/**
 * Theme Name:     Arkhe Child
 * Author:         LOOS,Inc.
 * Template:       arkhe
 * Text Domain:	   arkhe-child
 * Description:    A very simple theme for production templates. Customize as you like.
 */

/* －－－トップ－－－ */

/* トップ画像の幅を広げるため設定 */
.l-content__body, .l-main {
  max-width: 2560px;
  padding: 0;
}

/* スライダー */
.swiper-pagination-pc,
.swiper-pagination-sp {
  position: absolute !important;
  top: 50% !important;
  left: 1% !important;
  transform: translateY(-35%) !important;
  z-index: 10;
}

/* スライダーのインジケータ */
.swiper-pagination-bullet {
  display: block !important;
  width: 3px !important;
  height: 5vw !important;
  cursor: pointer !important;
  -webkit-transition: var(--transition) !important;
  transition: var(--transition) !important;
  background-color: red !important;
  margin-top: 10px !important;
}

.swiper-slide img {
  width: 100%;
}

/* キャッチフレーズの親要素 */
.pc {
  position: relative;
}

/* PCではSP用画像非表示 */
.sp {
  position: relative;
  display: none !important;
}

/* キャッチフレーズ */
.catchphrase {
  position: absolute;
  top: 45%;
  left: 5%;
  animation: fadeIn 10s 1s;
  z-index: 100;
  /* opacitiy:0を指定しないと最初に表示されてからアニメーションしてしまう */
  opacity: 0;
  /* 上記だけだとアニメーション後消えるので下記で表示を維持する */
  animation-fill-mode: forwards;
}

/* キャッチフレーズアニメーション（クラス名ではなくanimationの名前を付ける） */
@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.catchphrase p {
  color: white;
  font-size: 4vw;
  font-weight: bold;
  width: 100%;
  text-align: center;
  margin: 0 auto;
}

.catchphrase p span {
  font-size: 6vw;
}

.top-content {
  max-width: 1200px;
  margin: 0 auto;
}

.message {
  max-width: 625px;
  margin: 0 auto;
}

/* トップの会社概要メッセージと会社概要ページのメッセージの両端を常に開ける（max-width以上になると詰まるため） 
WordPressならカバーを付けその中にコンテンツを入れると自動で中央表示になる。*/
.message strong {
  display: block;
  margin: 0 auto;
  width: 90%;
}

/* －－－会社概要－－－ */

/* 全体の幅 */
.corporate {
  max-width: 1200px;
  margin: 0 auto;
}

/* 企業理念 */
.philosophy {
  max-width: 820px !important;
  margin: 0 auto !important;
}

/* 品質方針 */
.policy {
  max-width: 870px !important;
  margin: 0 auto !important;
}

/* テーブルの親要素 */
.table {
  max-width: 750px;
  margin: 30px auto;
}

/* テーブル */
table {
  width: 100%;
  margin: 0 auto;
}

table th {
  width: 25%;
  vertical-align: middle;
  text-align: center;
}


/* －－－事業内容－－－ */

.business {
  max-width: 1200px;
  margin: 0 auto;
}

dl:hover {
  background-color: gray;
  transition: .4s ease-in-out;
  cursor: pointer;
}


/* －－－お問い合わせ－－－ */

.contact {
  max-width: 1200px;
  margin: 0 auto;
}

/* 入力フォーム */
form {
  max-width: 1100px;
  margin: 0 auto;
}

/*ContactForm7カスタマイズ*/
table.CF7_table{
	width:80%;
	margin:0 auto;
	border: 3px solid #e5e5e5;
}

table.CF7_table tr{
	border-top: 1px solid #e5e5e5;
}

.CF7_table th {
  width:30%;/*横幅*/
  background-color:#ebedf5;/*ブルーグレー*/
}

.single .entry-content table.CF7_table,
.page .entry-content table.CF7_table{
	display:table;
}

/*入力欄*/
.CF7_table input, .CF7_table textarea {
	border: 1px solid #d8d8d8;
}

.CF7_table ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.CF7_req {
	font-size:.9em;
	padding: 5px;
	background: #f79034;
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/* 「送信する」ボタン */
.wpcf7 input.wpcf7-submit {
	background-color:#f79034;
	border:0;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	margin:0 auto;
}

.CF7_btn {
	text-align:center;
	margin-top:20px;
}

.wpcf7-spinner {
	width:0;
	margin:0;
}

/* 入力エリアの幅 */
.wpcf7-text,.wpcf7-textarea {
  width: 100%;
}

/* －－－プライバシーポリシー －－－ */

.privacy {
  max-width: 1200px;
  margin: 0 auto;
}


/* －－－メニュー －－－ */
.menu-item {
  position: relative;
}

.c-gnav__a {
  padding: 10px !important;
}

.c-gnav__a::after {
    position: absolute;
    left: 0;
    bottom: 16px;
    content: '';
    width: 100%;
    height: 2px;
    background: #000000;
    opacity: 0;
    transition: 0.3s;
}

.c-gnav__a:hover::after {
  bottom: 22px;
  opacity: 1;
}


/* －－－フッター －－－ */
#copyright {
  text-align: center;
  font-size: 13px;
}


/* －－－レスポンシブ－－－ */
@media screen and (max-width: 500px) {
  /* SP時はPC用画像を非表示にしてsp画像を表示 */
  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }

  /* トップページの会社概要メッセージ */
  .message {
    max-width: 445px;
    font-size: 1rem !important;
  }
  
  /* 企業理念 */
  .philosophy {
    max-width: 360px;
    margin: 0 auto;
  }
  
  /* 品質方針 */
  .policy {
    max-width: 360px !important;
    margin: 0 auto !important;
  }
  /* お問い合わせフォーム */
	table.CF7_table {
    width:95%;
	}

  /* タイトル列 */
  .CF7_table th {
    width:30%;/*横幅*/
    background-color:#ebedf5;/*ブルーグレー*/
  }

	.CF7_table tr, .CF7_table td, .CF7_table th {
    display: block;
    width: 100%;
    line-height:2.5em;
  }

	.CF7_table th {
    background-color:#ebedf5;
	}
}