@charset "utf-8";
/*
Theme Name: Security-Work WordPress 
Author: Y.ARAKI
Description: original theme
Version： 1.0.0
*/
/* CSS Document */
/*==================== ▼ ====================*/
.pc-on {
  display: block;
}
.pc-off {
  display: none;
}
.tb-on {
  display: none;
}
.sp-on {
  display: none;
}
/*==================== ▼ TABLET ====================*/
@media screen and (max-width: 840px) {
  .tb-on {
    display: block;
  }
  .pc-on {
    display: none;
  }
  .sp-on {
    display: none;
  }
}
@media screen and (max-width: 599px) {
  .pc-on {
    display: none;
  }
  .tb-on {
    display: none;
  }
  .sp-on {
    display: block;
  }
  .sp-none {
    display: none;
  }
  #page_top {
    display: none;
  }
}
/*==================== ▼ HEADER ====================*/
.parallax-page-title {
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  padding: 100px 0 20px;
  color: #fff;
  text-shadow: 1px 2px 3px #333;
}
.page-title {
  text-align: center;
  font-size: 24px;
  margin-bottom: 20px;
}
.page-title span {
  font-family: "Times New Roman", Times, "serif";
  padding-left: 10px;
  font-size: 20px;
}
/*==================== ▼ BUSINESS ====================*/
.business-01 {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 10px;
  color: #D40307;
}
.business-02 {
  color: #333;
}
.business-03 {
  font-size: 18px;
  width: 100%;
  max-width: 510px;
  margin: 0 auto 10px;
}
.business-04 {
  font-size: 18px;
  width: 100%;
  max-width: 510px;
  margin: 0 auto 30px;
}
.business-box-1 {
  max-width: 860px;
  margin: 0 auto 30px;
}
.business-05 {
  font-size: 18px;
  margin: 0 0 5px 20px;
}
.business-box-2 {
  max-width: 408px;
  float: left;
  border: 1px solid #233B6C;
  margin: 0 10px;
  height: auto;
}
.business-06 {
  color: #fff;
  text-align: center;
  font-size: 18px;
  background-color: #233B6C;
  padding: 10px 0;
  margin-bottom: 5px;
}
.business-07 {
  padding: 0 5px;
}
.business-08 {
  padding: 5px 5px 10px 5px;
}
.business-box-3 {
  width: 90%;
  max-width: 860px;
  margin: 0 auto 30px;
}
.business-09 {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}
.business-10 {
  font-size: 18px;
  margin-bottom: 5px;
}
.business-10 img {
  width: 20px;
  padding-right: 10px;
  vertical-align: middle;
}
.business-11 {
  font-size: 18px;
  margin-bottom: 20px;
}
.business-11 img {
  width: 20px;
  padding-right: 10px;
  vertical-align: middle;
}
/* ==================== ▼ COMPANY ==================== */
.company-inner {
  width: 96%;
  max-width: 900px;
  margin: 0 auto;
  background-color: #fff;
}
.company-01 {
  font-size: 20px;
  margin-bottom: 20px;
}
.company-box-1 {
  width: 100%;
  max-width: 900px;
  margin: 0 auto 30px;
}
.company-02 {
  width: 250px;
  float: left;
  margin: 30px 20px 0 0;
}
.company-box-1-inner {
  width: 630px;
  float: left;
}
.company-03 {
  margin-bottom: 10px;
}
.company-04 {
  margin-bottom: 20px;
}
.company-05 {
  margin-bottom: 20px;
  font-size: 18px;
}
.company-06 {
  text-align: right;
}
.company-07 {
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-size: 20px;
  padding-left: 20px;
}
.company-table {
  width: 96%;
  max-width: 800px;
  margin: 0 auto 50px;
}
.company-table th {
  text-align: left;
  padding: 5px 10px;
  width: 30%;
  background: #efefef;
  border: 1px solid #ccc;
}
.company-table td {
  padding: 5px 10px;
  border: 1px solid #ccc;
}
.company-box-5 {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.company-08 {
  font-size: 22px;
  padding: 0 0 5px 20px;
}
.company-08 span {
  font-family: "Times New Roman", Times, "serif";
  padding-left: 10px;
}
.company-09 {
  margin: 0 0 10px 20px;
}
.company-10 {
  float: left;
  width: 380px;
  margin: 0 10px 20px;
}
/* ==================== ▼ FAQ ==================== */
.faq-box {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 30px;
}
/*アコーディオン全体*/
.accordion {
  width: 100%;
  max-width: 780px;
  margin: 0 auto;
}
.accordion li {
  margin: 10px 0;
}
.accordion section {
  border: 1px solid #ccc;
}
/*アコーディオンタイトル*/
.title {
  position: relative; /*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  font-size: 1rem;
  font-weight: normal;
  padding: 10px 10px 10px 50px;
  transition: all .5s ease;
}
/*アイコンの＋と×*/
.title::before, .title::after {
  position: absolute;
  content: '';
  width: 15px;
  height: 2px;
  background-color: #333;
}
.title::before {
  top: 48%;
  left: 15px;
  transform: rotate(0deg);
}
.title::after {
  top: 48%;
  left: 15px;
  transform: rotate(90deg);
}
/*　closeというクラスがついたら形状変化　*/
.title.close::before {
  transform: rotate(45deg);
}
.title.close::after {
  transform: rotate(-45deg);
}
/*アコーディオンで現れるエリア*/
.box {
  display: none; /*はじめは非表示*/
  background: #f0f0f0;
  margin: 0 10px 10px 10px;
  padding: 10px 10px 10px 20px;
}
/*==================== ▼ PRIVACY ====================*/
.privacy-box-1 {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
}
.privacy-01 {
  margin-bottom: 20px;
}
.privacy-02 {
  font-size: 18px;
  padding-bottom: 10px;
}
.privacy-03 {
  padding: 0 0 20px 10px;
}
.privacy-04 {
  padding: 0 0 20px 10px;
}
.privacy-05 {
  padding: 0 0 50px 10px;
}
.privacy-box-2 {
  width: 360px;
  float: right;
}
.privacy-06 {
  margin-bottom: 10px;
}
.privacy-07 {
  margin-left: 10px;
}
/* ==================== ▼ RECRUIT ==================== */
.recruit-01 {
  text-align: center;
  font-size: 20px;
  margin-bottom: 20px;
}
.recruit-box-1 {
  width: 100%;
  max-width: 950px;
  margin: 0 auto 30px;
}
.recruit-02 {
  font-size: 20px;
  padding: 5px 0 5px 30px;
  margin-bottom: 10px;
  font-weight: 700;
  background: linear-gradient(#fafafa, #ccc);
}
.recruit-box-2 {
  width: 100%;
  max-width: 640px;
  margin: 0 auto 20px;
}
.recruit-box-3 {
  width: 100%;
  max-width: 640px;
  margin: 0 auto 20px;
}
.recruit-03 {
  width: 300px;
  float: left;
  margin: 0 10px;
}
.recruit-04 {
  font-size: 18px;
  padding: 0 0 10px 0;
}
.recruit-05 {
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 2;
}
.recruit-05 img {
  width: 20px;
  padding: 0 5px 0 20px;
  vertical-align: middle;
}
.recruit-06 {
  padding: 0 0 10px 20px;
}
.recruit-07 {
  font-size: 18px;
  font-weight: 700;
  padding: 0 0 10px 20px;
}
.recruit-box-4 {
  width: 100%;
  max-width: 880px;
  margin: 0 auto 30px;
}
.recruit-08 {
  width: 400px;
  float: left;
  margin: 0 20px;
}
.recruit-box-5 {
  width: 100%;
  max-width: 960px;
  margin: 0 auto 30px;
}
.recruit-09 {
  font-size: 22px;
  text-align: center;
  margin-bottom: 10px;
  font-weight: 700;
}
.recruit-box-6 {
  width: 300px;
  float: left;
  margin: 0 10px;
}
.recruit-10 {
  margin-bottom: 0;
}
.recruit-11 {
  font-size: 20px;
  text-align: center;
}
.recruit-12 {
  padding: 10px;
}
/*==================== ▼ SECURITY ====================*/
.security-box-1 {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  padding-bottom: 30px;
}
.security-01 {
  width: 300px;
  float: left;
  margin: 0 20px;
}
.security-box-2 {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.security-02 {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 10px;
}
.security-03 {
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
}
.security-04 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 5px;
}
.security-05 {
  padding-left: 10px;
  margin-bottom: 20px;
}
/* ==================== ▼ SERVICE ==================== */
.service-01 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 20px;
}
.service-02 {
  font-size: 18px;
  text-align: center;
  margin-bottom: 50px;
}
.service-box-1 {
  width: 100%;
  max-width: 900px;
  margin: 0 auto 10px;
}
.service-03 {
  font-size: 20px;
  margin-bottom: 5px;
  font-weight: 700;
}
.service-04 {
  width: 300px;
  float: right;
}
.service-05 {
  width: 560px;
  margin: 0 0 0 20px;
}
/* ==================== ▼ SITMAP ==================== */
.sitemap-box-1 {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}
.sitemap-01 {
  width: 300px;
  text-align: center;
  margin-bottom: 20px;
  border: 1px solid #172953;
}
.sitemap-01 a {
  display: block;
  line-height: 50px;
  transition: 0.6s;
}
.sitemap-01 a:hover {
  background-color: #172953;
  color: #fff;
}
.sitemap-02 {
  width: 300px;
  text-align: center;
  margin: 0 0 20px 100px;
  border: 1px solid #172953;
}
.sitemap-02 a {
  display: block;
  line-height: 50px;
  transition: 0.6s;
}
.sitemap-02 a:hover {
  background-color: #C1D1F7;
  color: #fff;
}
.sitemap-03 {
  width: 300px;
  text-align: center;
  margin: 0 0 10px 100px;
  border: 1px solid #172953;
}
.sitemap-03 a {
  display: block;
  line-height: 50px;
  transition: 0.6s;
}
.sitemap-03 a:hover {
  background-color: #C1D1F7;
  color: #fff;
}
.sitemap-04 {
  width: 300px;
  text-align: center;
  margin: 0 0 20px 200px;
  border: 1px solid #172953;
}
.sitemap-04 a {
  display: block;
  line-height: 50px;
  transition: 0.6s;
}
.sitemap-04 a:hover {
  background-color: #C1D1F7;
  color: #fff;
}
/* ==================== ▼ CONTACT ==================== */
.contact-01 {
  font-size: 24px;
  text-align: center;
}
.contact-02 {
  text-align: center;
}
.contact-02 a {
  font-size: 30px;
  font-weight: 700;
}
.contact-02 img {
  width: 30px;
  padding-right: 10px;
  vertical-align: middle;
}
.contact-03 {
  text-align: center;
  margin-bottom: 30px;
}
.contact-04 {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 30px;
}
.contact-05 {
  font-size: 24px;
  text-align: center;
  margin-bottom: 10px;
}
.contact-06 {
  color: #D60003;
  padding: 0 0 5px 10px;
}
.contact-07 {
  font-size: 14px;
  padding-left: 10px;
  color: #D60003;
}
.contact-08 {
  font-size: 14px;
  padding-left: 10px;
  color: #061EE1;
}
.contact-09 {
  text-align: center;
}
.contact-10 {
  color: #D60003;
  margin-bottom: 10px;
}
.submit, .reset {
  display: inline-block;
  border-radius: 5%; /* 角丸       */
  font-size: 18px; /* 文字サイズ */
  text-align: center; /* 文字位置   */
  cursor: pointer; /* カーソル   */
  width: 250px;
  background: #000066; /* 背景色     */
  color: #ffffff; /* 文字色     */
  padding: 10px 0;
  transition: .6s; /* なめらか変化 */
  box-shadow: 3px 3px 3px #666666; /* 影の設定 */
  border: 1px solid #000066; /* 枠の指定 */
  margin: 0 10px;
}
.submit:hover, .reset:hover {
  box-shadow: none; /* カーソル時の影消去 */
  color: #000066; /* 背景色     */
  background: #ffffff; /* 文字色     */
}
p.error_messe {
  margin: 5px 0;
  color: #D60003;
}
#formWrap {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 20px;
}
table.formTable {
  width: 100%;
  margin: 0 auto 30px;
}
table.formTable td, table.formTable th {
  border: 1px solid #ccc;
  padding: 10px;
}
table.formTable th {
  width: 30%;
  font-weight: normal;
  background: #efefef;
  text-align: left;
}


.thanks-01 { text-align:  center;
margin-bottom: 30px;}

.thanks-02 { width: 150px;
margin: 0 auto;}