@charset "utf-8";

/* ============================
  Reset styles
============================ */

* {
	box-sizing: border-box;
}
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, address, img, small, dl, dt, dd, ol, ul, li, table, tbody, tfoot, thead, tr, th, td, article, aside, header, nav, section, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
html {
	overflow-y: scroll;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
th {
	text-align: left;
}

/* ============================
  Component styles
============================ */

body {
	font-size: 16px;
	line-height: 1;
	font-family: 'メイリオ', Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background-color: #f6f6f6;
	color: #404040;
	position: relative;
}
a {
	color: #333;
	text-decoration: none;
}
.cotent-wrapper {
	max-width: 960px;
}
a img:hover {
	opacity: .8;
	transition: .5s;
}

/* Text link
------------------------------ */

a:focus {
	outline: none;
}
a:hover {
	color: #f56531;
	transition: .1s;
}

/* clearfix
------------------------------ */

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}

/* Page Top
------------------------------ */

#page-top {
	display: block;
	position: fixed;
	text-indent: -9999px;
	z-index: 9999;
	bottom: -60px;
	right: 10px;
	width: 140px;
	height: 40px;
	padding: 0;
	background: url(../../images/btn_pagetop.png) no-repeat top;
	text-decoration: none;
	opacity: .95;
	border-radius: 3px;
}
#page-top:hover {
	background-color: #fff;
	cursor: pointer;
	background-position: bottom;
}

/* Header styles
------------------------------ */

header {
	z-index: 20;
	background-color: rgba(255, 255, 255, 0.9);
	position: absolute;
	width: 100%;
	min-width: 960px;
}
.grobal-nav {
	z-index: 1000;
	width: 960px;
	margin: 0 auto;
}
.grobal-nav h1 {
	float: left;
}
.grobal-nav h1 img {
	padding: 11px 8px;
}
.grobal-nav h1 img:hover {
	opacity: 1;
	transition: none;
}
.navbar-right {
	float: right;
}
.navbar-right li {
	position: relative;
	display: block;
	float: left;
}
.navbar-right li.active, .navbar-right li a {
	position: relative;
	display: block;
	font-size: 15px;
	font-weight: 500;
	padding: 24px 20px;
	line-height: 0;
	font-weight: bold;
	color: #404040;
	text-shadow: 0 1px 0 #eee;
}
.navbar-right li.active, .navbar-right li a:hover {
	color: #f56531;
	border-bottom: 1px solid #f56531;
}

/* Breadcrumb styles
------------------------------ */

.breadcrumb {
	width: 100%;
	min-width: 960px;
	background-color: #fff;
	overflow: hidden;
	border-top: 1px solid #CECECE;
}
.breadcrumb ol {
	width: 960px;
	margin: 0 auto;
}
.breadcrumb li {
	float: left;
	font-size: 12px;
}
.breadcrumb a {
	position: relative;
	display: block;
	color: #333;
	padding: 10px 0 10px 30px;
	background: #fff;
}
.breadcrumb li+ li a {
	padding-left: 60px;
}
.breadcrumb a:after, .breadcrumb a:before {
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	position: absolute;
	top: 50%;
	margin-top: -50px;
	left: 100%;
}
.breadcrumb a:after {
	border-left: 30px solid #fff;
	z-index: 2;
}
.breadcrumb a:before {
	border-left: 30px solid #e6e6e6;
	margin-left: 1px;
	z-index: 1;
}
.breadcrumb a:hover {
	background-color: #f56531;
	color: #fff;
	transition: .3s;
}
.breadcrumb li a:hover:after {
	border-left-color: #f56531 !important;
	transition: .3s;
}

/* Footer styles
------------------------------ */

footer {
	clear: both;
}
.footer-nav-wrapper {
	width: 100%;
	min-width: 960px;
	background: #e6e6e6;
}
.footer-nav-container {
	width: 900px;
	margin: 0 auto;
	padding: 40px 0;
	position: relative;
	display: flex;
}
.footer-left-container {
	position: relative;
	width: 200px;
	background: url(../../images/logo.png) no-repeat;
	background-size: 80% auto;
}
.sns-icons {
	position: absolute;
	top: 78px;
	left: 0;
}
.footer-right-container {
	width: 700px;
}
.footer-nav ul {
	display: flex;
}
.footer-nav ul ul {
	display: block;
}
.footer-nav li {
	font-size: 14px;
	width: 154px;
	position: relative;
	margin: 0 10px;
}
.footer-nav li:after {
	content: "";
	display: block;
	border-bottom: 1px solid #e94609;
	position: absolute;
	top: 24px;
	left: 0;
	width: 100%;
	box-shadow: 0 1px 0 #fff;
}
.footer-nav li li:after {
	content: none;
}
.wide-box {
	flex: 1;
}
.footer-nav li li {
	font-size: 11px;
	padding: 0 0 6px 0;
	margin: 0;
	width: 100%;
	line-height: 1.2em;
}
.footer-nav li li:first-child {
	padding-top: 24px;
}
.footer-gloval-wrapper {
	width: 100%;
	min-width: 960px;
	background-color: #fff;
}
.footer-gloval-container {
	width: 960px;
	margin: 0 auto;
	padding: 10px 0 20px;
}
.footer-grobal-nav li {
	display: inline-block;
	float: left;
	font-size: 12px;
	margin: 0 30px 0 0;
}
small {
	font-size: 12px;
	float: right;
}

/* Other Link styles
------------------------------ */

.other-link:after {
	content: url(../../images/icon_01.gif);
	width: 15px;
	height: 14px;
	margin-left: 5px;
}

/* PDF Link styles
------------------------------ */

a[href$=".pdf"]:after {
	content: url(../../images/icon_02.gif);
	width: 15px;
	height: 12px;
	margin-left: 5px;
}
.news-container a[href$=".pdf"]:after {
	display:none;
	content: url(../../images/icon_02.gif);
	width: 15px;
	height: 12px;
	margin-left: 5px;
}
/* Content styles
------------------------------ */

.cotent-wrapper {
	width: 960px;
	margin: 0 auto;
	padding: 50px 0;
	background: url(../../images/texture.jpg) no-repeat center top;
}

/* Top Page styles
------------------------------ */

.slogan img, .attention-banner img {
	display: block;
	margin: 0 auto;
}
.attention-banner {
	margin: 50px auto;
	display: flex;
	justify-content: space-between;
}
.attention-banner a{
}
.news-release {
	margin-bottom: 50px;
}
.news-release h2 {
	text-indent: -9999px;
	background: url(../../images/top_text_02.png) no-repeat;
	width: 396px;
	height: 24px;
	margin: 0 auto 20px;
}
.news-container {
	display: flex;
	justify-content: space-between;
}
.news-box {
	background: #fff;
	box-shadow: 0 1px 3px rgba(181, 181, 181, 0.3);
	border-radius: 5px;
	width: 312px;
	overflow: hidden;
	padding: 0 0 5px 0;
}
.news-box:hover {
	transition: .3s;
	background: #f56531;
	color: #fff;
}
.news-box .left-inner-box {
	float: left;
	width: 92px;
	margin: 5px 7px 7px 7px;
}
.news-box date {
	display: block;
	font-size: 11px;
	text-align: center;
	margin-bottom: 2px;
}
.news-box .category {
	font-size: 10px;
	padding: 3px 0;
	text-align: center;
	border-radius: 2px;
	background: #fff;
}
.news-box p {
	font-size: 12px;
	margin: 3px 5px 0 0;
	line-height: 17px;
}
.news-box img {
	width: 312px;
	height: 176px;
}
.news-box img:hover {
	opacity: inherit;
}
.news-list a {
	display: block;
	width: 143px;
	margin: 12px auto;
	background: #fff;
	padding: 6px 0 4px 13px;
	font-size: 14px;
	border-radius: 5px;
	box-shadow: inset 0 1px 1px #e0e0e0;
}
.news-list a:hover {
	background: #f56531;
	color: #fff;
	transition: .3s;
}
.news-list a:after {
	content: ">";
	font-weight: bold;
	margin-left: 16px;
	color: #e94609;
	font-family: monospace;
	vertical-align: middle;
}
.news-list a:hover:after {
	color: #fff;
	transition: .3s;
}
.pr-banner {
	display: flex;
	flex-wrap: wrap;
	width: 960px;
	justify-content: space-between;
}
.pr-banner a {
	display: block;
	margin-bottom: 15px;
}

/* Flexslider
------------------------------ */

.flexslider {
	min-width: 960px;
}
.flexslider li {
	max-height: 455px;
	overflow: hidden;
}
.flexslider .slides img {
	display: inline;
}
.caption, .caption02 {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	margin-top: -50px;
	color: #f56531;
	text-align: center;
	font-size: 70px;
	font-weight: bold;
}
.caption02 {
	top: 32%;
}
.caption a, .caption02 a {
	font-size: 16px;
	letter-spacing: 0.15em;
	color: #fff;
	display: block;
	background: #f56531;
	border: 1px solid #f56531;
	width: 230px;
	padding: 15px 0;
	margin: 17px auto 0;
	border-radius: 5px;
}
.caption a:hover, .caption02 a:hover {
	transition: .3s;
	background: #fff;
	color: #f56531;
}
.caption img.logo, .caption02 img.logo {
	width: 300px;
	margin: 0 auto;
}
.caption img.catch {
	width: 527px;
}
.caption03 {	
    max-width: 298px;
    position: absolute;
    left: 50%;
    /* right: 0; */
    bottom: 0;
    margin-left: 300px;
}
/* ============================
  Second Pages Component Styles
============================ */

.header-image {
	height: 200px;
	min-width: 960px;
}
.header-image h2 {
	font-size: 70px;
	font-weight: bold;
	text-indent: 0;
	text-align: center;
	padding-top: 100px;
	color: #fff;
	text-shadow: 0 0 40px #5d5d5d;
}
.content-container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

/* Side Navigation Styles
------------------------------ */

.side-nav {
	background: #fff;
	width: 250px;
	margin-right: 12px;
	border-radius: 5px;
	box-shadow: 0 1px 3px rgba(181, 181, 181, 0.3);
	overflow: hidden;
	padding: 10px 0 10px 0;
	align-self: flex-start;
}
.side-nav ul+ ul {
	border-top: 1px solid #e9e9e9;
	margin-top: 10px;
	padding-top: 10px;
}
.side-nav li {
	font-size: 14px;
	margin: 0 10px 0 10px;
	border-top: 1px solid #fff;
}
.side-nav li.active, .side-nav a {
	display: block;
	padding: 15px 5px 15px 10px;
	font-size: 14px;
	position: relative;
}
.side-nav li.active, .side-nav li.active a, .side-nav a:hover {
	color: #fff;
	background: #f56531;
	border-radius: 3px;
	transition: .3s;
}
.side-nav li.active:after, .side-nav a:after {
	position: absolute;
	top: 35%;
	right: 10px;
	content: ">";
	font-weight: bold;
	margin-left: 10px;
	color: #f56531;
	font-family: monospace;
	vertical-align: middle;
}
.side-nav li.active:after, .side-nav a:hover:after {
	color: #fff;
	transition: .3s;
}

/* Content Styles
------------------------------ */

.content-caption {
	width: 100%;
	font-size: 18px;
	text-align: center;
	line-height: 1.5em;
	margin-bottom: 50px;
}
.content-caption img {
	margin-bottom: 15px;
}
.content-full, .content-wide, .content-half {
	width: 100%;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 1px 3px rgba(181, 181, 181, 0.3);
	border: 1px solid #f56531;
	overflow: hidden;
	position: relative;
}
.content-full {
	width: 960px;
}
.content-wide {
	width: 698px;
}
.content-half {
	width: calc(50% - 6px);
	margin-bottom: 12px;
}
.content-container.product div:nth-child(3),
.content-container.product div:nth-child(4){
	margin-bottom: 0;
}
.content-title {
	border-bottom: 1px solid #f56531;
	position: relative;
}
.content-title .category {
	font-size: 16px;
	text-align: center;
	padding: 0 7px;
	color: #fff;
	background: #f56531;
	height: 65px;
	display: table-cell;
	vertical-align: middle;
	white-space: nowrap;
}
.content-title h3 {
	font-size: 20px;
	background-color: #fff;
	line-height: 1.3em;
	font-weight: bold;
	color: #4c4c4c;
	display: table-cell;
	vertical-align: middle;
	padding: 10px 20px 7px;
	line-height: 1.2em;
}
.content-title h3 img {
	vertical-align: middle;
	margin: 0 20px 0 0;
	width: 50px;
	height: 50px;
}
.recruit-more .content-title h3 br, .breadcrumb br {
	display: none;
}
.content-inner {
	padding: 40px;
}

/* ============================
  News Page Styles
============================ */

.header-product, .header-company, .header-news, .header-recruit, .header-contact {
	background-repeat: no-repeat;
	background-position: center;
	height: 200px;
}
.header-product {
	background-image: url(../../images/product_header_img.jpg);
}
.header-company {
	background-image: url(../../images/company_header_img.jpg);
}
.header-news {
	background-image: url(../../images/news_header_img.jpg);
}
.header-recruit {
	background-image: url(../../images/recruit_header_img.jpg);
}
.header-contact {
	background-image: url(../../images/contact_header_img.jpg);
}
.news-item {
	margin-bottom: 32px;
}
.news-item time {
	display: block;
	font-size: 11px;
	text-align: right;
	margin-bottom: 3px;
}
.news-item .category {
	display: inline-block;
	float: right;
	font-size: 10px;
	padding: 3px 10px;
	text-align: center;
	border-radius: 2px;
}
.ios, .media {
	border: 1px solid #38c9db;
	color: #38c9db;
}
.android, .notice {
	border: 1px solid #a3c938;
	color: #a3c938;
}
.kindle, .press {
	border: 1px solid #e46262;
	color: #e46262;
}
.news-item p {
	font-size: 14px;
	min-height: 33px;
	line-height: 1.3em;
	margin-left: 112px;
	padding-left: 20px;
	border-left: 1px solid #d9d9d9;
}
.news-item span {
	font-weight: bold;
}
.news-item-left {
	float: left;
	width: 92px;
}
.news-page-nav li {
	font-size: 14px;
	margin-bottom: 30px;
}
.news-page-nav .prev {
	float: left;
}
.news-page-nav .next {
	float: right;
}
.news-page-nav a {
	display: block;
	padding: 7px 12px;
	border: 1px solid #f56531;
	color: #f56531;
	border-radius: 3px;
}
.news-page-nav a:hover {
	background: #f56531;
	color: #fff;
	transition: .3s;
}
.news-page-nav .prev a:before, .news-page-nav .next a:after {
	font-size: 12px;
	font-weight: bold;
	color: #f56531;
	font-family: monospace;
	vertical-align: middle;
}
.news-page-nav .prev a:before {
	content: "<";
	margin-right: 12px;
}
.news-page-nav .next a:after {
	content: ">";
	margin-left: 12px;
}
.news-page-nav .prev a:hover:before, .news-page-nav .next a:hover:after {
	color: #fff;
	transition: .3s;
}
.news-content {
	line-height: 1.5em;
}
.news-content p {
	line-height: 1.5em;
	margin-bottom: 30px;
}
.news-content a {
	color: #f56531;
}
.news-content a:hover {
	text-decoration: underline;
}
.news-image01 {
	width: 100%;
	margin: 10px 0;
}
.news-image01 img {
	display: block;
	margin: 0 auto;
}

/* ============================
  Product Page Styles
============================ */

.os-list {
	position: absolute;
	top: 7px;
	right: 7px;
}
.os-list li {
	display: inline-block;
	border-radius: 3px;
	font-size: 13px;
	padding: 3px 7px 1px 7px;
	font-weight: bold;
}
.product .content-full {
	margin-top: 50px;
}
.product .content-half .content-title {
	border-bottom: none;
	border-top: 1px solid #f56531;
}
.product a .content-title .category {
	border-right: 1px solid #fff;
}
.product a .content-title h3 {
	color: #f56531;
}
.product a .content-title h3:after {
	content: ">";
	position: absolute;
	top: 50%;
	right: 20px;
	font-size: 26px;
	font-weight: 900;
	color: #f56531;
	font-family: monospace;
	line-height: 0;
	transform: rotate(90deg);
}
.product a .content-title h3.official-link:after {
	transform: rotate(0);
}
.product a:hover .content-title, .product a:hover .content-title h3 {
	background: #f56531;
	transition: .3s;
	color: #fff;
}
.product a img:hover {
	opacity: 1;
}
.product a:hover .content-title h3:after {
	color: #fff;
}
.product-keyimage {
	border-bottom: 1px solid #e4e4e4;
	height: 245px;
	overflow: hidden;
}
.product-left {
	float: left;
	width: 686px;
	min-height: 340px;
	padding: 30px;
	border-right: 1px solid #e4e4e4;
}
.product-left p {
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.5em;
}
.product-left .img_box{
	text-align:right;
}
.product-right {
	margin-left: 686px;
}
.product-right dl {
	width: 272px;
	margin-top: -1px;
}
.product-right dt {
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	background-color: #fbf8f8;
	padding: 15px;
	margin-bottom: 15px;
	font-weight: bold;
	color: #444;
}
.product-right dd {
	padding: 0 15px 15px;
	color: #444;
	font-size: 14px;
}
.product-schreen {
	clear: both;
	border-top: 1px solid #e4e4e4;
	padding: 30px;
}
.product-download {
	border-top: 1px solid #e4e4e4;
}
.product-download h4 {
	background-color: #fbf8f8;
	border-bottom: 1px solid #e4e4e4;
	font-size: 18px;
	font-weight: bold;
	padding: 15px 30px 13px;
}
.product-schreen img {
	margin-left: 23px;
}
.product-download ul {
	margin: 0 auto;
	text-align: center;
	margin-left: -50px;
}
.product-download li {
	display: inline-block;
}
.product-download img {
	height: 50px;
}
.product-download a {
	background: none;
	margin: 20px 0 20px 30px;
	padding: 0;
	display: block;
}

/* ============================
  Company Page Styles
============================ */

.company-message hr {
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.company-message p {
	font-size: 16px;
	margin-bottom: 30px;
	line-height: 1.5em;
}
.company-message p.ceo-name {
	text-align: right;
	margin: 20px 0 50px;
	font-size: 20px;
}
.company-message p.ceo-name span {
	font-size: 14px;
}
.content-inner.company-profile table, .company-history table {
	font-size: 14px;
	margin-bottom: 20px;
	border-bottom: 1px solid #e4e4e4;
}
.content-inner.company-profile tr, .company-history tr {
	border-top: 1px solid #e4e4e4;
}
.content-inner.company-profile th, .company-history th {
	background-color: #fcfaf8;
	padding: 20px;
	white-space: nowrap;
}
.content-inner.company-profile td, .company-history td {
	width: 544px;
	padding: 20px;
	line-height: 1.5em;
}
.company-message h4 {
	font-size: 18px;
	margin-bottom: 40px;
	padding-top: 20px;
}
.company-message .logo-text {
	margin-top: 30px;
	font-size: 14px;
}
.content-inner.company-profile h4 {
	background-color: #fcfaf8;
	border-top: 1px solid #e4e4e4;
	border-bottom: 1px solid #e4e4e4;
	padding: 20px;
	margin-bottom: 15px;
}
.company-history h4 {
	font-weight: bold;
	padding: 0 20px 20px 0;
}
.content-inner.company-profile li {
	margin-bottom: 10px;
}
.content-inner.company-profile li span {
	font-size: 12px;
}
.content-inner.company-profile li:before {
	content: "●";
	color: #f56531;
	font-size: 12px;
	vertical-align: top;
	padding-right: 3px;
}
.content-inner.company-profile a[href^="http"] {
	background: none;
	padding-right: 0;
	margin-right: 0;
}
.ceo-image {
	margin-bottom: 20px;
}

/* ============================
  Recruit Page Styles
============================ */

.recruit-top h3 {
	text-align: center;
	font-size: 26px;
	margin-bottom: 10px;
}
.career-list, .career-banner {
	margin-bottom: 50px;
}
.career-list ul, .career-banner ul {
	width: 960px;
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
}
.career-banner ul {
	justify-content: space-between;
}
.career-list li {
	border-radius: 5px;
	box-shadow: 0 1px 3px #c5c5c5;
	width: 314px;
	margin: 0 8px 9px 0;
}
.career-list li:nth-child(3n) {
	margin-right: 0;
}
.career-banner li {
	margin: 0 0 9px 0;
}
.career-list img, .career-banner img, .career-flow img {
	display: block;
}
.career-link .game-engineer, .career-list .game-engineer {
	border: 1px solid #206a1a;
}
.career-link .graphic-designer, .career-list .graphic-designer {
	border: 1px solid #00aceb;
}
.career-link .dot-designer, .career-list .dot-designer {
	border: 1px solid #e94860;
}
.career-link .animation-designer, .career-list .animation-designer {
	border: 1px solid #b60812;
}
.career-link .planner, .career-list .planner {
	border: 1px solid #fabd05;
}
.career-link .scenario-writer-scripter, .career-list .scenario-writer-scripter {
	border: 1px solid #7472b4;
}
.career-link .customer-support, .career-list .customer-support {
	border: 1px solid #003d8a;
}
.career-link .server-infrastructure-engineer, .career-list .server-infrastructure-engineer {
	border: 1px solid #32b614;
}
.career-link .director, .career-list .director {
	border: 1px solid #bd8e01;
}
.career-link img, .career-banner li {
	border-radius: 5px;
	box-shadow: 0 1px 3px #c5c5c5;
}
.career-flow, .career-faq {
	width: 960px;
}
.career-flow h3 {
	margin-bottom: 0;
}
.career-flow img {
	margin: 0 auto;
}
.career-flow p {
	text-align: center;
}
.career-faq h3 {
	margin-top: 50px;
}
.career-faq p {
	margin: 15px auto 0;
}
.career-faq a {
	display: block;
	background: #eb551c;
	border: 1px solid #eb551c;
	color: #fff;
	font-size: 16px;
	width: 300px;
	margin: 0 auto;
	padding: 20px 0;
	text-align: center;
	border-radius: 5px;
}
.career-faq a:hover {
	background: #fff;
	color: #eb551c;
}
.entry-btn {
	margin: 20px 0 0 0;
}
.entry-btn a {
	display: block;
	background: linear-gradient(#eb551c 0%, #d84208 100%);
	margin: 0 auto;
	text-align: center;
	padding: 25px 0 23px;
	color: #fff;
	font-size: 24px;
	border-radius: 10px;
	font-weight: bold;
	box-shadow: 0 1px 3px #c5c5c5;
}
.entry-btn_newgraduates a {
	background: linear-gradient(#7fca34 0%, #67b41b 100%);
}
.entry-btn_newgraduates-top a{
	background: linear-gradient(#7fca34 0%, #67b41b 100%);
	height:120px;
	width:616px;
	display:table-cell;
	vertical-align:middle;
	letter-spacing:10px;
}
.entry-btn_newgraduates-top a > span{
	display:block;
	border-top:1px solid #fff;
	font-size: 20px;
	margin:5px 40px 0;
	padding:10px 0 0;
	letter-spacing:3px;
}
.entry-btn_none a {
	background:linear-gradient(to bottom, #d6d6d6 0%,#cccccc 100%);
	cursor: default;
}
.entry-btn a:hover {
	opacity: .85;
}
.entry-btn_none a:hover{
		opacity: 1.0;
}
.recruit-sp-interview .career-link, .recruit-more .career-link {
	text-align: center;
}
.recruit-more .career-link {
	margin: 40px 0 0 0;
}
.recruit-sp-interview .career-link, .recruit-sp-movie .career-link, .recruit-sp-comic .career-link {
	margin: 0 0 30px 0;
	border-top: 1px solid #eb551c;
}
.career-link p {
	margin: 30px 0 15px !important;
	min-height: auto !important;
}
.career-link a {
	display: inline-block;
}
#attentionarea{ 	
	margin:40px 10px 0 ; 	
	line-height:1.2; 	
} 
/* Recruit Side Nav Styles
------------------------------ */

.side-nav.recruit-nav img {
	width: 100%;
}
.side-nav.recruit-nav li {
	position: relative;
	line-height: 1.2em;
}
.side-nav.recruit-nav li span {
	display: block;
	margin: 10px;
	color: #8a8a8a;
}
.side-nav.recruit-nav li li {
	margin: 0;
}
.side-nav.recruit-nav li li:first-child {
	margin-top: 5px;
}
.side-nav.recruit-nav li li.active, .side-nav.recruit-nav li li a {
	width: 230px;
	height: 50px;
	padding: 0 0 0 47px;
	vertical-align: middle;
	display: table-cell;
}
.side-nav.recruit-nav .game-engineer.active:before, .side-nav.recruit-nav .game-engineer a:before, 
.side-nav.recruit-nav .graphic-designer.active:before, .side-nav.recruit-nav .graphic-designer a:before, 
.side-nav.recruit-nav .dot-designer.active:before, .side-nav.recruit-nav .dot-designer a:before, 
.side-nav.recruit-nav .animation-designer.active:before, .side-nav.recruit-nav .animation-designer a:before, 
.side-nav.recruit-nav .planner.active:before, .side-nav.recruit-nav .planner a:before, 
.side-nav.recruit-nav .scenario-writer-scripter.active:before, .side-nav.recruit-nav .scenario-writer-scripter a:before, 
.side-nav.recruit-nav .customer-support.active:before, .side-nav.recruit-nav .customer-support a:before, 
.side-nav.recruit-nav .server-infrastructure-engineer.active:before, .side-nav.recruit-nav .server-infrastructure-engineer a:before, 
.side-nav.recruit-nav .director.active:before, .side-nav.recruit-nav .director a:before {
	content: "";
	width: 35px;
	height: 35px;
	position: absolute;
	top: 15%;
	left: 7px;
}
.side-nav.recruit-nav .game-engineer.active:before, .side-nav.recruit-nav .game-engineer a:before {
	background: url(../../images/recruit_career_icon_01.png) no-repeat center center;
}
.side-nav.recruit-nav .graphic-designer.active:before, .side-nav.recruit-nav .graphic-designer a:before {
	background: url(../../images/recruit_career_icon_02.png) no-repeat center center;
}
.side-nav.recruit-nav .dot-designer.active:before, .side-nav.recruit-nav .dot-designer a:before {
	background: url(../../images/recruit_career_icon_03.png) no-repeat center center;
}
.side-nav.recruit-nav .animation-designer.active:before, .side-nav.recruit-nav .animation-designer a:before {
	background: url(../../images/recruit_career_icon_04.png) no-repeat center center;
}
.side-nav.recruit-nav .planner.active:before, .side-nav.recruit-nav .planner a:before {
	background: url(../../images/recruit_career_icon_05.png) no-repeat center center;
}
.side-nav.recruit-nav .scenario-writer-scripter.active:before, .side-nav.recruit-nav .scenario-writer-scripter a:before {
	background: url(../../images/recruit_career_icon_06.png) no-repeat center center;
}
.side-nav.recruit-nav .customer-support.active:before, .side-nav.recruit-nav .customer-support a:before {
	background: url(../../images/recruit_career_icon_07.png) no-repeat center center;
}
.side-nav.recruit-nav .server-infrastructure-engineer.active:before, .side-nav.recruit-nav .server-infrastructure-engineer a:before {
	background: url(../../images/recruit_career_icon_08.png) no-repeat center center;
}
.side-nav.recruit-nav .director.active:before, .side-nav.recruit-nav .director a:before {
	background: url(../../images/recruit_career_icon_09.png) no-repeat center center;
}
.recruit-nav .side-nav-banner {
	margin-bottom: 20px;
}
.recruit-nav .side-nav-banner li li:first-child {
	margin: 7px 0 10px;
}
.recruit-nav .side-nav-banner li li a {
	display: block;
	padding: 0;
	width: 210px;
	height: auto;
	margin: 0 auto 10px;
}
.recruit-nav .side-nav-banner li li a img {
	display: block;
}
.recruit-nav .side-nav-banner li li a:after {
	content: none;
}
.recruit-nav .side-nav-banner li li a:hover {
	background: none;
}

/* Recruit More Pages Styles
------------------------------ */

.recruit-more .content-inner dl {
	font-size: 14px;
	width: 550px;
	margin: 15px auto;
}
.recruit-more .content-inner dt {
	float: left;
	font-weight: bold;
	text-align: right;
	width: 85px;
}
.recruit-more .content-inner dd {
	margin: 0 0 30px 118px;
	border-left: 1px solid #e4e4e4;
	padding: 0 0 0 30px;
	line-height: 1.2em;
}
.recruit-more .content-inner li {
	margin: 10px 0 0 1em;
	text-indent: -1em;
}
.recruit-more .content-inner li:before {
	content: "●";
	color: #f56531;
	font-size: 12px;
	vertical-align: top;
	padding-right: 3px;
}
.recruit-more .content-inner p {
	text-align: center;
}
.recruit-more .content-inner p a {
	color: #f56531;
}
.recruit-more .content-inner p a:hover {
	text-decoration: underline;
}
.recruit-more .content-inner .entry-btn {
	margin-top: 40px;
}
.dot-designer .content-wide {
	border: 1px solid #e94860;
}
.dot-designer .content-title {
	border-bottom: 1px solid #e94860;
}
.dot-designer .category {
	background: #e94860;
}
.dot-designer .content-inner li:before {
	color: #e94860;
}
.recruit-more div.recruit_caution{
	margin:40px auto 0;
	font-size: 16px;
	line-height: 1.2em;
}
.recruit-more div.recruit_caution li:before{
	display:none;
}

/* Recruit Special Pages Styles
------------------------------ */

.content-wide.recruit-sp-interview h3, .content-wide.recruit-sp-movie h3, .content-wide.recruit-sp-comic h3 {
	width: 65px;
	height: 65px;
	position: absolute;
	top: 0;
	left: 0;
	background: #f56531;
	color: #fff;
	padding: 25px 15px;
}
.content-wide.recruit-sp-interview img, .content-wide.recruit-sp-movie img, .content-wide.recruit-sp-comic img {
	display: block;
	margin: 0 auto;
}
.content-wide.recruit-sp-interview h4, .content-wide.recruit-sp-movie h4, .content-wide.recruit-sp-comic h4 {
	width: 100%;
	border-top: 1px solid #f56531;
	font-size: 18px;
	display: table-cell;
	vertical-align: middle;
	font-weight: bold;
	padding: 10px;
}
.content-wide.recruit-sp-interview .category, .content-wide.recruit-sp-movie .category, .content-wide.recruit-sp-comic .category {
	height: 50px;
}
.content-wide.recruit-sp-interview p, .content-wide.recruit-sp-movie p, .content-wide.recruit-sp-comic p{
	margin: 30px;
	position: relative;
	line-height: 1.6em;
	font-size: 14px;
	min-height: 75px;
}
.content-wide.recruit-sp-interview .interviwer-a img {
	top: 0;
	left: 0;
}
.content-wide.recruit-sp-interview .interviwer-b img {
	top: 0;
	right: 0;
}
.content-wide.recruit-sp-interview p.interviwer-a {
	padding: 0 127px 0 100px;
}
.content-wide.recruit-sp-interview p.interviwer-b {
	padding: 0 100px 0 127px;
}
.content-wide.recruit-sp-interview p.interviwer-a span {
	color: #a4c92b;
}
.content-wide.recruit-sp-interview p.interviwer-b span {
	text-align: right;
	color: #38cabd;
}
.content-wide.recruit-sp-interview p.interviwer-a strong {
	background: linear-gradient(transparent 60%, #e8f1cd 60%);
}
.content-wide.recruit-sp-interview p.interviwer-b strong {
	background: linear-gradient(transparent 60%, #caefeb 60%);
}
.content-wide.recruit-sp-interview p span {
	font-size: 14px;
	display: block;
	margin-bottom: 5px;
}
.content-wide.recruit-sp-interview p img {
	position: absolute;
}
.content-wide.recruit-sp-interview p strong {
	padding: 0 2px;
	margin: 0 2px;
}
.special-content {
	margin-bottom: 30px;
}
.content-wide.recruit-sp-movie .movie {
	padding: 30px 30px 0 30px;
	margin-bottom: 30px;
}
.content-wide.recruit-sp-movie .movie video {
	width: 100%;
	border: 1px solid #e4e4e4;
	border-radius: 5px;
}
.content-wide.recruit-sp-movie .comment p {
	margin: 30px;
	font-size: 14px;
	line-height: 1.5em;
}
.content-wide.recruit-sp-movie .comment img {
	margin: 30px auto;
	border-radius: 5px;
}
.content-wide.recruit-sp-comic div img{
	border:1px solid #e9e9e9;
	margin-bottom:20px;
}
.content-wide.recruit-sp-comic .special-content p{
	text-align:left;
	margin:0 30px !important;
}
.content-wide.recruit-sp-comic .special-content img{
	border-radius: 5px;
    box-shadow: none;
	border: 1px solid #e9e9e9;
}

/* Recruit FAQ Pages Styles
------------------------------ */

.recruit-faq .content-inner dl {
	font-size: 14px;
	width: 600px;
	margin: 15px auto;
}
.recruit-faq .content-inner dt {
	border: 1px solid #f56531;
	border-radius: 5px;
	font-size: 16px;
	padding: 15px;
	margin-bottom: 15px;
}
.recruit-faq .content-inner dt:before {
	content: "Q.";
	color: #f56531;
	font-size: 24px;
	vertical-align: baseline;
	padding-right: 6px;
	font-weight: bold;
}
.recruit-faq .content-inner dd {
	line-height: 1.5em;
	margin-bottom: 30px;
}
.recruit-faq .content-inner ul {
	margin-bottom: 10px;
}
.recruit-faq .content-inner li {
	margin: 10px 0 0 1em;
	text-indent: -1em;
}
.recruit-faq .content-inner li:before {
	content: "●";
	color: #f56531;
	font-size: 12px;
	vertical-align: top;
	padding-right: 3px;
}

/* Contact Pages Styles
------------------------------ */

.contact h4 {
	background: #fcf8f9;
	padding: 30px;
	font-weight: bold;
	border-top: 1px solid #f56531;
	border-bottom: 1px solid #e4e4e4;
	margin: -1px 0 30px 0;
}
.contact p {
	line-height: 1.5em;
}
.contact .contact-text, .contact .contact-btn, .contact .contact-link {
	margin: 30px;
}
.contact .contact-btn a {
	display: inline-block;
	background: linear-gradient(#eb551c 0%, #d84208 100%);
	color: #fff;
	padding: 15px 30px;
	border-radius: 5px;
	text-align: center;
}
.contact .contact-btn a[href^="mailto"]:before {
	content: url(../../images/icon_03.png);
	margin-right: 10px;
	vertical-align: middle;
}
.contact .contact-btn a:hover {
	opacity: .9;
}
.contact .contact-btn a span {
	font-size: 11px;
}
.contact .contact-link a {
	color: #f56531;
	margin: 0 0 0 2px;
}
.contact .contact-link a:hover {
	text-decoration: underline;
}
.contact .contact-link a span {
	font-size: 11px;
}
.contact .contact-link:before {
	content: ">";
	font-size: 12px;
	font-weight: bold;
	margin-right: 7px;
	color: #f56531;
	font-family: monospace;
	vertical-align: middle;
}
.contact .caution {
	margin: 0 30px 30px;
	border: 1px solid #f56531;
	border-radius: 3px;
}
.contact .caution h4 {
	padding: 15px;
	border: none;
	background: #f56531;
	color: #fff;
	margin: 0;
}
.contact .caution p {
	padding: 15px;
}

/* About & Privacy Pages Styles
------------------------------ */

.privacy {
	padding-top: 30px;
}
.about .content-box, .privacy .content-box {
	padding-bottom: 30px;
}
.about h4, .privacy h4 {
	padding: 30px;
	font-weight: bold;
	border-top: 1px solid #f56531;
	border-bottom: 1px solid #e4e4e4;
	margin-top: -1px;
}
.about h5, .privacy h5 {
	font-size: 14px;
	font-weight: bold;
	line-height: 1.5em;
	margin: 0 30px;
}
.about p, .privacy p {
	font-size: 14px;
	line-height: 1.5em;
	margin: 0 30px;
}
.about ol, .privacy ol, .privacy ul {
	list-style: decimal;
	padding: 15px 0 0 50px;
	font-size: 14px
}
.privacy ul {
	list-style: disc;
}
.privacy ul ol {
	list-style: upper-roman;
	padding: 5px 0 2px 20px;
}
.about li, .privacy li {
	margin-bottom: 7px;
	line-height: 1.5em;
}
.about .textcenter,
.privacy .textcenter{
	text-align: center;	
}
.about .textright,
.privacy .textright{
	text-align: right;	
}

/* Not Found Pages Styles
------------------------------ */

.not-found {
	text-align: center;
	width: 958px;
	height: 400px;
	display: table-cell;
	vertical-align: middle;
}
.not-found p {
	font-size: 18px;
	margin-bottom: 10px;
}
.not-found a {
	display: inline-block;
}
.not-found a:before {
	content: ">";
	font-size: 12px;
	font-weight: bold;
	margin-right: 7px;
	color: #f56531;
	font-family: monospace;
	vertical-align: middle;
}

/* newgraduate style (新卒ページ)
------------------------------ */
.newgraduate_wappaer{
	font-size: 14px;
	line-height: 1.4;
}
.newgraduate_wappaer h4{
	font-weight: bold;
	font-size: 18px;
	margin: 2rem 0 0.5rem;
	transform: scale(1, 1.4);
}
.newgraduate_wappaer h4 span{
	font-size: 12px;
	font-weight: normal;
	padding-left: 0.5rem;
}
.newgraduate_wappaer p{
	text-align: left !important;
}
.newgraduate_wappaer img{
	width: 100%;
}
.newgraduate_about{
	font-size: 18px;
	line-height: 2.4;
}
.newgraduate_interview{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.newgraduate_interview .newgraduate_interview_box{
	width: 48%;
	box-shadow: 0 0 4px #c1c1c1;
	border-radius: 4px;
}
.newgraduate_jobs_box{
	/*box-shadow: 0 0 4px #c1c1c1;*/
	border-radius: 4px;
	padding: 3rem 1rem 3rem 2rem;
	margin-bottom: 1rem;
	display: table;
	width: 100%;
}
.jobx_box_n-pl{
	background-image: url("../../images/recrut/tit_n_planner.png");
	background-repeat: no-repeat;
	background-position:left center;
	background-size:auto;
}
.jobx_box_n-ge{
	background-image: url("../../images/recrut/tit_n_game-engineer.png");
	background-repeat: no-repeat;
	background-position:left center;
	background-size:auto;
}
.jobx_box_n-gd{
	background-image: url("../../images/recrut/tit_n_graphic-designer.png");
	background-repeat: no-repeat;
	background-position:left center;
	background-size:auto;
}
.jobx_box_n-cw{
	background-image: url("../../images/recrut/tit_n_comprehensive-work.png");
	background-repeat: no-repeat;
	background-position:left center;
	background-size:auto;
}
.newgraduate_jobs_box div{
	display: table-cell;
	vertical-align: middle;
}
.newgraduate_jobs_box div:first-child{
	width: 70%;
}
.newgraduate_jobs_box:last-child{
	margin-bottom: 0;
}
.newgraduate_jobs_box > div{
	  text-shadow    : 
       2px  2px 1px #ffffff,
      -2px  2px 1px #ffffff,
       2px -2px 1px #ffffff,
      -2px -2px 1px #ffffff,
       2px  0px 1px #ffffff,
       0px  2px 1px #ffffff,
      -2px  0px 1px #ffffff,
       0px -2px 1px #ffffff;   
}
.newgraduate_jobs_box .jobs_neme{
	font-size: 24px;
	font-weight: bold;
}
.newgraduate_jobs_box a{
	border: 1px solid #404040;
	padding: 0.5rem;
	display: block;
	text-align: center;
	background-color: rgba(255,255,255,0.8);
}
.newgraduate_recruitment{
	display: flex;
	justify-content: space-between;
}
.newgraduate_recruitment .newgraduate_recruitment_box{
	width: 48%;
}
.newgraduate_recruitment_box img{
	border-radius: 4px;
	overflow: hidden;
}
.newgraduate_recruitment_box a{
	border: 1px solid #404040;
	padding: 0.5rem 1rem;
	display: block;
	text-align: center;	
}
/* 各職 */
.newgraduate_wappaer h5{
	border-left: 5px solid #404040;
	padding-left: 0.5rem;
	font-weight: bold;
	font-size: 18px;
	margin: 2rem 0 0.5rem;
}
.newgraduate_careerpath_box{
	border: 1px solid #f90;
	padding: 1.5rem 2rem 1.5rem;
	position: relative;
	margin-bottom: 2rem;
	font-size: 16px;
	position: relative;
}
.newgraduate_careerpath_box:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #f90;
}
.first_newgraduate_careerpath_box{
	padding: 1.5rem 2rem 1.5rem 4.5rem;
}
.last_newgraduate_careerpath_box{
	margin-bottom: 0;
}
.last_newgraduate_careerpath_box:before{
	display: none;
}
.newgraduate_careerpath_box .icon_beginner{
	position: absolute;
	width: 30px;
	left:2rem;
	/*right: 5%;
	top:-5px;
	transform: rotate(25deg)*/
}
.newgraduate_other{
	display: flex;
	justify-content: space-between;
}
.newgraduate_other .newgraduate_other_box{
	width: 49.5%;
}
/* 福利厚生 */
.benefit_wap{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	position: relative;
	font-size: 14px;
	line-height: 1.4;
}
.benefit_box{
	width: 48%;
	margin-bottom: 3rem;
}
.benefit_box p{
	text-align: left !important;
}
.benefit_box img{
	width: 100%;
}
.benefit_title{
	font-weight: bold;
	margin: 0.5rem 0;
}