@charset "UTF-8";
img{width: auto;max-width: 100%;height: auto;vertical-align: bottom;}
.text-right{text-align: right;}
.tpl-header__logo .tpl-header__svg {
    fill: #3F2021;
}

.tpl-header__name {
    color: #3F2021;
}

.tpl-drawer__line {
    background: #3F2021;
}
.bg_wrap{padding-top:90px ;}
.clrBg01{background: #E6E1DB;}
.clrBg02{background: #CEDDE5;}
.clrBg03{background: #CFE5DA;}
.clrBg04{background: #CFD4E2;}
.clrBg05{background: #E5E5CF;}
.clrBg06{background: #DEDEDE;}
.en{font-family: Montserrat, sans-serif;}

.tpl-navbar{background: #F6F4F3;margin: 16px 0 0;padding: 10px 0 18px;}
.tpl-navbar .tpl-section{padding: 0;}
.tpl-navbar .list-item{max-width: 710px;margin: 0 auto;display: flex;justify-content: space-between;flex-wrap: wrap;align-items: flex-end;}
.tpl-navbar .list-item li{width:17.636%;text-align: center;}
.tpl-navbar .list-item a{display: block;font-size: min(1.5vw,1.4rem);}
.tpl-navbar .list-item a:hover p{background: #fff;border: solid 1px;}
.tpl-navbar .list-item a p{height: 2.85em;display: flex;align-items: center;justify-content: center;border-radius: 40px;color: #401F20;}
.tpl-navbar .list-item a img{position: relative;bottom: -0.2em;}
.tpl-navbar .list-item li:nth-of-type(5) a img{bottom: -0.4em;}

@media screen and (max-width: 768px) {
  .bg_wrap{padding-top: 64px;}
  .tpl-navbar{margin: 8px 0 0;}
  .tpl-navbar .list-item{align-items: flex-end;}
  .tpl-navbar .list-item {row-gap: 10px;}
  .tpl-navbar{background: #F6F4F3;}
  .tpl-navbar .list-item li{width: 30%;}
}
@media screen and (max-width: 480px) {
.tpl-navbar .list-item a{font-size: 1.1rem;}
}

/* card */
.list-card{display: flex;justify-content: space-between;row-gap: 50px;flex-wrap: wrap;position: relative;}

.card-link{width: 318px;height: 450px;background: #fff;border: 2px solid #401F20;border-radius: 10px;padding: 14px 18px;position: relative;}


.card-link::after{opacity: 0;transition: opacity .5s ease;transition-delay: 0.5s;position: absolute;content: "";background: url("../images/urawakari/core_03.jpg") no-repeat center center/100% 100%;width:92px;height:66px;bottom: -3px;right: -2px;}
.card-link.is-inview::after{opacity: 1;}
.card-link .card-ttl{display: flex;justify-content: space-between;margin: 0 0 15px;}
.card-link .card-ttl .txt h4{font-size: 1.3rem;line-height: 2;letter-spacing: 0.1em;}
.card-link .card-ttl .txt p{font-size: 0.7rem;}
.card-link .card-ttl .mark p{font-weight: bold;font-size: 0.7rem;text-align: center;margin: 0 0 7px;}
.card-link .card-info-tit{font-size: 2rem;font-weight: bold;letter-spacing: 0.1em;width: fit-content;height: 2.5em;display: flex;align-items: center;padding: 0 15px;border-radius: 34px;}
.card-link .card-info-tit.pd-short{padding-right: 0;}
.card-link .card-info-tit:nth-of-type(2){position: relative;top: -7px;}

.card-link .gr-ttl{position: relative;}
.card-link .gr-ttl-hv{opacity: 0;position: absolute;}
.card-link:hover .gr-ttl{position: absolute;opacity: 0;}
.card-link:hover .gr-ttl-hv{opacity: 1;position: relative;}


/* clr */
.clr-txt01{color: #CB8B8B;}
.clr-txt02{color: #AAC6C7;}
.clr-txt03{color: #AAC7AA;}
.clr-txt04{color: #B1B8D3;}
.clr-txt05{color: #C6C4A9;}
.clr-txt06{color: #D2CCCC;}

/* clr */
.card-link.card-child .card-info-tit{background: #E3CFCF;}
.card-link.card-edu .card-info-tit{background: #CEDDE5;}
.card-link.card-conveni .card-info-tit{background: #CFE5DA;}
.card-link.card-access .card-info-tit{background: #CFD4E2;}
.card-link.card-living-env .card-info-tit{background: #E5E5CF;}
/* .card-link.card-security .card-info-tit{background: #E5E5CF;}
.card-link.card-living .card-info-tit{background: #E4DFDD;} */



.card-link .read-more{opacity: 0;transition: opacity 0.25s ease-in-out;line-height: 1.3;letter-spacing: 0.05em;right: 0;bottom:-15px;position: absolute;font-size: 1rem;display: flex;flex-direction: column;justify-content: center;align-items: center;color: #fff;font-family: Montserrat, sans-serif;font-weight: 500;width: 75px;height: 75px;border-radius: 50%;box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.16);z-index: 2;}
.card-link .read-more img{margin-top: 5px;}
.card-link:hover .read-more{opacity: 1;}

/* clr */
.card-link.card-child .read-more{background: #CC8B8B;}
.card-link.card-edu .read-more{background: #AAC6C7;}
.card-link.card-conveni .read-more{background: #A9C7AA;}
.card-link.card-access .read-more{background: #B1B8D3;}
.card-link.card-living-env .read-more{background: #C6C4A9;}
/* .card-link.card-security .read-more{background: #C6C4A9;}
.card-link.card-living .read-more{background: #B9AEA9;} */



.card-link .card-desc{font-size: 1.3rem;margin: 10px 0 0;line-height: 2;position: relative;}
.card-link .card-desc-hv{opacity: 0;position: absolute;}

.card-link:hover .card-desc{position: absolute;opacity: 0;}
.card-link:hover .card-desc-hv{opacity: 1;position: relative;}



.card-link .card-desc.long{margin: 17px 0 0;}
.card-link .img-hover img{position: absolute;bottom: 18px;z-index: 2;left: 50%;transform: translateX(-50%);}
.card-link.card-child01 .img-hover img{left: -5%;transform: unset;}
.card-link .img-hover .img-hv{opacity: 0; transition: opacity .25s ease-in-out;}
.card-link .img-hover .img-def{opacity: 1;transition: opacity .25s ease-in-out;}
.card-link:hover .img-hover .img-hv{opacity: 1;}
.card-link:hover .img-hover .img-def{opacity: 0;}

/* width img */
.card-link.card-child01 .img-hover img{width: 317px;transition: all 0.3s;}
.card-link.card-child01:hover .img-hover img{left: 10%;}
.card-link.card-child02 .img-hover img{width: 250px;}
.card-link.card-child03 .img-hover img{width: 206px;left: 45%;transition: all 0.3s;}
.card-link.card-child03:hover .img-hover img{bottom: 8px;}


.card-link.card-edu01 .img-hover img{width: 183px;}
.card-link.card-edu02 .img-hover img{width: 242px;bottom: -5%;transition: all 0.3s;}
.card-link.card-edu02:hover .img-hover img{bottom: 18px;}

.card-link.card-edu03 .img-hover img{width:258px;transition: all 0.3s;}
.card-link.card-edu03:hover .img-hover img{bottom: -5%;}

.card-link.card-conveni01 .img-hover img{width: 215px;left: 45%;}
.card-link.card-conveni02 .img-hover img{width: 175px;bottom: 0;left: 45%;}
.card-link.card-conveni03 .img-hover img{width: 125px;}


.card-link.card-access01 .img-hover img{width: 234px;left: -10%;transform: unset;transition: all 0.3s;}
.card-link.card-access01:hover .img-hover img{left: 10%;}
.card-link.card-access02 .img-hover img{width: 202px;left: 45%;}
.card-link.card-access03 .img-hover img{width: 272px;bottom: 15%;transition: all 0.3s;}
.card-link.card-access03:hover .img-hover img{bottom: 18px;left: 40%;}

.card-link.card-living-env01 .img-hover img{width: 207px;left: 45%;}
.card-link.card-living-env02 .img-hover img{width: 270px;}

.card-link.card-security01 .img-hover img{width: 207px;left: 45%;}
.card-link.card-security02 .img-hover img{width: 270px;}

.card-link.card-living01 .img-hover img{width: 142px;}
.card-link.card-living02 .img-hover img{width: 255px;}


@media screen and (max-width: 768px) {
    .list-card{flex-direction: column;justify-content: center;align-items: center;row-gap: 40px;}
}
.bound{opacity: 0;}
.bound.is-inview{animation: bound .6s cubic-bezier(.33, 1, .68, 1) forwards calc(.06 * 1s + 0s);}
    
@keyframes bound{
    0%{opacity: 0; transform: translateY(50%) scale(1.2, .8);}
    40%{opacity: 1; transform: translateY(-10%);}
    70%{opacity: 1; transform: translateY(5%) scale(1.2, .8);}
    100%{opacity: 1; transform: none;}
}