/* Description: Master CSS file */
/**************************/
/*     General Styles     */
/**************************/
:root {
  --primary: #879e46;
  --primary2: #bbd5a6;
  --gray: #999;
  --white: antiquewhite;
  --black: #111;
  --dark: #0f0f0f;
  --akane: #c42a2c;

  --box-shadow: 0 0.125rem 0.3rem rgba(0, 0, 0, 0.3);
  --box-shadow-hover: 0 0.125rem 0.3rem rgba(0, 0, 0, 0.3);
  --box-shadow-inset: inset 0.8rem 0.8rem 1.2rem rgba(0, 0, 0, 0.05),
    inset -0.8rem -0.8rem 1.2rem #fff;
  --box-shadow-dark: 0.8rem 0.8rem 1.2rem rgba(0, 0, 0, 0.1),
    -0.8rem -0.8rem 1.2rem rgba(#fff, 0.2);
}
html {
  overflow-x: hidden;
  /*  
        max-width: 70ch;
        padding: 2ch;
        margin: auto;*/
}
body {
  margin: 0;
  font-family: "Noto Sans JP", "Poppins", "Montserrat", sans-serif;
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.5;
  color: #0f0f0f;
  background-color: #fff;
  -webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Noto Sans JP", "Poppins", sans-serif;
}
h1 {
  font-size: 1.875rem;
  font-weight: 500;
}
button {
  font-family: "Noto Sans JP", sans-serif;
}
p,
ul,
h4 {
  margin: 0;
  padding: 0;
}
a {
  color: #00a108;
  text-decoration: none;
}
a:hover {
  color: var(--primary);
  text-decoration: none;
  transition: 0.5s;
}

li {
  list-style-type: none;
}

strong {
  font-size: 1.375rem !important;
  padding: 3rem 0 1rem 0 !important;
}
.mincho {
  font-family: "Sawarabi Mincho", serif;
  font-weight: 500;
}
.aka {
  color: #f00;
}
.ao {
  color: #00f;
}

.bg-topbar {
  background-color: white !important;
  color: var(--primary) !important;
  font-size: 0.875rem;
}
.bg-spot {
  background-color: #aca167 !important;
}
.moji-kan {
  letter-spacing: 0.075rem;
}

.fw-light {
  font-weight: 400 !important;
}
.fw-medium {
  font-weight: 500 !important;
}

.fw-bold {
  font-weight: 700 !important;
}

.fw-black {
  font-weight: 900 !important;
}

.fw-600 {
  font-weight: 500;
  font-size: 1.25rem;
  color: #e44e00;
  padding-bottom: 0.625rem;
}
.text-coler-0 {
  color: var(--primary) !important;
}
.text-coler-1 {
  color: var(--gray) !important;
}
.text-coler-2 {
  color: var(--white) !important;
}
.text-coler-3 {
  color: var(--black) !important;
  font-size: 1rem !important;
}
.text-coler-4 {
  color: var(--black) !important;
}
.text-coler-5 {
  color: var(--akane) !important;
}
.text-size-small {
  font-size: 0.875rem;
}
.form-control {
  font-size: 0.875rem;
}

.text-size-small02 {
  font-size: 0.75rem;
  vertical-align: middle;
}

.table {
  max-width: 970px;
  margin: auto;
}
.table thead,
th,
td {
  border-color: #ccc;
  font-weight: normal;
}
.back-to-top {
  position: fixed;
  display: none;
  right: 45px;
  bottom: 45px;
  z-index: 99;
}

.ovlay {
  opacity: 0.9;
}

/* Sections dividers */
.divider-w {
  border-top: 1px solid #eaeaea;
  margin: 0;
}

.divider-d {
  border-top: 1px solid #ddd;
  margin: 0;
}
.divider-dot {
  border-top: 1px dotted #9f760f;
  margin: 0;
}
.divider-p {
  border-top: 6px solid #c800ff;
  margin: 0;
}

.divider-w2 {
  border-top: 6px solid #fff;
  margin: 0;
}

.divider-r {
  border-top: 6px solid red;
  margin: 0;
}

.divider-y {
  border-top: 6px solid #ffee0b;
  margin: 0;
}

.divider-g {
  border-top: 6px solid #00a108;
  margin: 0;
}

.nokke .h5 {
  position: relative;
  padding: 1rem;
  background: #ddd;
  border-radius: 0.5rem;
}

.nokke .h5:after {
  position: absolute;
  content: "";
  top: 100%;
  left: 30px;
  border: 10px solid transparent;
  border-top: 10px solid #ddd;
  width: 0;
  height: 0;
}

@media (max-width: 992px) {
  .nokke {
    width: 96%;
    margin: 0 auto;
  }
}

/*** Button ***/
.btn {
  transition: 0.5s;
  border-radius: 0.75rem;
  padding: 6px 12px;
  font-size: 0.875rem;
}
.btn.btn-primary,
.btn.btn-outline-primary:hover {
  color: #ffffff;
}
.btn-square {
  width: 38px;
  height: 38px;
}
.btn-sm-square {
  width: 32px;
  height: 32px;
}
.btn-lg-square {
  width: 48px;
  height: 48px;
}
.btn-square,
.btn-sm-square,
.btn-lg-square {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: normal;
}
.btnx-main {
  background: #00a108;
  border: 2px solid #00a108;
}
.btnx-main:hover {
  background: var(--primary);
  border: 2px solid var(--primary);
}
.btnx-indigo {
  background: var(--bs-indigo);
  border: 2px solid var(--bs-indigo);
}
.btnx-purpule {
  background: var(--bs-purple);
  border: 2px solid var(--bs-purple);
}
.btnx-pink {
  background: var(--bs-pink);
  border: 2px solid var(--bs-pink);
}
.btnx-orange {
  background: var(--bs-orange);
  border: 2px solid var(--bs-orange);
}
.btnx-teal {
  background: var(--bs-teal);
  border: 2px solid var(--bs-teal);
}
.btnx-cyan {
  background: var(--bs-cyan);
  border: 2px solid var(--bs-cyan);
}
.btnx-lime {
  background: #7cb342;
  border: 2px solid #7cb342;
}
.btnx-indigo-light {
  color: var(--bs-indigo);
  background: #9fa8da;
  border: 2px solid #9fa8da;
}
.btnx-purpule-light {
  color: var(--bs-purple);
  background: #ce93d8;
  border: 2px solid #ce93d8;
}
.btnx-pink-light {
  color: var(--bs-pink);
  background: #f48fb1;
  border: 2px solid #f48fb1;
}
.btnx-orange-light {
  color: var(--bs-orange);
  background: #ffcc80;
  border: 2px solid #ffcc80;
}
.btnx-teal-light {
  color: #004d40;
  background: #80cbc4;
  border: 2px solid #80cbc4;
}
.btnx-cyan-light {
  color: #006064;
  background: #80deea;
  border: 2px solid #80deea;
}
.btnx-lime-light {
  color: #827717;
  background: #c5e1a5;
  border: 2px solid #c5e1a5;
}

.border-light {
  border: none;
}
/*** Spinner ***/
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;
  z-index: 99999;
}

#spinner.show {
  transition: opacity 0.5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}

#loading {
  width: 100%;
  height: 100vh;
  background-color: #fff;
  position: relative;
}
#loading img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.load-hidden {
  display: none;
}

.head-title {
  display: block;
  color: var(--primary);
  text-align: right;
  padding-top: 0.375rem;
  padding-right: 1.375rem;
  font-size: 0.875rem;
}

/* flatpickr-calenda */
/* flatpickr-calendar日曜日：赤 */
.flatpickr-calendar
  .flatpickr-innerContainer
  .flatpickr-weekdays
  .flatpickr-weekday:nth-child(7n + 1),
.flatpickr-calendar
  .flatpickr-innerContainer
  .flatpickr-days
  .flatpickr-day:not(.flatpickr-disabled):not(.prevMonthDay):not(
    .nextMonthDay
  ):nth-child(7n + 1) {
  color: #f00;
}

/* flatpickr-calendar土曜日：青 */
.flatpickr-calendar
  .flatpickr-innerContainer
  .flatpickr-weekdays
  .flatpickr-weekday:nth-child(7),
.flatpickr-calendar
  .flatpickr-innerContainer
  .flatpickr-days
  .flatpickr-day:not(.flatpickr-disabled):not(.prevMonthDay):not(
    .nextMonthDay
  ):nth-child(7n) {
  color: #25bdcf;
}

/* flatpickr-calendar祝日 */
.flatpickr-day.is-holiday {
  background: lighten(#f00, 40%) !important;
}

/* flatpickr-calendar入力欄の文字列を選択させないようにしておく  */
.flatpickr-calendar .numInput {
  user-select: none;
}
/* flatpickr-calendar end */

/* Section Background */
.home,
.info,
.about,
.services,
.plans,
.work,
.contact {
  /*height: 110vh;*/
  position: relative;
}
#bbs {
  height: 100vh;
  position: relative;
}

.home,
.about,
.services,
.plans,
.about,
.map,
.location {
  color: var(--dark);
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.company,
.newslette {
  background-color: #fff;
}
.plan {
  background-color: #e8d182;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.ec-aria {
  background-color: var(--primary);
  opacity: 0.9;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.ec-aria a {
  color: white;
}
.ec-aria a:hover {
  color: var(--primary2);
}
.mainZenkoji {
  background-color: #fff;
  width: 100%;
  height: auto;
  background-image: url("../assets/images/zenkouji/mainBackgroud.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  z-index: 1;
}

.bottom {
  background-color: var(--primary);
}
.wh-opt {
  background-color: white;
  opacity: 0.9;
  border-radius: 20px;
}

/**********************/
/*    news            */
/**********************/

.-news {
  color: var(--primary) !important;
  padding: 20px 30px;
  background: #ffffff;
  border: 1px solid rgba(89, 87, 87, 0.2);
  border-radius: 7px;
  box-shadow: 0 0 6px rgba(89, 87, 87, 0.4);
}
.-news .border-news {
  border-bottom-color: #ddd !important;
}

/* clearfix */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}

/* for macIE \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}

ul#newsList {
  margin: 0;
  padding: 0;
}
ul#newsList li {
  color: #595757 !important;
  font-size: 0.75rem;
  margin: 0;
  padding: 5px 0;
  margin-bottom: 3px;
  border-bottom: 1px dotted #ccc;
  list-style-type: none;
}

.catName {
  display: inline-block;
  padding: 3px 8px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 0.5rem;
  line-height: 100%;
  margin: 0 2px;
}
.newMark {
  display: inline-block;
  border: 1px solid #f00;
  padding: 1px 4px;
  font-size: 11px;
  line-height: 100%;
  background: #f00;
  color: #fff;
  box-shadow: 1px 1px 1px #999;
  border-radius: 8px;
  font-style: italic;
}
.comment {
  display: block;
  padding: 3px 0;
  float: left;
  overflow: hidden;
  width: 480px; /* 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.thumbNailWrap {
  display: block;
  width: 200px;
  float: left;
  height: auto;
  overflow: hidden;
}

/* Pager style（外部化可） */
.pager {
  text-align: right;
  padding: 10px;
  clear: both;
}
/*ページャーボタン*/
.pager a {
  border: 1px solid #999;
  border-radius: 5px 5px 5px 5px;
  color: #333;
  font-size: 12px;
  padding: 3px 7px 2px;
  text-decoration: none;
  margin: 0 1px;
}

/*現在のページのボタン*/
.pager a.current {
  background: #999;
  border: 1px solid #999;
  border-radius: 5px 5px 5px 5px;
  color: #fff;
  font-size: 12px;
  padding: 3px 7px 2px;
  margin: 0 1px;
  text-decoration: none;
}

.pager a:hover {
  background: #999;
  color: #fff;
}

.overPagerPattern {
  padding: 0 2px;
}

/* /Pager style */
div#news {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

div#news div#information div {
  margin: 20px 0;
  border-top: 1px dotted #ccc;
  padding-top: 20px;
  color: #595757 !important;
}

div#news div#information div:first-child {
  border-top: none;
  padding-top: 0;
}
/**********************/
/*     foot           */
/**********************/

.footer {
  background-color: var(--primary);
}
.footer a,
.footer .fab,
.footer .far,
.footer .fas {
  color: var(--dark) !important;
}
.footer a:hover,
.footer .fab:hover {
  cursor: pointer;
  color: var(--primary2) !important;
}
.footer a[href*="tel:"] {
  color: white !important;
}
.footer i {
  font-size: 1rem;
}

/**********************/
/*     Navigation     */
/**********************/
.navbar {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 0.875rem;
  background-color: #fff;
  /*box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.025);*/
}
.navbar.sticky-top {
  /*top: -100px;*/
  transition: 0.5s;
}
.navbar .navbar-brand {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.navbar .logo-image img {
  width: 220px;
  height: auto;
}
.navbar .logo-text {
  color: var(--dark);
  font-weight: 500;
  line-height: 1rem;
  font-size: 1.35rem;
  text-decoration: none;
}
.offcanvas-collapse {
  position: fixed;
  top: 9.65rem; /* adjusts the height between the top of the page and the offcanvas menu */
  bottom: 0;
  left: 100%;
  width: 100%;
  overflow-y: auto;
  visibility: hidden;
  padding: 1rem;
  background-color: #fff;
  transition: transform 0.2s ease-in-out, visibility 0.2s ease-in-out;
  opacity: 0.95;
}
.offcanvas-collapse.open {
  visibility: visible;
  transform: translateX(-100%);
}
.navbar .navbar-nav {
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;
}
.navbar .dropdown-menu {
  border: none;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
  background-color: var(--primary);
}
.navbar .dropdown-item {
  color: #363636;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 0.875rem;
  padding-top: 0.625rem;
  text-decoration: none;
  padding-bottom: 0.625rem;
}
.navbar .dropdown-item:hover {
  background-color: #fff;
}
.navbar .dropdown-divider {
  width: 100%;
  height: 1px;
  border: none;
  margin: 0.5rem auto 0.5rem auto;
  background-color: var(--gray);
}
.navbar .nav-item .nav-link {
  color: var(--black);
  text-decoration: none;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  transition: all 0.2s ease;
}
.navbar-nav a:hover {
  cursor: pointer;
  color: #c42a2c !important;
}
.navbar .nav-item .nav-link .fa-instagram {
  color: #fff;
  font-size: 1.25rem;
}
.navbar .fa-stack {
  width: 2em;
  font-size: 0.75rem;
  margin-right: 0.25rem;
}
.navbar .fa-stack-2x {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(#e4a972),
    to(#1e00ff)
  );
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.2s ease;
}
.navbar .fa-stack-1x {
  color: #ffffff;
  transition: all 0.2s ease;
}
.navbar .fa-stack:hover .fa-stack-2x {
  color: var(--primary02);
}
.navbar .fa-stack:hover .fa-stack-1x {
  color: var(--primary02);
}
.navbar .navbar-toggler {
  padding: 0;
  border: none;
  font-size: 1.25rem;
}
.navbar-toggler-icon {
  font-size: 1.75rem;
}
/*.imgLogo:before{
	content:"";
	display: block;
	width:0;
	height:0;
	padding-bottom:16%;
	
}
.imgLogo imgLogochild{
	padding:0;
}
*/
/****************/
/*     swiper   */
/****************/
/*** swiper ***/
main {
  display: block;
}

.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 10rem;
}

.l-section {
  border-top: 1px solid #eee;
}
.l-sectionPU {
  border-top: none;
}
.l-section .l-inner,
.l-sectionPU .l-inner {
  padding-top: 2rem;
  padding-bottom: 6rem;
}

[class*="swiper"]:focus {
  outline: none;
}

.slide-media,
.thumb-media {
  position: relative;
  overflow: hidden;
}
.slide-media img,
.thumb-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.swiper-button-prev,
.swiper-button-next {
  display: grid;
  place-content: center;
  width: 6.4rem;
  height: 6.4rem;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}
.swiper-button-prev::before,
.swiper-button-next::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  border-radius: 50%;
  -webkit-box-shadow: var(--box-shadow);
  box-shadow: var(--box-shadow);
}
.swiper-button-prev::after,
.swiper-button-next::after {
  width: 1.2rem;
  height: 1.2rem;
  content: "";
  border: solid var(--color-gray);
  border-width: 3px 3px 0 0;
}
.swiper-button-prev::after {
  margin-left: 0.4rem;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.swiper-button-next::after {
  margin-right: 0.4rem;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}
.swiper-pagination-bullet {
  border-radius: inherit;
  margin: 0 5px !important;
  width: 30px;
  height: 3px;
  background: antiquewhite;
  opacity: 0.35;
  -webkit-transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
  transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
}
.swiper-pagination-bullet-active {
  background: #dbb71e;
  width: 50px;
  opacity: 1;
  -webkit-transition: 0.8s;
  transition: 0.8s;
}

/*** swiper movie01 ***/
.mv01 {
  margin-bottom: 16px;
}
.mv01 .l-inner {
  padding-bottom: 0;
}
.mv01 .swiper-fade .swiper-slide {
  -webkit-transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, transform !important;
  transition-property: opacity, transform, -webkit-transform !important;
  pointer-events: none;
}
.mv01 .swiper-fade .swiper-slide-active {
  pointer-events: auto;
}

.mv01 .slide-media {
  height: 800px;
}
.mv01 .slide-media img {
  -webkit-transition: 7s 1s ease-out;
  transition: 7s 1s ease-out;
}

.mv01 .swiper-pagination {
  position: absolute;
  z-index: 1;
  top: 75%;
  bottom: 0;
  left: 0;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  margin: auto;
}

.mv01 .slide-logo {
  position: absolute;
  z-index: 1;
  top: 20%;
  left: 50%;
  -webkit-transform: translateY(-20%) translateX(-50%);
  transform: translateY(-20%) translateX(-50%);
  margin: auto;
  width: 135px;
  opacity: 0.9;
}

.mv01 .slide-title {
  position: absolute;
  z-index: 1;
  top: 30%;
  left: 50%;
  -webkit-transform: translateY(-30%) translateX(-50%);
  transform: translateY(-30%) translateX(-50%);
  margin: auto;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  color: #fff;
  letter-spacing: 0;
  text-shadow: 0px 0px 4px #000;
}

.mv01 .slide-title02 {
  position: absolute;
  z-index: 1;
  top: 40%;
  left: 50%;
  -webkit-transform: translateY(-40%) translateX(-50%);
  transform: translateY(-40%) translateX(-50%);
  margin: auto;
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1.6;
  color: #fff;
  letter-spacing: 0;
  text-shadow: 0px 0px 4px #000;
}
.warnigbox {
  position: absolute;
  z-index: 1;
  top: 78%;
  left: 50%;
  -webkit-transform: translateY(-78%) translateX(-50%);
  transform: translateY(-78%) translateX(-50%);
  max-width: 700px;
  width: 100%;
  margin: auto;
  padding: 10px 25px;
  background-color: rgba(255, 255, 255, 0.65);
}
.__wbox {
  margin: 0 auto;
}

.warnigbox h2 {
  font-size: 1.25rem !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  color: #000;
  text-align: left;
}
.warnigbox p {
  text-align: left;
  color: #000;
  font-weight: 500 !important;
  font-size: 1rem;
  padding: 5px 0;
}
.warnigbox a {
  color: #f00;
  font-size: 1rem;
}
.warnigbox a.wb-2 {
  color: #f00;
  font-size: 1.875rem;
}
.warnigbox a:hover {
  color: #ff383a;
}
.mv01 .swiper-slide[class*="-active"] .slide-media img {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}
/*  .mv01 .swiper-slide[class*=-active] .slide-title {
    -webkit-animation: mv01-fadeIn 2s 0.5s var(--easing) both;
            animation: mv01-fadeIn 2s 0.5s var(--easing) both;
  }*/

@-webkit-keyframes mv01-fadeIn {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0;
    -webkit-filter: blur(300px);
    filter: blur(300px);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
  }
}

@keyframes mv01-fadeIn {
  0% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0;
    -webkit-filter: blur(300px);
    filter: blur(300px);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
  }
}

/* === ヒーローセクション全体 === */
.hero-slide {
  display: flex;
  margin: 30px auto;
  max-width: 1280px;
  height: 350px;
  position: relative;
  border-bottom: 1px solid #fdfdfd;
  overflow: hidden;
}

/* === 各ドアの共通スタイル === */
.door {
  width: 45%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

/* 左側背景 */
.door-left {
  background: url("../special/pasta.jpg") center/cover no-repeat;
}

/* 右側背景 */
.door-right {
  background: url("../special/cider.jpg") center/cover no-repeat;
}

/* === 扉だけのパネル === */
.door-panel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit; /* 背景を引き継ぐ */
  z-index: 3;
  transition: transform 0.8s ease;
}
/* 背景ブラー専用レイヤー */
.blur-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  filter: blur(0px);
  transition: filter 0.8s ease;
  z-index: 0;
}

/* 扉が開いたときだけぼかす */
.hero-slide:hover .door-left .blur-bg,
.hero-slide:hover .door-right .blur-bg {
  filter: blur(8px);
}
/* === 中身（商品画像やテキスト） === */
.door-content {
  position: relative;
  z-index: 1;
  padding: 0;
  margin: 50px 0;
  text-align: center;
  background: transparent;
}
.door-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  background: inherit;
  z-index: -1;
  filter: blur(0px);
  transition: filter 0.8s ease;
}
.door-content--img {
  display: flex;
  justify-content: center;
}
.door-content img {
  max-width: 28%;
  display: block;
  margin: 0;
}

.caption {
  font-size: 1.5rem;
  font-weight: bold;
  color: #fff;
}
.door-left .caption {
  color: #333;
}
/* === 中央ラベル部分 === */
.door-center {
  width: 10%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(
    to bottom,
    #c2f0ff,
    #e6ffff
  ); /* 夏らしい爽やか背景 */
  /* background: #0099ff; */
  /* border-left: 1px solid #aaa;
        border-right: 1px solid #aaa; */
  z-index: 4;
}

.door-center .label {
  writing-mode: vertical-rl;
  font-size: 1.2rem;
  font-weight: bold;
  color: #00a2ff;
  letter-spacing: 0.1em;
  text-align: center;
  animation: floatWave 2.5s ease-in-out infinite;
}
@keyframes floatWave {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}
/* === ホバーで扉を外に開く === */
.hero-slide:hover .door-left .door-panel {
  transform: translateX(-100%);
}

.hero-slide:hover .door-right .door-panel {
  transform: translateX(100%);
}
.btn-detail {
  display: inline-block;
  margin-top: 12px;
  padding: 10px 28px;
  font-size: 1rem;
  font-weight: 500;
  color: #fff;
  background: linear-gradient(135deg, #00c6ff, #0072ff);
  border: none;
  border-radius: 100px;
  box-shadow: 0 6px 15px rgba(0, 115, 255, 0.3);
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.btn-detail:hover {
  color: #fff;
  background: linear-gradient(135deg, #0072ff, #00c6ff);
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(0, 115, 255, 0.4);
}
/* === モバイル対応 === */
@media (max-width: 768px) {
  .hero-slide {
    flex-direction: column;
    height: auto;
    margin-top: 0;
  }

  .door,
  .door-center {
    width: 100%;
    height: auto;
  }

  .door-center .label {
    writing-mode: horizontal-tb;
    padding: 10px 0;
  }
  .door-left .blur-bg,
  .door-right .blur-bg {
    filter: blur(8px);
  }
  .door-panel {
    display: none; /* モバイルでは扉なし表示 */
  }
}

/*** pickUp ***/

.card05 {
  overflow: hidden;
}
.card05 .swiper {
  overflow: visible;
}
.card05 .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
}
.card05 .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.card05 .slide {
  overflow: hidden;
  width: 24rem;
  border-radius: 4px;
  -webkit-box-shadow: var(--box-shadow);
  box-shadow: var(--box-shadow);
}
.card05 .slide-media {
  padding-top: 62.5%;
}
.card05 .slide-media img {
  height: calc(100% + 16px);
  -webkit-transform: translateY(-16px);
  transform: translateY(-16px);
}
.card05 .slide-content {
  padding: 1.75rem;
}
.card05 .slide-title03 {
  font-size: 1.25rem;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: auto;
  margin-bottom: 1rem;
  letter-spacing: none;
}

.card05 .slide-date {
  font-size: 1.25rem;
  letter-spacing: none;
  line-height: 1;
  display: block;
  color: var(--primary);
}

@media only screen and (max-width: 1024px) {
  html {
    -webkit-text-size-adjust: 100%;
  }
  .l-inner {
    padding: 0 4rem;
  }
  .pc {
    display: none !important;
  }
  .mv01 {
    margin-bottom: 8rem;
  }
  .mv01 .slide-media {
    height: max(70vh, 70vw);
  }
}
@media only screen and (max-width: 599px) {
  html {
    font-size: 0.875rem;
  }
  .pc-tab {
    display: none !important;
  }
  .mv01 .slide-title {
    font-size: 1.25rem;
    top: 30%;
    left: 50%;
    -webkit-transform: translateY(-30%) translateX(-50%);
    transform: translateY(-30%) translateX(-50%);
    margin: auto;
  }
  .mv01 .slide-title02 {
    font-size: 1.25rem;
    top: 55%;
    left: 50%;
    -webkit-transform: translateY(-55%) translateX(-50%);
    transform: translateY(-55%) translateX(-50%);
    margin: auto;
  }
  .card05 .slide {
    width: 24rem;
  }
  .card05 .slide-title03 {
    font-size: 1.25rem;
    letter-spacing: none;
  }
  .card05 .slide-date {
    font-size: 1rem;
    letter-spacing: none;
  }
}
@media only screen and (min-width: 1025px) {
  .tab-sp {
    display: none !important;
  }
  .swiper-button-prev::before,
  .swiper-button-next::before {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .swiper-button-prev:hover::before,
  .swiper-button-next:hover::before {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  .card05 .slide {
    -webkit-transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
    transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
  }
  .card05 .slide img {
    -webkit-transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
    transition: 0.8s cubic-bezier(0.2, 1, 0.2, 1);
  }
  .card05 .slide:hover {
    -webkit-transform: translateY(-16px);
    transform: translateY(-16px);
    -webkit-box-shadow: var(--box-shadow-hover);
    box-shadow: var(--box-shadow-hover);
  }
  .card05 .slide:hover img {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  .card05 .swiper:hover .slide:not(:hover) {
    opacity: 0.5;
  }
}
@media only screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}
.usBox {
  max-width: 860px;
  width: 100%;
  height: 500px;
  margin: 0 auto;
}
@media (max-width: 992px) {
  .usBox {
    display: block;
    width: 98%;
    height: 500px;
    margin: 0 auto;
    margin-bottom: 80px;
  }
}

/*** About ***/
@media (min-width: 992px) {
  .container.about {
    max-width: 100% !important;
  }

  .about-text {
    padding-right: calc(((100% - 960px) / 2) + 0.75rem);
  }
}

@media (min-width: 1200px) {
  .about-text {
    padding-right: calc(((100% - 1140px) / 2) + 0.75rem);
  }
}

@media (min-width: 1400px) {
  .about-text {
    padding-right: calc(((100% - 1320px) / 2) + 0.75rem);
  }
}
.gallery {
  overflow: hidden;
}
.gallery .swiper,
.gallery .thumb-wrapper {
  max-width: 1024px;
  margin: auto;
}
.gallery .swiper {
  overflow: visible;
}
.gallery .swiper-fade .swiper-slide {
  -webkit-transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, transform !important;
  transition-property: opacity, transform, -webkit-transform !important;
  pointer-events: none;
}
.gallery .swiper-fade .swiper-slide-active {
  pointer-events: auto;
}
.gallery .swiper-controller {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 62.5%;
}
.gallery .swiper-button-prev,
.gallery .swiper-button-next {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  margin: auto;
}
.gallery .swiper-button-prev {
  right: calc(100% + 3.2rem);
}
.gallery .swiper-button-next {
  left: calc(100% + 3.2rem);
}
.gallery .slide {
  display: block;
  overflow: hidden;
}
.gallery .slide-media {
  display: block;
  padding-top: 62.5%;
  border-radius: 16px;
}
.gallery .slide-media img {
  -o-object-fit: contain;
  object-fit: contain;
}
.gallery .slide-title {
  font-weight: bold;
  line-height: 1.6;
  padding: 3.2rem 0;
}
.gallery .thumb-wrapper {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}
.gallery .thumb-media {
  padding-top: 100%;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  border-radius: 4px;
}
.gallery .thumb-media img {
  -webkit-transition: var(--transition);
  transition: var(--transition);
}
.gallery .thumb-media-active {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  opacity: 0.3;
}
.gallery .thumb-media-active img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
/****************/
/*     Home     */
/****************/
.home {
  background-color: #fff;
}
.para {
  width: 50%;
}
.para-light {
  opacity: 0.8 !important;
}
.para-dark {
  color: var(--dark);
  opacity: 1;
}
.para-white {
  color: #fff;
  opacity: 0.9;
}
.para-black {
  color: var(--primary);
  font-weight: 500;
}
.home .card-header {
  padding: 0.5rem 1rem;
  margin-bottom: 0;
  background-color: rgba(239, 237, 128, 0.3);
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.l-design {
  position: relative;
  color: white;
  width: 100%;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
  background-color: #00a4c5;
  border-radius: 1.5rem;
  font-size: 1.375rem;
  text-align: center;
}
.l-design:before {
  font-family: "Font Awesome 5 Free";
  content: "\f5d2";
  color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateX(-50%);
  transform: translateY(-50%);
}
.home h6 {
  padding: 0.5rem 1rem;
  color: #00a4c5;
  background-color: rgba(186, 227, 249, 0.6);
  border-radius: 100vh;
}
.home ul {
  padding-left: 30px;
}
.home li {
  list-style: disc;
}

/********************/
/*     Services     */
/********************/
.services .card {
  padding: 20px;
  border-radius: 0;
  color: #595757;
  border: 2px solid #eee;
}
.services .card:hover {
  border: 10px solid;
  transform: scale(1.01);
  border-image-slice: 1;
  border-width: 2px;
  border-image-source: var(--gradient);
  box-shadow: 5px 5px 0px 0px #0ee951;
}
/*****************/
/*     Plans     */
/*****************/
.plans .card {
  padding: 20px;
  border: none;
}
.plans .card .aka {
  color: var(--akairo) !important;
  font-size: 0.875rem;
}

.plan .card {
  padding: 20px;
  border: none;
}
.plan .card .aka {
  color: var(--akairo) !important;
  font-size: 0.875rem;
}
/************************/
/*     Testimonials     */
/************************/
.slider-1 {
  padding-top: 8.25rem;
  padding-bottom: 8.5rem;
}
.slider-1 .section-title {
  text-align: center;
}
.slider-1 .h2-heading {
  text-align: center;
  margin-bottom: 3rem;
}
.testimonial-card {
  position: relative;
  width: 250px;
  height: 250px;
  border: 2px solid var(--primary);
  margin: 0 auto;
}
/* 画像に対して指定する class */
.testimonial-card img {
  object-fit: cover;
  position: absolute;
  width: 100%;
  height: 100%;
}
.slider-1 .slider-container {
  position: relative;
}
.slider-1 .swiper-container {
  width: 86%;
  position: static;
}
.slider-1 .swiper-button-prev,
.slider-1 .swiper-button-next {
  color: var(--primary);
}
.slider-1 .swiper-button-prev:focus,
.slider-1 .swiper-button-next:focus {
  /* even if you can't see it chrome you can see it on mobile device */
  outline: none;
}
.slider-1 .swiper-button-prev {
  left: -14px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23707375'%2F%3E%3C%2Fsvg%3E");
  background-size: 18px 28px;
}
.slider-1 .swiper-button-next {
  right: -14px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23707375'%2F%3E%3C%2Fsvg%3E");
  background-size: 18px 28px;
}
.slider-1 .card {
  border: none;
  position: relative;
  background-color: transparent;
}
.slider-1 .card-image {
  width: 80px;
  height: 80px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
  margin-bottom: 1.25rem;
}
.slider-1 .card-body {
  padding: 0;
}
.slider-1 .testimonial-text {
  margin-bottom: 0.75rem;
}
.slider-1 .testimonial-author {
  margin-bottom: 0;
  color: #252c38;
}
.slider-1 .avatar {
  width: 70px;
  height: 70px;
  border-radius: 50%;
}
/* Dropdown Menu */
.navbar .dropdown .dropdown-menu {
  animation: fadeDropdown 0.2s; /* required for the fade animation */
}
@-webkit-keyframes fadeDropdown {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeDropdown {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/**********************/
/*     Newsletter     */
/**********************/
.form-control-input,
.form-control-textarea {
  width: 100%;
  appearance: none;
  border-radius: 4px;
  font-size: 0.875rem;
  line-height: 1.5rem;
  padding-left: 1.5rem;
  padding-top: 0.775rem;
  padding-bottom: 0.775rem;
}
/* -- contents-maker-2-area -- */

.contents-maker-2-area {
  width: 100%;
  margin: 0 auto;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

.border-news {
  border-bottom: #879e46 solid 1px;
}

@media screen and (max-width: 820px) {
  .contents-maker-2-area {
    width: 95%;
    display: block;
  }
}
.cm2-images {
  width: 300px;
  height: auto;
  margin: 0 auto;
  overflow: hidden;
}
.cm2-images img {
  cursor: zoom-in;
  transition-duration: 0.3s;
}

/******************************/
/*     Back To Top Button     */
/******************************/
#myBtn {
  z-index: 99;
  right: 24px;
  width: 48px;
  height: 48px;
  bottom: 24px;
  border: none;
  outline: none;
  display: none;
  position: fixed;
  cursor: pointer;
  border-radius: 50%;
  background-color: #1b721d;
}
#myBtn:hover {
  background-color: rgba(27, 114, 29, 0.5);
}
#myBtn img {
  width: 1.375rem;
  margin-left: 0.125rem;
  margin-bottom: 0.25rem;
}
/***********************/
/*     Extra Pages     */
/***********************/
.ex-header {
  margin-top: 0;
  padding-top: 2rem;
  padding-bottom: 2rem;
  padding-left: 1.5rem;
  background-color: var(--primary);
}
.ex-header-inews {
  margin-top: 0;
  padding-top: 2rem;
  padding-bottom: 2rem;
  padding-left: 1.5rem;
  background-color: rgba(236, 201, 18, 0.96);
}

.ex-header h1 {
  color: var(--white);
  font-size: 1.875rem;
}
.ex-header h3 {
  color: var(--white);
  font-size: 1.375rem;
}
.ex-header-inews h1 {
  color: #010000;
  font-size: 1.875rem;
}
.ex-header-inews h3 {
  color: #010000;
  font-size: 1rem;
}
.ex-basic-2 {
  background-color: #efed80;
}
.contactimag {
  background: url("../assets/images/013.jpg") no-repeat bottom center fixed #fff;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color: rgba(255, 255, 255, 0.75);
  background-blend-mode: lighten;
}

.profimg {
  background: url(../assets/images/profile.jpg) no-repeat 20% center scroll #fff;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color: rgba(255, 255, 255, 0.6);
  background-blend-mode: lighten;
}

.ex-basic-1 .list-unstyled .fas {
  font-size: 0.375rem;
  line-height: 1.625rem;
}
.ex-basic-1 hr {
  border: none;
  border-top: dotted 1px #00a5e3;
}
.ex-basic-1 .list-unstyled .flex-grow-1 {
  margin-left: 0.5rem;
}
.ex-basic-1 .text-box {
  padding: 1.25rem 1.25rem 0.5rem 1.25rem;
  background-color: #f7f9fd;
}
.ex-cards-1 .card {
  border: none;
  background-color: transparent;
}
.ex-cards-1 .card .fa-stack {
  width: 2em;
  font-size: 1.125rem;
}
.ex-cards-1 .card .fa-stack-2x {
  color: var(--secondary);
}
.ex-cards-1 .card .fa-stack-1x {
  width: 2em;
  color: #ffffff;
  font-weight: 700;
  line-height: 2.125rem;
}

.plans .fa-stack {
  width: 2em;
  font-size: 1rem;
}
.plans .fa-stack-2x {
  color: #00a4c5;
}
.plans .fa-stack-1x {
  width: 2em;
  color: #ffffff;
  font-weight: 600;
  line-height: 1.875rem;
}

.ex-cards-1 .card .list-unstyled .flex-grow-1 {
  margin-left: 2.25rem;
}
.ex-cards-1 .card .list-unstyled .flex-grow-1 h5 {
  margin-top: 0.125rem;
  margin-bottom: 0.5rem;
}

.plans .flex-grow-1 {
  margin-left: 1.875rem;
}
.plans .flex-grow-1 h5 {
  margin-top: 0.175rem;
  margin-bottom: 0.5rem;
}
/*---Responsive Styles ---*/
.-item {
  padding: 0 50px;
}
.tatebox {
  text-align: left;
  line-height: 1.8;
}
.vertical {
  display: inline-block;
  margin: 0;
  padding: 0;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-align: left;
  color: #333;
}
.vertical__part {
  text-orientation: upright;
}
/*************************/
/*     Media Queries     */
/*************************/
@media only screen and (max-width: 1024px) {
  .services,
  .work,
  .testimonial,
  .about,
  .contact,
  .plans {
    height: 100%;
    color: var(--dark);
  }
}
@media (min-width: 992px) {
  .slider-1 .swiper-container {
    width: 92%;
  }
  .slider-1 .swiper-button-prev {
    left: -16px;
    width: 22px;
    background-size: 22px 34px;
  }
  .slider-1 .swiper-button-next {
    right: -16px;
    width: 22px;
    background-size: 22px 34px;
  }
  /* Navigation */
  .navbar {
    box-shadow: none;
    transition: all 0.2s;
    padding-top: 1.75rem;
    background-color: #fff;
  }
  .navbar.top-nav-collapse {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: #fff;
    /*box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.025);*/
  }
  .offcanvas-collapse {
    position: static;
    top: auto;
    bottom: auto;
    left: auto;
    width: auto;
    padding-right: 0;
    padding-left: 0;
    background-color: #fff;
    overflow-y: visible;
    visibility: visible;
  }
  .offcanvas-collapse.open {
    transform: none;
  }
  .navbar .navbar-nav {
    margin-top: 0;
    margin-bottom: 0;
  }
  .navbar .nav-item .nav-link {
    padding-right: 0.75rem;
    padding-left: 0.75rem;
  }
  .navbar .dropdown-menu {
    padding-top: 0.75rem;
    padding-bottom: 0.875rem;
    box-shadow: 0 3px 3px 1px rgba(0, 0, 0, 0.08);
  }
  .navbar .dropdown-divider {
    width: 90%;
  }
  .navbar .social-icons {
    margin-left: 0.5rem;
  }
  .navbar .fa-stack {
    margin-right: 0;
    margin-left: 0.25rem;
  }
}

@media only screen and (max-width: 820px) {
  h1 {
    font-size: 30px;
  }
  .para {
    width: 100%;
  }
  .swiper-container {
    width: 92%;
  }
  .swiper-button-prev {
    left: -16px;
    width: 22px;
    background-size: 22px 34px;
  }
  .swiper-button-next {
    right: -16px;
    width: 22px;
    background-size: 22px 34px;
  }
  .instg::after {
    content: " Instgram";
  }

  /* #myBtn {
    right: 12px;
    width: 24px;
    height: 24px;
    bottom: 12px;
  }
  #myBtn img {
    width: 1.125rem;
    margin-left: 0.125rem;
    margin-bottom: 0.5rem;
  } */

  .-news {
    width: 85%;
    margin: auto;
  }
}
@media only screen and (max-width: 1024px) {
  .gallery .swiper-button-prev::before,
  .gallery .swiper-button-next::before {
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: var(--box-shadow-dark);
    box-shadow: var(--box-shadow-dark);
  }
  .gallery .swiper-button-prev::after,
  .gallery .swiper-button-next::after {
    border-color: #fff;
  }
  .gallery .swiper-button-prev {
    right: calc(100% - 3.2rem);
  }
  .gallery .swiper-button-next {
    left: calc(100% - 3.2rem);
  }
}
@media only screen and (max-width: 599px) {
  .gallery .thumb-wrapper {
    grid-template-columns: repeat(5, 1fr);
  }
}

@media (max-width: 768px) {
  .tatebox {
    text-align: left;
  }
  .vertical {
    width: 90%;
    margin: 30px 0px 0px 0px;
    padding-left: 0;
    padding-bottom: 30px;
    color: #333;
    -webkit-writing-mode: horizontal-tb;
    -ms-writing-mode: lr-tb;
    writing-mode: horizontal-tb;
  }
}
@media (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: var(--primary) !important;
  }
}