@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/
.header {display:none;}
.footer {display:none;}
.main {
	padding-left:0;
	padding-right:0;
	padding:0;
}
h1.entry-title {display:none;}
.wrap {width:100vw;}

/* 768px以下の画面（スマホ）では自作メニューを隠す */
@media screen and (max-width: 768px) {
  .global_nav {
    display: none !important;
  }
}
/* スライドインメニューを強制的に「押せる」状態にする */
.mobile-menu-buttons, .footer-mobile-buttons {
    z-index: 9999; /* 他の要素の下に隠れないようにする */
}

/* メニューボタンの見た目を整える */
.footer-mobile-buttons .mobile-menu-button .fa::before {
    content: "\f0c9" !important; /* 三本線アイコンに強制変更 */
}
/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.original_header {margin:2em 2em 0 2em;}
.header-flex {
	display:flex;
	flex-direction: row;
    justify-content: space-between;
}
.header-logo {width:30%;}
.header-info {
	display:flex;
	flex-direction: column;
    align-items: flex-end;
	width:70%;
}
.tel-number {width:40%;}
.hours {
	width:30%;
	margin-top:1%;
}
.global_nav {margin-top:1.5em;}
.global_nav {
  text-align: center;
}

.global_nav_list {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
}

.global_nav_list li {
  position: relative;
  padding: 0 20px;
}

/* 区切り線 */
.global_nav_list li:not(:last-child)::after {
  content: "|";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  color: #888;
}

/* リンク */
.global_nav_list a {
  text-decoration: none;
  color: #666;
  font-size: 16px;
  letter-spacing: 0.1em;
}

.global_nav_list a:hover {
  opacity: 0.7;
}
.global_nav_list li:last-child {
  padding-right: 0;
}
/*スライダー▼*/
.hero_slider {
  width: 100%;
  height: 520px;
  position: relative;
  overflow: hidden;
  margin-bottom: 0;
}
.slides {
  width: 100%;
  height: 100%;
  position: relative;
}
.slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.slide.active {
  opacity: 1;
}
/* ドット */
.slider_dots {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
}
.slider_dots span {
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 50%;
  opacity: 0.5;
  cursor: pointer;
}
.slider_dots span.active {
  opacity: 1;
}
/*スライダー▲*/
/* 見出し帯 */
.midashi-banner {
	position: relative;
	background:#37C000;
	text-align: center;
	padding: 12px 0;
	font-weight: bold;
	letter-spacing: .2em;
}
.midashi-banner img {width:30%;}
/* 中央の切り欠き三角 */
.midashi-banner::after {
	content: "";
    position: absolute;
    left: 50%;
    bottom: -15px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #37C000;
}
.subttl {
	text-align: center;
    font-size: 20px;
    font-weight: bold;
    margin: 2em;
}
.midashi-banner2 {
	background:#37C000;
	text-align: center;
	padding: 5px 0;
}
/* =====================
TOPお知らせ
===================== */
.top-news{
  max-width:800px;
  margin:0 auto 7% auto;
}
.top-news-list{
  list-style:none;
  padding:0;
  margin:0;
}
.top-news-item a{
	display:flex;
	gap:15px;
	padding:10px 0;
	border-bottom:1px dotted #4d4d4d;
	text-decoration:none;
	color:#808080;
	align-items: center;
}
.top-news-item a:hover{color:#000;}
.top-news-date{
  font-size:17px;
  min-width:90px;
}
.top-news-ttl{
  font-size:17px;
}
.top-news-more {text-align:end;}
.top-news-more a {
	font-size:15px;
	text-decoration:none;
	border:1px solid #37C000;
	padding:0.5em;
	color:#37C000;
}
.top-news-more a:hover{
	background:#37C000;
	color:#fff;
}

/* =====================
TOP事業内容
===================== */
/* 全体 */
.service-grid{
  margin:-33px auto 0 auto;
}
/* 1ブロック */
.service-item{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch;
}
/* 左右反転用 */
/* 反転用 */
.service-item.reverse{
  grid-template-columns:1fr 1fr;
}
.service-item.reverse .service-text{
  order:1;
}
.service-item.reverse .service-image{
  order:2;
}
/* 画像 */
.service-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.jugyoutopttl {
	font-size:22px;
	color:#37C000;
	font-weight:bold;
}
/* テキストBOX */
.service-text{
  background:#fff;
  padding:50px;
  display:flex;
  flex-direction:column;
  justify-content:center;
	align-items: center;
}
.service-text h3{
  font-size:22px;
  margin-bottom:15px;
}
.service-text p{
  line-height:1.8;
  margin-bottom:25px;
	text-align:center;
	line-height:1.5;
}
/* ボタン */
.service-btn{
  display:inline-block;
  border:1px solid #37C000;
  color:#37C000;
  padding:0.2em 1em;
  text-decoration:none;
  width:fit-content;
	font-size:15px;
}
.service-btn:hover{
  background:#37C000;
  color:#fff;
}
/* =====================
お知らせ一覧
===================== */
.news-archive {
	width:70%;
	margin:0 auto;
}
.news-card{
  display:block;
  border:1px solid #ccc;
  padding:25px;
  margin-bottom:30px;
  text-decoration:none;
  color:#333;
}
.news-title {font-size:22px;}
.news-date {font-size:15px;}
.news-body {
	font-size: 17px;
    line-height: 1.5;
}
/* =====================
TOPお問い合わせ
===================== */
.topcontacttxt {text-align:center;}
.topcontacttel {
	display:block;
	width:55%;
	margin:0 auto;
}
/* フォーム全体 */
.contacttxt {
	max-width:600px;
	display:block;
	margin:5% auto 2% auto;
}
.cf7-wrap{
  max-width:600px;
  margin:0 auto;
}
/* 各項目 */
.cf7-field{
  margin-bottom:25px;
}
/* ラベル */
.cf7-field label{
  display:block;
  font-weight:600;
  margin-bottom:8px;
}
/* 必須マーク */
.cf7-field .req{
  color:#e60033;
  margin-left:5px;
}
/* 入力欄 */
.cf7-field input,
.cf7-field textarea{
  width:100%;
  padding:14px;
  border:1px solid #999;
  border-radius:3px;
  font-size:16px;
  box-sizing:border-box;
}
/* テキストエリア高さ */
.cf7-field textarea{
  min-height:180px;
  resize:vertical;
}
/* 注意文 */
.cf7-note{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:15px;
  color:#e60033;
  margin-top:-35px;
}
/* マーク側 */
.cf7-note-mark{
    font-size: 30px;
    padding-top: 10px;
    display: inline;
}
/* テキスト */
.cf7-note-text{
  font-size:15px;
	color:#000;
}
/* 送信ボタン */
.cf7-wrap input[type="submit"]{
  background:#37C000;
  color:#fff;
  border:none;
  padding:14px 40px;
  font-size:16px;
  cursor:pointer;
  border-radius:4px;
	width:25%;
	display:block;
	margin:0 auto;
}
.cf7-wrap input[type="submit"]:hover{
  opacity:0.8;
}
/* =====================
フッター
===================== */
/* 中身（左右高さを揃える） */
.footer-inner{
  width:100%;
  max-width:none;
  margin:0;
  display:flex;
  align-items:stretch;
	min-height:500px;
}
/* 左 */
.footer-left{
  width:50%;
  background:#37C000;
	display:flex;
  align-items:center;     /* 縦中央 */
  justify-content:center; /* 横中央 */
}
.footer-left-box {
	width:80%;
	margin:15px auto 0 auto;
}
.footer-info {margin-top:7%;}
/* 右 */
.footer-right{
  width:50%;
	padding:0;
  margin:0;
  background:none;
}
.footer-right iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
}
/* マップ */
.footer-right iframe{
  width:100%;
  height:100%;
  min-height:400px;
  border:0;
  display:block;
}
.site-footer{
  width:100vw;
  margin-left:calc(50% - 50vw);
}
/* コピーライト */
.footer-bottom{
  background:#fff;
  color:#000;
  text-align:center;
  padding:15px;
  font-size:13px;
	margin-top:0;
}
/* ===== スマホ ===== */
@media (max-width:768px){
  .footer-inner{
    flex-direction:column;
  }
  .footer-left,
  .footer-right{
    width:100%;
  }
  .footer-right iframe{
    min-height:300px;
  }
}
/* =====================
レスポンシブ
===================== */

@media screen and (max-width: 768px) {
  .hero_slider {
    height: 300px;
  }
}

/* =====================================
  事業案内 共通
===================================== */
.business-section {}
/* 横並び行 */
.business-row {display: flex;}
/* =====================================
  上段
===================================== */
.business-top-text {
  flex: 1;
  font-size: 18px;
  line-height: 2;
	display: flex;
    align-items: center;
	justify-content: center;
	font-size: 20px;
    font-weight: 500;
}
.business-top-image {
  flex: 1;
}
.business-top-image img {
  width: 100%;
  height: auto;
  display: block;
}
/* =====================================
  下段 共通
===================================== */
.business-permit {
  flex: 1;
  box-sizing: border-box;
}
/* タイトル */
.business-title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
}
/* 黄色 */
.business-permit.normal-permit {
	display: flex;
    flex-direction: column;
    align-items: center;
	background:#dbe158;
	padding:2em 4em 1em 4em;
}
/* グレー */
.business-permit.special-permit {
	display: flex;
    flex-direction: column;
    align-items: center;
	background:#cccccc;
	padding:2em 4em 1em 4em;
}
/* 本文 */
.business-text {
  font-size: 15px;
  line-height: 1.5;
}
.kakko-left{
  margin-left:-0.5em;
  display:inline-block;
}
.kakko-right{
  margin-right:-0.5em;
  display:inline-block;
}
.indent-1{
  display:inline-block;
  padding-left:1em;
}
/*マニフェスト*/
.manifest-ttl {
	font-size:25px;
	text-align:center;
	font-weight:bold;
	margin-bottom: 0.5em;
}
.manifest-ttl.green{color:#37C000;}
.manifest-txt {
	font-size:17px;
	text-align:center;
	color:#828282;
}
.area-buttons{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:20px;
  max-width:650px;
  margin:0 auto;
	margin-bottom:7%;
}
.dltxt {
	text-align:center;
	font-size:14px;
	color:#828282;
}
.dl-border {
	max-width:650px;
	border:1px solid #37c000;
	margin:0 auto 5% auto;
}
/* ボタン */
.area-btn{
  display:flex;
  justify-content:center;
  align-items:center;
  background:#8cc63f;   /* グリーン */
  color:#fff;
  font-size:20px;
  font-weight:600;
  letter-spacing:0.2em;
  height:50px;
  border-radius:8px;
  text-decoration:none;
  transition:0.3s;
}

/* hover */
.area-btn:hover{
  background:#6fa82f;
	color:#fff586;
  transform:translateY(-2px);
}
.dl-but {
	display:flex;
	justify-content:center;
	align-items:center;
	background:#fff;
	color:#37c000;
	font-size:20px;
	font-weight:600;
	letter-spacing:0.2em;
	height:50px;
	border:1px solid #37c000;
	border-radius:8px;
	text-decoration:none;
	transition:0.3s;
}
/* hover */
.dl-but:hover{
	background:#37c000;
	color:#fff586;
	transform:translateY(-2px);
}
/*スマホ*/
@media(max-width:600px){
  .area-buttons{
    grid-template-columns:1fr;
  }
}
/*運搬料金*/
.price-container {margin-bottom:7%;}

/* =====================================
  スマホ対応
===================================== */

@media screen and (max-width: 768px) {
  .business-row {
    flex-direction: column;
  }
  .business-row-top {
    margin-bottom: 50px;
  }
  .business-permit {
    padding: 25px;
  }
  .business-top-text {
    font-size: 16px;
  }
}
/*中古車販売*/
/* ===== 中古車販売 4分割レイアウト ===== */
.usedcar-wrap{
  width:100%;
}
/* 1段ずつ横並び */
.usedcar-row{
  display:flex;
  width:100%;
}
/* 上段 */
.usedcar-row-top{
  flex-direction:row;
}
.usedcar-text-top{
	font-size: 18px;
  line-height: 2;
	display: flex;
    align-items: center;
	justify-content: center;
	font-size: 20px;
    font-weight: 500;
}
/* 下段 */
.usedcar-row-bottom{
  flex-direction:row;
}
.usedcar-text-bottom {
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.usedcar-title{
	font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px;
}
.usedcar-text{
	font-size: 15px;
    line-height: 1.5;
	width:80%;
}
/* 各ブロック 50% */
.usedcar-text-top,
.usedcar-image-top,
.usedcar-image-bottom,
.usedcar-text-bottom{
  width:50%;
}

/* 画像は親いっぱい */
.usedcar-image-top img,
.usedcar-image-bottom img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
/* =====================================
  事例紹介
===================================== */
/* 事例一覧 全体 */
.case-archive{
  max-width:80%;
  margin:2em auto 80px;
}
/* グリッド */
.case-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:30px;
}
/* カード */
.case-card{
  display:block;
  text-decoration:none;
  color:#000;
  background:#fff;
	
}
/* 画像 */
.case-img img{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}
/* 地域 */
.case-area{
  background:#7fbf00;
  color:#fff;
  text-align:center;
  padding:8px;
  font-size:20px;
	font-weight:600;
}
/* 説明文 */
.case-text{
  padding:10px;
  font-size:15px;
  line-height:1.6;
}
.case-text p {margin-bottom:0;}
/*個別ページ*/
.case-single-wrap{
  display:flex;
  gap:40px;
  align-items:flex-start;
	width:80%;
	margin:0 auto;
}
/* 左 */
.case-images{
	width:55%;
}
.case-main-img img{
	width:100%;
	height:400px;
	height:auto;
	display:block;
	object-fit: cover;
}
.case-thumbs{
  display:flex;
  gap:10px;
  margin-top:15px;
}
.case-thumb{
  width:80px;
  cursor:pointer;
  opacity:0.7;
}
.case-thumb:hover{
  opacity:1;
}
/* 右 */
.case-text-area{
  width:45%;
}

/* =====================================
 ブログ
===================================== */
/* ブログ一覧全体のコンテナ */
.blog-archive-section {
	width:70%;
	margin:0 auto;
}
.blog-list {margin-top: 30px;}
/* 1つの記事アイテム */
.blog-item {
    display: flex !important;
    gap: 30px;
    margin-bottom: 40px;
    align-items: center; /* 縦方向の中央揃え */
    border: 1px solid #000; /* 記事の区切り線 */
}
/* 画像サイズを固定して歪ませない */
.blog-img {flex: 0 0 200px;}
.blog-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 4px; /* 少し角を丸くすると今風です */
	padding:1em;
}
/* テキストエリア */
.blog-content {
	display: flex;
    flex-direction: column;
	margin-right:1em;
}
.blog-title {
    font-size: 20px;
	font-weight:600;
    color: #333;
    margin-bottom: 10px;
}
.blog-excerpt {
	font-size:15px;
	line-height:1.5;
	text-align:justify;
}
a.blog-btn {
	color:#37C000;
	border:1px solid #37C000;
	padding:0 0.5em;
	font-size:15px;
	text-decoration:none;
	transition:0.3s;
	align-self: flex-end;
	margin-top:1em;
}
a.blog-btn:hover{
	background:#37C000;
	color:#fff586;
  transform:translateY(-2px);
}
/* 続きを読むボタンを右下に配置 */
.blog-btn-wrap {
    text-align: right;
    margin-top: auto;
}
.blog-more-wrap {
	text-align: center;
    width: 45%;
    display: block;
    margin: 0 auto 5em auto;
}
a.blog-more-btn {
	text-decoration:none;
	display:block;
	color:#37C000;
	border:1px solid #37C000;
	padding:0.5em;
	font-size:17px;
	font-weight:600;
	text-decoration:none;
	transition:0.3s;
}
a.blog-more-btn:hover{
  background:#37C000;
	color:#fff586;
  transform:translateY(-2px);
}
/* ページネーションのリストを横並びに強制する */
.pagination ul {
    display: flex !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 40px 0 !important;
    justify-content: center !important; /* 中央寄せ */
    gap: 10px; /* ボタン同士の間隔 */
}
/* 点（リストマーク）を消す */
.pagination li {
    margin: 0 !important;
    padding: 0 !important;
    list-style-type: none !important;
}
/* 数字や「次へ」のボタン装飾 */
.pagination li a, 
.pagination li span {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border: 1px solid #7ebc59;
    background: #fff;
    color: #7ebc59;
    text-decoration: none;
    font-size: 14px;
    border-radius: 4px;
    transition: 0.3s;
}

/* 現在のページの装飾 */
.pagination li span.current {
    background: #7ebc59 !important;
    color: #fff !important;
}

/* ホバー時 */
.pagination li a:hover {
    background: #7ebc59;
    color: #fff;
}
/*個別ページ*/
/* シングルページ全体のコンテナ */
.single-blog-container {
    max-width: 1100px;
    margin: 50px auto;
    padding: 0 20px;
}
/* フレックスボックスの設定 */
.blog-detail-flex {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}
/* 左側：画像(55%) */
.blog-detail-img {
    flex: 0 0 55%;
}

.blog-detail-img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
}
/* 右側：テキスト */
.blog-detail-content {
    flex: 1;
}
.blog-detail-title {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 20px;
    line-height: 1.4;
    color: #333;
}
.blog-detail-text {
    line-height: 1.8;
    color: #444;
}
/* 記事ナビゲーション全体のスタイル */
.blog-navigation {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px solid #eee;
}

.nav-links {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.nav-prev, .nav-next {
    flex: 1;
}

.nav-next {
    text-align: right;
}

.nav-links a {
    text-decoration: none;
    display: block;
    padding: 15px;
    border: 1px solid #eee;
    background: #fff;
    transition: 0.3s;
    border-radius: 5px;
}

.nav-links a:hover {
    border-color: #7ebc59;
    background: #f9fff5;
}

.nav-arrow {
    display: block;
    font-size: 0.8rem;
    color: #7ebc59;
    margin-bottom: 5px;
    font-weight: bold;
}

.nav-title {
    display: block;
    font-size: 0.95rem;
    color: #333;
    font-weight: bold;
}

/* スマホでは縦並びにする */
@media screen and (max-width: 500px) {
    .nav-links {
        flex-direction: column;
    }
}
/* 戻るボタン */
.blog-back-link {
    margin-top: 60px;
    text-align: center;
}

.blog-back-link a {
    display: inline-block;
    padding: 10px 30px;
    background: #f5f5f5;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    transition: 0.3s;
}

.blog-back-link a:hover {
    background: #7ebc59;
    color: #fff;
}

/* スマホ対応：768px以下は縦並び */
@media screen and (max-width: 768px) {
    .blog-detail-flex {
        flex-direction: column;
    }
    .blog-detail-img {
        flex: 0 0 100%;
    }
}
/* =====================================
  会社紹介
===================================== */
.aisatsu-flex {
	display:flex;
	flex-direction: row;
    width: 70%;
    margin: 5% auto;
}
.aisatsu-l {
	width:70%;
	margin-right:2em;
}
.aisatsu-ttl {
	font-size:22px;
	font-weight:600;
	color:#37c000;
	margin-bottom:0.7em;
}
.aisatsu-txt {
	font-size:16px;
	text-align:justify;
	line-height:1.7;
}
.aisatsu-name {text-align:end;}
.aisatsu-photo {width:30%;}
/*会社概要*/
.company-box {
	width:50%;
	margin:5% auto;
}
.company-info {
    list-style: none;
    padding: 0;
}

.company-info li {
    display: flex;
    align-items: flex-start; /* 住所が複数行になっても上が揃う */
    margin-bottom: 15px;      /* 行間 */
    font-size: 18px;
    line-height: 1.6;
}

.info-label {
    flex: 0 0 72px;           /* 幅は少し余裕を持って設定 */
    font-weight: bold;
    text-align: justify;       /* 文字を端まで広げる */
    text-align-last: justify;  /* 最終行（1行しかないので実質これ）も端まで広げる */
    display: inline-block;     /* 割り付けを効かせるために必要 */
}

/* 「／」をラベルから切り離して、常に同じ位置に固定したい場合 */
.info-label::after {
    content: "";               /* ラベル内の「／」は消してCSSで制御するとより綺麗です */
}

.info-value {
    flex: 1;            /* 残りの幅をすべて使う */
}
/* スマホでは縦並びにする場合（お好みで） */
@media screen and (max-width: 600px) {
    .company-info li {
        flex-direction: column;
    }
    .info-label {
        flex: 0 0 auto;
        margin-bottom: 5px;
    }
}
/*取得許可*/
.kyoka-ttl {
	text-align: center;
    background: #37c000;
    font-size: 22px;
    font-weight: 600;
	color:#fff;
}
.license-list {
    list-style: none;
    padding: 0;
    margin: 40px 0;
}

.license-list li {
    display: flex;
    align-items: stretch; /* ラベルと内容の高さを揃える */
    
    /* ★ハイトを完全に固定（秋田県の2行が余裕で入る高さに指定） */
    height: 60px; 
    
    /* ★項目同士の隙間（画像のようなゆったりした間隔） */
    margin-bottom: 20px!important; 
}

.license-label {
    flex: 0 0 100px;           /* 県名の横幅 */
    text-align: justify;       /* 均等割り付け */
    text-align-last: justify;
    font-weight: bold;
    
    display: flex;
    align-items: center;       /* 文字を縦方向の中央に */
    
    /* 線との距離 */
    padding-right: 30px; 
    /* 緑色の縦線（高さ固定なので線の長さも常に一定になります） */
    border-right: 2px solid #7ebc59; 
}

.license-value {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;   /* 1行でも2行でも中央に配置 */
    
    /* 線からテキストまでの距離 */
    padding-left: 30px; 
    line-height: 1.8;
}

/* 最後の項目の余白は不要な場合 */
.license-list li:last-child {
    margin-bottom: 0;
}
/* スマホ対応：幅が狭くなったら縦並びに */
@media screen and (max-width: 600px) {
    .license-list li {
        flex-direction: column;
        align-items: flex-start;
    }
    .license-label {
        flex: 0 0 auto;
        border-right: none;
        border-bottom: 2px solid #7ebc59; /* 縦線を下線に変更 */
        padding-right: 0;
        margin-right: 0;
        margin-bottom: 10px;
        width: 100px; /* スマホでも均等割り付けを維持 */
    }
}
/*保有車両*/
.company-info.sharyou{
	margin-top:1em;
	padding-left:5em;
}
.syaryou-photo {
	display:flex;
	flex-direction: row;
    justify-content: space-between;
}
.syaryou-img {width:30%;}

/* =====================================
  お問い合わせページ
===================================== */
.contact-box {
	width:70%;
	margin:0 auto;
}
.contactborder {
	border:1px solid #333333;
	margin:5% 0;
}
.mail-address {
	text-align:center;
	font-size:30px;
	font-weight:bold;
	color:#37c000;
	margin:3% 0 5% 0;
}
/* =====================================
  各ページ 下部共通
===================================== */
.kyoutsu-info-box {
	width:40%;
	margin:0 auto;
}
.kyoutsu-info {margin:1em 0;}
.kyoutsu-btn {
	display:block;
	text-align:center;
	color:#37C000;
	border:1px solid #37C000;
	padding:0.5em;
	font-size:17px;
	font-weight:600;
	text-decoration:none;
	transition:0.3s;
}
.kyoutsu-btn:hover{
  background:#37C000;
	color:#fff586;
  transform:translateY(-2px);
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	/*header*/
	.header-flex {
		display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
	}
	.header-logo {width:100%;}
	.header-info {
		    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
	}
	.tel-number, .hours {width:70%;}
	main.main {padding:0;}
	.hero_slider {height:200px;}
	.midashi-banner {padding: 5px 0;}
	.midashi-banner img {width:70%;}
	.top-news-list {padding-right:26px;}
	.top-news-more a {margin-right:26px;}
	.top-news-date {
		font-size: 13px;
		min-width: 55px;
	}
	.top-news-ttl {font-size:15px;}
	.service-item.reverse {display:block;}
	.service-item {
		display:flex;
		align-items: stretch;
		flex-direction: column-reverse;
	}
	.topcontacttxt {
		text-align: center;
		width: 80%;
		margin: 0 auto;
		font-size: 15px;
        line-height: 1.5;
	}
	.topcontacttel {
		width:80%;
		margin: 10% auto;
	}
	.contacttxt {width:80%;}
	.cf7-wrap {width:80%;}
	.cf7-wrap input[type="submit"] {width:50%;}
}