*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
body{
	/*background: #81bcd8;  テスト的に背景色をいれてます */
}

.site-header{
	background: rgba(255,255,255,0);

	/*display: -webkit-flex;
	display: flex;
	padding: 60px 20px;*/
	position: fixed;
	justify-content: space-between;
	transition: .5s;
	width: 100%;
	height: 72px;
	font-family: \\6E38\30B4\30B7\30C3\30AF\4F53, "Yu Gothic", YuGothic, "\\30D2\30E9\30AE\30CE\89D2\30B4 Pro", "Hiragino Kaku Gothic Pro", \\30E1\30A4\30EA\30AA, Meiryo, "MS\ \FF30\30B4\30B7\30C3\30AF", "MS PGothic", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, sans-serif;
	font-size: 16px;
	z-index: 10;
}
.site-header.transform{
	background: rgba(255,255,255,0.9);
	/*padding: 20px;*/
}

.site-header-con {
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* トップヘッダー 1200ピクセル以上は広がらないように */
@media(max-width: 1200px){
	.site-header-con {
		width: 100%;
	}
}

@media(min-width: 1200px){
	.site-header-con {
		/* width: 1200px;*/
	}
}

.site-header-left {
    float:left;
	/*width: 10%;*/
	width: 107px;
}

.site-header-center {
	float:left;
	/*width: 68%;*/
	width: 850px;
	/*margin: 0px auto 0px auto;*/
	
	margin-left: calc((100% - (850px + 148px + 170px - 70px)) / 2);
    margin-right: calc((100% - (850px + 148px + 170px + 70px )) / 2);
	
	
	padding: 34px 6px 0px 0px;
	/*background: #818888;  テスト的に背景色をいれてます */
}

.site-header-right {
    float:right;
	/*width: 22%;*/
	width: 170px;
	padding: 0px 0px 0px 0px;
	/*background: #818818;  テスト的に背景色をいれてます */
}

.site-logo img{
	float:left;
	width: 83px;
	height: 56px;
	margin: 6px 0px 0px 17px;
}

.site-header.transform .site-logo .rogo_shiro {
    display: none !important;
}
.site-logo .rogo_kuro {
    display: none !important;
}
.site-header.transform .site-logo .rogo_kuro {
    display: block !important;
}
.site-header.transform .site-logo img {
	width: 83px;
	height: 56px;
	margin: 6px 0px 0px 17px;
}

.gnav {
    margin-top: 12px;
}
.gnav__menu{
	/*float:right;*/
	margin-top: 0px;
	/*background: #FF0000;  テスト的に背景色をいれてます */
}
.gnav__menu li { 
    float:left;
}
.gnav__menu__item{
	/*margin-left: 18px;*/
	margin-left: 32px;
}
.gnav__menu__item a{
	color: #FFFFFF;
	text-decoration: none;
}

.site-header.transform .gnav__menu__item a {
	color: #000000;
}
.gnav__menu__item a:hover {
	/*color: #00FF00;*/
	text-decoration: underline;
}
.site-header.transform .gnav__menu__item a:hover {
	color: #000000;
}
.gnav__menu__item_language {
	margin-left: 20px;
}

/* トップヘッダー 1160ピクセル以上は消す */
@media(max-width: 1160px){
    .gnav__menu__item{ display:none; } /* 横並びの文字メニューは消す（language残し（修正前のなごり）） */
	.site-header-center { display:none; } /* 横並びの文字メニューは消す（language残さず） */
	/*.site-header-right { width: 90%; }*/ /* 右上のアイコンボタンをスペース戻す */
}


/*.content{
	line-height: 1.6;
	padding-top: 100px;
	width: 1200px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
.content p{
	margin-bottom: 40px;
}
.site-footer{
	background: #333;
	padding: 80px 0;
}
.copyright{
	color: #fff;
	font-size: 12px;
	text-align: center;
}
*/

/* トップヘッダー 768ピクセル以上は消す */
@media(max-width: 767px){
    /*.site-header.transform {display:none; }
	.site-header-right { display:none; }*/
}

ul.top-menu {
    /*position: fixed;
    left:0;
    bottom:0;
    width: 100%;*/
    float:right;
	height:64px;/*高さ*/
    margin:0px 0px 0px 0px;
    padding:0;
    /*background-color:#f5f5f5;背景色
    z-index:30*/;
	/*background: #FF0000;  テスト的に背景色をいれてます */
	}

ul.top-menu li {
	float:left;
	/*width:25%;*/
    /*background-color:#f5f5f5;背景色*/
    list-style-type:none;
	text-align:center;
	/*font-size:25px;アイコンのサイズ*/
	height:64px;
	/*padding-top:8px;*/
	line-height: 22px;
	font-size: 12px;
}

.top-menu li a {
    display: block;
    color:#000000; /*アイコン＆文字の色*/
    /*padding-top:10px;
    padding-bottom:5px;
    line-height:10px;*/
    text-decoration:none;
}

.site-header.transform .top-menu li a {
    color:#FFFFFF; /*アイコン＆文字の色*/
}


ul.top-menu li:first-child {
    width: 100px;
	/*background-color: #416d42;*/
	margin-right:10px;
}

ul.top-menu li:nth-child(2) {
    width: 60px;
	padding-top:8px;
	background-color: #FFFFFF;
}

.site-header.transform ul.top-menu li {
	/*background-color: #00ff00;*/
}

.site-header.transform ul.top-menu li:nth-child(2) {
	background-color: #282828;
}

ul.top-menu li:nth-child(3) {
     /*width: 80px;
	background-color: #b4a44b;*/
}

ul.top-menu li rect {
    fill: rgb(0, 0, 0);
}

.site-header.transform ul.top-menu li rect {
    fill: rgb(255, 255, 255);
}
