/*
Theme Name: Wakayama System
Author: web-support
*/
@charset 'UTF-8';
:root {
  --text-color: #333;
  --main-color: #3386D1;
  --base-color: #A8DBE1;
  --font-family-jan: 'Noto Sans JP', 'Meiryo', sans-serif;
  --font-family-en: 'Montserrat', sans-serif;
  --font-family-fontawesome: "Font Awesome 5 Free";
}
body {
  color: var(--text-color);
  font-family: var(--font-family-jan);
  font-size: 16px;
	line-height: 1.7;
}
* {
  box-sizing: border-box;
	
}
a {
  color: var(--text-color);
  text-decoration: none;
}
a:hover {
  opacity: .7;
}
h2 {
  font-family: var(--font-family-en);
  font-weight: bold;
  font-size: 2rem;
}
h2 span {
  font-family: var(--font-family-jan);
  font-weight: normal;
  font-size: 0.75rem;
}
di, ol, ul {
  margin-bottom: 0;
}
img {
  max-width: 100%;
}
.row {
  --bs-gutter-x: 0;
}
.pc {
  display: block;
}
.sp {
  display: none;
}
.mt-80 {
  margin-top: 80px;
}
.mt-50 {
  margin-top: 50px;
}
.mt-65 {
  margin-top: 65px;
}
.py-80 {
  padding-top: 80px;
  padding-bottom: 80px;
}
.pt-50 {
  padding-top: 50px;
}
.flex-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header__inner {
  margin: 15px auto;
}
.header-utilities {}
.header-utilities__logo {
  margin-right: auto;
  display: inline-block;
	z-index: 1000;
}
.header-contact__item {
  display: inline-block;
  margin-left: 20px;
  vertical-align: middle;
  position: relative;
}
.headerTel a {
  display: inline-block;
  font-size: 1.5rem;
  color: var(--main-color);
  padding-left: 1em;
}
.headerTel::before {
  position: absolute;
  top: 23%;
  left: 0;
  display: inline-block;
  content: '';
  width: 32px;
  height: 32px;
  background-image: url("./img/hd-tel-icon.png");
  background-repeat: no-repeat;
}
.headerMail {
  background-color: var(--main-color);
  padding: .3em 2.3em .4em;
  border-radius: 50px;
  font-size: 1rem;
  font-weight: bold;
}
.headerMail a {
  display: inline-block;
  color: #fff;
  padding-left: 1.5em;
}
.headerMail::before {
  position: absolute;
  top: 28%;
  left: 1.5em;
  display: inline-block;
  content: '';
  width: 32px;
  height: 23px;
  background-image: url("./img/hd-mail-icon.png");
  background-repeat: no-repeat;
}
.btn-burger {
  display: block;
  width: 60px;
  height: 60px;
  position: absolute;
  top: 5px;
  right: 10px;
}
/*---------------------------------
ヘッダーナビ
-----------------------------------*/
.header-nav {
  margin: 1.5em 5em;
}
/*---------------------------------
パンくずリスト
-----------------------------------*/
.bread-list{
	list-style:none;
	display: inline-block;
}
.breadcrumb__inner{
	display: flex;
    align-items: center;
}
/*---------------------------------
keyvisual
-----------------------------------*/
/*.keyVisual {
  max-height: 300px;
  overflow: hidden;
}*/
.keyVisual{
	
	text-align: center;
}
.keyVisual img {
  object-fit: contain;
  /*width: 100%;*/
	border-radius: 15px;
}
/* fadeShow */
.fadeShow {
  animation-name: fadeShowAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeShowAnime {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.service-title {}
.service-title::before {
  padding-right: 0.5em;
  content: '';
  display: inline-block;
  background-image: url(./img/deco-title.png);
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  vertical-align: top;
}
.service__item {
  width: 32%;
}
.service__item {
  display: flex;
  flex-direction: column;
}
.service__item .service-txt {
  flex-direction: column;
  align-items: stretch;
  display: flex;
  flex: 1 0 auto;
}
.service__item .btn {
  max-height: 50px; /* 位置を下に揃える */
  margin-top: auto;
}
.service__item img {
  object-fit: cover;
  height: 250px;
}
.service__title {
  background-color: var(--main-color);
  color: #fff;
  font-size: 1.2rem;
}
.service-txt {
  background-color: var(--base-color);
}
.wh-btn {
  display: block;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  width: 250px;
  position: relative;
}
.wh-btn::before {
  content: "";
  background: url("../img/long-arrow.png");
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 25px;
  width: 31px;
  height: 5px;
}
/* fadeUp */
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0;
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.fadeUpTrigger {
  opacity: 0;
}
/*----------development------------*/
.development-title {
  display: flex;
  align-items: center;
  justify-content: center;
}
.development-title::after, .development-title::before {
  border-top: 1px solid var(--text-color);
  content: '';
  width: 3em;
}
.development-title::before {
  margin-right: 1em;
}
.development-title::after {
  margin-left: 1em;
}
.development-item {
  border: 1px solid var(--text-color);
}
.system-title {
  border-bottom: 1px dotted var(--text-color);
  padding-bottom: .5em;
}
.industry {
  display: inline-block;
  border-radius: 2px;
  background-color: var(--main-color);
  color: #FFF;
  padding: 0 3px 1px;
  margin-bottom: .3em;
}
.development-contents {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.development-contents-title {
  width: 30%;
  margin-bottom: 10px;
}
.development-contents-description {
  width: 70%;
  margin-bottom: 10px;
}
.blue-btn {
  background-color: var(--main-color);
  color: #FFF;
  text-align: center;
  position: relative;
  width: 350px;
  margin-left: auto;
  margin-right: auto;
  padding: 0.7em 4em;
  border-radius: 10em;
  display: block;
}
.blue-btn::after {
  content: '';
  display: inline-block;
  background-image: url("../img/long-arrow-white.png");
  width: 42px;
  height: 10px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 2em;
}
.development-lists > div {
  margin-bottom: 1em;
}
.development-lists > div:nth-child(odd) {
  padding-right: .5em;
}
.development-lists > div:nth-child(even) {
  padding-left: .5em;
}
.development-contents-title, .development-contents-description {
  border-bottom: 1px dotted #ccc;
  word-wrap: break-word;
}
/*---------------------------------
strongPoint
-----------------------------------*/
.base-bg {
  background-color: var(--base-color);
}
.st-point-title {
  font-size: 1.25rem;
  letter-spacing: .1em;
}
.st-point-title span {
  display: inline-block;
  color: var(--main-color);
  font-size: 1.8rem;
  font-weight: bold;
  background-color: #fff;
  padding: 0 0.1em;
  transform: rotate(-5deg);
  margin-right: .2em;
}
.st-point:nth-child(even) {
  flex-direction: row-reverse;
}
/*---------------------------------
Blog
-----------------------------------*/
.blog-list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
}
.blog-txt-box{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
}
.blog-item {
  border: 1px solid #333;
}
.wp-post-image{
	object-fit: contain;
}
.blog-item-box{
border: #ccc 1px;
    border-style: solid;
	}
.blog-title {
  font-size: 1.25rem;
  font-weight: bold;
}
.blog-txt a{
	margin-top:50px;
}
.blog-txt{
	display: flex;
	flex-direction: column;
}
.blog-date,.blog-title{
	flex: 1;
  min-height: 0%;
}
.blog-content{
  height: 148px;
  min-height: 0%;
}
.blog-content p{
	flex-shrink: 0;
}
.blog-img-box{
	height:298px;
}
.blue-sm-btn {
  background-color: var(--main-color);
  color: #FFF;
  position: relative;
  width: 100%;
  border-radius: 50px;
  text-align: center;
  padding: 0.3em 1em;
  margin-left: auto;
  display: block;
	margin-top:auto;
}
.blue-sm-btn:before {
  display: inline-block;
  content: '';
  background-image: url("./img/small-arrow-white2.png");
  position: absolute;
  width: 20px;
  height: 6px;
  top: 50%;
  transform: translateY(-50%);
  right: 2em;
}
.blue_btn_link {
  display: block;
}
.blog-content {
  /*border-bottom: 1px #ddd solid;*/
}
.blog-title::before {
  display: inline-block;
  content: "Blog";
}
.blog-single-category ul {
  padding-left: .5em;
  padding-right: 1em;
}
.blog-lists-box {
  border-bottom: 1px solid #ddd;
}
/*---------------------------------
Contact
-----------------------------------*/
.contact-box h2 {
  color: var(--main-color);
  text-align: center;
  font-size: 1.2vw;
}
.contact-title {
  max-width: 100%;
}
.contact-title::before {
  content: '';
  display: inline-block;
  background-image: url(./img/blue-r-syasen.png);
  margin-right: 0em;
  transform: scale(-1, 1);
  width: 2em;
  height: 1.2em;
  background-repeat: no-repeat;
}
.contact-title::after {
  content: '';
  display: inline-block;
  background-image: url(./img/blue-r-syasen.png);
  margin-left: 0em;
  width: 2em;
  height: 1.2em;
  background-repeat: no-repeat;
}
/*------------TEL--------------*/
.contact-item {
  border: 1px solid #3386D1;
  width: 45%;
}
.contact-from {
  display: inline-block;
  padding: 0.1em 0.7em;
  background-color: var(--main-color);
  color: #fff;
  font-size: 1rem;
  border-radius: 50px;
  margin-bottom: 0.3em;
}
.tel-num {
  position: relative;
}
.tel-num::before {
  content: '\f2a0';
  font-family: var(--font-family-fontawesome);
  font-weight: 900;
  padding-right: .5em;
  color: var(--main-color);
  font-size: 2rem;
}
.tel-num span {
  font-family: var(--font-family-en);
  font-size: 2rem;
  color: var(--main-color);
}
.business-hours span {
  padding-left: 1rem;
}
.form-link {
  font-size: 1.7rem;
  color: var(--main-color);
  position: relative;
  margin-top: 3px;
  /*height: 64px;*/
}
.form-link::after {
  content: '\f101';
  font-family: var(--font-family-fontawesome); /*←ココ！！！！！！！*/
  font-weight: 900;
  padding-left: 1em;
}
/*---------------------------------
footer
-----------------------------------*/
.footer-bg {
  background-color: var(--main-color);
  color: #fff;
}
.footer-logo img {
  margin-top: -.4em;
}
.follow-us {
  font-size: 1.1rem;
  font-family: var(--font-family-en);
  font-weight: bold;
}
.google-map-btn {
  margin-top: 1em;
  font-weight: bold;
  display: inline-block;
  text-align: center;
  border-radius: 50px;
  background-color: #fff;
  padding: 0 .7em .1em;
}
.google-map-btn a {
  color: var(--main-color);
  display: inline-block;
}
.ft-category-item a {
  color: #fff;
    margin-bottom: 5px;
    display: inline-block;
}
/*---------------------------------
TOPへ戻るボタン
-----------------------------------*/
.pagetop {
  position: fixed;
  width: 50px;
  height: 50px;
  border-radius: 8px;
  background: #666;
  color: #fff;
  bottom: 40px;
  right: 20px;
  cursor: pointer;
  z-index: 999;
}
.pagetop span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 100%;
  text-align: center;
  font-size: 14px;
}
/*---------------------------------
下層ページ共通
-----------------------------------*/
.service-page__title {
  font-size: 1.5rem;
  text-align: center;
  position: relative;
}
.service-page__title::before {
  content: "";
  display: inline-block;
  color: var(--main-color);
  font-size: 0.8rem;
  position: absolute;
  top: -17px;
  left: 50%;
  transform: translateX(-50%);
}
.service-page__title::after {
  position: absolute;
  content: "";
  display: block;
  background-color: var(--main-color);
  width: 50px;
  height: 3px;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50px;
}
/*---------------------------------
サービス項目
-----------------------------------*/
.consultation-lists li {
  list-style: square;
}
.consultation-item {
  line-height: 2;
  font-size: 1rem;
}
.service-category::before {
  display: inline-block;
  content: "Clean Up";
}
.service-category__item {
  text-align: center;
  position: relative;
  padding-top: 30px;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-right: 25px;
  margin-left: 1em;
  margin-right: 1em;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  margin-bottom: 0.5em;
}
.service-category__item::before {
  display: inline-block;
  position: absolute;
  top: -15px;
  left: -5px;
  font-family: var(--font-family-en);
  font-size: 38px;
  z-index: 50;
}
.service-cate-box {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}
.service-category__title {
  font-size: 1.2rem;
  font-weight: normal;
	margin-bottom: 1em;
}
.service-category__contents ul {
  padding-left: 2em;
  text-align: left;
  list-style: square;
}
.service-category__contents li {
  font-size: 0.8rem;
}
.service01 {
  background: #C7EFF6;
}
.service02 {
  background: #F6F0C7;
}
.service03 {
  background: #F6E3C7;
}
.service04 {
  background: #E8D3FB;
}
.service01::before {
  content: "01";
  color: var(--main-color);
}
.service02::before {
  content: "02";
  color: #D6D600;
}
.service03::before {
  content: "03";
  color: #EBA604;
}
.service04::before {
  content: "04";
  color: #5500D6;
}
.flag3 {
  position: absolute;
  top: 0;
  left: 0;
  border-left: 40px solid #fff;
  border-bottom: 40px solid transparent;
}
/*---------------------------------
consultation
-----------------------------------*/
.consultation-bg {
  background-color: var(--base-color);
  width: 100vw;
  position: relative;
}
.consultation-title {
  background-color: var(--main-color);
  transform: skew(-26deg, -2deg);
  position: absolute;
  top: -20px;
  left: 5%;
  padding: .5em 1em;
}
.consultation-title h3 {
  color: #fff;
  transform: skew(26deg, 0deg);
  display: inline-block;
  font-size: 1.3rem;
  margin-bottom: 0;
}
/*---------------------------------
flow
-----------------------------------*/
.flow-title::before {
  display: inline-block;
  content: "Clean Up Flow";
}
.flow-num {
  background-image: url("./img/fukidashi2.png");
  background-repeat: no-repeat;
  background-size: contain;
  color: #fff;
  font-size: 2rem;
  text-align: center;
  position: relative;
  width: 84px;
  height: 94px;
}
.flow-num::after {
  display: block;
  position: absolute;
  left: 40%;
  top: 40%;
  transform: translate(-50%, -50%);
}
.flow-num01::after {
  content: "1";
}
.flow-num02::after {
  content: "2";
}
.flow-num03::after {
  content: "3";
}
.flow-num04::after {
  content: "4";
}
.flow-num05::after {
  content: "5";
}
.flow-num06::after {
  content: "6";
}
.flow-item-title {
  margin-top: 0;
  margin-bottom: 0;
  color: var(--main-color);
  font-size: 1.3rem;
}
.flow-item {
  padding-bottom: .5em;
}
/*---------------------------------
キービジュアル
----------------------------------*/
.page-keyVisual {
  position: relative;
}
.page-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2vw;
  color: var(--main-color);
  text-shadow: 1px 1px 2px #fff;
}
/*---------------------------------
サービス内容について
----------------------------------*/
.page-service-title {
  font-family: var(--font-family-jan);
  font-weight: 500;
  font-size: 2rem;
}
.page-service-title span {
  display: block;
  padding-left: 1.5em;
  color: var(--main-color);
}
.service-item {
  text-align: center;
}

/*---------------------------------
blog archive.php
-----------------------------------*/
.blog-archive-date {
  font-size: 0.8rem;
}
.blog-archive-title {
  font-size: 1.1rem;
}
.blog-archive-btn {
  width: 170px;
}
.blog-archive-btn::before {
  right: 1em;
}
.blog-thumbnail a img{
	    object-fit: cover;
}
/*---------------------------------
blog single.php
-----------------------------------*/
.blog-single-title {
  background-color: var(--main-color);
  color: #fff;
  padding: .3em;
  font-size: 1.2rem;
  letter-spacing: .8px;
}
.blog-single-title a {
  color: #fff;
}
.blog-single-date {
  font-size: 0.8rem;
}
.page-navi {}
/*---------------------------------
Contact contact.php
-----------------------------------*/
.contact-category::before {
  display: inline-block;
  content: "Contact";
}

[type=text],[type=email],textarea{
	width:100%;
	border: 1px solid #333;
    border-radius: 3px;
		padding:.3em;
}
[type="submit"] {
	padding:.5em 1.3em;
	border-radius: 2px;
	background-color:var(--main-color);
	color:#fff;
}
.submit-btn p{
	text-align: center;
	transform: translateX(24px);
}
/*---------------------------------
feature.php
-----------------------------------*/
.license-category::before {
  display: inline-block;
  content: "License and Skill";
}
.licence-box-title {
  border-left: 7px solid var(--main-color);
  padding-left: .5em;
}
.licence-box-list {
  list-style: square;
}
.licence-box-item {
  line-height: 2;
  color: var(--main-color);
}
.licence-box-item span {
  color: var(--text-color);
}
/*---------------------------------
company.php
-----------------------------------*/
.message::before {
  display: inline-block;
  content: "Message";
}
.company-category::before {
  display: inline-block;
  content: "Company";
}
.message-sign {
  font-size: 1.5rem;
  font-weight: bold;
}
.message-sign span {
  font-size: 0.9rem;
  font-weight: normal;
}
.message-img img {
  object-fit: cover;
}
.company-item {
  border-bottom: 1px solid #ddd;
  line-height: 3;
	padding-top: 0.3em;
    padding-bottom: 0.3em;
}
.company-item:first-child {
  border-top: 1px solid #ddd;
}
.company-item dd {
  margin-bottom: 0;
}
/*---------------------------------
development.php
-----------------------------------*/
.development-category::before {
  display: inline-block;
  content: "Past Development";
}
/*tab*/
.tab-item {
  background-color: #ddd;
  border-radius: 2px;
}
.tab-item:hover{
	cursor: pointer;
}
.dev-articles {
  display: none;
}
.is-contents-active {
  display: block;
}
.is-btn-active {
  border-bottom: 2px solid #333;
  transition: all .08s;
}
/*---------------------------------
recruit.php
-----------------------------------*/
.recruit-category::before {
  display: inline-block;
  content: "Recruit";
}
.recruit-list-item {
  padding-bottom: .5em;
  border-bottom: 1px solid #ddd;
}
/*---------------------------------
Sidebar
-----------------------------------*/
.sidebar-title {
  font-size: 1.1rem;
  background-color: #ddd;
  color: #333;
  padding: .5em .5em;
  transform: skewX(-5deg);
  text-align: center;
}
.sidebar-title span {
  transform: skewX(5deg);
}
.sidebar-list {
  padding-left: 1em;
}
.sidebar-list-item {
  line-height: 2;
}
/*---------------------------------
追加CSS
---------------------------------*/
h2 span{
	letter-spacing: .05em;
}
.header-nav{
	margin: 1.5em auto;
}
ol, ul {
    padding-left: 0;
}
.service__item {
    width: 24%;
}
.ft-category-item a{
	margin-left: 10px;
}
.ft-category-list{
	margin-top: 0;
}
.wh-btn{
	width:90%;
}
.img-kadomaru{
	border-radius: 10px;
}
.s-caution{
	font-size: .75em;
}
.st-point-txt span{
	font-weight: bold;
}
.caution-box{
	
	border: 2px solid #444;
	padding: 5px;
	display: flex;
	margin: 0 auto;
	align-items: center;
}
.caution-ttl{
	color:red;
	font-size: 1.2em;
	
}
.caution-img-box{
	margin-right: 15px;
    width: 10%;
}
.caution-txt-box{
	width:80%;
}
.caution-txt-box p{
	margin-bottom: 0;
	padding-bottom: 0;
}
.footer-logo span{
	font-size: 0.8rem;
	font-weight: normal;
}

.price-list-tb td,.price-list-tb th{
	padding:10px;
}
.price-list-tb th{
	text-align: center;
	font-size: 1.5rem;
	background-color: var(--main-color);
	color:#fff;
	border:1px solid #fff;
	}
.price-list-tb td{
	border:1px solid var(--main-color);
	font-weight: bold;
	text-align: center;
}
.price-list-tb td span{
	font-size: 1.4rem;
}
.price-list-tb{
	border-collapse: collapse;
	border:3px solid var(--main-color);
	margin:0 auto;
	border-radius: .5em;
}
.price-list-img{
	text-align: center;
}
.price-ex-tb{
	border-collapse: collapse;
	border:3px solid var(--main-color);
	margin:0 auto;
	
	width: 100%;
}
.price-ex-tb th{
	text-align: center;
	font-size: 1.2rem;
	background-color: var(--main-color);
	color:#fff;
	border:1px solid #fff;
	padding:10px;
	font-weight: normal;
	}
.price-ex-tb td{
	border:1px solid var(--main-color);
	font-weight: bold;
	text-align: left;
	padding:10px;
}
.price-ex-tb td span{
	font-size: 1.4rem;
}

.price-ex-tb tr{
	
}
.price-list-bg li{
	padding-left: 10px;
}
.price-list-bg h3{
	margin-top: 15px;
	font-size: 1.3rem;
	font-weight: 600;
}
.keyVisual{
	height: auto;
}
/*---------------------------------
1000px以下
-----------------------------------*/
@media screen and (max-width:992px) {
  .service__item {
    width: 48%;
    margin-bottom: 2em;
  }
  .form-link {
    font-size: 2.2vw;
  }
  .contact-box h2 {
    font-size: 1.8vw;
  }
  /*------------------------------
	development
--------------------------------*/
  .development-lists > div:nth-child(odd) {
    padding-right: 0em;
  }
  .development-lists > div:nth-child(even) {
    padding-left: 0;
  }
  .development-lists > div:nth-child(odd) {
    padding-right: 0;
  }
  .blue-btn {
    display: block;
  }
  .development-lists > div {
    margin-bottom: 2em;
  }
	.blog-content{
		height:150px;
	}
/*---------------------------------
追加CSS
---------------------------------*/
	.caution-box{
		display: block;
	}
	.caution-img-box{
		width:20%;
		margin: 10px auto;
	}
	.caution-txt-box{
		margin: 10px auto;
		width:100%;
	}
	.ft-category-item a{
	margin-left: 0px;
}
}
/*---------------------------------
768px以下
-----------------------------------*/
@media screen and (max-width:768px) {
  body {
    font-size: 14px;
    letter-spacing: 1px;
  }
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .mt-80 {
    margin-top: 50px;
  }
  .spMainNav__list {
    background-color: #fff;
    padding: 4%;
  }
  /*-------------------------------
	ヘッダー
	-------------------------------*/
  .header-bg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 1000;
  }
  /*-------------------------------
	ハンバーガーアイコン
	-------------------------------*/
  #navToggle {
    position: absolute;
    top: -300px;
  }
  .spMainNav {
    display: none;
  }
  .hamburger {
    width: 60px;
    height: 60px;
    border: 1px solid #eee;
    padding: 10px;
    position: relative;
    border-radius: .3em;
  }
  .hamburger span {
    display: block;
    height: 2px;
    background: #333;
    position: absolute;
    top: 25px;
    left: 10px;
    right: 10px;
    transform: translateY(-50%);
    transition: all 0.5s;
  }
  .hamburger span::before {
    content: '';
    display: block;
    height: 2px;
    background: #333;
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    transition: all 0.5s;
  }
  .hamburger span::after {
    content: 'Menu';
    display: block;
    /*height: 2px;
		background:#333;*/
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    transition: all 1s;
  }
  #navToggle:checked ~ .hamburger span {
    background-color: transparent;
  }
  #navToggle:checked ~ .hamburger span::before {
    content: "";
    transform: translateY(10px);
  }
  #navToggle:checked ~ .hamburger span::after {
    content: "close";
    color: #000;
  }
  #navToggle:focfus-visible ~ .hamburger {
    box-shadow: 1px 1px 2px gray;
  }
  #navToggle:checked ~ .spMainNav {
    display: block;
  }
  .spMainNav.active {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #fff;
    scale: none;
  }
  .spMainNav__list {
    position: absolute;
    top: 90px;
    left: 0;
    right: 0;
  }
  .spMainNav__item {
    padding: 16px 4% 10px;
    border-bottom: 1px solid #ddd;
  }
  .hamburger.active {
    z-index: 100;
  }
  /*------------------------------
	service
--------------------------------*/
  .service__item {
    width: 100%;
    margin-bottom: 1em;
  }
  .service__item-img {
    width: 100%;
    height: 250px;
  }
  .service__item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /*------------------------------
	strong-point
--------------------------------*/
  /*.py-80 {
    padding-top: 50px;
    padding-bottom: 50px;
  }*/
  .st-point {
    flex-direction: column-reverse;
  }
  /*------------------------------
	contact
--------------------------------*/
  .contact-box h2 {
    font-size: 2vw;
  }
  .contact-title::before, .contact-title::after {
    display: none;
  }
  .contact-item {
    width: 100%;
    margin-bottom: 1em;
  }
  .form-link {
    height: auto;
  }
  .contact-from {
    font-size: 3vw;
  }
  .tel-num::before, .form-link {
    font-size: 5vw;
  }
  .tel-num span {
    font-size: 6.5vw;
  }
  .business-hours {
    font-size: .8rem;
  }
  .contact-from {
    font-size: 2.5vw;
    margin-bottom: 0;
  }
	[type="submit"] {
		transform: translateX(-24px);
    padding: 1em 2em;
    border-radius: 2px;
    background-color: var(--main-color);
    color: #fff;
    width: 100%;
}
	

  /*------------------------------
	footer
--------------------------------*/
  .footer-logo {
    text-align: left;
    width: 100%;
    margin-bottom: 30px;
}
  .ft-sns-icons {
    padding-left: .5em;
    margin-top: 1em;
  }
  .google-map-btn {
    display: none;
  }
  .ft-category-list {
    margin-top: 1em;
    padding-left: .5em;
  }
  .ft-category-item {
    line-height: 2;
  }
	.ft-category-item a {
		margin-bottom: 0;
		
		}
/*---------------------------------
追加CSS
---------------------------------*/
	.google-map-btn{
		margin-top: 0;
	}
	.keyVisual{
		padding-top:80px;
	}
}
/*---------------------------------
767px以下
-----------------------------------*/
@media screen and (max-width:767px) {
  /*.service-category-lists{
		display: block;
	}*/
  main {
    margin-top: 35px;
  }
  .service-category__item {
    margin-left: 0;
    margin-right: 0;
  }
  .development-lists > div:nth-child(odd) {
    padding-right: 0;
  }
  .flow-item-title {
    font-size: 1.1rem;
  }
  .service-page__title::before {
    top: -19px;
    width: 100%;
  }
	.blog-content{
		height:86px;
	}
	.blog-thumbnail a img{
		object-fit: cover;
    display: block;
    width: 100%;
	}
	.blog-arcive-item-box{
		padding:.5em;
	}
	.breadcrumb{
	margin-bottom: 0;	
	}
	.mt-80{
		margin-top: 50px;
	}
/*---------------------------------
追加CSS
---------------------------------*/
}