@charset "UTF-8";

/* --------------------------------------------------
**
** default
**
** -------------------------------------------------- */
html { overflow-y: scroll }
body { -webkit-text-size-adjust: 100%; }
html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,address,code,em,
img,q,strong,dl,dt,dd,ol,ul,li,form,label,fieldset,legend,table,caption,
tbody,tfoot,thead,tr,th,td,button {
	padding: 0;
	margin: 0;
	font-style: normal;
	font-weight: normal;
	outline: 0;
	border: none;
	background: none;
}
section,nav,article,aside,header,footer { display: block; }
body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 10px;
	min-width: 1080px;
}
* html body { font-size: x-small; }
*:first-child+html body { font-size: x-small; }
ol li,ul li { list-style: none; }
blockquote,q { quotes: none; }
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a,img,fieldset { border: 0; }
img,input { vertical-align: middle; }
textarea:focus,input:focus { outline: 0;  /*safariの自動フォーカスを切る */ }

/* --------------------------------------------------
**
** typography
**
** -------------------------------------------------- */
h1,h2,h3,h4,h5,h6,p,li,th,td,dt,dd,pre,caption,address {
	font-size: 100%;
	color: #000;
	line-height:1.5;
}
table { font-size: 100%; }
p input,p select,p textarea,li p,li li,li dt,li dd,li input,li select,li textarea,
dd p,dd li,dd dt,dd dd,
dd input,dd select,
dd textarea,
th p,
th li,
th dt,
th dd,
th input,
th select,
th textarea,
td p,
td li,
td dt,
td dd,
td input,
td select,
td textarea { font-size: inherit; }
textarea {
	color: #000;
	line-height: 1.5;
}
input {
	padding: 0;
	margin: 0;
}
strong {
	font-weight: bold;
	color: #BC0D0D;
}
em { }
a:link,
a:visited,
a:active,
a:hover,
a:link li,
a:visited li,
a:active li,
a:hover li { color: #000; }
a {
	text-decoration: underline;
	word-break: break-all;
}
a:hover { text-decoration: none; }
h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a { font-weight: bold; }

.clear:after {
  display: block;
  clear:both;
  content:"";
  visibility:hidden;
  height:0
}
.clear {
  /* 触发 hasLayout */
  zoom: 1;
}
/* --------------------------------------------------
**
** column
**
** -------------------------------------------------- */
div.row { clear: both; }
.col1of3 { width: 33.33%; }
.col2of3 { width: 66.66%; }
.col1of4 { width: 25%; }
.col1of5 { width: 20%; }
.col2of5 { width: 40%; }
.col3of5 { width: 60%; }
.col4of5 { width: 80%; }
.col2of4 { width: 50%; }
.col3of4 { width: 75%; }
.col1of3,
.col2of3,
.col1of4,
.col2of4,
.col3of4,
.col1of5,
.col2of5,
.col3of5,
.col4of5 {
	float: left;
	zoom: 1;
}
.col1of3.reverse,
.col2of3.reverse,
.col1of4.reverse,
.col2of4.reverse,
.col3of4.reverse,
.col1of5.reverse,
.col2of5.reverse,
.col3of5.reverse,
.col4of5.reverse { float: right; }
/* --------------------------------------------------
**
** layout
**
** -------------------------------------------------- */
div.container-nav {
	width: 1080px;
	margin: 0 auto;
	position: relative;
}

div.container {
	width: 620px;
	margin: 0 auto;
	position: relative;
}

div.last-content{
	margin-bottom:60px;
}

div.container-thanks{
	width: 620px;
	margin-top:60px;
	margin-left:120px;
	position: relative;	
}

div.container-recruit{
	width:1080px;
	margin:0 auto;
	position:relative;
	margin-top:70px;
	margin-bottom:70px;
}
div.container-top{
	width:1080px;
	margin:0 auto;
	position:relative;
}

div.formTitle{
	font-size:24px;
	padding-bottom:30px;
	background-color: #fff;
}

div.input01{
	font-size:14px;
	padding-top:10px;
	padding-bottom: 10px;
	padding-left: 10px;
}
div.input02{
	font-size:14px;
	padding-top:10px;
	padding-bottom: 10px;
	padding-left: 10px;
}
div.input03{
	font-size:14px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left: 10px;
}
div.input04{
	font-size:14px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left: 10px;
}
div.input05{
	font-size:14px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left: 10px;
}
.agree-box{
	margin: 15px 0;
}
.agree-box{
	font-size: 14px;
	text-align: center;
}
.agree-box input{
	margin-right: 6px;
}
div.submitBtn{
	font-size:14px;
}
div.service-intro{
	margin-top:15px;
}

div.case-intro{
	margin-top:15px;
	margin-bottom:100px;
}

/* -------------------------------------------------- header --*/
header h1 {
	float: left;
	width: 200px;
}

header .gNav {
	float: left;
	width: 700px;
}
header .gNav ul {
}
header .gNav li {
	font-size: 160%;
	text-align: center;
	float: left;
}

header .gNav li a {
	display: block;
	padding: 0 12px;
	color: #666;
	text-decoration: none;
	height: 50px;
	line-height: 50px;
}
header .gNav li a:hover,
header .gNav li.current a { color:rgb(68,114,196); }


header #lang {
	position: absolute;
	right: 10px;
	top: 15px;
}

header #lang li {
	font-size: 140%;
	float: left;
	color:rgb(68,114,196);
	padding: 0 10px;
}
header #lang li:first-child { 
	border-right: 1px solid #666;}

header #lang li a {
	text-decoration: none;
	color: #666;
}

header #lang li a:hover { 
	color:rgb(68,114,196); 
}

header{
	background: #FFF;
	overflow:hidden;
	margin-bottom: 220px;
}

#header-low{
	background: #FFF;
	overflow:hidden;
	margin-bottom: 0px;
}

#contents { 
	clear: both;
}

/* -------------------------------------------------- body --*/
html,
body{
	height: 100%;
	width: 100%
}

body.top {
	background-image: url(../img/top-bgimg.jpg);
	background-size: cover; 
	background-position: center center;
	background-repeat: no-repeat;
}

#about-img{
    background-image:url(../img/q01-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

#service-img{
    background-image:url(../img/q05-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}
#executive-img{
    background-image:url(../img/q07-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

#case-img{
    background-image:url(../img/q02-bgimg.jpg);
	background-size:cover; 
	background-position:relative;bottom:0px;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

#recruit-img{
    background-image:url(../img/q04-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

#contact-img{
    background-image:url(../img/q03-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

#english-img{
	background-image:url(../img/q06-bgimg.jpg);
	background-size:cover; 
	background-position: :center center;
	max-width:100%;
    height:250px;
    vertical-align:baseline;
}

p.includeimg{
	margin-top: 20px;
	margin-bottom:50px;
}

#platform {
	min-height: 100%;
	position: relative;
}

#h2-white{
	font-size: 50px;
	padding-top: 70px;
	padding-left:100px;
	color:#FFF;
}

#h2-top{
	font-size: 50px;
	padding-top: 0px;
	padding-left:0px;
	text-align: center;
}

h2{
	font-size: 50px;
	padding-top: 70px;
	padding-left:100px;
}


h3{
	position:relative;
	margin-top: 60px;
	padding:5px;
	padding-left:15px;
	font-weight: bold;
	font-size: 20px;
	background-color: #FFF;
	border-bottom: 1px dashed rgb(68,114,196);
	border-left: 5px solid rgb(68,114,196);
}


.thanks{
	font-size:24px;
}

p{
	font-size:16px;
	padding-top:15px;
	padding-bottom:40px;
}

.container-top p
{
	font-size:16px;
	padding-top:50px;
	padding-bottom:40px;
	text-align: center
}

#contents-about th{
	font-size:15px;
	width:160px;
	height:30px;
	text-align: center;
	border-bottom: #e3e3e3 1px dotted;
}
#contents-about td{
	font-size:15px;
	border-bottom: #e3e3e3 1px dotted;
	padding: 10px 0px 10px 25px;
}

#contents-recruit th{
	font-size:15px;
	width:160px;
	height:30px;
	text-align: center;
	border-bottom: #e3e3e3 1px dotted;
}
#contents-recruit td{
	font-size:15px;
	border-bottom: #e3e3e3 1px dotted;
	padding: 10px 0px 10px 25px;
}

table{
	margin-left: auto;
	margin-right: auto;
}

table.about th {
    background-color: rgba(0,0,0,0.1);
    color: #000;
}

table.about td{
	width:250px;
}

table.recruit th {
    color: #000;
    width:100px;
    background-color: rgba(0,0,0,0.1);
}

table.recruit td{
	width:980px;
}

th.t-top {
    border-top: rgb(68,114,196) 4px solid;
}
td.t-top {
	border-top: #b3b3b3 4px solid;
}

table.contact th{
	background-color: rgba(0,0,0,0.1);
	font-size:14px;
	text-align:left;
	padding-left: 10px;
	padding-right:10px;
}

.service-intro li{
	font-size:16px;
}

.case-intro li{
	font-size:16px;
}

.service1{
	margin-bottom: 30px;
	margin-left: 30px;
}

.submitBtn{
	text-align: center;
}

.title-name-jp{
	font-size:20px;
	padding-top: 0px;
}

.tableArea{
	margin-top:10px;
	margin-bottom:60px;
}

.tableArea2{
	margin-top:70px;
	margin-bottom:70px;
}

.formBox{
	margin-top:60px;
	margin-bottom:60px;
}

.services{
	position:relative;
	padding-left:30px;
	font-size: 18px;
	line-height: 18px;
	padding-top:9px;
	padding-bottom:7px;
}
 
.services:before{
	content:''; 
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px; 
	height:12px; 
	width:12px; 
	display:block; 
	position:absolute; 
	top:14px; 
	left:7px; 
	background-color:#6B0CE8;
	box-shadow: 0 0 2px 2px rgba(255,255,255,0.2) inset;
	filter:alpha(opacity=50);
	-moz-opacity:0.50;
	-khtml-opacity: 0.50;
	opacity:0.50;
	z-index: 1;
}
 
.services:after{
	content:''; 
	border-radius:30px;
	-webkit-border-radius:30px;
	-moz-border-radius:30px; 
	height:15px; 
	width:15px; 
	display:block; 
	position:absolute; 
	top:7px; 
	left:2px; 
	background-color:rgb(68,114,196);
	box-shadow: 0 0 2px 2px rgba(255,255,255,0.2) inset
}	

.last-content p{
	padding-bottom:10px;
}

.tableArea2 p{
	font-size:16px;
	padding-top:10px;
	padding-bottom:5px;
}

/* -------------------------------------------------- footer --*/
footer {
	background: #666;
	padding: 1px 0;
	position: relative;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
}
#footer-top{
	background: #666;
	padding: 1px 0;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
}

p.copyright{
	padding-top: 0px;
	padding-bottom: 0px;
}

p.copyright small { 
	color: #FFF; }
	
.sp-only{
	display: none;
}
.executive-table input[type="text"]{
	width: 100%;
	box-sizing: border-box;
}
.executive-table .input01{
	font-size: 0;
}
.input01 input[type="text"]{
	width: calc(50% - 5px);
	font-size: 14px;
}
.input01 input[type="text"]:first-child{
	margin-right: 5px;
}
.input01 input[type="text"]:last-child{
	margin-left: 5px;
}
.rule{
	margin-top: 50px;
	height: 240px;
    overflow-y: auto;
    padding: 1em;
    border: 1px solid #e5e5e5;
}
.rule-text{
	margin-top: 30px;
}
.rule-text:first-child{
	margin-top: 0;
}
.rule-text h2{
	padding: 0;
	font-size: 20px;
	text-align: center;
	padding-bottom: 10px;
}
.rule-text p{
	font-size: 13px;
	padding: 0;
	line-height: 23px;
}
.rule-text p.tips1{
	padding-left: 1em;
	position: relative;
}
.rule-text p.tips2{
	padding-left: 3em;
	position: relative;
}
.rule-text p span.span-tips{
	position: absolute;
	left: 0;
	top: 0;
}
.rule-text p.text-right{
	text-align: right;
}
@media screen and (max-width: 1100px) {
	body{
		min-width: 100%;
	}
	div.container-nav{
		width: 100%;
	}
	div.container-top,div.container,div.container-recruit,div.container-thanks{
		width: 100%;
		padding: 0 50px;
		box-sizing: border-box;
	}
	header h1{
		width: 160px;
		float: none;
	}
	header .gNav{
		width: auto;
		float: none;
	}
	header .gNav ul{
		display: flex;
		justify-content: center;
		background: #ddd;
	}
}
@media screen and (max-width: 767px) {
	.sp-only{
		display: block;
	}
	.pc-only{
		display: none;
	}
	div.container-top,div.container,div.container-recruit,div.container-thanks{
		padding: 0 10px;
	}
	header #lang{
		position: relative;
		text-align: center;
		top: 0;
		right: 0;
		font-size: 0;
	}
	header #lang li{
		float: none;
		height: 50px;
		line-height: 50px;
		display: inline-block;
		border-bottom: none;
		vertical-align: top;
		font-size: 16px;
		width: 50%;
	    box-sizing: border-box;
	    text-align: center;
	}
	header #lang li:first-child {
	    border-right: 1px solid #ddd;
	}
	header #lang li a{
		padding: 0;
	}
	header .gNav{
	    position: absolute;
	    background: #fff;
	    top: 50px;
	    z-index: 11111;
	    float: none;
	    width: 100%;
	    height: calc(100vh - 50px);
	    border-top: 1px solid #ddd;
	    display: none;
	}
	header .gNav ul{
		display: block;
		background: #fff;
	}
	header .gNav li{
		float: none;
	    border-bottom: 1px solid #ddd;
	    text-align: left;
	}
	header{
		margin-bottom: 170px;
		overflow: inherit;
	}
	#header-low{
		overflow: inherit;
	}
	.sp-menu{
		position: absolute;
		right: 0;
		width: 50px;
		height: 50px;
		top: 0;
		box-sizing: border-box;
	}
	.sp-menu span, .sp-menu span::before, .sp-menu span::after {
	    position: absolute;
	    display: inline-block;
	    height: 3px;
	    width: 24px;
	    background: #525263;
	}
	.sp-menu span {
	    position: absolute;
 	    top: 23px;
	    right: 8px;
	    -webkit-transition: background 0.3s 0.3s;
	    -moz-transition: background 0.3s 0.3s;
	    transition: background 0.3s 0.3s;
	}
	.sp-menu span::before, .sp-menu span::after {
	    content: '';
	    right: 0;
	    -webkit-transform: translateZ(0);
	    -moz-transform: translateZ(0);
	    -ms-transform: translateZ(0);
	    -o-transform: translateZ(0);
	    transform: translateZ(0);
 	   -webkit-backface-visibility: hidden;
	    backface-visibility: hidden;
 	   -webkit-transform-origin: 0% 50%;
	    -moz-transform-origin: 0% 50%;
	    -ms-transform-origin: 0% 50%;
	    -o-transform-origin: 0% 50%;
	    transform-origin: 0% 50%;
	    -webkit-transition: -webkit-transform 0.3s 0.3s;
	    -moz-transition: -moz-transform 0.3s 0.3s;
 	   transition: transform 0.3s 0.3s;
	}
	.sp-menu span::before {
	    top: -8px;
	}
	.sp-menu span::after {
	    top: 8px;
	}
	.sp-menu.active span {
	    background: rgba(46, 50, 51, 0);
	}
	.sp-menu.active span::before, .sp-menu.active span::after {
	    background: #525263;
	}
	.sp-menu.active span::before {
	    -webkit-transform: translateX(0px) translateY(-1px) rotate(45deg);
	    -moz-transform: translateX(0px) translateY(-1px) rotate(45deg);
	    -ms-transform: translateX(0px) translateY(-1px) rotate(45deg);
	    -o-transform: translateX(0px) translateY(-1px) rotate(45deg);
	    transform: translateX(0px) translateY(-1px) rotate(45deg);
	}
	.sp-menu.active span::after {
	    -webkit-transform: translateX(0px) translateY(0px) rotate(-45deg);
	    -moz-transform: translateX(0px) translateY(0px) rotate(-45deg);
	    -ms-transform: translateX(0px) translateY(0px) rotate(-45deg);
	    -o-transform: translateX(0px) translateY(0px) rotate(-45deg);
	    transform: translateX(0px) translateY(0px) rotate(-45deg);
	}
	#h2-top{
		font-size: 30px;
		line-height: 45px;
	}
	.container-top p{
		padding: 30px 0;
	}
	#about-img,#service-img,#contact-img,#english-img,#case-img,#recruit-img,#executive-img{
	    display: flex;
	    justify-content: center;
	    align-items: center;
	}
	#h2-white{
		display: inline-block;
		padding: 0;
	}
	#contact-img h2,#case-img h2,#english-img h2,#recruit-img h2{
		display: inline-block;
		padding: 0;
	}
	img{
		max-width: 100%;
	}
	#contents-recruit th{
		width: 100px;
	}
	table.recruit td{
		width: calc(100% - 100px);
	}
	#contents-recruit td{
		padding: 10px;
	}
	table.contact{
		width: 100%;
	}
	table.contact tr{
		display: block;
	}
	table.contact th{
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 10px;
	}
	table.contact td{
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 10px 0;
	}
	table.contact td input{
		width: 100%;
		box-sizing: border-box;
	}
	table.contact td textarea{
		width: 100%;
		box-sizing: border-box;
	}
	div.input01,div.input02,div.input03,div.input04,div.input05{
		padding: 0;
	}
	div.container-thanks{
		text-align: center;
		margin-left: 0;
	}
	table.contact td .agree-box input{
		display: inline;
		width: auto;
	}
	header h1{
		padding: 5px 10px;
	}
	header h1 img{
		height: 40px;
		width: auto;
	}
	#h2-white,#contact-img h2,#english-img h2,#case-img h2,#recruit-img h2{
		font-size: 40px;
	}
	#h2-white br,#contact-img h2 br,#english-img h2 br,#case-img h2 br,#recruit-img h2 br{
		display: none;
	}
	#h2-white span,#contact-img h2 span,#english-img h2 span,#case-img h2 span,#recruit-img h2 span{
		display: block;
		text-align: center;
	    line-height: 50px;
	}
	#about-img, #service-img, #contact-img, #english-img,#case-img,#recruit-img,#executive-img{
		height: 180px;
	}
	.service1{
		margin: 0 1.5em 30px;
	}
	.formBox,.tableArea2{
		margin: 20px 0 60px;
	}
}