/*
Theme Name: Twenty Twenty-one Child
Version: 1.6
Template: twentytwentyone
*/

html {
    font-size: clamp(14px,  2vw, 18px); /*16px */
   scroll-behavior: smooth;
   height: 100%;
}

body {
   margin: 0;
   height: 100%;
   width: 100vw;
  overflow-x: hidden;
   background: linear-gradient(to right, #8FC8E2, #2E7EB9);
   color:#fff;
}
h1,
h2,
h3,
h4{
 margin: 0;
   font-size:1rem;
   font-weight: 600;
   letter-spacing: 0.23rem;
   font-family: "Noto Sans JP", sans-serif;
}

a {
   text-decoration: none;
   outline:none;
   letter-spacing: 0.2rem;
}
p,
a,
button{
   font-size:1rem;
   font-weight:bold;
   letter-spacing: 0.23rem;
   font-family: YakuHanJP,"Noto Sans JP", sans-serif;
   margin: 0;
}
span{
   font-weight:bold;
   letter-spacing: 0.23rem;
   font-family: YakuHanJP,"Noto Sans JP", sans-serif;
   margin: 0;
}
h3 span,
h4 span,
p span,
a span{
   display:inline-block;
}

ul {
 padding: 0;
}
li{
   list-style-type:none;
}

img,
picture,
iframe{
 vertical-align: top;
 width: 100%;
}

.flex {
 display: flex;
}

.boxouter {
 width: 90%;
 margin: 0 auto;
 max-width: 1200px;
}

.pc {
 display: block;
}
.sp {
 display: none;
}

/* :focus, :focus-visible - 削除 */
input[type=text]:focus,
input[type=submit]:focus, 
select:focus{
   outline: initial;
}
textarea:focus-visible{
   outline: initial;
}

/* 共通 */
/* AI査定バナー */
.AI-a{
   width: 80%;
   margin: 5% auto;
  max-width: 1000px;
   box-shadow: 10px 10px 20px #1F284B61;
   position: relative;
}
.AI-a a{
   transition: 0.2s;
}
.AI-a a:hover{
   opacity: 0.5;
}

.hiddenBox{
   overflow: hidden;
}


/* ヘッダー */
header{
   position: fixed;
   top: 0;
   width: 100%;
   z-index: 9999;
   background: linear-gradient(to right, #8FC8E2bd, #2e7eb9bd);
   padding: 1.5rem 1rem;
}

a.h1{
  display: block;
  width: 50%;
  min-width: 100px;
  max-width: 270px;
   z-index: 10;
}

.menu-btm__outer{
   position: fixed;
  bottom: 0;
   left: 0;
  width: 85%;
  background: url(./img/obi-BtoW.webp);
  background-position: top right;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 10;
}

.menu-btm{
   max-width:1500px;
   margin:0 auto;
}

.menu-btm ul {
   display: flex;
   justify-content: space-evenly;
   padding: 2rem 1rem 1.8rem;
}
.menu-btm ul li{
   line-height:1rem;
}
.menu-btm ul li a{
   color:#fff;
   transition: 0.2s;
}
.menu-btm ul li a:hover{
   opacity: 0.5;
}
.menu-btm ul .border{
   height:100%;
   width:0.08rem;
   background:#fff;
}
.menu-contact__outer{
   position: fixed;
   bottom: 1rem;
   right:0;
   width: 15%;
   z-index: 999;
}
.menu-contact__outer a{
   width: 80%;
   aspect-ratio: 1 / 1;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   gap: 0.5rem;
   margin: 0 auto;
   position: relative;
   background:
   linear-gradient(45deg,  transparent 10%, #fff 10%),
   linear-gradient(135deg, transparent 10%, #fff 10%),
   linear-gradient(225deg, transparent 10%, #fff 10%),
   linear-gradient(315deg, transparent 10%, #fff 10%);
 background-position: bottom left, top left, top right, bottom right;
 background-size: 55% 55%;
 background-repeat: no-repeat;
   transition: 0.2s;
}
.menu-contact__outer a:hover{
   opacity: 0.8;
}
.menu-contact__outer a span{
   color: #2E7EB9;
   display:block;
}
.menu-contact__outer a img{
   width:45%;
   max-width: 80px;
}


/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
 /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
 position: fixed;
 z-index: 999;
 /*ナビのスタート位置と形状*/
 top: 0;
 right: -33%;
 width: 9rem;
 height: 100vh;
 /*動き*/
 transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
 right: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
 /*ナビの数が増えた場合縦スクロール*/
 position: fixed;
 z-index: 999;
 width: 9rem;
 height: 100vh;
 /*表示する高さ*/
 overflow: auto;
 -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
 /*ナビゲーション天地中央揃え*/
 position: absolute;
 z-index: 999;
 top: 5rem;
 right:1rem;
}

/*リストのレイアウト設定*/
#g-nav li {
 list-style: none;
 text-align: right;
}

#g-nav li a {
 color: #fff;
 text-decoration: none;
 padding: 0.5rem 0px;
 display: block;
 text-transform: uppercase;
 letter-spacing: 0.1em;
 font-weight: bold;
   font-size: 0.75rem;
}

#g-nav li a:hover {
 color: #ffffff8D;
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
   position: fixed;
  z-index: 9999;
  top: 1.2rem;
  right: 1rem;
   cursor: pointer;
  width: 2.5rem;
  height: 2rem;
  text-align: center;
}
.openbtn p{
   font-size: 0.75rem;
   letter-spacing: 0.1rem;
}
/*×に変化*/
.openbtn span {
 display: inline-block;
 transition: all 0.2s;
 position: absolute;
 left: 0;
 height: 1px;
 background-color: #fff;
 width: 100%;
}

.openbtn span:nth-of-type(1) {
   top: 1.4rem;
}

.openbtn span:nth-of-type(2) {
 top: 1.6rem;
}

/* .openbtn.active span:nth-of-type(1) {
   top: 1.7rem;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
  width: 50%;
}

.openbtn.active span:nth-of-type(2) {
   top: 1.7rem;
  left: 50%;
 transform: translateX(-50%) rotate(45deg);
 width: 50%;
} */

/* ファーストビュー */
.top{
   width:100%;
   height:100vh;
   overflow:hidden;
}
.top__img{
   position: relative;
  right: -20%;
   height: 95vh;
   transform: skew(20deg, 0deg);
   -webkit-transform-origin: 100% 0;
   transform-origin: 100% 0;
   overflow:hidden;
}
.top__imgbg{
   height: 100%;
  background: url(./img/top__img.webp);
  transform: skew(-20deg, 0deg);
  transform-origin: 100% 0;
   background-position: left;
  background-size: cover;
  background-repeat: no-repeat;
}
.top__scroll{
   position: absolute;
   bottom: 0;
   left: 1rem;
   z-index: 5;
}
.top__scroll span{
   font-size: 1rem;
   font-family: "Montserrat", sans-serif;
   writing-mode: vertical-rl;
}
.top__scroll > div{
   position:relative;
   overflow: hidden;
}
.top__scroll-kaku{
   width: 0;
   height: 100%;
   position:absolute;
   left:50%;
   transform:translate(-50%,0%);
   border-style: solid;
   border-width: 0.5rem 0.4rem 0 0.4rem;
   border-color: #fff transparent transparent transparent;
   animation-name: scrollAnime;
   animation-duration:3s;
   animation-iteration-count:infinite;
   animation-fill-mode:forwards;
   transition-timing-function: ease-in-out;
}
@keyframes scrollAnime{
   0% {
       top:30%;
   }
   5% {
       opacity:1;
   }
   50% {
       opacity:0;
       top:100%;
   }
   50.1% {
       top:-5%;
   }
   100% {
       opacity:1;
       top:30%;
   }
}
.top__scroll-line{
   height: 20vh;
   width: 0.07rem;
   margin: 0 auto;
   background: #fff;
}

/* home ファーストビュー */
.top__txt{
   position: absolute;
   top: 50%;
   left: 10%;
   transform: translate(0%, -50%);
}
.top__txt p:nth-of-type(1){
   font-family: "Montserrat", sans-serif;
   font-size: 5rem;
   font-weight: 400;
   letter-spacing: 1rem;
   line-height: 150%;
   margin-bottom: 1.5rem;
}
.top__txt p:nth-of-type(2){
   font-size:1.071rem;
   line-height: 300%;
}
.top__deco-right{
   position: absolute;
   top: 20%;
   right: 15vw;
   transform: translate(100%,-50%);
}
.deco1{
   position: relative;
   width: 10vw;
   height: 3rem;
   background: #C1E8ED;
   margin: 0 0 0 auto;
}
.deco1:before{
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   left:-0.5rem;
   border-top: solid 0.5rem transparent;
   border-right: solid 0.5rem #C1E8ED;
}
.deco2{
   position: relative;
   width: 15vw;
   height: 3rem;
   background:linear-gradient(to right, #258BB9, #94C2D6);
}
.deco2:before{
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   left:-0.5rem;
   border-top: solid 0.5rem transparent;
   border-right: solid 0.5rem #258BB9;
}
.top__deco-left{
   position: absolute;
   z-index: -1;
   bottom: 10%;
   left: 0;
   transform: translate(0%,-50%);
}
.top__deco-left .deco1{
   margin: 0;
}
.top__deco-left .deco1:after{
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right:-0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #C1E8ED;
}
.top__deco-left .deco2{
   background: linear-gradient(to right,  #94C2D6, #258BB9);
}
.top__deco-left .deco2:after{
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right:-0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}

/* home 稼働率 */
.kadou{
   margin: 5% auto 0%;
}
.kadou__main{
   display:flex;
   align-items: center;
   background:#000;
   padding:2rem;
   position: relative;
   background: #2E7EB9;
   max-height: 15rem;
}
.kadou__main div:nth-of-type(1){
   font-size: 1.286rem;
   background: #fff;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 20%;
   height:100%;
   max-width: 10rem;
   max-height: 10rem;
   aspect-ratio: 1 / 1;
}
.kadou__main div:nth-of-type(1) span{
   color: #2E7EB9;
}
.kadou div:nth-of-type(2){
   flex-grow: 1;
   display: flex;
   justify-content: center;
}
.kadou__main div:nth-of-type(2) > span{
   display: block;
   font-family: "Montserrat", sans-serif;
   font-size: 8.786rem;
   font-weight:400;
   line-height: 8rem;
   margin-bottom: -3rem;
   margin-right: 4rem;
}
.kadou__main div:nth-of-type(2) > span .size-s{
   font-family: "Montserrat", sans-serif;
   font-weight:400;
   font-size:4.857rem;
}
.kadou__main:before,
.kadou__main:after{
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
}
.kadou__main:before{
   border-bottom: solid 2rem transparent;
   border-top: solid 2rem transparent;
   border-right: solid 2rem #2E7EB9;
   left: -2rem;
}
.kadou__main:after{
   border-top: solid 2rem transparent;
   border-left: solid 2rem #2E7EB9;
   border-bottom: solid 2rem transparent;
   right: -2rem;
}
.kadou__day{
   color:#8FC8E2;
   text-align:right;
   margin: 1rem -2rem 1rem 1rem;
}
/* h2タグ*/
.h2-con{
   display:flex;
   align-items: end;
   gap:1rem;
}
h2{
   display: inline;
   font-family: "Montserrat", sans-serif;
   font-weight: 400;
  font-size: 4rem;
  letter-spacing: 0.4rem;
   color: #62A7C6;
   line-height: 100%;
}
.h2-sub{
   font-size: 1.2rem;
    color: #62A7C6;
}
/* home お知らせ*/
.news-box{
position:relative;
}
.news__img{
   margin-top: -30%;
}
.news__img img{
   object-fit: cover;
   height: 100%;
}
.news__outer{
   margin: 5% auto 10% 0;
   background: #fff;
   width: 80%;
   padding: 2rem 4rem;
   position:relative;
   z-index:1;
   filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
}
.news__outer:after {
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   border-top: solid 2rem transparent;
   border-left: solid 2rem #fff;
   border-bottom: solid 2rem transparent;
   right: -2rem;
}
.news{
   color: #62A7C6;
   max-width: 1000px;
   margin: 10% auto 15%;
}
.news__con{
   margin:1.5rem 0;
}
.news a p{
   display:inline-block;
   font-size:1rem;
   color: #62A7C6;
}
.news .new{
   position: relative;
   z-index: 1;
   text-align: center;
   width: 100px;
   margin-right: 0.5rem;
   color: #fff;
}
.news .new::before{
   content: "";
   position: absolute;
   top: 50%;
   left: 48%;
   transform: translate(-50%,-50%) skewX(30deg);
   z-index: -1;
   background-color: #62A7C6;
   height: 1.5rem;
   width: 65%;
}
.news__deco{
   position: absolute;
   top: 65%;
   right: 0;
   color:#fff;
   z-index:2;
   transition: 0.2s;
}
.news__deco:hover{
   opacity: 0.5;
}
.news__deco .deco1{
   width: 50vw;
   height: 5rem;
   background: #2E7EB9;
}
.news__deco .deco1:before{
   left: -1rem;
   border-top: solid 1rem transparent;
   border-right: solid 1rem #2E7EB9;
}
.news__deco .deco__box{
   position: relative;
   top: 50%;
}
.news__deco .top__scroll-line{
   height: 0.07rem;
   width: calc(45vw - 5rem);
   margin: 0.7rem 0 auto auto;
   position:relative;
}
.news__deco .top__scroll-line:before{
   content: '一覧へ';
   position: absolute;
   top: 0;
   transform: translateY(-40%);
   left: -5rem;
}
.news__deco .top__scroll-kaku{
   width: 0%;
   height: 0%;
   border-width: 0.4rem 0 0.4rem 0.5rem;
   border-color: transparent transparent transparent #fff;
   animation-name: NEWSscrollAnime;
   top: -0.35rem;
}
@keyframes NEWSscrollAnime{
   0% {
       left:50%;
   }
   5% {
       opacity:1;
   }
   50% {
       opacity:0;
       left:95%;
   }
   50.1% {
       left:30%;
   }
   100% {
       opacity:1;
       left:50%;
   }
}

/* home PM事業部とは*/
.services__box{
   position:relative;
}
.services__outer{
   margin: 10rem auto;
   background: #fff;
   width: 70%;
   max-width: 1500px;
   padding: 2rem 4rem;
   position: relative;
   color: #62A7C6;
}
.services{
   margin: 8% auto;
/* 	width: 80%;
   max-width: 1200px; */
}
.services:before,
.services:after{
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   border-top: solid 2rem transparent;
   border-bottom: solid 2rem transparent;
}
.services:after{
   border-left: solid 2rem #fff;
   right: -2rem;
}
.services:before{
   border-right: solid 2rem #fff;
   left: -2rem;
}
.services .txt{
   font-size: 1.071rem;
   line-height: 2.3rem;
   margin-top: 2rem;
}
.services__sannkau{
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 1.8rem 1rem 0 1rem;
   border-color: #62A7C6 transparent transparent transparent;
   margin: 7% auto;
}

.services .flow-ttl{
   font-size:1.125rem;
   text-align:center;
}
.flow-flex{
   margin:2rem auto 0;
   display:flex;
   align-items: center;
}
.flow-flex .txtBox{
   width: 100%;
}
.flow-flex .txtBox p{
  line-height: 2.3rem;
}
.flow-flex .imgBox{
   width: 100%;
}
.flow-flex .imgBox p{
   font-size: 1.143rem;
   text-align: center;
   margin-top: 1rem;
}

.services__deco-right{
   position: absolute;
   top: -15%;
   right: 0;
}
.services__deco-right .deco1:nth-of-type(1){
   width: 15vw;
}
.services__deco-right .deco2{
   width: 20vw;
   margin-bottom:40%;
}
.services__deco-left{
   position: absolute;
   bottom: -30%;
   left: 0;
}
.services__deco-left .deco1{
   margin:0;
   width: 20vw;
}
.services__deco-left .deco1:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #C1E8ED;
}
.services__deco-left .deco2:nth-of-type(1){
   width:3vw;
   background: #2E7EB9;
   margin-bottom: 50%;
}
.services__deco-left .deco2:nth-of-type(1):after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #2E7EB9;
}
.services__deco-left .deco2{
   width:25vw;
   background: linear-gradient(to right, #94C2D6, #258BB9);
}
.services__deco-left .deco2:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}

.servicesBtn{
   margin: 10% auto;
   background: #2E7EB9;
  width: 70%;
  max-width: 1500px;
  position: relative;
   transition: 0.2s;
}
.servicesBtn:hover{
   opacity: 0.5;
}
.servicesBtn:before,
.servicesBtn:after{
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   border-top: solid 2rem transparent;
   border-bottom: solid 2rem transparent;
}
.servicesBtn:before{
   border-right: solid 2rem #2E7EB9;
   left: -2rem;
}
.servicesBtn:after{
   border-left: solid 2rem #2E7EB9;
  right: -2rem;
}
.servicesBtn a{
   display: flex;
   align-items: center;
   color: #fff;
   padding: 3rem 0;
}
.servicesBtn a p:nth-of-type(1){
   width: 100%;
   text-align: center;
   font-size: 1.125rem;
}
.servicesBtn a p:nth-of-type(2){
   white-space: nowrap;
   font-size: 1rem;
}


/* home オーナー様向けトピックス1*/
.topics1{
   position:relative;
}
.topics1 .top__img{
   left: -1%;
   height: 80vh;
   width: 80%;
   transform-origin: 0 100%;
}
.topics1 .top__img .top__imgbg{
   background-image: url(./img/topics1__img.webp);
   background-repeat:no-repeat;
   transform: skew(-20deg, 0deg);
   transform-origin: 0 100%;
}
.topics1__txt-box{
   position: absolute;
   top: 0;
   right: 0;
   width: 100%;
}
.topics1__txt-outer{
   margin: 0 0 0 auto;
  background: #fff;
  width: 80%;
   max-width: 1500px;
  padding: 2rem 4rem;
  position: relative;
   transform: translatey(-50%);
  z-index: 1;
  filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
}
.topics1__txt-outer:before {
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   border-top: solid 2rem transparent;
   border-right: solid 2rem #fff;
   border-bottom: solid 2rem transparent;
   left: -2rem;
}
.topics1__txt{
   color: #131C39;
  max-width: 1000px;
  margin: 5rem auto 2rem;
}
.topics1__txt > p{
   font-size: 1.071rem;
   line-height: 2.3rem;
   color: #62A7C6;
   margin-top: 2rem;
}
.topics1__sannkaku{
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 1.8rem 1rem 0 1rem;
   border-color: #62A7C6 transparent transparent transparent;
   margin: 4rem auto 1rem;
}

.topics1__a-box{
   display:flex;
   justify-content: center;
  gap: 2%;
   margin-top: -3vh;
}
.topics1__a{
   width: 100%;
   height: 55vh;
  min-height: 400px;
   background-color: #fff;
   text-align: center;
   position: relative;
   overflow: hidden;
   transition: 0.2s;
   box-shadow: 10px 10px 20px #1F284B61;
}
.topics1__a:hover{
   background-color: #E5EFF5;
   transform: scale(1.05);
}
.topics1__a .nmb{
   position: absolute;
  top: 5%;
  left: -5%;
  font-family: "Montserrat", sans-serif;
  font-size: 8rem;
  font-weight: 400;
  color: #62A7C6;
  opacity: 0.1;
  line-height: 100%;
}
.topics1__a .txt{
   position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
   color: #62A7C6;
   font-size: 1.071rem;
}
.topics1__a .more{
   position: absolute;
  bottom: 5%;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   color: #62A7C6;
   font-size: 1rem;
}

/* home オーナー様向けトピックス2*/
.topics2__box{
   position:relative;
}
.topics2__outer{
   margin: calc(10rem + 10%) auto 0;
  background: #8FC8E2;
  width: 100%;
   position: relative;
}
.topics2{
   padding: 2rem 0;
  display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 3%;
}
.topics2__txtBox{
   width: 100%;
   max-width: 550px;
}
.topics2__txtBox .h2-con{
   flex-direction: column;
  align-items: baseline;
   gap: 2rem;
}
.topics2__txtBox .h2-con h2,
.topics2__txtBox .h2-con .h2-sub{
   color: #fff;
}
.topics2__txtBox p{
   margin-top: 1.5rem;
   font-size: 1.071rem;
  line-height: 2.3rem;
}
.topics2__deco{
   color:#fff;
   transition: 0.2s;
}
.topics2__deco:hover{
   opacity: 0.5;
}
.topics2__deco .deco1{
   margin: 3rem auto 0 0;
  width: calc(100% - 1rem);
   height: 5rem;
   background: #509DC8;
}
.topics2__deco .deco1:before{
   right: -1rem;
   left: auto;
  border-top: solid 1rem transparent;
   border-right: initial;
  border-left: solid 1rem #509DC8;
}
.topics2__deco .deco__box{
   position: relative;
  top: 50%;
   width: 80%;
   margin: 0 auto;
}
.topics2__deco .top__scroll-line{
   height: 0.07rem;
   width: calc(100% - 10rem);
   margin: 0.7rem 0 auto auto;
   position:relative;
}
.topics2__deco .top__scroll-line:before{
   content: '物件検索はこちら';
   position: absolute;
   top: 0;
   transform: translateY(-40%);
   left: -10rem;
   line-height: 100%;
}
.topics2__deco .top__scroll-kaku{
   width: 0%;
   height: 0%;
   border-width: 0.4rem 0 0.4rem 0.5rem;
   border-color: transparent transparent transparent #fff;
   animation-name: NEWSscrollAnime;
  top: -0.35rem;
}
.topics2__imgBox{
   width: 100%;
   max-width: 500px;
}
.topics2__imgBox .img{
   transform: translatey(-40%);
   filter: drop-shadow(10px 10px 20px #1F284B61);
}

.topics2__deco-right{
   position: absolute;
   top: -145%;
   right: 0;
}
.topics2__deco-right .deco2{
   width: 20vw;
   margin-bottom:40%;
}
.topics2__deco-left{
   position: absolute;
   bottom: -160%;
   left: 0;
}
.topics2__deco-left .deco1{
   margin:0;
   width: 20vw;
}
.topics2__deco-left .deco1:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #C1E8ED;
}
.topics2__deco-left .deco2{
   width:25vw;
   background: linear-gradient(to right, #94C2D6, #258BB9);
}
.topics2__deco-left .deco2:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}

/* home オーナー様向けトピックス3*/
.topics3__box{
   position:relative;
   margin: 15% 0 5%;
}
.topics3__outer{
   width: 80%;
  background: #fff;
  padding: 2rem 4rem;
  position: relative;
   z-index: 1;
   margin-bottom: -30%;
   color: #62A7C6;
}
.topics3{
   margin: 8% auto;
   display: flex;
   gap: 7%;
}
.topics3:before,
.topics3:after{
   width: 0;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   border-top: solid 2rem transparent;
   border-bottom: solid 2rem transparent;
}
.topics3:after{
   border-left: solid 2rem #fff;
   right: -2rem;
}
.topics3:before{
   border-right: solid 2rem #fff;
   left: -2rem;
}

.topics3__aBox{
   width: 100%;
   display: flex;
  flex-direction: column;
   gap: 4%;
}
.topics3__aBox a{
   background-color: #62A7C6;
  display: flex;
  justify-content: space-between;
   align-items: center;
  padding: 1rem 1.5rem;
  flex-grow: 1;
   transition: 0.2s;
}
.topics3__aBox a:hover{
   opacity: 0.5;
}
.topics3__aBox a p{
   color: #fff;
}
.topics3__aBox a p.ttl{
   font-size: 1.125rem;
}
.topics3__aBox a p.more{
   font-family: "Montserrat", sans-serif;
  font-weight: 500;
  font-size: 1rem;
}

.topics3__txtBox{
   width: 100%;
   padding: 7% 0;
}
.topics3__txtBox .h2-con{
   flex-direction: column;
  align-items: baseline;
   gap: 2rem;
}
.topics3__txtBox > p{
   margin-top: 2.5rem;
  font-size: 1.071rem;
  line-height: 2.3rem;
}

.topics3__box .top__img{
  height: 80vh;
  width: 80%;
  transform-origin: 0 100%;
  transform: skew(-20deg, 0deg);
}
.topics3__box .top__img .top__imgbg{
   background-image: url(./img/topics3__img.webp);
   background-repeat:no-repeat;
   transform: skew(20deg, 0deg);
   transform-origin: 0 100%;
}

.topics3__deco-left{
   position: absolute;
   bottom: -150%;
   left: 0;
}
.topics3__deco-left .deco1{
  margin: 0;
  width: 10vw;
  background: #2E7EB9;
}
.topics3__deco-left .deco1:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #2E7EB9;
}
.topics3__deco-left .deco2{
   width:25vw;
   background: linear-gradient(to right, #94C2D6, #258BB9);
   margin-top: 15%;
}
.topics3__deco-left .deco2:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}

/* 他ページ-共通 */
/* 他ページ-共通_h2 */
.h2Box{
   margin: 10% auto 5%;
}
.h2Box h2{
   font-family: "Montserrat", sans-serif;
   color: #fff;
   font-size: 3.125rem;
}
.h2Box h2 span.sub{
   color: #fff;
   font-size: 1.125rem;
}

/* 他ページ-共通_ページネーション-初期化 */
.page-nav .navigation{
   margin: 0;
   border: initial;
  padding: 0;
}
.page-nav .navigation .nav-links *{
   margin: 0;
   font-size: 0.75rem;
   color: #fff;
   min-width: initial;
   min-height: initial;
}
/* 他ページ-共通_ページネーション */
.page-nav{
   padding: 5% 0;
}
.page-nav .navigation .nav-links .page-numbers{
   padding:5px 12px 5px calc(12px +  0.2rem);
   margin: 0 5px;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
}
.page-nav .navigation .nav-links .page-numbers:hover{
   color: #fff;
   text-decoration: none;
}
.page-nav .nav-links .current{
   background:#8FC8E2;
   text-decoration: none;
}

/*  他ページ-お知らせ */
.page-news .news__con{
   margin:1.5rem 0;
   padding-bottom: 1.5rem;
   border-bottom: 1px solid #fff;
}
.page-news .news__con:nth-last-of-type(2){
   border-bottom: initial;
   padding: 0;
}
.page-news .news__con a p{
   display:inline-block;
   font-size: 0.75rem;
   color: #fff;
}
.page-news .news__con .new{
   position: relative;
   z-index: 1;
   text-align: center;
   width: 100px;
   margin-right: 0.5rem;
   color: #62A7C6;
}
.page-news .news__con .new::before{
   content: "";
   position: absolute;
   top: 50%;
   left: 48%;
   transform: translate(-50%,-50%) skewX(30deg);
   z-index: -1;
   background-color: #fff;
   height: 1.5rem;
   width: 65%;
}
/*  他ページ-お知らせ-詳細 */
.single-news{
   margin: 5% auto;
}
.single-news h3{
   font-size: 1.125rem;
}
.single-news .content{
   margin: 5% 0;
}
.single-news .content p{
   font-size: 1rem;
}
.single-news .backbtn{
   color: #fff;
   font-size: 1rem;
   transition: 0.2s;
}
.single-news .backbtn:hover{
   opacity: 0.5;
}

/*  他ページ-貸したい*/
.page-lend .aBox{
   gap: 2%;
}
.page-lend .aBox a{
   position: relative;
   background: linear-gradient(90deg, #1E77B9, #9CD5EF);
   color: #fff;
   width: calc(100% - 0.5rem);
   text-align: center;
  padding: 1.75rem 0 1.75rem 0.5rem;
   font-size: 1rem;
   letter-spacing: min(0.2rem, 3px);
   transition:0.2s;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
}
.page-lend .aBox a:hover{
   opacity: 0.25;
}
.page-lend .aBox a span{
   font-size: 1rem;
   letter-spacing: min(0.2rem, 3px);
}
.page-lend .aBox a:before {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -1rem;
   left: auto;
   border-top: solid 1rem transparent;
   border-right: initial;
   border-left: solid 1rem #9CD5EF;
}

.page-lend .Con{
   margin: calc(10% + 2rem) auto;
   position: relative;
}
.page-lend .Con .Con-mainOuter{
   background: #fff;
   position: relative;
}
.page-lend .Con .Con-mainOuter:before {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-bottom: solid 2rem #fff;
  top: -2rem;
}
.page-lend .Con .Con-mainOuter:after {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-top: solid 2rem #fff;
  bottom: -2rem;
}
.page-lend .Con .Con-mainOuter .Con-mainHidden{
   position: relative;
  overflow: hidden;
   z-index: 1;
}
.page-lend .Con .Con-mainOuter .Con-main{
   color: #62A7C6;
   width:80%;
   max-width: 1000px;
   margin:0 auto;
   padding: 10% 0;
}
.page-lend .Con .Con-mainOuter .Con-main h3{
   font-size: 1.125rem;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex{
   margin: 5% 0;
   gap: 3%;
   align-items: center;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex .txtBox{
   width: 100%;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex .txtBox h4{
   position: relative;
  z-index: 1;
  text-align: center;
  color: #fff;
   font-size: 1rem;
   margin-bottom: 1.2rem;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex .txtBox h4::before {
   content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%) skewX(30deg);
  z-index: -1;
  background-color: #62A7C6;
  height: 1.5rem;
  width: 95%;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex .txtBox p{
   font-size: 1.071rem;
   line-height: 200%;
}
.page-lend .Con .Con-mainOuter .Con-main >.flex .imgBox{
   width: 100%;
}
.page-lend .Con .Con-mainOuter .Con-main .nmb {
   position: absolute;
   font-family: "Montserrat", sans-serif;
   font-size: 15rem;
   font-weight: 400;
   color: #62A7C6;
   opacity: 0.1;
   line-height: 100%;
       z-index: -1;
}
.page-lend .Con .Con-mainOuter .Con-main .nmb.nmb1 {
   top: 5%;
   left: -5%;
}
.page-lend .Con .Con-mainOuter .Con-main .nmb.nmb2 {
   bottom: 25%;
   right: -2%;
}

.page-lend .Con .Con__deco-right{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.page-lend .Con .Con__deco-right .deco1:nth-of-type(1){
   width: 8vw;
}
.page-lend .Con .Con__deco-right .deco1:nth-of-type(3){
   width: 4vw;
}
.page-lend .Con .Con__deco-right .deco2{
   width: 12vw;
   margin-bottom:40%;
}
.page-lend .Con .Con__deco-left{
   position: absolute;
  bottom: 0%;
  left: 0;
   z-index: 1;
}
.page-lend .Con .Con__deco-left .deco1{
   margin:0;
   width: 8vw;
}
.page-lend .Con .Con__deco-left .deco1:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #C1E8ED;
}
.page-lend .Con .Con__deco-left .deco2:nth-of-type(1){
   width:3vw;
   background: #2E7EB9;
   margin-bottom: 50%;
}
.page-lend .Con .Con__deco-left .deco2:nth-of-type(1):after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #2E7EB9;
}
.page-lend .Con .Con__deco-left .deco2{
   width:12vw;
   background: linear-gradient(to right, #94C2D6, #258BB9);
}
.page-lend .Con .Con__deco-left .deco2:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}


.page-lend .Con2 .bg{
   position: absolute;
   bottom: -5%;
   z-index: -1;
}
.page-lend .Con2 .Con-mainOuter{
   background: #E5EFF5;
}
.page-lend .Con2 .Con-mainOuter:before {
  border-bottom: solid 2rem #E5EFF5;
}
.page-lend .Con2 .Con-mainOuter:after {
  border-top: solid 2rem #E5EFF5;
}
.page-lend .Con2 .Con-mainOuter .Con-main .txt{
   font-size: 1.071rem;
  margin-top: 3%;
  line-height: 200%;
}
.page-lend .Con2 .Con-mainOuter .Con-main .nmb.nmb2{
   bottom: 5%;
}

.page-lend .Con3 .Con-mainOuter .Con-main .txtBox,
.page-lend .Con4 .Con-mainOuter .Con-main .txtBox{
   align-items: flex-start;
  gap: 1rem;
   margin: 3% 0 0 0;
}
.page-lend .Con3 .Con-mainOuter .Con-main .txtBox .txt,
.page-lend .Con4 .Con-mainOuter .Con-main .txtBox .txt{
   font-size: 1.071rem;
  line-height: 200%;
   width: 100%;
}
.page-lend .Con3 .Con-mainOuter .Con-main .txtBox .img,
.page-lend .Con4 .Con-mainOuter .Con-main .txtBox .img{
  width: 50%;
   margin-top: 0.4rem;
}

.page-lend .Con3 .Con__deco-left{
   bottom: initial;
  top: 0;
}
.page-lend .Con3 .Con__deco-right{
  top: initial;
}

.page-lend .Con4 .Con-mainOuter{
   background: #E5EFF5;
}
.page-lend .Con4 .Con-mainOuter:before {
  border-bottom: solid 2rem #E5EFF5;
}
.page-lend .Con4 .Con-mainOuter:after {
  border-top: solid 2rem #E5EFF5;
}
.page-lend .Con3 .Con__deco-left{
   bottom: initial;
  top: 0;
}


/*  他ページ-借りたい , search.php*/
.page-borrow .formCon{
   margin-bottom: calc(2rem + 3%);
   max-width: 1000px;
}
.page-borrow .ac .ac-li{
   list-style: none;
   transition: 0.2s;
   background-color: #fff;
   color: #62A7C6;
}
.page-borrow .ac .ac-li .ac-label{
   cursor: pointer;
   position: relative;
   padding: 1.5rem;
}
.page-borrow .ac .ac-li .ac-label .pFlex{
   display: flex;
   justify-content: center;
}
.page-borrow .ac .ac-li .ac-label .pFlex .pBox{
   display: flex;
   align-items: center;
   padding: 0 5%;
}
.page-borrow .ac .ac-li .ac-label .pFlex .pBox:nth-of-type(3){
   padding-right: 10%;
}
.page-borrow .ac .ac-li .ac-label .pFlex .pBox p{
   font-size: 1rem;
   line-height: 150%;
}
.page-borrow .ac .ac-li .ac-label .pFlex .pBox p.Q{
   font-size: 1rem;
   line-height: 100%;
   width: 100%;
}
.page-borrow .ac .ac-li .ac-label .pFlex .line{
   border-right: 2px solid #8FC8E2;
}
.page-borrow .ac .ac-li .ac-label .icon-wrap{
   position: absolute;
   right: calc(5px + 2rem);
   top: 50%;
   transform: translatey(-50%);
   width: 38px;
   height: 38px;
}
.page-borrow .ac .ac-li .ac-label .icon-wrap .icon{
   position: relative;
   display: inline-block;
   width: 100%;
   height: 100%;
}
.page-borrow .ac .ac-li .ac-label .icon-wrap .icon::after,
.page-borrow .ac .ac-li .ac-label .icon-wrap .icon::before{
   position: absolute;
   content: "";
   display: block;
   transition: all 0.4s;
   background: #62A7C6;
   left: 50%;
   top: 50%;
   width: 50%;
   height: 2px;
   transform: translate(-50%, -50%);
}
.page-borrow .ac .ac-li.open .ac-label .icon-wrap .icon::before{
   transform: translate(-50%, -50%) rotate(90deg);
}
/* open */
.page-borrow .ac .ac-li.open:before {
   border-bottom: solid 2rem #E5EFF5;
}
.page-borrow .ac .ac-li.open .ac-label .pFlex .line{
   border-right: 2px solid #62A7C6;
}
.page-borrow .ac .ac-li.open .ac-label .icon:before{
   transform: translate(-50%, -50%) rotate(0deg);
}

.page-borrow .ac .ac-li .ac-content{
   display: none;
   position: relative;
   border-top: 0.2rem solid;
   padding: 1.5rem 0;
}
.page-borrow .ac .ac-li .ac-content:before {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
   content: "";
  border-left: solid 2rem transparent;
   border-right: solid 2rem transparent;
  border-top: solid 2rem #fff;
   bottom: -2rem;
   transition: 0.2s;
}
.page-borrow .ac .ac-li .ac-content .boxouter form .flexBox{
   display: flex;
   justify-content: space-between;
  align-items: center;
   border-bottom: 2px solid #EFEFEF;
  padding: 1rem 0;
}
.page-borrow .ac .ac-li .ac-content .boxouter form .flexBox .selectBox{
   color: #717688;
}
.page-borrow .ac .ac-li .ac-content .boxouter form .flexBox .selectBox select{
   padding: 0 calc(1.5rem + var(--form--spacing-unit)) 0 0;
   border: none;
   font-size: 1rem;
   font-weight: bold;
   letter-spacing: 0.23rem;
   font-family: YakuHanJP, "Noto Sans JP", sans-serif;
   color:#71768833;
   -webkit-appearance: none;
   appearance: none; 
}
.page-borrow .ac .ac-li .ac-content .boxouter form .submit{
   width: 100%;
   background: #62A7C6;
   border: none;
   border-radius: 100px;
   font-size: 1rem;
  font-weight: bold;
  letter-spacing: 0.23rem;
   font-family: YakuHanJP, "Noto Sans JP", sans-serif;
  color: #fff;
   transition: 0.2s;
   margin-top: 2rem;
}
.page-borrow .ac .ac-li .ac-content .boxouter form .submit:hover{
   opacity: 0.5;
}

.conditionsCon{
   margin-bottom: 3%;
   max-width: 1000px;
}

.page-borrow .load{
   display: flex;
   flex-wrap: wrap;
   gap: 2.5%;
}
.page-borrow .load .card{
   display: flex;
  flex-direction: column;
  justify-content: space-between;
   width: 48.5%;
   opacity: 100;
   transition: 0.2s;
}
.page-borrow .load .card .txtBox{
   margin: 1rem 0;
}
.page-borrow .load .card .txtBox p{
   font-size: 1rem;
  padding: 0.5rem;
  border-bottom: 1px solid #AED7F0;
}
.page-borrow .load .card .txtBox p.title{
   background: #FFFFFF33;
   border-bottom: none;
}
.page-borrow .load .card .aBox{
   margin-bottom: 10%;
}
.page-borrow .load .card .aBox a{
   display: flex;
   align-items: center;
   background: linear-gradient(90deg, #C6EDFF, #fff);
   padding: 1rem 0.5rem;
   margin-bottom: 0.5rem;
   transition: 0.2s;
}
.page-borrow .load .card .aBox form{
   background: linear-gradient(90deg, #C6EDFF, #fff);
   margin-bottom: 0.5rem;
   transition: 0.2s;
}
.page-borrow .load .card .aBox form button{
   display: flex;
   align-items: center;
   background: none;
  border: none;
   width: 100%;
   padding: 1rem 0.5rem;
}
.page-borrow .load .card .aBox a:hover,
.page-borrow .load .card .aBox form:hover{
   opacity: 0.5;
}
.page-borrow .load .card .aBox .txt{
   width: 100%;
   text-align: center;
   color: #8FC8E2;
}
.page-borrow .load .card .aBox .sannkaku{
   color: #8FC8E2;
}
.page-borrow .catListInnerBlock .more{
   margin: 5% 0 9%;
}


/*  他ページ-借りたい-詳細*/
.h2Box-single-borrow{
   margin: 5% auto 2rem;
}
.single-borrow{
   margin-bottom: 10%;
}
.single-borrow h3{
   font-size: 1.375rem;
   color: #398CC1;
   background: #fff;
   padding: 1rem 2rem;
   margin-bottom: 1.5rem;
}
.single-borrow > .flex{
   justify-content: space-between;
   align-items: flex-end;
   margin-bottom: 1.5rem;
}
.single-borrow > .flex .txtBox p{
   font-size: 1rem;
}
.single-borrow > .flex .txtBox p span{
   margin-right: 1rem;
}
.single-borrow > .flex .txtBox p span.L{
   font-size: 1.75rem;
}
.single-borrow > .flex .aBox form{
  background: linear-gradient(90deg, #C6EDFF, #fff);
  transition: 0.2s;
}
.single-borrow > .flex .aBox form:hover{
   opacity: 0.5;
}
.single-borrow > .flex .aBox p{
   font-size:  min(0.938rem, 15px)
}
.single-borrow > .flex .aBox .txt{
   display: flex;
  align-items: center;
   gap: 1rem;
   padding: 1rem 2rem;
  background: none;
  border: none;
   width: 100%;
   text-align: center;
   color: #398CC1;
}
.single-borrow > .flex .aBox .txt span{
   display: inline-block;
}
.single-borrow > .flex .aBox .sannkaku{
   color: #398CC1;
}
.single-borrow .slide{
   max-height: 80vh;
  aspect-ratio: 5 / 4;
  margin: 0 auto 3rem;
}
.single-borrow .slide .slide-main {
   width: 100%;
  position: relative;
  overflow: hidden;
   margin-bottom: 1rem;
}
.single-borrow .slide .slide-main img{
   width:100%;
   aspect-ratio: 20 / 13;
   object-fit:contain;
}
.single-borrow .slide .slide-main img:nth-of-type(n + 2){
   position:absolute;
   left:0;
   display:none;
   top:0;
   max-width:100%;
   transform:translate(-50%,0);
   left:50%;
}
.d-block{
   display:block!important;
}
.op-0{
   opacity:0;
}
.single-borrow .slide .slide-list-outer{
   display: flex;
}
.single-borrow .slide .slide-list-outer .blue{
   width: 5%;
   background: #62A7C6;
}
.single-borrow .slide .slide-list-outer .slide-list{
   text-align:center;
   width:100%;
   display:flex;
   overflow:auto;
   gap: 1%;
   margin: 0 2%;
}
.single-borrow .slide .slide-list-outer .slide-list img{
   width: 20%;
   aspect-ratio: 5 / 4.5;
   object-fit:cover;
   cursor:pointer;
}
.single-borrow > .txtBox{
   margin: 0 auto 3rem;	
}
.single-borrow > .txtBox .flexBox{
   display: flex;
   background: #FFFFFF33;
   padding: 0.7rem 1rem;
   margin-bottom: 0.5%;
}
.single-borrow > .txtBox .flexBox p{
   width: 100%;
}
.single-borrow > .txtBox .flexBox p.ttl{
   max-width: 150px;
   width: 35%;
}
.single-borrow > .txtBox .pointBox{
   margin-top: 2rem;	
}
.single-borrow > .txtBox .pointBox .ttl{
   font-size: 1.375rem;
   margin-bottom: 0.5rem;
}
.single-borrow > .txtBox .pointBox p{
   font-size: 1rem;
}
.single-borrow > .aBox{
   margin-top: 7%;	
}
.single-borrow > .aBox form{
   background: linear-gradient(90deg, #C6EDFF, #fff);
  transition: 0.2s;
}
.single-borrow > .aBox form:hover{
   opacity: 0.5;
}
.single-borrow > .aBox form .txt{
   background-color: initial;
   border: none;
   color: #398CC1;
   width: 100%;
   font-size: 0.938rem;
}

/*  他ページ-プライバシーポリシー*/
.page-policy{
   margin-bottom: 10%;
}
.page-policy h3{
   font-size: 1.188rem;
   margin-top: 3rem;
}
.page-policy p{
   font-size: 1rem;
   line-height: 200%;
}
.page-policy .mTop{
   margin-top: 1.5rem;
}


/*  他ページ-会社概要*/
.page-company{
   margin: 5% 0 10%;
   position: relative;
}
.page-company .Con-mainOuter{
   background: #fff;
   position: relative;
}
.page-company .Con-mainOuter:before {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-bottom: solid 2rem #fff;
  top: -2rem;
}
.page-company .Con-mainOuter:after {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-top: solid 2rem #fff;
  bottom: -2rem;
}
.page-company .Con-mainOuter .Con-main{
   color: #62A7C6;
   margin:0 auto;
   padding: 10% 0;
   width: 80%;
   padding: 5% 0;
  border-bottom: 1px solid #62A7C6;
}
.page-company .Con-mainOuter .Con-main:last-of-type{
   border-bottom: initial;
}
.page-company .Con-mainOuter .Con-main .flex{
   gap: 2.5%;
   margin-bottom: 0.8rem;
}
.page-company .Con-mainOuter .Con-main .flex:last-of-type{
   margin-bottom: 0;
}
.page-company .Con-mainOuter .Con-main .flex p{
   font-size: min(1rem, 13px);
   font-size: 1rem;
}
.page-company .Con-mainOuter .Con-main .flex .ttlBlue{
   width: 30%
}
.page-company .Con-mainOuter .Con-main .flex .ttlBlue p{
   position: relative;
  z-index: 1;
  text-align: center;
  margin-right: 0.5rem;
  color: #fff;
	white-space: nowrap;
}
.page-company .Con-mainOuter .Con-main .flex .ttlBlue p::before {
   content: "";
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%) skewX(30deg);
   z-index: -1;
   background-color: #62A7C6;
   height: 1.5rem;
   width: 95%;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon{
   width: 100%;
   display: flex;
   flex-direction: column;
  align-items: center;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon .txtConInner{
   width: 100%;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon .txtBox{
   margin-bottom: 0.8rem;
   gap: 2.5%;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon .txtBox:last-of-type{
   margin-bottom: 0;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon .txtBox .ttl{
   width: 100%;
  max-width: 200px;
}
.page-company .Con-mainOuter .Con-main .flex .txtCon .txtBox .txt{
   width: 100%;
}

.page-company .Con__deco-right{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.page-company .Con__deco-right .deco1:nth-of-type(1){
   width: 8vw;
}
.page-company .Con__deco-right .deco1:nth-of-type(3){
   width: 4vw;
}
.page-company .Con__deco-right .deco2{
   width: 12vw;
   margin-bottom:40%;
}
.page-company .Con__deco-right2{
   top: initial;
   bottom: 0;
}
.page-company .Con__deco-left{
   position: absolute;
  bottom: 40%;
  left: 0;
   z-index: 1;
}
.page-company .Con__deco-left .deco1{
   margin:0;
   width: 8vw;
}
.page-company .Con__deco-left .deco1:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #C1E8ED;
}
.page-company .Con__deco-left .deco2:nth-of-type(1){
   width:3vw;
   background: #2E7EB9;
   margin-bottom: 50%;
}
.page-company .Con__deco-left .deco2:nth-of-type(1):after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #2E7EB9;
}
.page-company .Con__deco-left .deco2{
   width:12vw;
   background: linear-gradient(to right, #94C2D6, #258BB9);
}
.page-company .Con__deco-left .deco2:after {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -0.5rem;
   border-top: solid 0.5rem transparent;
   border-left: solid 0.5rem #258BB9;
}


/*  他ページ-ご入居中のお客様へ*/
.page-customer .totono1{
   background: linear-gradient(90deg,  #fff,  #E5EFF5);
   padding: 5% 0 calc(5% + 2rem);
}
.page-customer .totono1 .boxouter{
   gap: 5%;
   align-items: center;
   width: 80%;
}
.page-customer .totono1 .boxouter .txtBox{
   width: 100%;
}
.page-customer .totono1 .boxouter .txtBox >*{
   margin-bottom: 7%;
}
.page-customer .totono1 .boxouter .txtBox h3{
   color: #131C39;
   font-size: 1.125rem;
}
.page-customer .totono1 .boxouter .txtBox .logo1{
   width: 70%;
}
.page-customer .totono1 .boxouter .txtBox .pBox p.ttl{
   color: #131C39;
   font-size: 1.125rem;
   margin-bottom: 3.5%;
}
.page-customer .totono1 .boxouter .txtBox .pBox p.txt{
   color: #131C39;
   font-size: 1.071rem;
}
.page-customer .totono1 .boxouter .txtBox .logo2{
   width: 50%;
}
.page-customer .totono1 .boxouter .imgBox{
   width: 90%;
}

.page-customer .totono2Outer{
   background: #E5EFF5;
   position: relative;
   margin: -2rem auto 5%;
   filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
}
.page-customer .totono2Outer:before {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-bottom: solid 2rem #E5EFF5;
  top: -2rem;
}
.page-customer .totono2Outer:after {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
  content: "";
   border-right: solid 2rem transparent;
  border-left: solid 2rem transparent;
  border-top: solid 2rem #E5EFF5;
  bottom: -2rem;
}
.page-customer .totono2Outer .totono2{
   color: #62A7C6;
   margin:0 auto;
   padding: 10% 0;
   width: 80%;
   padding: 5% 0;
}
.page-customer .totono2Outer .totono2 h3{
   font-size: 1.125rem;
}
.page-customer .totono2Outer .totono2 > p{
   font-size: 1.071rem;
   margin: 3% 0;
   line-height: 200%;
}
.page-customer .totono2Outer .totono2 .sikumiBox{
   background: #FFFFFF;
   border-left: 0.3rem solid #1E77B9;
   padding: 1rem 2.5% 1rem 0;
   align-items: center;
   margin-bottom: 0.5rem;
}
.page-customer .totono2Outer .totono2 .sikumiBox .ttlBox{
   width: 45%;
  min-width: 250px;
   display: flex;
   align-items: center;
   justify-content: center;
  gap: 5%;
   padding: 0 2%;
   border-right: 1.5px solid;
}
.page-customer .totono2Outer .totono2 .sikumiBox .ttlBox .icon{
   width: 20%;
   display: flex;
}
.page-customer .totono2Outer .totono2 .sikumiBox .ttlBox .ttl{
   width: 100%;
}
.page-customer .totono2Outer .totono2 .sikumiBox .ttlBox .ttl span{
	font-size: 1.071rem;
	letter-spacing: 0.02rem;
}
.page-customer .totono2Outer .totono2 .sikumiBox .txtBox{
   width: 100%;
   padding: 0 2.5%;
}
.page-customer .totono2Outer .totono2 .sikumiBox .txtBox p{
   font-size: 1rem;
}

.page-customer .totono3{
   gap: calc(0.5rem + 2%);
   margin-bottom: 10%;
}
.page-customer .totono3 a{
   display: flex;
  align-items: center;
   position: relative;
  background: linear-gradient(90deg, #1E77B9, #9CD5EF);
  color: #fff;
  width: calc(100% - 0.5rem);
  text-align: center;
  padding: 1rem 0 1rem 1rem;
  font-size: 1rem;
  transition: 0.2s;
   filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
}
.page-customer .totono3 a:before {
   width: 0.5rem;
   height: 100%;
   display: block;
   position: absolute;
   content: "";
   top: 0;
   right: -1rem;
   left: auto;
   border-top: solid 1rem transparent;
   border-right: initial;
   border-left: solid 1rem #9CD5EF;
}
.page-customer .totono3 a .img{
   max-width: 150px;
}
.page-customer .totono3 a .txt{
   width: 100%;
   text-align: center;
   padding: 0 5%;
}

.page-customer .question{
   margin-bottom: 10%;
}
.page-customer .question h3{
   margin-bottom: 5%;
}
.page-customer .question .ac{
   padding: 3px 0;
   margin: calc(2rem + 1%) 0 1%;
   filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
}
.page-customer .question .ac .ac-li{
   list-style: none;
   transition: 0.2s;
   background-color: #2E7EB9;
   color: #8FC8E2;
   position: relative;
}
.page-customer .question .ac .ac-li:before {
  width: 100%;
  height: 0%;
  display: block;
  position: absolute;
   content: "";
  border-right: solid 2rem transparent;
  border-bottom: solid 2rem #2E7EB9;
   top: -2rem;
   transition: 0.2s;
}
.page-customer .question .ac .ac-li .ac-label{
   cursor: pointer;
   position: relative;
   padding: 0 0 2rem;
}
.page-customer .question .ac .ac-li .ac-label .pFlex{
   display: flex;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .pBox{
   display: flex;
   align-items: center;
   padding: 0 5%;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .pBox:nth-of-type(3){
   padding-right: 10%;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .pBox p{
   font-size: 1rem;
   line-height: 150%;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .pBox p.Q{
   font-size: 1rem;
   line-height: 100%;
   width: 100%;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .line{
   border-right: 2px solid #8FC8E2;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .icon-wrap{
   position: absolute;
   right: 7%;
   top: 10%;
   transform: translatey(-50%);
}
.page-customer .question .ac .ac-li .ac-label .pFlex .icon-wrap .icon{
   position: relative;
   display: inline-block;
   width: 100%;
   height: 100%;
}
.page-customer .question .ac .ac-li .ac-label .pFlex .icon-wrap .icon::before{
   position: absolute;
   content: "▲";
   display: block;
   transition: all 0.4s;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   padding: 0 0 0.1rem 0.3rem;
}
.page-customer .question .ac .ac-li.open .ac-label .pFlex .icon-wrap .icon::before{
   transform: translate(-50%, -50%) rotate(180deg);
}
/* open */
.page-customer .question .ac .ac-li.open{
   background-color: #E5EFF5;
   color: #62A7C6;
}
.page-customer .question .ac .ac-li.open:before {
   border-bottom: solid 2rem #E5EFF5;
}
.page-customer .question .ac .ac-li.open .ac-label .pFlex .line{
   border-right: 2px solid #62A7C6;
}
.page-customer .question .ac .ac-li.open .ac-label .icon:before{
   transform: translate(-50%, -50%) rotate(0deg);
}

.page-customer .question .ac .ac-li .ac-content{
   display: none;
   position: relative;
}
.page-customer .question .ac .ac-li .ac-content .boxouter{
    display: flex;
    padding: 0 0 2rem;
    width: 100%;
}
.page-customer .question .ac .ac-li .ac-content .boxouter .kara{
   padding: 0 calc(1rem + 5%);
}
.page-customer .question .ac .ac-li .ac-content .boxouter .txtBox{
   padding: 0 5%;
   display: flex;
  gap: 2%;
   width: 100%;
}
.page-customer .question .ac .ac-li .ac-content .boxouter p{
    font-size: 1rem;
    margin: 1% 0;
}
.page-customer .question .ac .ac-li .ac-content .boxouter .txtBox .txt{
   margin-top: calc(0.7% + 0.1rem);	
}
.page-customer .question .ac .ac-li .ac-content .boxouter .txtBox .txt p{
   margin-top: 2rem;
   font-size: 1.071rem;
   line-height: 200%;
}
.page-customer .question .ac .ac-li .ac-content .boxouter .txtBox .txt p:nth-of-type(1){
   margin: 0;
}

.page-customer .map{
   margin-bottom: 10%;
}
.page-customer .map h3{
   font-size: 1.125rem;
   margin-bottom: 5%;
}
.page-customer .map .ttl{
   font-size: 1.125rem;
   margin-bottom: 1%;
}
.page-customer .map .flexBox{
   display: flex;
   gap: 0.5%;
   flex-wrap: wrap;
   margin-bottom: 5%;
}
.page-customer .map .flexBox a{
   width: 24%;
   display: flex;
   align-items: center;
   background: linear-gradient(90deg, #FFF, #C6EDFF);
  color: #62A7C6;
   padding: 1.125rem;
   margin-bottom: 0.7%;
   transition: 0.2s;
   white-space: nowrap;
}
.page-customer .map .flexBox a:hover{
   opacity: 0.4;
}
.page-customer .map .flexBox a .txt{
   text-align: center;
  width: 100%;
   font-size: 1.125rem;
}


/* 他ページ-管理物件実績 */
.page-works{
   margin: 5% 0;
}
/* もっと見る */
.catListInnerBlock {
   border-radius: 3px;
}
ul.catList {
   border: none;
   list-style: none;
   padding: 0;
   max-width: 1000px;
}
ul.catList .load{
   display: flex;
   flex-wrap: wrap;
   gap: 2.5%;
}
ul.catList .load .card{
   width: 48.5%;
   opacity: 100;
   transition: 0.2s;
}
ul.catList .load .card .img{
   aspect-ratio: 3 / 2;
}
ul.catList .load .card .img img{
   object-fit: cover;
  height: 100%;
}
ul.catList .load .card .txtBox{
   margin: 5% 0 10%;
}
ul.catList .load .card .txtBox .flexBox{
   display: flex;
   align-items: center;
   padding: 1rem 0;
   border-bottom: 1px solid #AED7F0;
}
ul.catList .load .card .txtBox .flexBox p{
   font-size: 1rem;
}
ul.catList .load .card .txtBox .flexBox p.ttl{
   width: 50%;
   max-width: 100px;
}
ul.catList .load .card .txtBox .flexBox p.txt{
   width: 100%;
}

/* もっと見るのボタン */
.catListInnerBlock .more{
  text-align: center;
  padding: 1rem;
   background: #2E7EB9;
   transition: 0.2s;
}
.catListInnerBlock .more:hover {
   opacity: 0.5;
}

/* もっと見るの非表示 */
.catList li.is-hidden {
 visibility: hidden;
 opacity: 0;
 height: 0;
 margin: 0 10px;
 padding: 0;
}


/*  他ページ-お問合せ-共通*/
.page-contact .txtBox{
   margin: 5% auto;
}
.page-contact .txtBox .blue{
   position: relative;
   background: linear-gradient(90deg, #1E77B9, #9CD5EF);
   color: #fff;
   width: calc(100% - 0.5rem);
   padding: 1.75rem 0 1.75rem 0.5rem;
   font-size: 1.125rem;
   margin-bottom: 2rem;
}
.page-contact .txtBox .blue:before {
  width: 0.5rem;
  height: 100%;
  display: block;
  position: absolute;
   content: "";
  top: 0;
  right: -1rem;
  left: auto;
   border-top: solid 1rem transparent;
   border-bottom: solid 1rem transparent;
  border-left: solid 1rem #9CD5EF;
}
.page-contact .txtBox .blue:after{
  width: 0.5rem;
  height: 100%;
  display: block;
  position: absolute;
   content: "";
  top: 0;
  right: auto;
  left: -1rem;
   border-top: solid 1rem transparent;
   border-bottom: solid 1rem transparent;
   border-right: solid 1rem #1E77B9;
}
.page-contact .txtBox p{
   font-size: 1.071rem;
   margin-bottom: 1rem;
}
.page-contact .txtBox a{
   font-size: 1.071rem;
   color: #fff;
   text-decoration: underline;
   transition: 0.2s;
}
.page-contact .txtBox a:hover{
   opacity: 0.5;
}
.page-contact .formBox{
   margin: 5% auto 15%;
}
.page-contact .formBox .formTtl p{
   font-size: 1.313rem;
   font-weight: bold;
   letter-spacing: 0.23rem;
   font-family: YakuHanJP,"Noto Sans JP", sans-serif;
   color: #fff;
   background: none;
   border: none;
   padding: 0;
  margin: 0;
   width: 100%;
}
.page-contact .formBox .formTtl input{
   display: none;
}
.page-contact .formBox .formCon{
   margin: 2rem 0;
}
.page-contact .formBox .formCon.content{
   margin-top: 4rem;
}
.page-contact .formBox .formCon p{
   font-size: 1.125rem;
   margin-bottom: 0.5rem;
}
.page-contact .formBox .formCon input,
.page-contact .formBox .formCon select,
.page-contact .formBox .formCon textarea{
   background: #E5EFF5;
   border: none;
   padding: var(--form--spacing-unit);
   font-size: 1.125rem;
   font-family: YakuHanJP,"Noto Sans JP", sans-serif;
}
.page-contact .formBox .formCon .selectBox{
   position: relative;
   display: unset;
}
.page-contact .formBox .formCon .selectBox::before {
   content: "";
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 0.7rem  0.5rem 0  0.5rem;
   border-color: #8FC8E2 transparent transparent transparent;
   position: absolute;
   top: 50%;
   right:  0.8rem;
   transform: translateY(-50%);
   pointer-events: none;
}
.page-contact .formBox .formCon .selectBox select{
   padding: var(--form--spacing-unit) calc( 2rem + var(--form--spacing-unit)) var(--form--spacing-unit) var(--form--spacing-unit);
}
.page-contact .formBox .formCon textarea::placeholder {
   color: #BFDBEA;
   font-size: 1.125rem;
   font-weight: bold;
   letter-spacing: 0.23rem;
   font-family: YakuHanJP,"Noto Sans JP", sans-serif;
}
.page-contact .formBox .formCon input.w-100{
   width: 100%;
}
.page-contact .formBox .formCon .txt{
   font-size: 0.8rem;
}
.page-contact .formBox .formCon .input-btm{
   color: #C1E8ED;
   font-size: 0.8rem;
}
.page-contact .formBox .formTxt p{
   font-size: 0.8rem;
}
.page-contact .formBox .formTxt .ttl{
   margin-top: 2rem;
   font-size: 1.125rem;
}
.page-contact .formBox .formTxt a{
   font-size: 0.8rem;
  color: #fff;
   text-decoration: underline;
   transition: 0.2s;
}
.page-contact .formBox .formTxt a:hover{
   opacity: 0.5;
}
.page-contact .formBox .contactAgree{
   margin: 4rem 0;
}
.page-contact .formBox .submit button{
   text-align: center;
   width: 100%;
  border-radius: 50px;
  border: none;
   transition: 0.2s;	
   background: #2E7EB9;
   color: #fff;
   opacity: 0.3;
}
.page-contact .formBox .submit button.is-inactive{
   opacity: 0.3;
   pointer-events: none;
}
.page-contact .formBox .submit button.is-active{
   opacity: 1;
   pointer-events: initial;
}
.page-contact .formBox .contactAgree label{
   display: flex;
  align-items: center;
  justify-content: center;
   gap: 1rem;
   font-size: 1rem;
  font-weight: bold;
  letter-spacing: 0.23rem;
  font-family: YakuHanJP,"Noto Sans JP", sans-serif;
}
.page-contact .formBox .contactAgree label input{
   background: none;
  border: var(--form--border-width) solid #fff;
}
.page-contact .formBox .contactAgree label input:after{
   border: 3px solid #fff;
   border-top: 0;
  border-left: 0;
}


/* 他ページ-お問合せ確認-共通 */
.page-confirmation .formBox .formCon{
   margin: 0;
   padding: 2rem 0;
   border-bottom: 1.5px solid #7EC3E1;
}
.page-confirmation .formBox .formCon p{
   font-size: 1.125rem;
   margin: 0;
   color: #E2F1F8;
}
.page-confirmation .formBox .formCon input{
   background: none;
  padding: 0;
  margin: 0;
   color: #E2F1F8;
   font-size: 1rem;
   font-weight: bold;
  letter-spacing: 0.23rem;
  font-family: YakuHanJP,"Noto Sans JP", sans-serif;
   width: 100%;
}
.page-confirmation .formBox .formCon.formTtl input{
   font-size: 1.125rem;
   display: block;
}
.page-confirmation .formBox .confirmation-submit{
   margin: 4rem 0;
}
.page-confirmation .formBox .confirmation-submit button{
   opacity: 1;
   margin: 1rem 0;
}
.page-confirmation .formBox .confirmation-submit button.back{
   background: linear-gradient(90deg, #ABDEF0, #75BEDE);
   color: #2E7EB9;
}


/* 他ページ-ありがとうページ */
.page-thank{
   background: #fff;
   position: relative;
   margin: calc(8% + 2rem) auto;
}
.page-thank:before {
   width: 100%;
   height: 0%;
   display: block;
   position: absolute;
   content: "";
   border-right: solid 2rem transparent;
   border-left: solid 2rem transparent;
   border-bottom: solid 2rem #fff;
   top: -2rem;
}
.page-thank:after {
   width: 100%;
   height: 0%;
   display: block;
   position: absolute;
   content: "";
   border-right: solid 2rem transparent;
   border-left: solid 2rem transparent;
   border-top: solid 2rem #fff;
   bottom: -2rem;
}
.page-thank > .boxouter{
   padding: 10% 0;
}
.page-thank h2{
   text-align: center;
  display: block;
}
.page-thank p{
   font-size: 1.125rem;
   color: #62A7C6;
   text-align: center;
   margin: calc(1rem + 1%) 0 calc(2rem + 2%);
}
.thank__deco{
   color:#fff;
   transition: 0.2s;
   display: block;
  max-width: 600px;
  margin: 0 auto;
}
.thank__deco:hover{
   opacity: 0.5;
}
.thank__deco .deco1{
   margin: 0 auto 0 0;
  width: calc(100% - 1rem);
   height: 5rem;
   background: #509DC8;
}
.thank__deco .deco1:before{
   right: -1rem;
   left: auto;
  border-top: solid 1rem transparent;
   border-right: initial;
  border-left: solid 1rem #509DC8;
}
.thank__deco .deco__box{
   position: relative;
  top: 50%;
   width: 80%;
   margin: 0 auto;
}
.thank__deco .top__scroll-line{
   height: 0.07rem;
   width: calc(100% - 10rem);
   margin: 0.7rem 0 auto auto;
   position:relative;
}
.thank__deco .top__scroll-line:before{
   content: 'TOPへ戻る';
   position: absolute;
   top: 0;
   transform: translateY(-40%);
   left: -10rem;
   line-height: 100%;
}
.thank__deco .top__scroll-kaku{
   width: 0%;
   height: 0%;
   border-width: 0.4rem 0 0.4rem 0.5rem;
   border-color: transparent transparent transparent #fff;
   animation-name: NEWSscrollAnime;
  top: -0.35rem;
}


/* フッター */
footer .footer1 .footer1__left{
  display: flex;
  flex-direction: column;
  justify-content: center;
   width: 80%;
   max-width: 600px;
   padding: 5%;
  background: linear-gradient(180deg, #C6EDFF, #1E77B9);
}
footer .footer1 .footer1__left .h2-con{
   flex-direction: column;
  align-items: baseline;
   margin-bottom: 3rem;
}
footer .footer1 .footer1__left .h2-con h2,
footer .footer1 .footer1__left .h2-con span{
   color: #fff;
}
footer .footer1 .footer1__left .txtBox .txtBox__flex{
   display: flex;
   gap: 1rem;
   margin-bottom: 0.5rem;
}
footer .footer1 .footer1__left .txtBox .txtBox__flex .img{
   width: 1.625rem;
}
footer .footer1 .footer1__left .txtBox .txtBox__flex p{
   font-size: 1.5rem;
   line-height: 100%;
}
footer .footer1 .footer1__right{
   width: 100%;
   padding: 5% 2% 5% calc(2% - 1rem );
   background: #8FC8E2;
   display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10%;
}
footer .footer1 .footer1__right a{
   display: flex;
   align-items: center;
   position: relative;
  margin: 1% auto;
  padding: 5%;
  width: calc(100% - 1rem);
   max-width: 800px;
  background: #2E7EB9;
   filter: drop-shadow(0.625rem 0.625rem 1.25rem #1F284B61);
   transition: 0.2s;
}
footer .footer1 .footer1__right a:hover{
   opacity: 0.5;
}
footer .footer1 .footer1__right a:before{
  width: 0.5rem;
  height: 100%;
  display: block;
  position: absolute;
  content: "";
  top: 0;
   right: -1rem;
  left: auto;
  border-top: solid 1rem transparent;
  border-right: initial;
  border-left: solid 1rem #2E7EB9;
}
footer .footer1 .footer1__right a .ttl{
   width: 165px;
   font-size: 1.2rem;
   letter-spacing: 0.1rem;
   color: #fff;
}
footer .footer1 .footer1__right a .txt{
   width: 100%;
   font-size: 1rem;
   color: #fff;
}
footer .footer1 .footer1__right a .sannkau{
   width: 0.625rem;
   margin-left: 0.625rem;
   font-size: 0.625rem;
   color: #fff;
}
footer .footer2{
   background-color: #fff;
   padding: 5% 0;
}
footer .footer2 .boxouter{
   justify-content: space-between;
   gap: 5%;
   width: 85%;
}
footer .footer2 .boxouter .leftBox p{
   color: #62A7C6;
}
footer .footer2 .boxouter .leftBox .logo{
   margin-top: 2rem;
   max-width: 300px;
}
footer .footer2 .boxouter .leftBox p.ttl{
   margin-top: 2rem;
   font-size: 1rem;
}
footer .footer2 .boxouter .leftBox p.txt{
   margin-top: 1rem;
   font-size: 1rem;
}
footer .footer2 .boxouter .rightBox{
  width: 100%;
  max-width: 800px;
   gap: 10%;
}
footer .footer2 .boxouter .rightBox .aBox-outer{
   width: 100%;
}
footer .footer2 .boxouter .rightBox .aBox-outer .aBox{
   display: flex;
   flex-direction: column;
   margin: 10% 0;
}
footer .footer2 .boxouter .rightBox .aBox-outer .aBox .ttl{
   color: #62A7C6;
   font-size: 1.1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid #62A7C6;
  margin-bottom: 0.75rem;
}
footer .footer2 .boxouter .rightBox .aBox-outer .aBox a{
   color: #62A7C6;
   font-size: 1rem;
   margin: 0.25rem 0;
   transition: 0.2s;
}
footer .footer2 .boxouter .rightBox .aBox-outer .aBox a:hover{
   opacity: 0.4;
}
footer .footer3{
   display: flex;
   background-color: #2E7EB9;
   justify-content: center;
   align-items: center;
   gap: 1rem;
   padding: 1rem;
}
footer .footer3 p{
   font-size: 9px;
   letter-spacing: 0;
}
footer .footer3 .logo{
  width: 7%;
   min-width: 100px;
   display: flex;
}

/* 404ページ　thanksページ */
.error{
   text-align: center;
   margin: 200px 0;
}
.error p{
   margin:50px;
}
.error p:nth-of-type(1){
   font-size: 3rem;
   line-height: 3rem;
}
.error p:nth-of-type(1) span{
   font-size: 1.5rem;
   line-height: 1.5rem;
}
.error .topbtn{
   margin-bottom:100px;
}
.error a{
   padding: 1rem 2rem;
   transition: .2s;
}
.error a:hover{
   color: #0a0a0a4D;
}



/* アニメーション */
.fadeUpTrigger{
   opacity:0;
}

.fadeUp {
   animation-name: fadeUpAnime;
   animation-duration:1s;
   animation-fill-mode:both;
   opacity: 0;
}
@keyframes fadeUpAnime{
   from {
       opacity: 0;
       transform: translateY(100px);
   }
   to {
       opacity: 1;
       transform: translateY(0);
   }
}



@media screen and (min-width:1500px){
   .menu-contact__outer a span {
       font-size: 1.2rem;
   }
   .menu-contact__outer a{
       max-width:250px;
   }
   .flow-flex{
       width:80%;
   }
}
@media screen and (max-width:900px){
   html{
       font-size: clamp(1px, 3.5vw, 16px);/*16px */
   }
   .flex{
       display: block;
   }
   
   .h2-con{
       flex-direction: column;
       align-items: baseline;
   }
   .AI-a{
       margin: 10% auto;
   }
   
   .menu-btm__outer{
       display: none;
   }
   .menu-contact__outer{
       width: 50%;
       bottom: 3rem;
   }
   .menu-contact__outer:before {
       width: 100%;
       height: 0%;
       display: block;
       position: absolute;
       content: "";
       border-left: solid 1rem transparent;
       border-bottom: solid 1rem #fff;
       top: -1rem;
   }
   .menu-contact__outer:after{
       width: 100%;
       height: 0%;
       display: block;
       position: absolute;
       content: "";
       border-left: solid 1rem transparent;
       border-top: solid 1rem #fff;
       bottom: -1rem;
   }
   .menu-contact__outer a{
       width: 100%;
       aspect-ratio: initial;
       background: #fff;
       flex-direction: row-reverse;
       padding-left: 1rem;
   }
   .menu-contact__outer a:hover{
       opacity: 1;
   }
   .menu-contact__outer a img{
       width: 15%;
       max-width: 30px;
   }
   
   .top__txt p:nth-of-type(1){
       font-size: 3rem;
       letter-spacing: 0.5rem;
   }
   
   .kadou__main{
       width: 80%;
       margin: 0 auto;
       display: block;
       max-height: initial;
   }
   .kadou__main div:nth-of-type(1){
       aspect-ratio: initial;
       width: 100%;
       max-width: initial;
   }
   .kadou__main div:nth-of-type(1) span{
       font-size: 1.125rem;
   }
   .kadou__main div:nth-of-type(2) > span{
       margin-right: 0;
   }
   .kadou__day{
       margin: 1rem 0 1rem 1rem;
   }
   
   .news__outer{
       width: 90%;
       padding: 2rem;
       margin-top: 20%;
   }
   .news__outer:after{
       border-top: solid 1rem transparent;
       border-left: solid 1rem #fff;
       border-bottom: solid 1rem transparent;
       right: -1rem;
   }
   .news a p:last-of-type{
       display:block;
   }
   .news__deco{
       top: 60%;
   }
   .news__img{
       height: 50vh;
       margin-top: -25vh;
   }
   
   .services__outer{
       margin: 20% auto;
       padding: 2rem 0;
   }
   .services .h2-con{
       align-items: center;
   }
   .services__deco-right{
       top: -20%;
   }
   .services__deco-left{
       bottom: -35%;
   }
   
   .flow-flex{
       display: block;
   }
   .flow-flex .txtBox p,
   .flow-flex .imgBox{
       margin-top: 1rem;
   }
   .flow-flex .imgBox p{
       font-size: 0.75rem;
   }
   
   .topics1 .top__img{
       height: 30vh;
       width: 90%;
   }
   .topics1__txt-outer{
       margin: 20% auto;
       padding: 2rem 0;
       width: 70%;
   }
   .topics1__txt-outer:after{
       width: 0;
       height: 100%;
       display: block;
       position: absolute;
       content: "";
       top: 0;
       border-top: solid 2rem transparent;
       border-bottom: solid 2rem transparent;
       border-left: solid 2rem #fff;
       right: -2rem;
   }
   .topics1__txt-box{
       position: relative;
       margin-top: -50%;
   }
   .topics1__a-box{
       margin-top: calc(6rem + 15%);
       flex-direction: column;
   }
   .topics1__a{
       height: 100%;
       min-height: initial;
       display: flex;
       align-items: center;
       padding: 1.5rem 0;
       margin-bottom: 1.5%;
   }
   .topics1__a .nmb{
       top: 50%;
       transform: translateY(-50%);
       font-size: 5rem;
       left: -1rem;
   }
   .topics1__a .txt{
       position: initial;
       transform: initial;
       width: 100%;
   }
   .topics1__a .txt br{
       display: none;
   }
   .topics1__a .more{
       position: initial;
       transform: initial;
       width: 40%;
       max-width: 90px;
   }
   
   
   .topics2__outer{
       margin: 20% auto 0;
       background: linear-gradient(180deg, #8FC8E2 0%, #8FC8E2 70%, transparent 70%, transparent 100%);
   }
   .topics2{
       padding: 10% 0;
       width: 80%;
       flex-direction: column;
   }
   .topics2__txtBox p{
       margin-top: 1rem;
   }
   .topics2__imgBox{
       transform: translate3d(0px, 0px, 0px)!important;
       margin: 3rem 0 0;
       width: 80%;
   }
   .topics2__imgBox .img{
       transform: initial;
   }
   .topics2__deco .top__scroll-kaku{
       animation-name: topics2scrollAnime;
   }
   @keyframes topics2scrollAnime{
       0% {
           left:70%;
       }
       5% {
           opacity:1;
       }
       50% {
           opacity:0;
           left:95%;
       }
       50.1% {
           left:60%;
       }
       100% {
           opacity:1;
           left:70%;
       }
   }
   .topics2__deco-right{
       transform: translate3d(0px, 0px, 0px)!important;
       top: -7%;
   }
   .topics2__deco-left{
       transform: translate3d(0px, 0px, 0px)!important;
   bottom: 0;
   }
   
   .topics3__box{
       margin: 15% 0 10%;
   }
   .topics3__outer{
       transform: translate3d(0px, 0px, 0px)!important;
       width: 70%;
       padding: 2rem 0;
       margin: 0 auto;
   }
   .topics3{
       flex-direction: column-reverse;
   }
   .topics3__aBox a{
       margin-bottom: 2.5%;
   }
   .topics3__box .top__img{
       height: 30vh;
       width: 90%;
       right: -10%;
       margin-top: -20%;
   }
   .topics3__deco-left{
       transform: translate3d(0px, 0px, 0px)!important;
       bottom: 5%;
   }
   
   footer .footer1 .footer1__left{
       width: 100%;
       max-width: initial;
       padding: 10% 5%;
   }
   footer .footer1 .footer1__left .h2-con{
       width: 70%;
       margin: 0 auto 1.5rem;
   }
   footer .footer1 .footer1__left .txtBox{
       width: 70%;
       margin: 0 auto;
   }
   footer .footer1 .footer1__right{
       padding: 10% 5%;
   }
   footer .footer1 .footer1__right a{
       display: block;
       height: initial;
       padding: 6%;
       margin: 2% 0;
   }
   footer .footer1 .footer1__right a .ttl{
       display: inline;
       border-right: 1px solid;
       padding-right: 1rem;
   }
   footer .footer1 .footer1__right a .txt{
       margin: 1rem 0 0.5rem 0;
   }
   footer .footer1 .footer1__right a .sannkau{
       width: 100%;
       text-align: end;
   }
   
   footer .footer2 .boxouter .leftBox .logo{
       width: 70%;
   }
   footer .footer2 .boxouter .rightBox{
       width: 70%;
   }
   
   
   /* 他ページ-共通 */
   /* 他ページ-共通_h2 */
   .h2Box{
       margin: 10% auto 5%;
   }
   .h2Box h2 span.sub{
       display: block;
   }

   
   /*  他ページ-お知らせ */
   .page-news .news__con a p.blog_title{
       display: block;
   }
   
   /*  他ページ-貸したい*/
   .page-lend .aBox a{
       display: block;
       width: calc(100% - 1rem);
       margin-bottom: 1.5%;
   }
   .page-lend .aBox a:last-of-type{
       margin-bottom: 0;
   }
   
   .page-lend .Con{
       margin: calc(10% + 2rem) auto calc(20% + 2rem);
   }
   .page-lend .Con .Con-mainOuter .Con-main{
       width: 85%;
   }
   .page-lend .Con .Con-mainOuter .Con-main h3{
       margin-bottom: 2.5rem;
   }
   .page-lend .Con .Con-mainOuter .Con-main >.flex {
       display: flex;
       flex-direction: column;
       margin: 3rem 0;
   }
   .page-lend .Con .Con-mainOuter .Con-main >.flex:nth-of-type(2){
       flex-direction: column-reverse;
   }
   .page-lend .Con .Con-mainOuter .Con-main >.flex:last-of-type{
       margin-bottom: 0;
   }
   .page-lend .Con .Con-mainOuter .Con-main >.flex .txtBox{
       margin-bottom: 1.2rem;
   }
   .page-lend .Con .Con-mainOuter .Con-main >.flex .imgBox .img{
       margin-bottom: 0;
   }
   .page-lend .Con .Con-mainOuter .Con-main .nmb{
       font-size: 11rem;
   }
   .page-lend .Con .Con-mainOuter .Con-main .nmb.nmb2{
       bottom: 5%;
   }
   
   .page-lend .Con1 .Con-mainOuter .Con-main .nmb.nmb2{
       bottom: 20%;
   }
   
   .page-lend .Con3 .Con-mainOuter .Con-main .txtBox .img,
   .page-lend .Con4 .Con-mainOuter .Con-main .txtBox .img{
       width: 100%;
   }
   
   .page-lend .Con3 .Con__deco-left,
   .page-lend .Con4 .Con__deco-left{
       transform: translateY(-100%);
   }
   .page-lend .Con4{
       margin-bottom: calc(10% + 2rem);
   }
   
   
   /*  他ページ-会社概要*/
   .page-company {
       margin: 10% 0 15%;
   }
   .page-company .Con-mainOuter:before{
       border-right: solid 1rem transparent;
       border-left: solid 1rem transparent;
       border-bottom: solid 1rem #fff;
       top: -1rem;
   }
   .page-company .Con-mainOuter:after{
       border-right: solid 1rem transparent;
       border-left: solid 1rem transparent;
       border-top: solid 1rem #fff;
       bottom: -1rem;
   }
   .page-company .Con-mainOuter .Con-main{
       width: 78%;
   }
   .page-company .Con-mainOuter .Con-main > .flex > *{
       margin: 2rem 0;
   }
   .page-company .Con-mainOuter .Con-main .flex .txtCon .txtBox:last-of-type{
       margin-bottom: 0.8rem;
   }
   
   
   /*  他ページ-ご入居中のお客様へ*/
   .page-customer .totono1{
       padding: 5% 0 calc(5% + 7rem);
   }
   
   .page-customer .totono2Outer{
       margin: -2rem auto calc(10% + 1rem);
   }
   .page-customer .totono2Outer .totono2{
       padding: calc(5% + 0.5rem) 0 calc(5% + 0.5rem);
       margin: -5rem auto 5%;
   }
   .page-customer .totono2Outer .totono2 .sikumiBox{
       padding: 1rem;
   }
   .page-customer .totono2Outer .totono2 .sikumiBox .ttlBox{
       width: 100%;
       min-width: initial;
       padding: 0.5rem 0;
       border-bottom: 1.5px solid;
       border-right: initial;
   }
   .page-customer .totono2Outer .totono2 .sikumiBox .txtBox{
       padding: 0.5rem 0;
   }
   .page-customer .totono2Outer:before{
       border-right: solid 1rem transparent;
       border-left: solid 1rem transparent;
       border-bottom: solid 1rem #E5EFF5;
       top: -1rem;
   }
   .page-customer .totono2Outer:after{
       border-right: solid 1rem transparent;
       border-left: solid 1rem transparent;
       border-top: solid 1rem #E5EFF5;
       bottom: -1rem;	
   }
   
   .page-customer .totono3 a{
       width: calc(100% - 1rem);
           margin: 5% 0;
   }
   .page-customer .totono3 a .img{
       width: 40%;
   }
   
   .page-customer .question .ac .ac-li .ac-label .pFlex{
       display: block;
   }
   .page-customer .question .ac .ac-li .ac-label .pFlex .pBox{
       padding: 1rem 5%;
   }
   .page-customer .question .ac .ac-li .ac-label .pFlex .line{
       border-right: initial;
       border-bottom: 1.5px solid #8FC8E2;
       margin: 0 15% 0 5%;
   }
   .page-customer .question .ac .ac-li .ac-label .pFlex .icon-wrap{
       top: 50%;
       transform: translatey(-100%);
   }
   .page-customer .question .ac .ac-li .ac-content .boxouter .kara{
       display:none;
   }
   
   .page-customer .map .flexBox a{
       width: 49%;
       padding: 1.125rem 0.5rem;
   }
   
   /*  他ページ-借りたい , search.php*/
   .conditionsCon {
       margin-bottom: calc(1rem + 3%);
   }
   .page-borrow .ac .ac-li .ac-content:before{
       border-left: solid 1rem transparent;
       border-right: solid 1rem transparent;
       border-top: solid 1rem #fff;
       bottom: -1rem;
   }
   
   /*  他ページ-借りたい-詳細*/
   .single-borrow > .flex .aBox{
       margin-top: 1rem;
   }
   .single-borrow > .flex .aBox .txt{
       justify-content: center;
   }
}


@media screen and (max-width:500px){
   .deco1,
   .deco2{
       height: 1.5rem;
   }
   
   .AI-a{
       width: 90%;
   }
   
   .top__txt p:nth-of-type(1){
       font-size: 2.5rem;
   }
   .top__txt p:nth-of-type(2){
       font-size: 1rem;
       line-height: 250%;
   }
   
   .top__img{
       right: 0;
   }
   .top__deco-right{
       display: none;
   }
   
   .top__deco-left .deco1{
       width: 35vw;
   }
   .top__deco-left .deco2{
       width: 45vw;
   }
   
   
   /*  他ページ-借りたい , search.php*/
   .page-borrow .ac .ac-li .ac-label .pFlex{
       justify-content: left;
   }
   .page-borrow .ac .ac-li .ac-content .boxouter form .flexBox{
       display: block;
   }
   
   
   /*  他ページ-貸したい*/
   .page-lend .Con2 .bg{
       bottom: -10%;
   }
   
   
   /*  他ページ-会社概要*/
   .page-company .Con-mainOuter .Con-main .flex .ttlBlue {
       width: 100%;
   }
   
   
   /* 他ページ-管理物件実績 */
   ul.catList .load .card{
       width: 100%;
   }
   
   
   footer .footer1 .footer1__left {
       padding: 15% 5%;
   }
}