@charset "UTF-8";

/* CSS Document */

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





/*　　　共通項目　　　*/

* {
	line-height: 1.0;
}

html {
	font-size: 62.5%;
}

body {
	/* font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif; */
	font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

h2 {
	font-size: 4.0rem;
	line-height: 1.0;
}

img {
	height: auto;
}

p {
	font-size: 1.6rem;
}

a {
	transition-property: opacity;
	transition-duration: 0.5s;
}

a:hover {
	opacity: 0.7; 
	cursor: pointer;
}

.sub-title {
	margin: 0 0 10px;
}

.m-plus-1p-thin {
  font-family: "M PLUS 1p", sans-serif;
  font-weight: 100;
  font-style: normal;
}

#breadcrumbs {
	font-size: 1.2rem;
}

#breadcrumbs span {
	margin: 0 6px;
}

#breadcrumbs span:first-child {
	margin: 0 6px 0 0;
}

#breadcrumbs a {
	color: #000;
	text-decoration: none;
}





/*　　　ヘッダー　　　*/

header .header-area {
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 999;
}

header .logo-wrap {
	position: fixed;
	top: 50px;
	left: 50px;
}

header .logo-wrap .brand-text {
	padding: 0 0 5px;
	font-size: 1.4rem;
	letter-spacing: .15em;
}

header .nav-wrap {
	position: fixed;
	top: 20px;
	right: 0;
}

header .nav-wrap .sns-wrap {
	margin: 0 0 10px;
	padding: 0 30px 0 0;
	text-align: right;
}

header .nav-wrap .sns-wrap img {
	margin: 0 0 0 10px;
}

#g-nav {
	display: flex;
	flex-direction: column-reverse;
}

#g-nav ul {
	display: flex;
	padding: 0 20px 0 30px;
	border-radius: 20px 0 0 20px;
	background-color: rgba( 255, 255, 255, 0.8 );
}

#g-nav ul li {
	padding: 10px;
	font-size: clamp(1.2rem, 1.56vw, 1.6rem);
}




/*　　　フッター　　　*/

footer {
	padding: 100px 0 20px;
	 background-image: linear-gradient(150deg, rgba(255, 247, 213, 1) 10%, rgba(255, 226, 247, 1) 90%);
}

footer .cta-area {
	margin: 0 0 100px;
}

footer .cta-area .sub-title {
	text-align: center;
}

footer .cta-area .title {
	margin: 20px 0 0;
	font-size: 4.0rem;
	line-height: 1.0;
	text-align: center;
}

footer .cta-area .tel-wrap {
	position: relative;
	margin: 80px 0 60px;
	text-align: center;
}

footer .cta-area .tel-wrap .family-photo {
	position: absolute;
	top: -60px;
	width: 658px;
	transform: translate( -50%, 0 );
}

footer .cta-area .tel-wrap .worries-text {
	margin: 0 0 150px;
	font-size: 1.8rem;
	line-height: 1.5;
}

footer .cta-area .tel-wrap .button {
	width: 800px;
	margin: 0 auto;
	padding: 60px 0 40px;
	background: #DD4F4F;
	box-shadow: inset -5px -5px 10px rgba( 0, 0, 0, 0.2 );
	border-radius: 30px;
	color: #fff;
}

footer .cta-area .tel-wrap .button .inquiry {
	margin: 0 0 5px;
	font-size: 1.8rem;
}

footer .cta-area .tel-wrap .button .phone-icon {
	margin: 0 10px 0 0;
	vertical-align: 0;
}

footer .cta-area .tel-wrap .button span {
	font-size: 6.0rem;
}

footer .cta-area .tel-wrap .button .note {
	font-size: 1.4rem;
}

footer .cta-area .cta-wrap {
	display: flex;
	gap: 4px;
}

footer .cta-area .cta-wrap .catalog {
	position: relative;
	width: 50%;
	height: 0;
	padding: 25% 0 0;
	background: url( "../images/common/p_cta-01.webp" ) no-repeat;
	background-size: cover;
}

footer .cta-area .cta-wrap .hearing {
	position: relative;
	width: 50%;
	height: 0;
	margin: 0;
	padding: 25% 0 0;
	background: url( "../images/common/p_cta-02.webp" ) no-repeat;
	background-size: cover;
}

footer .cta-area .cta-wrap .box {
	position: absolute;
	top: 50%;
	left: 5%;
	transform: translate( 0, -50% );
}

footer .cta-area .cta-wrap .box .sub-title {
	font-size: 0.83vw;
	text-align: left;
}

footer .cta-area .cta-wrap .box .title {
	margin: 5px 0 30px;
	font-size: 2.08vw;
	line-height: 1.5;
	text-align: left;
}

footer .cta-area .cta-wrap .box .button {
	width: 18.75vw;
	padding: 1.97vw 0;
	border-radius: 10px;
	box-shadow: inset -5px -5px 10px rgba( 0, 0, 0, 0.2 );
	background: #DD4F4F;
	color: #fff;
	font-size: 1.25vw;
	text-align: center;
}

footer .footer-area {
	max-width: 1280px;
	margin: 0 auto;
}

footer .logo-wrap {
	width: 180px;
	text-align: center;
}

footer .logo-wrap .brand-text {
	padding: 0 0 20px;
	font-size: 1.4rem;
	letter-spacing: .15em;
}

footer .brand-title {
	margin: 30px 0 0;
}

footer .company-area {
	display: flex;
	justify-content: space-between;
	margin: 80px 0;
	color: #888;
}

footer .company {
	width: 300px;
}

footer .company .tel {
	margin: 15px 0 0;
	font-size: 1.8rem;
}

footer .company dl {
	font-size: 1.2rem;
}

footer .company dt {
	margin: 15px 0 0;
	font-weight: 300;
}

footer .company dd {
	margin: 3px 0 0;
}

footer .company .note {
	margin: 15px 0 0;
	font-size: 1.2rem;
	line-height: 1.5;
}

footer .footer-gnav {
	display: flex;
	justify-content: space-between;
	width: 800px;
}

footer .footer-gnav li {
	padding: 0 0 10px;
	font-size: 1.2rem;
}

footer .footer-gnav li:first-child {
	padding: 0 0 30px;
	color: #000;
	font-size: 1.6rem;
}

footer .last-wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

footer .sns-wrap img {
	margin: 0 10px 0 0;
}

footer .copyright {
	display: flex;
	margin: 20px 0 0;
}

footer .copyright li {
	padding: 0 10px;
	border-left: solid 1px #000;
	font-size: 1.2rem;
}





/*　　　LINE UP　　　*/

.cta-brand {
	margin: 150px 0 0;
	text-align: center;
}

.cta-brand .brand-area {
	display: flex;
	gap: 30px;
	margin: 50px 0 0;
}

.cta-brand .brand-area .brand-wrap {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: calc( 100% / 3 );
	padding: 180px 0 35px;
	border-radius: 20px;
}

.cta-brand .brand-area .brand-wrap .brand-box {
	color: #fff;
}

.cta-brand .brand-area .brand-wrap .brand-box .brand-name {
	margin: 125px 0 20px;
	font-size: 2.4rem;
}

.cta-brand .brand-area .brand-wrap .brand-box .text {
	margin: 0 0 30px;
	font-size: 1.8rem;
	line-height: 1.5;
}

.cta-brand .brand-area .brand-wrap .brand-box .button {
	width: 100px;
	margin: 0 auto;
	padding: 10px 0;
	border: solid 1px #fff;
	border-radius: 17px;
	font-size: 1.2rem;
}

.cta-brand .brand-area .custom-home {
	background-image: linear-gradient(160deg, rgba(250, 245, 183, 1) 10%, rgba(245, 193, 17, 1) 90%);
	box-shadow: -5px -5px 5px #dcad0d inset;
}

.cta-brand .brand-area .custom-home-nano {
	background-image: linear-gradient(160deg, rgba(255, 183, 255, 1) 10%, rgba(244, 106, 185, 1) 90%);
	box-shadow: -5px -5px 5px #d260a1 inset;
}

.cta-brand .brand-area .custom-home-alpha {
	background-image: linear-gradient(160deg, rgba(192, 230, 154, 1) 10%, rgba(62, 178, 102, 1) 90%);
	box-shadow: -5px -5px 5px #388954 inset;
}

.cta-brand .brand-area .custom-home .logo,
.cta-brand .brand-area .custom-home-nano .logo {
	width: 160px;
	margin: 0 auto;
}

.cta-brand .brand-area .custom-home-alpha .logo {
	width: 185px;
	margin: 0 auto;
}





/*　　　トップページ　　　*/

.top-firstview {
	padding: 235px 0 100px;
	background-image: linear-gradient(150deg, rgba(255, 247, 213, 1) 10%, rgba(255, 226, 247, 1) 90%);
}

.top-firstview h1 {
	margin: 100px 0 0;
	padding: 0 0 30px;
	font-size: 4.0rem;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

.top-firstview .text {
	font-size: 1.7rem;
	line-height: 2.0;
}

.top-firstview .area01 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 1280px;
	margin: 0 auto;
}

.top-firstview .area01 .wrap01,
.top-firstview .area01 .wrap02 {
	width: 600px;
}

.top-firstview .area01 .wrap01 .text {
	margin: 50px 0 0;
}

.top-firstview .area01 .wrap01 .box {
	display: flex;
	gap: 20px;
	margin: 100px 0 0;
}

.top-firstview .area02 {
	width: 1280px;
	margin: 100px auto 0;
}

.top-firstview .area02 .wrap {
	display: flex;
	justify-content: space-between;
}

.top-firstview .area02 .wrap .box01,
.top-firstview .area02 .wrap .box02 {
	margin: 50px 0 0;
}

.top-firstview .area02 .wrap .box01 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 50px 0;
	width: 790px;
}

.top-firstview .area02 .wrap .box01 article {
	width: 380px;
}

.top-firstview .area02 .wrap .box01 article img {
	width: 380px;
}

.top-firstview .area02 .wrap .box01 article .region {
	display: inline-block;
	margin: 10px 0 5px;
	padding: 5px 8px;
	background: #000;
	color: #fff;
	font-size: 1.0rem;
}

.top-firstview .area02 .wrap .box01 article h3 {
	font-size: 1.6rem;
}

.top-firstview .area02 .wrap .box02 {
	width: 450px;
}

.top-firstview .area02 .wrap .box02 .text {
	margin: 80px 0 50px;
}

.top-firstview .area02 .wrap .box02 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 10px;
}

.top-firstview .area02 .wrap .box02 ul li {
	width: 200px;
}

.top-firstview .area02 .wrap .box02 ul li a {
	display: block;
	padding: 13px 0;
	border: solid 1px #000;
	border-radius: 25px;
	font-size: 1.4rem;
	text-align: center;
}

.top-firstview .area02 .wrap .box02 ul li a:hover {
	background: #fff;
	border: none;
}

.top-link {
	width: 1280px;
	margin: 150px auto 0;
}

.top-link .notice-area {
	width: 960px;
	margin: 0 auto;
}

.top-link .notice-area .title-wrap {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.top-link .notice-area .title-wrap .menu-tab {
	display: flex;
	position: relative;
	bottom: 5px;
	border-right: solid 1px #000;
}

.top-link .notice-area .title-wrap .menu-tab li {
	padding: 0 10px;
	border-left: solid 1px #000;
}

.top-link .news-wrap {
	display: flex;
	gap: 18px;
	width: 960px;
	margin: 30px auto 0;
}

.top-link .news-wrap article {
	width: calc( 960px / 4 );
}

.top-link .news-wrap article img {
	width: 100%;
}

.top-link .news-wrap article time {
	display: block;
	margin: 10px 0 0;
	font-size: 1.2rem;
}

.top-link .news-wrap article h3 {
	font-size: 1.6rem;
	line-height: 1.5;
}

.top-link .event-area {
	display: flex;
	justify-content: space-between;
	width: 960px;
	margin: 30px auto 0;
}

.top-concept {
	width: 1280px;
	margin: 150px auto 0;
}

.top-concept .concept-area {
	display: flex;
	gap: 50px;
	position: relative;
	margin: 50px 0 0;
}

.top-concept .concept-area .wrap dl {
	width: 732px;
	border-top: solid 1px #000;
}

.top-concept .concept-area .wrap dt {
	padding: 5px 0 0;
	font-weight: 300;
	font-size: 1.6rem;
}

.top-concept .concept-area .wrap dd {
	padding: 40px 0 60px;
	border-bottom: solid 1px #000;
	font-size: 2.8rem;
}

.top-concept .concept-area .wrap a {
	display: block;
	width: 200px;
	margin: 50px auto 0;
	padding: 13px 0;
	border: solid 1px #000;
	border-radius: 25px;
	font-size: 1.4rem;
	text-align: center;
}

.top-concept .features-area {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin: 30px 0 0;
}

.top-concept .features-area .circle {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 313px;
	border: solid 1px #DD4F4F;
	border-radius: 100%;
	text-align: center;
}

.top-concept .features-area .circle:before {
	display: block;
	content: '';
	padding: 100% 0 0;
}

.top-concept .features-area .circle .box {
	font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

.top-concept .features-area .circle .box h3 {
	color: #DD4F4F;
	font-weight: 100;
	font-size: 2.8rem;
}

.top-concept .features-area .circle .box span {
	display: block;
	width: 190px;
	margin: 20px 0;
	border-top: solid 1px #DD4F4F;
}

.top-concept .features-area .circle .box p {
	color: #DD4F4F;
	font-weight: 100;
	font-size: 1.6rem;
}

.top-slider-area {
	margin: 150px 0 0;
}

.top-slider-area img {
	width: 100%;
	height: auto;
}

.top-slider-area .slick-slide {
	margin: 0 5px;
}

.top-construction-area {
	width: 960px;
	margin: 150px auto 0;
}

.top-construction-area .wrap {
	position: relative;
	margin: 50px 0 0;
}

.top-construction-area .wrap .text {
	font-size: 1.7rem;
	line-height: 2.0;
}

.top-construction-area .wrap dl {
	margin: 30px 0 0;
	font-size: 1.4rem;
}

.top-construction-area .wrap dl:first-child {
	margin: 0;
}

.top-construction-area .wrap dd {
	margin: 5px 0 0;
	line-height: 1.5;
}

.top-construction-area .wrap dt {
	margin: 20px 0 0;
}

.top-construction-area .wrap img {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
}

.top-sns-area {
	width: 1280px;
	margin: 150px auto;
	text-align: center;
}

.top-sns-area .wrap {
	display: flex;
	justify-content: space-between;
	margin: 50px 0 0;
}





/*　　　プライバシーポリシー　　　*/

.privacy-policy main {
	width: 960px;
	margin: 0 auto;
	padding: 250px 0 20px;
	font-size: 1.8rem;
	text-align: justify;
}

.privacy-policy main h1 {
	font-weight: 600;
	font-size: 3.6rem;
	text-align: center;
}

.privacy-policy main h2 {
	margin: 100px 0 30px;
	font-weight: 600;
	font-size: 2.4rem;
}

.privacy-policy main h3 {
	margin: 50px 0 20px;
	font-weight: 600;
	font-size: 2.0rem;
}

.privacy-policy main h4 {
	margin: 50px 0 20px;
	font-weight: 600;
}

.privacy-policy main p {
	font-size: 1.8rem;
}

.privacy-policy main p,
.privacy-policy main li,
.privacy-policy main dd {
	line-height: 1.5;
}

.privacy-policy main ol {
	margin: 20px 0 0;
	padding: 0 0 0 1em;
	list-style: decimal;
}

.privacy-policy main dt {
	margin: 20px 0 10px;
}

.privacy-policy main a {
	color: #00e;
	text-decoration: underline;
}

.privacy-policy main .rdp {
	margin: 0 0 150px;
}






/*　　　施工事例　　　*/

.single-works .first-view img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.single-works .works-area {
	width: 960px;
	margin: 150px auto 0;
}

.single-works .works-area h1 {
	font-size: 4.0rem;
	text-align: center;
}

.single-works .works-area .text {
	width: 660px;
	margin: 60px auto 0;
	line-height: 2.0;
}

.single-works .works-area dl {
	display: flex;
	flex-wrap: wrap;
	border-top: solid 1px #000;
	margin: 100px 0 0;
	font-size: 1.4rem;
}

.single-works .works-area dt {
	width: 160px;
	padding: 30px 0 30px 20px;
	border-bottom: solid 1px #000;
}

.single-works .works-area dd {
	width: 800px;
	padding: 30px 0;
	border-bottom: solid 1px #000;
}

.single-works .gallery-wrap {
	columns: 3;/*段組みの数*/
	margin: 100px 0 0;
}

.single-works .gallery-wrap li {
	margin-bottom: 10px;/*各画像下に余白をつける*/
	list-style: none;
}

.single-works .gallery-wrap img {
	width: 100%;
	height: auto;
	vertical-align: bottom;/*画像の下にできる余白を削除*/
}

.single-works .other-area {
	width: 1280px;
	margin: 200px auto 0;
}

.single-works .breadcrumb-area {
	width: 1280px;
	margin: 100px auto 20px;
}




