@charset "UTF-8";

*,html	{font-family: 'Noto Sans JP', sans-serif;font-size: 17px;font-weight: 300;line-height: 180%;letter-spacing:0.05em;box-sizing: border-box}

body	{color: #333;text-align: center;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}


/*　リスト
--------------------*/

/*数字リスト*/
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}}


/*
　TABLE
-----------------------*/
	
table {}
th,td	{padding: 10px;border: solid 1px #ccc;}
th {background: #efefef}

@media screen and (max-width: 640px) {
table {border-bottom: solid 1px #ccc;}
.tbl-r02 th,.tbl-r02 td {display: block;width: 100%;border-bottom: none;}
}



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

:root {
--head-height: 160px;/*ヘッダのメニューの高さ*/
--head-height2: -160px;/*ヘッダのメニューの高さ調整分*/
--head-inner-height: 100px;
--gnav-pc-height: 60px;

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

--blue: #036eb8;/*PC時グローバルナビ背景*/
--dark-blue: #171c61;/*ヘッダコンタクト　/　フッタの背景色*/
--light-blue: #b2c1e3;/*薄いブルー　トップページ*/
--light-gray: #efefef;/*薄いグレー*/
--green: #8ec31f;/*仲介グリーン*/
}


/*　wrap
--------------------*/

.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: 640px) {.cwrap	{max-width: auto;margin: 0 5%;}}

.cpadding {padding: 100px 0;}
.cpadding.last {padding: 100px 0 0 0;}
@media only screen and (max-width: 768px) {
.cpadding {padding: 60px 0;}
.cpadding.last {padding: 40px 0 0 0;}
}


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

#header	{height: var(--head-height);z-index:20000;}

#header	{position: fixed;top: 0;left: 0;width: 100%;background: #fff;box-shadow: 0 2px 2px rgba(0,0,0,0.1);}
#header	.pc {}
#header	.sp  {display: none;}

.head-inner	{display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;height: var(--head-inner-height);width: 95%;margin: 0 0 0 5%;}

.head-logo {width: 400px;}

.desc {position: absolute;top: 30px;left: calc(5% + 70px);font-size: 0.8rem}



.header-contact-pc	{display: flex;}
.header-telfax-pc	{width: 250px;margin: 20px 20px 0 0;}
.header-contact-button-pc	a{display: block;width: 100px;height: 100px;padding: 5px;background: var(--dark-blue);color: #fff;text-decoration: none;}
.header-contact-button-pc	i{font-size: 40px;margin: 10px;}
.header-contact-button-pc	span{font-size: 15px;font-weight: bold} 

#g-nav 	{height: var(--gnav-pc-height);background: var(--blue);display: flex;align-items: center;justify-content: flex-end;padding: 0 calc(5% - 1.5em) 0 5%}
#g-nav ul	{display:-webkit-box;display:-ms-flexbox;display:flex;}
#g-nav li	a{display: block;padding: 1em 1.5em;color: #fff;text-decoration: none}
#g-nav li	a	.en{display: none}

@media screen and (max-width:980px){
#header	{height: var(--head-height-sp);}
#header	.pc {display: none}
#header	.sp {display: inline}
#g-nav li	a	.en{display: block;color: #666;font-size: 12px;font-family: 'Noto Serif JP', serif;}

.head-logo {max-width: 380px;width: calc(100% - 80px);}
.header-contact-pc	{display: none}

.desc {position: fixed;top: 15px;left: 100px;font-size: 0.8rem}

#g-nav 	{}
#g-nav ul	{display:block;}

#g-nav{position:fixed;z-index:1;top:0;left: 100%;right:-120%;width:100%;height:100vh;padding: 0 0 0 5%;background: url(../image/logo_draw.png)rgba(255,255,255,.93) no-repeat;background-position: 95% 100%;background-size: 100%;transition:all .6s}
#g-nav.panelactive{left: 0;right:0}
#g-nav ul{position:absolute;z-index:1;top:40%;left:50%;width: 75%;transform:translate(-50%,-50%);padding-left: 4%;border-left: 1px solid var(--dark-blue);}
#g-nav li{list-style:none;text-align:left}
#g-nav li a{display:block;padding: 15px 0;font-size: 1.1rem;color:#333;text-decoration:none;text-transform:uppercase;letter-spacing:.1em;font-weight:400}

.openbtn{position:fixed;top:15px;right:20px;z-index:2;cursor:pointer;width:50px;height:50px;background:rgba(255,255,255,.4);}
.openbtn span{position:absolute;left:7px;height:2px;display:inline-block;transition:all .4s;background-color:#333;width:100%}
.openbtn span:nth-of-type(1){top:13px;width:100%}
.openbtn span:nth-of-type(2){top:23px;width:80%}
.openbtn span:nth-of-type(3){top:33px;opacity: 0}
.openbtn span:nth-of-type(4){top:31px;left: 0px;background: transparent}
.openbtn span:nth-of-type(4):before{content: 'MENU';font-size: 12px;letter-spacing: 0px;}
.openbtn.active span:nth-of-type(1){top:18px;left:8px;transform:translateY(6px) rotate(-45deg);width:70%}
.openbtn.active span:nth-of-type(2){opacity:0}
.openbtn.active span:nth-of-type(3){top:30px;left:8px;transform:translateY(-6px) rotate(45deg);width:70%;opacity: 1}
.openbtn.active span:nth-of-type(4){display: none}
}

@media screen and (max-width:900px){
.desc {position: fixed;top: 15px;left:90px;font-size: 0.8rem}
}

@media screen and (max-width:768px){
.desc {left: 12.2%;}
}

@media screen and (max-width:640px){
.desc {left: 14%;font-size: 0.5rem}
}

@media screen and (max-width:516px){
.desc {top: 10px;left: 4%;}
}


@media screen and (max-width:480px){
.desc {top: 15px;left: 3%;}
}

@media screen and (max-width:375px){
.desc {left: 3%;}
}

@media screen and (max-width:360px){
.desc {left: 3%;font-size: 0.48rem}
}



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

#maincontents	{padding-top: var(--head-height);}
#maincontents.home	{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);}
#maincontents.home	{margin-bottom: var(--head-height-sp2);}
.adjustment {padding-top: var(--head-height-sp);margin-top: var(--head-height2-sp);}
}


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

#footer	{overflow: hidden;}
#copiright	{padding: 100px 0 50px 0;background: var(--dark-blue);color: rgba(255,255,255,0.5);font-size: 0.8rem;}

.pagetop{position: relative;display: block;top: 40px;left: calc(50% - 40px);margin: 0;line-height: 0;z-index: 19999;}
.pagetop	a{display: block;border-radius: 50%;background: #ccc; color: #fff;width: 80px;height: 80px;padding-top: 28px;border: 3px solid #fff;text-align: center;text-decoration: none;line-height: 1em;}
.pagetop	a:hover    {background: #2a73a1;opacity: 1}
.pagetop	i{display: block;margin-top: -15px;font-size: 65px;line-height: 0.5em;text-align: center;}
.pagetop	span{display: block;margin-top: -2px;font-size: 10px;text-align: center;}
@media screen and (max-width:980px){
#copiright	{padding: 100px 0 0 0;background: transparent}
.pagetop{left: calc(100% - 50px);}
.pagetop	a{border-radius: 50%;background: #666;width: 40px;height: 40px;padding-top: 20px;border: none;}
.pagetop	i{margin-top: -2px;font-size: 30px;line-height:0}
.pagetop	span{display: none}
}


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

.sp-bottom-button	{z-index:19999;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(--dark-blue);text-align: center;border-top: 1px solid #537f9d}
.sp-bottom-button	a{display: block;width: 100%;color: #fff;text-decoration: none;}
.sp-bottom-button	span.tel{border-right: 1px solid #1e4763;font-size: 12px;}
.sp-bottom-button	span.mail{border-left: 1px solid #537f9d;font-size: 11px;}
.sp-bottom-button	.fa-mobile	{font-size: 33px;}
.sp-bottom-button	.fa-envelope-o{font-size: 22px;padding-bottom: 8px;}

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



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


/*動かないフェード*/
.fadeinfirst {animation-name: fadeinfirst;animation-duration: 1s;}
@keyframes fadeinfirst {
from {opacity: 0;}
to {opacity: 1;}
}

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


/*ふたつめ以降のフェード*/

.fadein {
opacity : 0;
transform : translate(0px, 100px);
transition : all 1000ms;
}
.fadein.scrollin {
opacity : 1;
transform : translate(0px, 0px);
}


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

/*ふたつめ以降のフェードの中のフェード*/
.fadein.finfade {
-moz-transition-delay: 40ms;
-webkit-transition-delay: 40ms;
-o-transition-delay: 40ms;
-ms-transition-delay: 40ms;
}