@charset "UTF-8";

*,html	{font-family: "Noto Sans JP", sans-serif;font-size: 16px;line-height: 180%;box-sizing: border-box}

body	{color: #555555;text-align: center;letter-spacing:0.05em;word-break: break-all;overflow: hidden;overflow-y:scroll;}

img	{width: 100%;height: auto;line-height: 0}
a:hover	{opacity: 0.5;transition: all 0.5s;}
p	{margin-bottom: 1em}
p.none	{margin-bottom: 0}

/*font*/
.noto-serif{font-family: "Noto Serif JP", serif;}

/*数字リスト*/
ul.decimal	{margin: 0 0 0.5em 1.2em;list-style-type: decimal}
ul.decimal:last-child	{margin: 0 0 0 1.2em;}
/*・リスト*/
ul.disc    {margin:0;list-style-type:none;font-size:100%;}
ul.disc    li{margin-left:0;text-indent:-1em;padding-left:1em;line-height:150%;}
ul.disc    li:before{content:"・"}
/*米印リスト*/
ul.kome{margin:0;list-style-type:none;font-size:100%}
ul.kome li{margin-left:-1em;text-indent:-1em;padding-left:2em;line-height:150%}
ul.kome li:before{content:"※"}

/*改行*/
.pconly{display:inline}
.w48,.w64,.w768,.w980{display:none}
@media screen and (max-width:1100px){.pconly{display:none}}
@media screen and (max-width:980px){.w980{display:inline}}
@media screen and (max-width:768px){.w768{display:inline}}
@media screen and (max-width:640px){.w64{display:inline}.w64none{display:none}}
@media screen and (max-width:480px){.w48{display:inline}}




/*---------------------------
　:root
---------------------------*/

:root {
--head-height: 110px;/*ヘッダのメニューの高さ*/
--head-height2: -110px;/*ヘッダのメニューの高さ調整分*/

--head-height-sp: 80px;/*ヘッダのメニューの高さ*/
--head-height2-sp: -80px;/*ヘッダのメニューの高さ調整分*/


--color-01: #00a29a;
--color-02: #00913a;
--color-03: #2ca7e1;
--color-04: #ddedeb;
--color-05: #eff5ed;
--color-06: #0fc4bb;
}


/*---------------------------
　HEADER 
---------------------------*/

#header	{height: var(--head-height);}
#header	{position: fixed;top: 0;left: 0;display:flex;justify-content: center;align-items: center;width: 100%;background: #fff;box-shadow: 0 2px 2px rgba(0,0,0,0.1);z-index:1999}

.head-inner	{display:flex;justify-content: space-between;align-items: center;width: 96%;margin: auto 2%}

.header-logo	{position: relative;display: block;width: 300px;height: 60px;color: #333;text-decoration: none;z-index:20000;}
.header-mark	{position: absolute;top: 0;left: 0;width: 60px;}
.header-catch{position: absolute;top:7px;left: 70px;font-family: "Noto Serif JP", serif;font-size: 13px;font-weight: 400;}
.header-text{position: absolute;top: 30px;left: 70px;width: 230px;}

.header-tel-info	{position: relative;width: 280px;height: 40px;margin: 12px 120px 0 auto;}
.header-tel-num	{position: absolute;top: 0;left: 0;}
.header-tel-num	a	{display:flex;align-items: center;color: var(--color-01);font-weight: 700;font-size: 31px;text-decoration: none;letter-spacing: -0.001em;}
.header-tel-icon	{display: block;width: 45px;height: 45px;margin-right: 10px;}
.header-tel-time	{position: absolute;top: 45px;left: 40px;color: #999;font-size: 11px;}

.header-right	{}

.header-contact	{position: fixed;top: 10px;right: 2%;display: block;width: 100px;height: 100px;}

#g-nav ul	{display:flex;margin: 15px 120px 0 auto;}
#g-nav li	a{display: block;padding: 1em 1.5em 1em 25px;color: #333;background: url(../image/header_allow.png) no-repeat left;background-size: 18px;font-family: "Noto Serif JP", serif;font-size: 15px;text-decoration: none}

@media screen and (max-width: 1380px){
.header-contact	{top: 15px;width:80px;height: 80px;}
.header-tel-info	{margin: 12px 80px 0 auto;}
#g-nav ul	{margin: 15px 80px 0 auto;}
#g-nav li	a{padding: 1em 0.5em 1em 15px;font-size: 12px;background-size: 13px;}
#g-nav li	i{padding: 1em 0.5em 1em 15px;font-size: 12px;}
}



@media screen and (max-width:980px){

#header	{height: var(--head-height-sp);}

.head-inner	{width: 92%;margin: auto 3%}

.header-tel-info,
.header-contact	{display: none}

.header-logo	{width: 270px;height: 60px}
.header-mark	{top:5px;width: 50px;}
.header-catch{top:7px;left: 60px;font-size: 12px;font-weight: 500;}
.header-text{top: 30px;left: 60px;width: 200px;}

.openbtn{position:fixed;top:0;right:0;z-index:2;cursor:pointer;width:75px;height:80px;background: #2ca7e1;}
.openbtn span{position:absolute;left:10px;height: 1px;display:inline-block;transition:all .4s;background:#fff;transition: all 0.5s;}
.openbtn span:nth-of-type(1){top:30px;width:70%}
.openbtn span:nth-of-type(2){top:40px;width:50%;margin-left: 20%}
.openbtn span:nth-of-type(3){opacity: 0;transition: all 0.5s;}
.openbtn span:nth-of-type(4){top:50px;left:0;width: 70%;height: auto;background: none}
.openbtn span:nth-of-type(4):before{width: 60%;margin-left: 35%;content: 'MENU';display: block;white-space: nowrap;color: #fff;font-size: 0.8rem;text-align: right;opacity: 1;}

.openbtn.active span	{height: 2px;}
.openbtn.active span:nth-of-type(1){top:35px;left:18px;transform:translateY(6px) rotate(-45deg);width:50%}
.openbtn.active span:nth-of-type(2){opacity:0}
.openbtn.active span:nth-of-type(3){top:47px;left:18px;transform:translateY(-6px) rotate(45deg);width:50%;opacity: 1;}
.openbtn.active span:nth-of-type(4):before{opacity: 0}

#g-nav ul	{display:block;}

#g-nav{position:fixed;z-index:1;top:0;left: 100%;right:-120%;width:100%;height:100vh;background:rgba(255,255,255,.9);transition:all .6s}
#g-nav.panelactive{left: 0;right:0}
#g-nav ul{position:absolute;z-index:1;top:30%;left:50%;width: 80%;transform:translate(-50%,-50%);}
#g-nav li{list-style:none;text-align:left}
#g-nav li a{display:block;margin: 10px 0;padding: 10px 0 15px 20px;font-size: 1rem;color:#333;text-align:left;text-decoration:none;text-transform:uppercase;letter-spacing:.1em;}
#g-nav li	a{background: url(../image/header_allow_2.png) no-repeat left;background-size: 10px;border-bottom: 1px dashed #ccc;}

}


/*---------------------------
　MAIN
---------------------------*/

#maincontents	{padding-top: var(--head-height);margin-bottom: var(--head-height2);}
.adjustment {padding-top:  var(--head-height);margin-top: var(--head-height2);}
@media screen and (max-width:980px){
#maincontents	{padding-top: var(--head-height-sp);margin-bottom: var(--head-height2-sp);}
.adjustment {padding-top:  var(--head-height-sp);margin-top: var(--head-height2-sp);}
}

/*ページタイトル*/
.page-title	{position: relative;display:flex;justify-content: center;align-items: center;height: 200px;font-family: "Noto Serif JP", serif;font-size: 30px;font-weight: 500;letter-spacing: 0.1em;overflow: hidden;}
.page-title	{background: linear-gradient(110deg, #4ddad7 0, #fff 30%,#fff 70%,#4ddad7 100%);}

.page-title.property-title	img{position: absolute;top: -10px;bottom: 0;right: 10%;width: auto;height: 300px;}
.page-title.realestate-title	img{position: absolute;top: 0;bottom: 0;right: 0;width: auto;height: 250px;}
@media screen and (max-width:980px){
.page-title	{height: 150px;font-size: 25px;background: linear-gradient(130deg, #76ebe8 0, #fff 40%,#fff 60%,#76ebe8 100%);}
.page-title.property-title	img,
.page-title.realestate-title	img{display: none}
}


/*共通ブロックタイトル*/
.block-title {position: relative;display:flex;justify-content: center;align-items: center;margin-bottom: 50px;font-family: "Noto Serif JP", serif;font-size: 25px;text-align: center;}
.block-title p{padding: 0 20px;line-height: 1.4em}
.block-title span {position: relative;top: -10px;width: 100px;height: 2px;line-height: 2px; background: var(--color-01);}
@media screen and (max-width:980px){
.block-title {margin-top: 20px;margin-bottom: 40px;font-size: 22px;}
.block-title span {display: none}
.block-title:after{content: ' ';position: absolute;left: 40%;right: 40%;bottom: 5px;height: 2px;line-height: 20px; background: var(--color-01);}
}


.cwrap	{max-width: 1200px;margin: 0 auto;text-align: left;}
@media only screen and (max-width: 1200px) {.cwrap	{max-width: auto;margin: 0 4%;}}
@media only screen and (max-width: 768px) {.cwrap	{max-width: auto;margin: 0 7%;}}

.cpadding {padding: 80px 0;}
.cpadding-02 {padding: 80px 0 90px;}
.cpadding-bottom {padding: 0 0 80px 0;}
.cpadding-top {padding: 80px 0 0 0;}

@media only screen and (max-width: 768px) {
.cpadding {padding: 50px 0 70px;}
.cpadding-02 {padding: 50px 0 70px;}
.cpadding-bottom {padding: 0 0 50px 0;}
.cpadding-top {padding: 50px 0 0 0;}
}

/*to-other-site*/
.to-other-site {display:flex;justify-content: center;align-items: center;}
.to-other-site p{margin: 0}
.to-other-site a{position: relative;display: block;width: 600px;padding: 15px 0;background: var(--color-06);border: 3px solid var(--color-01);color: #fff;font-size: 25px;font-weight: 600;border-radius: 10px;text-align: center;text-decoration: none;}
.to-other-site a i{position: absolute;top: 20px;right: 40px;transition: all 0.5s;}
.to-other-site a:hover{background: var(--color-02);border: 3px solid var(--color-02);opacity: 1}
.to-other-site a:hover i{right: 30px;}
@media only screen and (max-width: 768px) {
.to-other-site p{display: block;min-width: 100%;width: 100%;overflow: hidden;}
.to-other-site a{min-width: 100%;width: 100%;margin: 0;overflow: hidden;}
}

/*to-contact-page*/
.to-contact-page {display:flex;justify-content: center;align-items: center;}
.to-contact-page p{margin: 0}
.to-contact-page a{position: relative;display: block;width: 600px;padding: 15px 0;background: var(--color-01);color: #fff;font-size: 21px;font-weight: 600;border-radius: 10px;text-align: center;text-decoration: none;}
.to-contact-page a i{position: absolute;top: 20px;right: 40px;transition: all 0.5s;}
.to-contact-page a:hover{background: var(--color-02);opacity: 1}
.to-contact-page a:hover i{right: 30px;}
@media only screen and (max-width: 768px) {
.to-contact-page p{display: block;min-width: 100%;width: 100%;overflow: hidden;}
.to-contact-page a{min-width: 100%;width: 100%;margin: 0;overflow: hidden;}
}



.text-01 {font-family: "Noto Serif JP", serif;font-size: 18px;}

.mg01 {margin-bottom: 60px;}


/*---------------------------
　FOOTER
---------------------------*/

#footer	{}
.footer-inner-wrap	{padding: 0 0 50px}


.footer-link	{margin-bottom: 40px;border-bottom: 1px solid #e5e5e5;}
.footer-link	a{display: block;padding: 25px 0;color: #666;text-decoration: none}
.footer-link-inner	{display:flex;justify-content: center;}
.footer-link-list	{display:flex;justify-content: space-around;width: 100%;}


@media screen and (max-width:980px){
.footer-inner-wrap	{padding: 30px 0 50px}
.footer-link-list{flex-wrap: wrap;}
.footer-link	{margin-bottom: 50px;border-bottom: none}
.footer-link-list	li {flex-basis: 100%;margin-bottom: 0.5em;}
.footer-link	a{padding: 0.7em 1em;border-bottom: 1px solid #e5e5e5;color: var(--color-01)}
}




.footer-info	{color: #666;text-align: center}
.footer-info	a{color: #666;text-decoration: none}




.footer-logo	{position: relative;display: block;width: 300px;height: 60px;margin: 0 auto 30px;color: #333;text-decoration: none;z-index:20000;}
.footer-mark	{position: absolute;top: 0;left: 0;width: 60px;}
.footer-catch{position: absolute;top:7px;left: 70px;font-family: "Noto Serif JP", serif;font-size: 13px;font-weight: 400;}
.footer-text{position: absolute;top: 30px;left: 70px;width: 230px;}


.footer-info-tel-wrap	{position: relative;width: 280px;height: 40px;margin: 0 auto;}
.footer-tel-num	{position: absolute;top: 0;left: 0;}
.footer-tel-num	a	{display:flex;align-items: center;color: var(--color-01);font-weight: 700;font-size: 31px;text-decoration: none;letter-spacing: -0.001em;}
.footer-tel-icon	{display: block;width: 45px;height: 45px;margin-right: 10px;}
.footer-tel-time	{position: absolute;top: 45px;left: 40px;color: #999;font-size: 11px;}

.footer-name	{margin-bottom: 10px;font-weight: 700}
.footer-adress	{margin-bottom: 30px;line-height: 1.5em}


#copiright	{padding: 25px 10px;font-size: 0.8rem;border-top: 1px solid #e5e5e5;}


@media screen and (max-width:980px){
#copiright	{border-top: none;}
}

/*---------------------------
　PAGETOP
---------------------------*/

.pagetop{position: fixed;display: block;bottom: 0; right: 0;margin: 0;text-align: right;z-index: 1000;}
.pagetop    a{display: block;width: 130px;height: 40px;background: var(--color-01); color: #fff;font-size: 15px;line-height: 40px;text-align: center;text-decoration: none;}
.pagetop    a	.fa{margin-right:8px;font-size: 20px;line-height: 38px;}
.pagetop    a:hover    {background: var(--color-03);color: #fff;opacity: 1}

@media screen and (max-width:980px){
.pagetop{bottom: 60px; right: 0;margin: 0;padding: 0;}
.pagetop    a{width: 40px;height: 40px;margin:auto;color: var(--color-01);background: #fff; text-align: center;}
.pagetop    a	.fa{margin-right:0;}
.pagetop    span{display: none}

}



/*---------------------------
　for SP Bottom button
---------------------------*/

.sp-bottom-button	{z-index:20000;position: fixed;left: 0;bottom: 0;right: 0;display: block;width: 100%}
.sp-bottom-button	ul{display: flex;}
.sp-bottom-button	li{flex-basis: 50%;height: 60px;}
.sp-bottom-button	span{display:flex;justify-content: center;align-items: center;height: 60px;background: var(--color-01);text-align: center;border-top: 1px solid #0bd3c9;}
.sp-bottom-button	a{display: block;width: 100%;color: #fff;text-decoration: none;}
.sp-bottom-button	span.tel{border-right: 1px solid #055d59;font-size: 11px;padding-bottom: 5px;}
.sp-bottom-button	span.mail{border-left: 1px solid #0bd3c9;font-size: 11px;}
.sp-bottom-button	.fa-mobile	{font-size: 35px;}
.sp-bottom-button	.fa-envelope-o{font-size: 22px;padding-bottom: 8px;}

@media screen and (min-width:981px){
.sp-bottom-button	{display: none;}
}


/*------------------------
/////FADE/////////////////
------------------------*/

/*フェードのみ*/
.fadeonly {animation-name: fadein01;animation-duration: 1s;}
@keyframes fadein01 {
from {opacity: 0;}
to {opacity: 1;}
}

/*ひとつめのフェード*/
.fadeinf {animation-name: fadein02;animation-duration: 1s;}
@keyframes fadein02 {
from {opacity: 0;transform: translateY(30px);}
to {opacity: 1;transform: translateY(0);}
}

/*ふたつめ以降のフェード*/
.fadein {
opacity : 0;
transform : translate(0, 100px);
transition : all 1000ms;
}
.fadein.scrollin {
opacity : 1;
transform : translate(0, 0);
}

@keyframes fadein {
from {
opacity: 0.1;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}