@charset "UTF-8";
/* COMMON
================================================== */
body {
	font-family: 'Arial',"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif;
}
.inner {
  max-width:1200px;
}
header {
	height: 100px;
    width: 100%;
    margin: 0 auto;
    color: #fff;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    align-items: center;
    position: relative;
    top:0;
    z-index: 100;
 }
header h1 {
  width:20%;
  line-height: 100px;
  margin-left: 1em;
	font-size: 2.25rem;
}
header h1 a img {
    width: 100%;
}

/* BUTTON
================================================== */
#hamburger {
  display: none;
}

/* GNAVI
================================================== */
header nav {
  display: block !important;
  background: none;
  position: inherit;
  margin: 0;
	width: auto;
}
header nav ul {
  position: inherit;
  height: 100px;
  overflow: hidden;
  margin: 0;
  background: none;
  width: auto;
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  margin: 0;
	padding:0 ;
width: auto;
}
header nav ul li {
  position: relative;
  box-sizing: border-box;
  border-bottom: 0;
  list-style: none;
  width: auto;
  padding: 0;
}

header nav ul li a {
  color: #444;
  padding: 1em 2em;
  box-sizing: border-box;
  height: 100px;
  line-height: calc(100px - 2em);
  display: block;
  border-right: 1px #f5f5f5 solid;
}
header nav ul li:last-of-type a {
	border-right: 0;
}

/*MAIN
================================================== */
main > article.white {
	margin-bottom: 10em;
}

/*KEYVISUAL
================================================== */
#keyVisual {
	/*padding-top: 100px;*/
}
#keyVisual #slide2 {
  display: none ;
}
#keyVisual #slide {
  display: block;
}

/*CATCHPHRASE
================================================== */
#catchPhrase .inner {
  background: none !important;
  width: 96%;
  padding: 10em 0;
}
/*画像有り*/
#catchPhrase dl {
  margin: 0;
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
	align-items: center;
}
#catchPhrase dt {
  display: block;
  width:47.5%;
}
#catchPhrase dd {
  width:47.5%;
}
#catchPhrase dd h1 {
  margin: 0 0 0.55em;
  font-size: 2.25rem;
  color: #444;
  line-height: 1.3em;
}
#catchPhrase dd p {
  color: #444;
  text-align: left;
}
/*画像無し*/
#catchPhrase .empty h1 {
  margin: 0 0 0.55em;
  font-size: 2.25rem;
  color: #444;
  line-height: 1.3em;
}
#catchPhrase .empty p {
  color: #444;
  text-align: center;
}

/*TT
================================================== */
/*common*/
#contents-2tt ul,#contents-3tt ul,#contents-4tt ul {
  margin: 0;
  padding: 0;
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  flex-wrap:wrap;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
}
#contents-2tt li img,#contents-3tt li img,#contents-4tt li img {
  width: 100%;
  display: inline;
}

/*2tt*/
#contents-2tt li {
  width:47.5%;
  margin: 0;
  border-bottom:0;
}
#contents-2tt li h2 {
  text-align: center;
  font-size: 2.25rem;
  margin: 1.4em 0 1.1em;
}

/*3tt*/
#contents-3tt li {
  width:30%;
  margin: 0;
  padding: 0;
  border-bottom: 0;
}
#contents-3tt li h2 {
  text-align: center;
  font-size: 1.875rem;
  margin: 1em 0 0.8em;
}

/*4tt*/
#contents-4tt li {
  width:22.5%;
  margin: 0;
  list-style: none;
  border-bottom: 0;
}
#contents-4tt li h2 {
  text-align: center;
  font-size: 1.625rem;
  margin: 0.8em 0 0.6em;
}

/*CONTENTS-NEWS
================================================== */
#contents-news h2 {
  text-align: center;
  font-size: 2.25rem;
  margin: 1.4em 0 1.1em;
}

#contents span.date {
  margin-top: -20px;
}

/*BANNER
================================================== */

#banner ul li {
	width: 23%;
	margin: 0 1.333% 10px 1.333%;
	max-width: 280px;
}
#banner ul li:nth-of-type(4n-3) {
	margin: 0 1.333% 10px 0;
}
#banner ul li:nth-of-type(4n) {
	margin: 0 0 10px 1.333%;
}

/*FOOTER
================================================== */
footer {
  padding: 0;
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
  align-items: center;
}
footer ul {
	margin:2em 0 2em 2em;
}
footer p {
  text-align: center;
  font-size: 0.625rem;
  margin: 0 2em 0 0;
}

/*PAGETOP
================================================== */
.pagetop {
  position:fixed;
  right:20px;
  bottom:100px;
  z-index:9999;
}
.pagetop a {
width:60px;
line-height: 60px;
border-radius:5px;
background-color: #444;
}
.pagetop a:after {
  content: "▲";
  font-size: 1rem;
}

#pageTitle{
	margin: 0 0 5em 0;
}

/*CONTENTS
================================================== */
#contents {
  width: 96%;
  max-width:1200px;
  min-width: 1000px;
  display:-ms-flexbox;
  display:-webkit-flex;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;  
}
#contents section {
  margin: 0 0 10em 0;
}
#contents section:last-of-type {
  margin: 0 0 0 0;
}
#contents h2 {
  font-size: 2rem;
	margin: 0 0 2em 0;
  padding: 0.5em 0 0 0;
}

#contents h3 {
  font-size: 1.5rem;
  margin: 0 0 0.5em 0;
}


/*table*/
#contents .table table {
  margin: 0 auto;
}
#contents .table th {
  display: table-cell;
  border-bottom: 1px dotted #ccc;
  padding: 1em;
  width: 10em;
}
#contents .table td {
  display: table-cell;
  line-height: 130%;
  margin: 0;
  padding: 1em 0;
  border-bottom: 1px dotted #ccc;
}


/*.contents-tt*/
#contents .contents-2tt ul,
#contents .contents-3tt ul,
#contents .contents-4tt ul {
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  flex-wrap:wrap;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
}
#contents .contents-2tt li {
  width: 46%;
}
#contents .contents-3tt li {
  width: 32%;
}
#contents .contents-4tt li {
  width: 23%;
}

/*.contents-cap*/
.contents-2cap ul,.contents-3cap ul,.contents-4cap ul {
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  flex-wrap:wrap;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
}
.contents-2cap li {
  width:46%;
}
.contents-3cap li {
  width:32%;
}
.contents-4cap li {
  width:23%;
}

/*img-txt*/
#contents .img-txt dl {
  display:-ms-flexbox;
  display:-webkit-flex;
  display: flex;
  -ms-flex-wrap:wrap;
  -webkit-flex-wrap:wrap;
  flex-wrap:wrap;
  -ms-flex-pack:justify;
  -webkit-justify-content: space-between;
  justify-content:space-between;
}
#contents .img-txt dt {
  width: 48%;
}
#contents .img-txt dd {
  width: 48%;
}

#contents p.btn {
  margin: auto;
  width:300px;
}


/*COMPANY
================================================== */
.company th {
	display: table-cell;
	width:20%;
	padding: 1em 0 1em 0;
	border-bottom: 1px dotted #bcbcbc;
}
.company td {
	display: table-cell;
	width:80%;
	padding: 1em 0 1em 0;
}
.company iframe {
	height: 450px;
}

/*BUSINESS
================================================== */
.business .column01 table {
  margin: 0 0 4em 0;
}
.business .column01 th {
  width: 30%;
  max-width: 480px;
  display: table-cell;
}
.business .column01 td {
 width: 65%;
 padding-left: 5%;
  display: table-cell;
}
.business .column02 {
	display:-ms-flexbox;
	display:-webkit-flex;
	display: flex;
	-ms-flex-pack:justify;
	-webkit-justify-content: space-between;
	justify-content:space-between;
	-ms-flex-wrap:wrap;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
}
.business .column02 dl {
	width: 45%;
	margin: 0 0 4em 0;
}
.business .column02 dt {
  font-size: 1.5rem;
  margin: 0 0 0.5em 0;
  font-weight: bold;
  text-align: center;
}
.business .column02 dd {
  margin: 0;
  text-align: center;
}
.business .column02 dd img {
  display: block;
  margin: 0 0 0.5em 0;
}


/*CONTACT
================================================== */
article.contact-table{
  padding-bottom: 5em;
}
article.contact-table table{
  border:none;
  margin-bottom: 50px;
}
article.contact-table table tr{
	margin-bottom: 0px;
	display: block;
}
article.contact-table table tr th{
	position: relative;
	color: #333;
	text-align: left;
	padding: 13px 0px 13px 5px;
	vertical-align: top;
	width: 25%;
	display: inline-block;
}
article.contact-table table tr th span{
	position: absolute;
	right: 5%;
	background-color: red;
	color: #fff;
	font-size: 12px;
	padding: 5px 10px;
}
article.contact-table table tr td{
  padding: 10px 0px 10px 5px;
  width: 70%;
	display: inline-block;
}
#contents input[type="text"]{
  width: 95%;
  padding: 5px;
  line-height: 20px;
}
#contents input[type="email"]{
  width: 95%;
  padding: 5px;
  line-height: 20px;
}
#contents textarea{
  width: 95%;
  padding: 5px;
  line-height: 20px;
}
#contents p.btn input[type="submit"] {
  margin: auto;
  width:300px;
  height: 60px;
  display: block;
  background-color: #333;
  color: #fff;
  text-decoration: none;
  text-align: center;
  border:none;
  cursor: pointer;
  transition: .8s all;
  line-height: 60px;
  padding: 0;
}
#contents p.btn input[type="submit"]:hover {
  background-color: #999;
}

#contents div.ContactPolicy p.center a{
  display: inline;
  padding: 1em;
}

/*RECRUIT
================================================== */
article.recruit table tr th{
  width: 20%;
  text-align: left;
  border-bottom: 1px solid #bcbcbc;
  display: table-cell;
  padding: 1em 0 1em 0;
}

article.recruit table tr td{
  width: 80%;
  border-bottom: 1px solid #bcbcbc;
  display: table-cell;
  padding: 1em 0 1em 0;
}

/*PAGENATION
================================================== */
aside#pagenation{
  margin-bottom: 5em;
}

aside#pagenation div.btn{
  width: 250px;
  margin: 0 auto;
}

aside#pagenation div.btn a{
    display: block;
    background-color: #444;
    text-align: center;
    border: 1px solid #444;
    color: #fff;
    text-decoration: none;
    line-height: 375%;
    transition: .8s;
}

aside#pagenation div.btn a:hover{
  background-color: #fff;
  color: #000;
}




/*MAIN-COLOR
================================================== */
.pagetop a {
  background-color: var(--main-color);
}
article.contact-table table tr th span{
  background-color: var(--main-color);
}
#contents p.btn input[type="submit"] {
  background-color: var(--main-color);
}
aside#pagenation div.btn a{
  background-color: var(--main-color);
  border: 1px solid var(--main-color);
}