@charset "utf-8";

html {  }
body { margin: 0; font-size: 1.5rem }
.sp {display: none;}
a { transition-property: all;transition: 0.3s linear; }
a:focus, *:focus { rgba(255,255,255,0) }
a:active, *:active { rgba(255,255,255,0) }
a[href*="tel:"] { pointer-events: none; cursor: default; text-decoration: none; }

/**********************************************************************　大枠デザイン　*******************************************************************************/

.bread { max-width: 1280px; width: 92% ; margin: 30px auto; font-size: .8em; text-align: left; }
.txcpc { text-align: center }

body.home #imagewrap { height: 66.55vh; background-image: url("../index/image.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center top; }

body.business #imagewrap, body.housing #imagewrap
{ height: 66.55vh; background-repeat: no-repeat; background-size: auto 100%; background-position: right top; }

body.business #imagewrap { background-image: url("../business/business.jpg"); }
body.housing #imagewrap { background-image: url("../housing/housing.jpg"); }

.bg { background-image: url("../img/bg.svg"); background-repeat: no-repeat; background-size: 20% auto; background-position: left bottom; }

body.home h1.image-title { font-size: 2em; line-height: 1.4em; left: 45%; width: 50%; top: 10vw; text-align: left; }
body.home h1.image-title span { font-size: .6em; display: block; }

.telset{ position: absolute ; z-index: 1;}
.telset { top: 30px; right: 3%; width: 250%px }
.telset p { text-align: right; padding-bottom: 15px }
.telset .tel img { width: 250px; }
.telset .fb img { width: 30px; }
.telset .contact img { width: 150px; }
.topics { padding: 50px 20% 50px; }

body.business h1.image-title,
body.housing h1.image-title { font-size: 1.5em; line-height: 1.6em; left: 10%; width: 50%; top: 14vw; text-align: left; }
body.business h1.image-title img, 
body.housing h1.image-title img { width: 30%; padding-bottom: 10px }

footer#org, main { max-width: 1280px; width: 92% ; margin: 0 auto; text-align: justify; }
footer#org { font-size: .8em } 
.wrap { border: 1px #ccc solid; box-sizing: border-box; border-bottom-width: 0 }
.nallow { width: 80%; margin: 0 0 0 20%; }
.icon5 { width: 100px; margin: 50px auto 0; }
.house { width: 70%; margin: 50px 15% 100px; }
.org-content { padding: 0 40px 0; font-size: 1.0em; line-height: 1.8em; }
.org-content .logo { width: 150px; margin-left: calc(50% - 75px); margin-bottom: 30px}

.midashitag { position: absolute; z-index: 1; top: 0; }
.midashitag { width: 20%; left: -25%; }

.flows { padding: 100px 0 0px; margin-top: 50px }
.flows { position: relative; background-image: url("../img/flow.svg"); background-size: 300px auto; background-repeat: no-repeat; background-position: left top; }
.flows h4 { font-size: 1.2em; left: 10px; top: -13px; width: 280px; text-align: center; }
.flows p { left: 330px; top: 10px; }

.workwrap > div { width: 25%; padding: 10px 0 }
.hatena { position: absolute; z-index: 1; left: 0px; top: 70px; width: 25%; }
.hatena .eng { font-size: 2em; }

.lft { float: left; }
.rgt { float: right; }

.gobu .lft { width: 46% }
.gobu .rgt { width: 46% }

.sanbu .lft { float: left; width: 32%; padding-left: 1% }
.sanbu .rgt { width: 32% }

.contactwrap { padding: 0 10%; }


footer#org .fst { width:16%; margin: 30px 4% 50px 4% }
footer#org .scd { width:23%; margin: 30px 4% 50px 4% }
footer#org .thd { width:18%; margin: 30px 4% 50px 0 }
footer#org .frt { width:18%; margin: 30px 0% 50px 0 }

.tel { padding: 20px 0 0; }

footer#org .lnks a { display: inline-block; margin: 0 5px; width: 130px }
footer#org .lnks a i { padding-right: 5px }

.photowrap img, .photo3wrap img { width: 25% }
.photo5wrap img { width: 20% }
.photo2wrap img { width: 50% }

/***** 　　　　　左右1366で縛るかどうか？ 　　　　　　*****/ 

header#togglebox { background-color: #efefef }
header#togglebox .logo { left: 3%; top: 30px; width: 12%; }
header#togglebox .misaki { right: 3%; top: 30px; width: 12%; }

header#togglebox nav { height: 110px; position: relative; }
header#togglebox nav { width: 92% ; margin: 0 auto; } 

header#togglebox nav ul { width: 70% ; padding: 50px 14% 0 16% }
header#togglebox nav ul li { float: left; width: 14%; text-align: center }
header#togglebox nav ul li:nth-child(2) { width: 30%; }
header#togglebox nav ul li a { display: inline-block; color: hsla(187,99%,35%,1); border-bottom: solid 2px hsla(187,99%,35%,0); }

body.hikari header#togglebox nav ul li:nth-child(2) a, 
body.business header#togglebox nav ul li:nth-child(3) a, 
body.housing header#togglebox nav ul li:nth-child(4) a, 
body.works header#togglebox nav ul li:nth-child(5) a, 
body.contact header#togglebox nav ul li:nth-child(6) a, 
header#togglebox nav ul li a:hover 
{ border-bottom: solid 2px hsla(187,99%,35%,1); }


@media screen and (min-width: 1281px) {  }


/*********************************************************************** ヘッダー ******************************************************************************/
/*********************************************************************** フッター ******************************************************************************/

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

}

@media screen and (min-width: 900px) 
{

}

/***********************色分け**************************/