@charset "utf-8";
/* ============================================================ */
/* header */
/* ============================================================ */
header {
	position: fixed;
	width: 100%;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	background: #fff;
	z-index: 10;
	font-size: 16px;
}
 /* ie8
header {
	position: relative\9;
}
 */
 /* ie9 
header:not(:target) {
	position: fixed\9; 
}
*/
#header_inner {
	position: relative;
	width: 960px;
	min-width: 960px;
	margin: 20px auto 0;
	text-align: left;
}

@media only screen and (orientation : portrait) {
	html.mobile header,
	html.tablet header {
		font-size: 12px;
	}
}


/*----- #header_logo -----*/

#header_logo {
	padding: 0 0 10px;
}



/*----- #header_search -----*/

#header_search {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 15;
}

#header_search a {
	display: block;
	float: right;
	width: 50px;
	height: 50px;
	background: #eee;
	color: #4b1981;
	font-size: 15px;
	text-align: center;
	line-height: 50px;
	-webkit-transition: background 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	-moz-transition: background 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	-ms-transition: background 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	transition: background 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

#header_search a.on,
#header_search a:hover {
	background: #4b1981;
	color: #fff;
}

#search_box_pc {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

#search_box_pc .inner {
	position: absolute;
	right: 0;
	top: -56px;
	padding: 10px;
	width: 250px;
	background: #4b1981;
	display: none;
}

#search_box_pc input[type="text"],
#search_box_pc form button {
	display: block;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#search_box_pc input[type="text"] {
	float: left;
	width: 210px;
	height: 28px;
	border: 1px solid #fff;
	box-sizing: border-box;
}

#search_box_pc form button {
	width: 38px;
	height: 28px;
	border: 1px solid #fff;
	box-sizing: border-box;
	background: #ccc;
	font-size: 12px;
	line-height: 28px;
}

@media only screen and (orientation : portrait) {
	html.mobile #header_search a,
	html.tablet #header_search a {
		font-size: 11px;
	}

	html.mobile #search_box_pc form button,
	html.tablet #search_box_pc form button {
		font-size: 10px;
	}
}


/*----- #header_nav -----*/

#header_nav {
	float: right;
	margin: -70px 160px 0 0;
}
/*
.global_english #header_nav,
.global_korean #header_nav,
.global_chinese #header_nav {
	float: right;
	margin: -70px 60px 0 0
}
*/
#header_nav ul {
	width: 390px;
	padding: 0 0 0 5px;
	font-size: 12px;
	*zoom: 1;
}

#header_nav ul:after {
  display: block;
  clear: both;
  content: "";
}

#header_nav ul:first-child {
	margin-bottom: 3px;
	border-bottom: 1px solid #dcdcdc;
}

#header_nav ul li {
	position: relative;
	float: left;
	width: 10em;
	margin: 2px 10px 0 0;
}

#header_nav ul li#hnav_global {
	width: auto !important;
	padding: 0 0 3px;
}

#header_nav ul li a i.fa {
	margin: 0 6px 0 0;
}

#header_nav ul li .ico_new_window {
	background-position: right 4px;
}

@media only screen and (orientation : portrait) {
	html.mobile #header_nav ul,
	html.tablet #header_nav ul {
		width: 430px;
		font-size: 10px;
	}

	html.android.tablet #header_nav ul li {
		margin: 2px 5px  0 0;
		width: 9.5em;
	}
}


/*----- #hnav_global -----*/
#hnav_global {
	position: absolute;
	right: 55px;
	top: 0;
	width: 90px;
	font-size: 12px;
/*	overflow: hidden;*/
}

#hnav_global > a {
	background: #503764;
	margin: 0 0 5px;
	text-align: center;
	width: 90px;
	color: #fff;
	display: block;
	line-height: 24px;
}

#hnav_global > a:hover {
	text-decoration: none;
}

#hnav_global a i.fa {
	margin: 0 6px 0 0;
}

#hnav_global .ico_new_window {
	background-position: right 4px;
}

#hnav_global ul {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 50%;
	width: 90px;
	padding: 8px 15px;
	border-radius: 4px;
	box-sizing: border-box;
	background: #7e7e7e;
	z-index: 15;
	visibility: hidden;
	transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
/*
#hnav_global:hover {
	overflow: visible;
}
*/
#hnav_global:hover ul {
	opacity: 1;
	top: 25px;
	visibility: visible;
}

#hnav_global > ul:before {
	display: block;
	position: absolute;
	top: -16px;
	left: 20px;
	content: "";
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-bottom: 8px solid #7e7e7e;
}

#hnav_global > ul li {
	float: none;
	margin: 2px 0 0;
}

#hnav_global > ul li:first-child {
	margin: 0;
}

#hnav_global > ul li a {
	color: #fff;
}

@media only screen and (orientation : portrait) {
	html.mobile #hnav_global,
	html.tablet #hnav_global {
		font-size: 10px;
	}
}


/*----- #font_size -----*/
#font_size {
	position: absolute;
	right: 55px;
	top: 27px;
	font-size: 12px;
	width: 90px;
}

#font_size > p {
	background: #503764;
	text-align: center;
	width: 90px;
	color: #fff;
	display: block;
	line-height: 24px;
	cursor: pointer;
}

#font_size ul {
	opacity: 0;
	position: absolute;
	left: 0;
	top: 50%;
	width: 90px;
	z-index: 15;
	visibility: hidden;
	transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

#font_size:hover ul {
	opacity: 1;
	top: 25px;
	visibility: visible;
}

#font_size ul li {
	background: #eee;
	width: 90px;
	text-align: center;
	line-height: 25px;
	cursor: pointer;
	transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	border-bottom: 1px solid #d2d2d2;
}

#font_size ul li:hover,
#font_size ul .active {
	background: #503764;
	color: #fff;
}

@media only screen and (orientation : portrait) {
	html.mobile #font_size,
	html.tablet #font_size {
		font-size: 10px;
	}
}



/*----- #global_nav -----*/

#global_nav {
	border-top: 1px solid #d2d2d2;
	border-bottom: 1px solid #e9e9e9;
}

#global_nav ul {
	display: table;
	width: 960px;
	margin: 0 auto;
}

#global_nav ul li {
	display: table-cell;
	width: 16%;
	border-right: 1px solid #d2d2d2;
	vertical-align: middle;
	text-align: center;
	line-height: 35px;
	letter-spacing: 0;
}

#global_nav ul li#gnav02,
#global_nav ul li#gnav05 {
	width: 20%;
}

#global_nav ul li#gnav06 {
	width: 12%;
}

#global_nav ul li a {
	display: block;
	color: #333;
	-webkit-transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	-moz-transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	-ms-transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	transition: all 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

#global_nav ul li:first-child {
	border-left: 1px solid #d2d2d2;
}

#global_nav ul li a:hover {
	background: #503764;
	color: #fff;
	text-decoration: none;
}