@charset "UTF-8";
input[type="image"],
input[type="submit"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
}

body {
  background: url("../img/edy88bg.gif");
}

i:before {
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  padding-right: 0.1em;
}

.mobile_btn {
  display: none;
}

.pc_img{
	display:block;
}

.mob_img{
	display:none;
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
  flex-wrap: wrap;
}

.flex .post-item {
  width: 30%;
  margin: 0 1%;
  margin-bottom: 3%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#header h1 {
  text-align: center;
  text-indent: 9999;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

#header .logo {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 12  px;
  padding: 15px;
  padding-bottom: 0;
}

.logo img {
  width: 50%;
}

.logobox {
  width: 570px;
  max-width: 100%;
  margin-right: 5%;
  margin-left: -5%;
}

.logobox img {
  width: 85%;
  margin: auto;
  display: block;
}

.telimg img, .mailimg img {
  display: block;
  width: 100%;
}

.telimg img:hover, .mailimg img:hover {
  opacity: .7;
  transition: all .3s;
}

.telimg {
  width: 350px;
  margin-right: 2%;
}

.mailimg {
  width: 110px;
  margin: 0 0.5%;
}

#box ul {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
}

#li1 img {
  width: 30%;
  display: block;
  margin: auto;
}

#box #li3 img {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  display: block;
  height: 250px;
  object-fit: cover;
  border-radius: 50%;
  transition: all .3s;
}

#box #li3 img:hover {
  transform: scale(1.03);
}

#li3 li {
  margin: 2% 3%;
  width: 27%;
  min-width: 250px;
  padding: 0;
  margin-bottom: 5%;
}

#li2 {
  flex-direction: column;
}

.detail_title {
  display: block;
  text-align: center;
  width: calc(100% - 20px);
  margin: auto;
  margin-bottom: 5%;
  font-weight: bold;
  background-color: #fff;
  /* 背景色 */
  border: 1px solid #ef858c;
  /* 枠線 */
  border-right: 20px solid #ef858c;
  /* 右側の太い線 */
  color: #383838;
  /* 文字色 */
  padding: 10px 4%;
  /* 上下・左右の余白 */
  position: relative;
}

.detail_title:after {
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.1);
  /* 付箋の影 */
  content: '';
  position: absolute;
  transform: rotate(1deg);
  -moz-transform: rotate(1deg);
  -webkit-transform: rotate(1deg);
  -o-transform: rotate(1deg);
  bottom: 15px;
  right: -3px;
  width: 85%;
  height: 10px;
  z-index: -1;
}

.detail, #blgli {
  background: #fff;
  padding: 8%;
  margin-top: 7%;
  margin: 0;
}

.detail li, #blgli li {
  padding: 0;
  margin: 0;
}

.detail dd, .detail dt, #blgli dd, #blgli dt {
  border-bottom: dashed #bcbcbc 1px;
  padding: 1% 0;
}

.detail dt, #blgli dt {
  font-weight: bold;
}

.detail dt::before, #blgli dt::before {
  content: "○";
}

.detail dd, #blgli dd {
  padding-left: 1em;
}

.detail dd::before, #blgli dd::before {
  content: "";
}

.detail dd:empty:before, #blgli dd:empty:before {
  content: "\A";
  white-space: pre;
}

#blgli {
  margin-top: 5%;
  margin-bottom: 5%;
}

.detail {
  margin-top: 7% !important;
}

.detail_btn {
  display: block;
  width: 80%;
  border: solid #ef858c 1px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  background: #fff;
  border-radius: 5px;
  overflow: hidden;
}

.detail_btn:hover {
  border: solid #ef858c 1px;
}

.detail_btn span {
  position: relative;
  z-index: 999;
  color: #e27b81;
  width: 100%;
  display: block;
  padding: 6% 0;
}

.detail_btn span:hover {
  color: #fff;
}

.detail_btn:before {
  content: '';
  /*絶対配置で位置を指定*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  /*色や形状*/
  background: #ef858c;
  width: 100%;
  height: 100%;
  /*アニメーション*/
  transition: transform 0.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: top;
}

.detail_btn:hover:before {
  transform: scale(1, 1);
}

.more_btn_wrapper {
  width: 100%;
  text-align: center;
  margin-bottom: 13%;
}

.more_btn {
  padding: 3% 12%;
  /* background: transparent; */
  background: #ef858c;
  color: #fff;
  width: auto;
  font-size: 16px;
  border-radius: 34px;
  display: inline-block;
  margin: auto;
}

.more_btn:hover {
  opacity: .7;
  color: #fff;
}

.subtitle {
  display: block;
  margin: 0 auto;
  margin-top: 7%;
  min-width: 170px;
  pointer-events: none;
}

.news {
  width: 30%;
  margin-top: 2%;
}

.syokai {
  width: 30%;
}

.lineform {
  width: 28%;
  margin-bottom: 5%;
}

#box #li2 {
  align-items: center;
}

#box #li2 img {
  width: 100%;
  max-width: 100%;
}

.message_area {
  position: relative;
  width: 100%;
}

.message_bg {
  width: 50%;
  display: block;
  margin: auto;
  opacity: .9;
  pointer-events: none;
}

.message {
  position: absolute;
  left: 50%;
  top: 49%;
  transform: translate(-50%, -50%);
  line-height: 2.5;
  font-size: 16px;
  letter-spacing: 0.1em;
  width: 100%;
  color: #383838;
}

.wash {
  width: 80%;
  background: #fff;
  border-radius: 20px;
  font-size: 16px;
  padding: 5%;
  margin: 0 auto;
  margin-bottom: 10%;
}

.wash a {
  text-decoration: underline;
  text-align: right;
  display: block;
}

.wash img {
  width: 100%;
  display: block;
  margin: 3% auto;
}

.contact {
  padding: 0 8%;
  font-size: 14px;
  /* 全幅指定 */
  /* pタグの余白を削除 */
  /* 背景色（お好きな色に） */
  /*  フォームの幅（自由に変えてOK） */
  /* 各項目の下部余白 */
  /* 項目名 */
  /* 必須タグと任意タグ共通のスタイル */
  /* 必須タグ */
  /* 任意タグ */
  /* 名前やメールアドレスなどユーザーが入力する箇所 */
  /* お問い合わせ内容を入力する箇所 */
  /* ボタン */
  /* ボタンにホバーした時 */
  /* ローダー */
}

.contact h2 {
  font-size: 16px;
  text-align: center;
  display: block;
  width: 100%;
  border-bottom: solid #e27b81 1px;
  font-weight: bold;
  margin-bottom: 1em;
}

.contact h4, .contact .wpcf7-not-valid-tip {
  display: block;
  width: 90%;
  margin: 0 auto;
}

.contact h4 {
  margin-top: 3%;
}

.contact img {
  width: 100%;
}

.contact .inari {
  width: 90%;
  display: block;
  margin: auto;
}

.contact #box_contact img {
  width: 80%;
  margin: 1% auto;
  display: block;
}

.contact #box_contact img.qrcode {
  margin-top: 6%;
  width: 70%;
}

.contact form {
  margin-bottom: 7%;
}

.contact .full-width {
  margin: 0 calc(50% - 50vw);
  padding: 5em calc(50vw - 50%);
}

.contact .wpcf7-form p {
  margin-bottom: 0;
}

.contact section.contact {
  background-color: #EDF7EF;
}

.contact .contactForm {
  max-width: 100%;
  margin: 0 auto;
}

.contact .contact_item {
  margin-bottom: 2.5rem;
}

.contact .label {
  display: block;
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  margin-bottom: .6rem;
  font-weight: bold;
  display: block;
  width: 90%;
}

.contact .label_tag {
  font-size: 1rem;
  color: #ffffff;
  border-radius: .3rem;
  margin-right: 1rem;
  padding: 5px 10px;
}

.contact .label_must {
  background-color: #C84772;
}

.contact .label_option {
  background-color: #888988;
}

.contact .inputs {
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.contact input[type="text"], .contact input[type="email"], .contact textarea {
  border: solid 1px #888988;
  padding: 1.5%;
  font-size: 1rem;
  margin: auto;
  display: block;
  width: 90%;
  max-width: 95%;
}

.contact textarea.form-control {
  border: solid 1px #707070;
  padding: .5rem;
  height: 207px;
  font-size: 1rem;
}

.contact .btnArea {
  text-align: center;
}

.contact input[type="submit"], .contact .line_btn {
  background: #C84772;
  border: 2px solid #ffffff;
  width: 70%;
  max-width: 70%;
  margin: auto;
  display: block;
  color: #ffffff;
  text-align: center;
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: .2em;
  text-indent: .2em;
  font-weight: bold;
  padding: 3% 7%;
  margin-top: 2rem;
  cursor: pointer;
  border-radius: .3rem;
  transition: all .3s;
}

.contact input[type="submit"]:hover {
  color: #C84772;
  background-color: #ffffff;
  border-color: #C84772;
}

.contact .wpcf7 .ajax-loader {
  display: block;
  margin: 0 auto;
}

.contact #li2 {
  margin-top: 13%;
  text-align: center;
  font-size: 16px;
}

.contact #li2 img {
  width: 95%;
  display: block;
  margin: auto;
}

.contact .line_btn {
  background: #06c755;
  color: #fff;
  border: solid #06c755 2px;
  width: 55%;
  display: block;
}

.contact .line_btn:hover {
  background: #fff;
  color: #06c755;
  border: solid #06c755 2px;
}

.contact_content {
  background: rgba(255, 255, 255, 0.7);
  border-radius: 10px;
  padding: 5%;
  margin-top: 5%;
}

#footer-menu ul {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4% 0;
}

#footer-menu ul li {
  margin: 0  2em;
}

#footer-menu ul li a:hover {
  color: #ffffff;
  opacity: .7;
}

/* モバイル版 */
@media screen and (max-width: 480px) {
  .contact_item {
    margin-bottom: 1.6rem;
  }
  .label {
    font-size: 1.5rem;
    margin-bottom: .4rem;
  }
  .label_tag {
    font-size: 1rem;
  }
  input[type="text"], input[type="email"] {
    padding: .4rem;
    font-size: 1rem;
  }
  textarea {
    padding: .4rem;
    font-size: 1rem;
  }
  input[type="submit"] {
    font-size: 1rem;
  }
}

#footer {
  padding: 0;
}

.phone_num {
  display: flex;
  text-align: center;
  font-weight: bold;
  font-size: 50px;
  margin: 0 auto;
  border-radius: 5px;
  width: 90%;
  margin: 3% auto;
  transition: all .3s;
  background-color: #ef858c;
  color: #fff;
  justify-content: center;
  align-items: center;
  padding: 1% 0;
}

.phone_num:hover {
  opacity: .7;
  color: #fff;
}

.contact #box_contact img.inari_sister {
  width: 10%;
  margin-right: 3%;
  margin-left: -5%;
}

@media screen and (max-width: 980px) {
	.mob_img{
		display:block;
	}
	
	.pc_img{
		display:none;
	}
  #header .logo {
    flex-direction: column;
    padding: 2% 0;
    padding-bottom: 0;
  }
  .logobox {
    width: 600px;
    margin: 0;
  }
  .menu-fixed {
    position: fixed;
    top: 0;
    z-index: 10000;
  }
  .mobile_btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    bottom: 0;
    z-index: 1000;
  }
  .mobile_btn a {
    background: #ef858c;
    padding: 5% 0;
    color: #fff;
    width: 100%;
    text-align: center;
    font-size: calc(calc(calc(100/780*26)*1vw));
  }
  .mobile_btn a.line_form {
    border-right: none;
    background: #06c755;
  }
  .mobile_btn a.mail_form {
    border-right: none;
    background: #61c8ff;
  }
  .mobile_btn a.line_form {
    border-right: none;
    background: #06c755;
  }
  #li3 li {
    margin: 2% 2%;
    width: 52%;
    min-width: 250px;
    padding: 0;
    margin-bottom: 6%;
  }
  #box #li3 img {
    width: 86%;
    height: 68vw;
  }
  #li3 li {
    width: 85%;
    margin-bottom: 14%;
  }
  .telimg, .mailimg {
    display: none;
  }
  .message_bg {
    width: 98%;
  }
  .message {
    font-size: calc(calc(calc(100/780*26)*1vw));
    line-height: 8vw;
  }
  .contact {
    padding: 0 3%;
  }
  .contact input[type="text"], .contact input[type="email"], .contact textarea {
    border: solid 1px #888988;
    padding: 6% 2%;
    font-size: 1rem;
    margin: auto;
    display: block;
    width: 90%;
    max-width: 95%;
  }
  .contact input[type="submit"], .contact .line_btn {
    width: 95%;
    max-width: 95%;
    padding: 4% 0;
    font-size: calc(calc(calc(100/780*27)*1vw));
  }
  .contact #box_contact img.qrcode {
    width: 90%;
  }
  .more_btn_wrapper {
    width: 100%;
    text-align: center;
    margin-bottom: 20%;
  }
  .contact #box_contact img.inari_sister {
    width: 15%;
    margin-right: 3%;
    margin-left: -5%;
  }
  .phone_num {
    font-size: calc(calc(calc(100/780*50)*1vw));
    width: 100%;
  }
  .wash {
    width: 90%;
    padding: 7%;
    margin-bottom: 15%;
  }
}
