/* ==================================================
   base
   ================================================== */
.inner {
   max-width: 144rem;
   margin: 0 auto;
}

.main {
   padding: 6rem 0;
}

.main-page {
   padding: 6rem 0 6rem 0;
}

/* btn */
.btn__pry {
   display: inline-block;
   width: 40rem;
   padding: 3rem 0;
   text-align: center;
   border: 1px solid var(--main);
   background-color: #fff;
   color: #C55757;
   font-size: 2.2rem;
   font-weight: 700;
   letter-spacing: .44rem;
   box-shadow: .7rem .7rem 0 0 #FEF4F4;
   position: relative;
   padding-left: 2.6rem;
   transition: all 0.3s ease;
}

.btn__pry:hover,
.btn__pry:focus {
   background-color: #FEEEEE;
   color: #BE6767;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
   transform: translateY(2px);
}

.btn__pry::after {
   content: url(../images/arrow.svg);
   display: inline-block;
   margin-left: 2.6rem;
   vertical-align: middle;
   width: 1.5rem;
   height: auto;
}

.btn__pry--secondary {
   background-color: var(--main);
   color: var(--wh);
}

.btn__pry--secondary:hover,
.btn__pry--secondary:focus {
   background-color: var(--main);
   color: var(--wh);
}

.btn__pry--secondary::after {
   content: url(../images/arrow2.svg);
}

/* /btn */

.logo-upper {
   margin: 0;
   color: var(--main);
   font-size: 2.7rem;
   font-weight: 500;
   letter-spacing: .135rem;
}

.logo-lower {
   margin: 0;
   font-size: 1.6rem;
   text-align: right;
   color: #D0A8A8;
}

.title-container {
   display: flex;
   flex-direction: column;
   justify-content: center;
   text-align: center;
   margin-bottom: 8.4rem;
}

.sec-title {
   color: var(--main);
   text-align: center;
   font-size: 3.6rem;
   font-weight: 700;
   letter-spacing: .72rem;
}

.title-container .slash {
   content: '';
   display: block;
   width: 6rem;
   height: 0.1rem;
   background: var(--main);
   transform: rotate(-45deg);
   margin: 0 auto;
}

.sec-subtitle {
   color: var(--sub);
   font-size: 3rem;
   text-align: center;
}

.sec-headline {
   position: relative;
}

.sec-headline .sec-title {
   padding: 5.2rem 0;
   letter-spacing: .45rem;
}

.corner-right {
   position: absolute;
   top: 0;
   right: 0%;
   width: 17.5%;
   height: 0rem;
   background: transparent;
   border-top: 1px solid #B95D5D;
}

.corner-right::before {
   content: '';
   position: absolute;
   bottom: 0;
   right: 0;
   width: 30%;
   height: 1px;
   background: #B95D5D;
   transform: translateY(100%) rotate(-45deg);
   transform-origin: bottom right;
}

.corner-left {
   margin-left: 3%;
   position: absolute;
   bottom: 0;
   left: 0%;
   width: 17.5%;
   height: 0rem;
   background: transparent;
   border-bottom: 1px solid #B95D5D;
}

.corner-left::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 30%;
   height: 1px;
   background: #B95D5D;
   transform: rotate(-40deg);
   transform-origin: top left;
}

#backToTop {
   position: fixed;
   bottom: 2rem;
   right: 2rem;
   width: 10rem;
   height: 10rem;
   background-color: #BE6767BA;
   color: #fff;
   border: none;
   border-radius: 50%;
   cursor: pointer;
   font-size: 2.4rem;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 10;
}

/* ==================================================
   header
   ================================================== */
#headr {
   display: block;
   width: 100%;
   height: 12rem;
   background-color: var(--wh);
   border-bottom: 1px solid#ECDADA;
   z-index: 10;
}

.header__inner {
   position: relative;
   z-index: 11;
   display: flex;
   max-width: 144rem;
   margin: 0 auto;
   justify-content: space-between;
   align-items: center;
   height: 12rem;
}

#headr .logo {}

#headr .logo-upper {
   margin: 0;
   color: var(--main);
   font-size: 2.7rem;
   font-weight: 500;
   letter-spacing: .135rem;
}

#headr .logo-lower {
   margin: 0;
   font-size: 1.6rem;
   text-align: right;
   color: #D0A8A8;
}

.header__nav {
   margin-left: 3.8rem;
   margin-right: 3.4rem;
}

.header__nav .nav {
   display: flex;
   gap: 5rem;
   align-items: center;
   list-style: none;
}

.header__nav .nav li {
   color: var(--accent);
   font-size: 1.7rem;
   font-weight: 500;
   letter-spacing: .17rem;
}

.header__nav .nav a {
   position: relative;
   display: inline-block;
}

.header__nav .nav a::before {
   content: '';
   position: absolute;
   bottom: -1.3rem;
   left: 50%;
   width: 0;
   height: 3px;
   background-color: #BE6767;
   transition: all 0.3s ease;
   transform: translateX(-50%);
}

.header__nav .nav a:hover::before,
.header__nav .nav a:focus::before,
.header__nav .nav a[aria-current="page"]::before {
    width: 115%;
    left: -7.5%;
    transform: translateX(0%);
}

.header__info {
   display: flex;
   align-items: center;
   gap: 2rem;
}

.header__info .tel {
   display: flex;
   align-items: center;
}

.header__info .tel__icon {
   width: 2.7rem;
   height: 2.7rem;
   margin-right: .7rem;
}

.header__info .tel__number {
   color: var(--main);
   font-size: 2.8rem;
   font-weight: 300;
   font-family: 'Outfit', sans-serif;
}

#headr .cta-btn__container {
   background-color: var(--main);
   width: 20.1rem;
   line-height: 5.3rem;
   display: flex;
   justify-content: center;
   transition: all 0.3s ease;
}

#headr .cta-btn {
   display: flex;
   align-items: center;
   gap: 1.8rem;
   color: var(--wh);
   font-size: 1.7rem;
   font-weight: 700;
}

#headr .cta-btn__icon {
   width: 2.2rem;
   height: 2.2rem;
}

/* ==================================================
   footer
   ================================================== */

#footer {
   border-top: 1px solid #ECDADA;
   padding-top: 2.5rem;
   background-color: #fff;
}

.footer__inner {
   max-width: 137.2rem;
   margin: 0 auto;
}

.footer__column {
   display: flex;
   justify-content: space-between;
}

.footer__logo {
   margin-top: 1rem;
   display: inline-block;
   margin-bottom: 2.5rem;
}

#footer .addres {
   color: var(--accent);
   margin-bottom: 1.8rem;
}

#footer .addres p {
   margin: 0;
   font-size: 1.7rem;
   letter-spacing: .17rem;
}

#footer .info-column {
   display: flex;
   align-items: center;
   gap: 3rem;
}

#footer .info-column__tel,
#footer .info-column__fax {
   color: var(--accent);
   font-size: 1.7rem;
   letter-spacing: .17rem;
}

#footer .info-column__tel span,
#footer .info-column__fax span {
   font-family: 'Outfit', sans-serif;
   font-size: 2.4rem;
   letter-spacing: .24rem;
}

.footer__nav {
   margin-right: 4rem;
}

.footer__nav .nav {
   list-style: none;
   margin-bottom: 0;
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
   height: 23rem;
   gap: 1.4rem;
   column-gap: 4rem;
}

.footer__nav .nav li {
   color: var(--accent);
   font-size: 1.7rem;
   letter-spacing: .17rem;
   font-weight: 500;
}

#footer .nav li::before {
   content: url('../images/arrow3.svg');
   display: inline-block;
   margin-right: 1rem;
   vertical-align: middle;
   width: 2rem;
   height: auto;
}

.footer__copy {
   background-color: var(--bg);
   height: 5rem;
   display: flex;
   align-items: center;
   justify-content: center;
}

.footer__copy p {
   margin: 0;
   color: var(--main);
   font-size: 1.6rem;
   font-weight: 500;
   letter-spacing: .16rem;
}

/* ==================================================
   ハンバーガーメニュー
   ================================================== */
.no-scroll {
   overflow: hidden;
   height: 100%;
   width: 100%;
   position: fixed;
}

.menu__info {
   flex-direction: column;
   gap: 0;
}

.menu-content {
   display: flex;
   flex-direction: column;
   align-items: center;
   margin-top: 16rem;
}

.menu-nav ul {
   text-align: center;
}

.menu-nav ul li {
   margin: 1rem 0;
}

.menu-nav ul li a {
   font-size: 2rem;
   line-height: 3rem;
   padding: 1.2rem 0;
   display: block;
}

.menu-content .cta-btn__container {
   background-color: var(--main);
   width: auto;
   line-height: 5.3rem;
   display: flex;
   justify-content: center;
}

.menu-content .cta-btn {
   display: flex;
   align-items: center;
   gap: 1.8rem;
   color: var(--wh);
   font-size: 1.7rem;
   font-weight: 700;
}

.menu-content .cta-btn__icon {
   width: 3.2rem;
   height: 3.2rem;
}

.menu-content .tel {
   display: flex;
   align-items: center;
}

.menu-content .tel__icon {
   width: 2.7rem;
   height: 2.7rem;
   margin-right: 0.7rem;
}

.menu-content .tel__number{
   color: var(--main);
    font-size: 3.8rem;
    font-weight: 300;
    font-family: 'Outfit', sans-serif;
}

.menu-nav li a {
   display: block;
   padding: 1rem 0;
}

/* ==================================================
   パンくずリスト
   ================================================== */
/* Breadcrumb list styles */
.breadcrumb {
   margin: 1rem 0;
   background-color: var(--bg);
}

.breadcrumb__list {
   padding: 1.2rem 2rem;
   list-style: none;
   display: flex;
   margin: 0;
}

.breadcrumb__inner {
   max-width: 144rem;
   margin: 0 auto;
}

.breadcrumb-item {
   font-size: 1.4rem;
   color: var(--accent);
   letter-spacing: .28rem;
}

.breadcrumb-item+.breadcrumb-item::before {
   content: "＞";
   padding: 0 1.2rem;
   color: #6c757d;
}

.breadcrumb-item a {
   text-decoration: none;
}

.breadcrumb-item a:hover {
   text-decoration: underline;
}

/* ==================================================
   page　fv用
   ================================================== */
.fv-page {
   width: 100%;
   height: 55rem;
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
   overflow: visible;
   position: relative;
}

.fv-page .fv__content {
   position: absolute;
   bottom: -11rem;
   left: 12.5%;
   text-align: center;
}

.fv-page .fv__content .title {
   margin: 0;
   color: var(--main);
   font-size: min(5.1vw, 5.1rem);
   font-weight: 500;
   letter-spacing: 1.02rem;
   margin-bottom: 2rem;
}

.fv-page .fv__content .subtitle {
   margin: 0;
   color: #CD8383;
   font-size: 3.7rem;
   font-size: min(3.7vw, 3.7rem);
   padding-left: 18%;
}

.fv-page .fv__content .slash {
   position: absolute;
   top: 50%;
   left: 125%;
   transform: translateY(-50%) rotate(45deg);
   width: 1px;
   height: 27.2rem;
   background-color: #E0ACAC;
   z-index: 1;
}

/* ==================================================
   cta
   ================================================== */
.cta {
   padding: 8rem;
   background-color: var(--bg2);
}

.cta__title-container {
   margin-bottom: 2rem;
}

.cta__text {
   color: var(--accent);
   font-size: 1.7rem;
   line-height: 180%;
   letter-spacing: .17rem;
   text-align: center;
   margin: 0;
   margin-bottom: 2.8rem;
}

.cta__column {
   display: flex;
   justify-content: center;
   align-items: stretch;
   gap: 6rem;
}

.cta__column .info {
   background-color: var(--wh);
   padding: 2.1rem 1.7rem 1.3rem 1.7rem;
}

.cta__column .info__title {
   margin: 0;
   color: var(--main);
   font-size: 2.3rem;
   font-weight: 700;
   letter-spacing: .46rem;
   text-align: center;
}

.cta__column .info__number {
   text-align: center;
   font-size: 4.2rem;
   color: var(--accent);
   font-family: 'Outfit', sans-serif;
   letter-spacing: .42rem;
}

.info__number-icon {
   width: 4.6rem;
   margin-right: 1.3rem;
}

.cta__column .info__number2 {
   margin: 0;
   color: var(--accent);
   font-size: 1.6rem;
   font-weight: 500;
   letter-spacing: .16rem;
   text-align: right;
}

.cta__column .info__number2:last-child {
   margin-right: 1.2rem;
}

.cta__column .info__number2 span {
   margin-left: 1.7rem;
   font-weight: 400;
   font-size: 3rem;
   font-family: 'Outfit', sans-serif;
   letter-spacing: .3rem;
}

.cta__column .btn-container {
   max-width: 47rem;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   background-color: var(--main);
   padding: 0 5rem;
}

.cta__column .btn-container__icon {
   width: 6.1rem;
   margin-top: -2rem;
   margin-bottom: 2rem;
}

.cta__column .btn-container p {
   margin: 0;
   color: var(--wh);
   font-size: 2.5rem;
   font-weight: 700;
   letter-spacing: .5rem;
}


/* ==================================================
   新規ページ作成用
   ================================================== */
   .new-page{
      padding: 8rem 2rem;
   }


/* ==================================================
   404
   ================================================== */
   .error-404{
      text-align: center;
      padding: 18rem 2rem;
   }

   .error-btn__container{
      margin-top: 6rem;
   }