header{ font-family:Meiryo,'Arial','Microsoft JhengHei',sans-serif;}
header .header_box{ width:1250px; margin:0 auto;}
header .logo{
	background:url(../img/LOGO.png);
	width:296px;
	height:66px;
	float:left;
	margin-top: -10px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

header .nav ul{ text-align:right; padding:0px 0; font-size:0; }
header .nav li{ display:inline-block; cursor:pointer; width:91px; height:32px;  border-bottom:solid 3px #fff; padding-bottom:4px; margin:8px 3px 0;}
header .nav li:nth-child(9){ width:80px;}
header .nav li:last-child{ margin-right:0;}
header .nav li:nth-child(1):hover ,header .nav li.on:nth-child(1){ border-color:#8ca43e;}
header .nav li:nth-child(2):hover ,header .nav li.on:nth-child(2){ border-color:#e37d4f;}
header .nav li:nth-child(3):hover ,header .nav li.on:nth-child(3){ border-color:#e60012;}
header .nav li:nth-child(4):hover ,header .nav li.on:nth-child(4){ border-color:#29a8b8;}
header .nav li:nth-child(5):hover ,header .nav li.on:nth-child(5){ border-color:#582a84;}
header .nav li:nth-child(6):hover ,header .nav li.on:nth-child(6){ border-color:#c33a2c;}
header .nav li:nth-child(7):hover ,header .nav li.on:nth-child(7){ border-color:#588a3b;}
header .nav li:nth-child(8):hover ,header .nav li.on:nth-child(8){ border-color:#e68b4e;}

header .nav li a{background:url(../images/header_nav.jpg) 0 center no-repeat; width:100%; height:100%; display:block;}
header .nav li:nth-child(1) a{ background-position:0 0;}
header .nav li:nth-child(2) a{ background-position:-91px 0;}
header .nav li:nth-child(3) a{ background-position:-182px 0;}
header .nav li:nth-child(4) a{ background-position:-273px 0;}
header .nav li:nth-child(5) a{ background-position:-364px 0;}
header .nav li:nth-child(6) a{ background-position:-455px 0;}
header .nav li:nth-child(7) a{ background-position:-546px 0;}
header .nav li:nth-child(8) a{ background-position:-637px 0;}
header .nav li:nth-child(9) a{ background-position:-750px 0;}
header .nav li.on .sub{ display:block; height:153px;}
header .sub{ width:100%; height:0; overflow:hidden; position:absolute; top:60px; left:0; /*display:none;*/ transition:all .6s;}
header .sub:before{ content:''; width:0; height:0; border-style:solid; border-width:10px 10px 0 10px; border-color:#fff transparent transparent transparent; position:absolute; left:50%; top:0;}
header .nav li:nth-child(1) .sub{ background:#8ca43e;}
header .nav li:nth-child(2) .sub{ background:#e37d4f;}
header .nav li:nth-child(3) .sub{ background:#29a8b8;}
header .nav li:nth-child(4) .sub{ background:#582a84;}
header .nav li:nth-child(5) .sub{ background:#c33a2c;}
header .nav li:nth-child(6) .sub{ background:#e60012;}
header .nav li:nth-child(7) .sub{ background:#588a3b;}
header .nav li:nth-child(8) .sub{ background:#e68b4e;}

header .nav li:nth-child(1) .sub:before{ margin-left:-200px;}
header .nav li:nth-child(2) .sub:before{ margin-left:-80px;}
header .nav li:nth-child(3) .sub:before{ margin-left:20px;}
header .nav li:nth-child(4) .sub:before{ margin-left:120px;}
header .nav li:nth-child(5) .sub:before{ margin-left:220px;}
header .nav li:nth-child(6) .sub:before{ margin-left:324px;}
header .nav li:nth-child(1) .sub ul{ margin-left:-173px;}
header .nav li:nth-child(2) .sub ul{ margin-left:-70px;}
header .nav li:nth-child(3) .sub ul{ margin-left:30px;}
header .nav li:nth-child(4) .sub ul{ margin-left:130px;}
header .nav li:nth-child(5) .sub ul{ margin-left:230px;}
header .nav li:nth-child(6) .sub ul{ margin-left:334px;}
header .sub ul{ text-align:left; position:absolute; left:50%;}
header .sub ul .licol{display:inline-block; margin-right:40px;margin-left:5px;}
header .sub ul li{ border:none; display:inline;}
header .sub ul li a{
	background:none;
	font-size:14px;
	color:#fff;
	text-decoration:none;
	padding:1px 0;
	margin-bottom:0em;
	line-height: 28px;
}
header .sub ul li a:hover{ background:url(../images/header_sub_hover.jpg) left bottom repeat-x;}

.sl{overflow: hidden;max-height: 0px;}
.sl.open { height:153px; max-height: 500px;; overflow:hidden;  /*display:none;*/ transition:all 0.5s;}
.sl.close { height:0px; max-height: 500px;; overflow:hidden;  /*display:none;*/ transition:all 0.5s;}


@media only screen and (max-width: 967px) {
header .logo{
	background:url();
	width:296px;
	height:66px;
margin-left: 0px;
	margin-top: 10px;
}

header .nav li a{background:url() 0 center no-repeat; width:100%; height:100%; display:block;}

}