@charset "utf-8";


/* -- Layout
-------------------------------------------------------------------------------- */
html, body {
	width: 100%;
	min-width: 1000px;
	overflow: hidden;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
html {
	overflow-y: scroll;
}
header,
main,
footer {
	text-align: left;
	width: 100%;
	margin: auto;
}
main,
footer {
	position: relative;
	z-index: 2;
}
footer {
	overflow: hidden;
}
br.sp {
	display: none;
}



/* -- Link
-------------------------------------------------------------------------------- */
a {
	color: #111;
	text-decoration: none;
	outline: none;
}
main a:hover {
	color: #888;
}



/* -- Headerer
-------------------------------------------------------------------------------- */
header {
	font-size: 0;
	background: #FFF;
	height: 120px;
	position: absolute;
	top: 0;
	z-index: 9;
}
header h1 {
	display: block;
	width: 980px;
	position: absolute;
	left: 0;
	right: 0;
	top: 39px;
	margin: auto;
}
header nav {
	display: block;
	width: 980px;
	height: 100%;
	margin: auto;
}
header nav > ul {
	display: block;
	float: right;
	padding-top: 39px;
}
header nav li a,
header nav li:before {
	font-size: 13px;
	font-weight: 600;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
header nav > ul > li {
	margin: 0 16px;
	height: 81px;
	display: inline-block;
}
header nav > ul > li:last-child { margin-right: 0; }
header nav > ul > li > a {
	display: block;
	height: 81px;
	padding: 14px 0 0;
	box-sizing: border-box;
	position: relative;
}
header nav > ul > li > a:before {
	content: "";
	background: #333;
	display: block;
	width: 100%;
	height: 0;
	position: absolute;
	left: 0;
	bottom: 0;
}
header nav > ul > li:hover a:before {
	height: 4px;
}
header nav li div {
	background: #FFF;
	text-align: left;
	display: none;
	padding: 50px 0 70px;
	width: 100%;
	border-top: solid 1px #EEE;
	box-shadow: 0 2px 2px rgba(0,0,0,0.2);
	position: absolute;
	left: 0;
	top: 120px;
}
header nav li ul {
	display: none;
	width: 980px;
	margin: auto;
}
header nav li ul li {
	display: inline-block;
	width: 245px;
	position: relative;
}
header nav li ul li a {
	display: inline-block;
	padding: 10px 0;
	font-weight: bold;
}
header nav li ul li a:hover {
	color: #888;
}
.fixNv header {
	height: 60px;
	position: fixed;
	top: -60px;
	box-shadow: 0 0 5px rgba(0,0,0,0.1);
}
.fixNv header h1 {
	top: 16px;
}
.fixNv header h1 img {
	width: 78px;
	height: auto;
}
.fixNv header nav > ul {
	padding-top: 9px;
}
.fixNv header nav > ul > li > a {
	height: 51px;
}
.fixNv header nav li div {
	top: 60px;
}
header p,
header nav > ul > li:nth-last-child(-n+2),
header nav > ul:last-child {
	display: none;
}



/* -- Contents
-------------------------------------------------------------------------------- */
header + main {
	text-align: left;
	padding-top: 120px;
}
main > * {
	text-align: left;
	width: 980px;
	margin: auto;
}

/* -- topic path -- */
.topicpath {
	font-size: 0;
	text-align: left;
	padding: 20px 0;
	border-top: 1px solid #EEE;
	position: relative;
}
.topicpath ul {
	display: block;
	width: 980px;
	margin: auto;
}
.topicpath ul li {
	font-size: 12px;
	display: inline;
	padding-right: 10px;
	font:  500 12px/1 Roboto, Helvetica, Arial, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}
.topicpath ul li span {
	line-height: 20px;
}
.topicpath ul li a:hover {
	color: #888;
}
.topicpath ul li > span {
	color: #999;
}
.topicpath p {
	display: block;
	width: 245px;
	height: 100%;
	position: absolute;
	left: calc(50% + 245px);
	top: 0;
}
main + div.topicpath p a {
	background: url(/assets/img/ico_pagetop_pc.png) no-repeat right center;
	display: block;
	width: 60px;
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
}
.topicpath ul li a:after {
	content: url("/assets/img/ico_path_pc.png");
	vertical-align: text-top;
	display: inline-block;
	margin-left: 10px;
}
header + .topicpath {
	margin-top: 120px;
	border-bottom: 1px solid #EEE;
}

/* -- complementary -- */
main > aside:last-child {
	padding: 80px 0;
}
.contBanner {
	display: table;
	width: 100%;
}
.contBanner li {
	display: table-cell;
	vertical-align: top;
}
.contBanner li:nth-child(2) { padding: 0 28px 28px; }
.contBanner li a {
	display: block;
	width: 308px;
}
.contBanner li img {
	width: 308px;
	height: auto;
}
.contBanner li span {
	display: inline-block;
	padding-top: 20px;
}

/* -- title -- */
main > h2,
section h2:not([class]) {
	font-size: 24px;
	line-height: 48px;
	letter-spacing: 0.1em;
	display: block;
	height: 48px;
	margin-bottom: 40px;
}
main > h2 i,
section h2 i {
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.2em;
	vertical-align: middle;
	display: inline-block;
	padding-left: 18px;
	margin-top: -5px;
}

/* -- Category list -- */
.cateList {
	padding: 25px 0;
}
.cateList h3,
.cateList ul {
	font-size: 14px;
	line-height: 25px;
	display: table-cell;
}
.cateList h3:after {
	content: "/";
	display: inline-block;
	padding: 0 15px 0 30px;
}
.cateList h3 i {
	display: none;
}
.cateList ul li {
	color: #888;
	display: inline-block;
	padding: 0 15px;
}



/* -- Footer
-------------------------------------------------------------------------------- */
footer {
	font-size: 12px;
	line-height: 1.66;
	color: #CCC;
	background: #111;
	padding: 80px 0 50px;
	max-width: 100%;
}
footer a {
	color: #CCC;
	font-weight: bold;
}
footer a:hover {
	color: #FFF;
}
footer li.career >a{
	pointer-events: none;
}
footer > *,
footer small {
	display: block;
	width: 100%;
	max-width: 980px;
	margin: auto;
}
footer h3 {
	margin-bottom: 50px;
}
footer h3 img {
	width: 187px;
	height: auto;
}
footer nav {
	margin-bottom: 75px;
}
footer nav > ul > li:nth-child(-n+5) {
	display: block;
	width: 100%;
	padding-bottom: 25px;
}
footer nav ul ul {
	display: block;
	margin: -1.66em 0 0 75px;
	position: relative;
}
footer nav ul ul:before {
	content: "";
	background:#111;
	display: block;
	width: 2.3em;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
footer nav ul ul li,
footer nav > ul > li:nth-child(n+6) {
	display: inline-block;
	white-space: nowrap;
}
footer nav ul ul li:before,
footer nav > ul > li:nth-child(n+6):before {
	content: "/";
	display: inline-block;
	width: 0.5em;
	padding: 0 1em;
}
footer nav > ul > li:nth-child(6) { color: #111; margin-left: 75px; }
footer > p {
	font-size: 10px;
	padding: 22px 0;
	max-width: 100%;
	border-top: solid 1px #222;
	border-bottom: solid 1px #222;
}
footer > ul {
	padding-top: 55px;
}
footer > ul li {
	display: inline-block;
	padding-right: 30px;
}
footer a[target="_blank"] {
	background: url(/assets/img/ico_blank_b_pc.png) no-repeat right center;
	padding-right: 18px;
}
footer > ul li:first-child a {
	background: url(/assets/img/ico_sotre_b.png) no-repeat right center;
	padding-right: 13px;
}
footer a:hover {
	border-bottom: solid 1px #FFF;
}



/* -- bracket
-------------------------------------------------------------------------------- */
.first-bracket,
br:not(.sp) + .bracket {
	margin-left: -0.6em;
}



/* -- configuration
-------------------------------------------------------------------------------- */
h2 i, time,
footer small,
footer > ul,
nav > ul > li:nth-child(2) ul {
	font-family: Roboto, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif;
	/*font-weight: 500;*/
}
header nav li a[target="_blank"]:after {
	content: url("/assets/img/ico_blank_w1_pc.png");
	margin-left: 4px;
}

header nav li.store a {
	border: solid 1px #000;
	height: auto;
	padding: 12px 15px;
	letter-spacing: 0.05em;
	display: inline-block;
}
.fixNv header nav > ul > li.store > a{
	height: auto;
}
header nav li.store a:before {
	content: none;
}
header nav li.store a:after {
	content: '';
	background: url("/assets/img/ico_sotre_w_pc2.png") no-repeat 0 0;
	background-size: 9px 12px;
	width: 9px;
	height: 12px;
	display: inline-block;
	margin-left: 5px;
	position: relative;
	top: 1px;
}
header nav li.store a:hover{
	background-color: #000;
	color: #fff;
}
header nav li.store a:hover:after {
	background-image: url("/assets/img/ico_sotre_b2.png");
}
.contBanner li a[target="_blank"] span:after {
	content: url("/assets/img/ico_blank_w2_pc.png");
	margin-left: 4px;
}
.contBanner li a:hover span:after,
header h1 a:hover,
footer h3 a:hover,
.topicpath p a:hover {
	opacity: 0.7;
}
a,
header nav > ul > li > a:before {
	transition: all 0.3s ease;
}
header nav li ul li:before {
	content: "-";
	display: inline;
	padding-right: 0.5em;
}
header nav li ul li a:hover,
.topicpath ul li a:hover,
.contBanner li a:hover span,
.cateList ul li a:hover {
	text-decoration: underline;
}
article > #title,
article > div.border,
#pagination,
#list,
#list li,
#news ul,
#news ul li,
.cateList {
	border-image: url(/assets/img/line_dot.png) 1 repeat;
}
article > #title,
article > div.border,
#pagination,
#list,
#news ul,
.cateList {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom: 1px dotted #000\9;
}
#pagination,
#list li,
#news ul li,
.cateList {
	border-top-style: solid;
	border-top-width: 1px;
	border-top: 1px dotted #000\9;
}