@charset "UTF-8";
/*
Theme Name: Shiratakomuten2
Version: 2024.9
Author: Sokoage Inc.
Author URI: https://sokoage.com/
Description: 白田工務店 オリジナルテーマ変更
Original Author: ZICCA DESIGN & Co.
Original Author URI: https:/zicca-d.com/
*/
:root {
  --font1: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}



body {
	font-family: 'Noto Serif JP', serif;
}
a.button {
	width: 340px;
	text-align: center;
	display: block;
	background-color: #1170AC;
	color: #fff;
	text-decoration: none;
	padding: 1.3rem 0;
	background-image: url(../images/arrow.png);
	background-repeat:  no-repeat;
	background-position: right 1rem center;
}
p.line {
	width: 200px;
	height: 1px;
	background-color: #1170AC;
	margin: 0 auto 2rem;
}
.image img {
	width: 100%;
}
.spRunner {
	display: none;
}
header {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	background-color: #fff;
	z-index: 100;
	position: fixed;
	top: 0;
}
header h1 {
	width: 164px;
	margin: 10px 0 0 10px;
}
header h1 img {
	width: 100%;
}

header nav {
	width: auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	box-sizing: border-box;
}
header nav a {
	display: block;
	text-decoration: none;
	color: #000;
	padding: 1.6rem 1rem;
	transition: 0.2s;
}
header nav a:hover {
	background-color: #439FC6;
	color: #ffffff;
}
header nav a.contact {
	background-color: #1170AC;
	color: #fff;
}
#spHeader {
	display: none;
}
#mob-nav {
	display: none;
}

footer {
	width: 100%;
	position: relative;
}
footer #contact {
	width: 100%;
	background-color: #F4F3F3;
	padding: 2rem 0;
}
footer #contact h2 {
	font-size: 1.3rem;
	text-align: center;
	font-weight: 200;
	margin-bottom: 1.5rem;
}

footer #contact .wrapper {
	width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
footer #contact .wrapper .box {
	width: 350px;
	background-color: #fff;
	padding: 2rem;
	box-sizing: border-box;
}
footer #contact .wrapper .box h3 {
	text-align: center;
	margin-bottom: 1rem;
}
footer #contact .wrapper .box .time {
	text-align: center;
}
footer #contact .wrapper .box .tel {
	color: #1170AC;
	font-size: 2.3rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 1rem;
}
footer #contact .wrapper .box a.button {
	width: 100%;
	margin-bottom: 1rem;
}
footer #fnav {
	width: 100%;
	background-color: #1170AC;
	padding: 3rem;
	box-sizing: border-box;
	color: #fff;
}
footer #fnav .wrapper .flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
footer #fnav .wrapper h1 {
	width: 220px;
}
footer #fnav .wrapper h1 img {
	width: 100%;
}
footer #fnav .wrapper .address {
	font-size: 0.8rem;
	line-height: 1.5;
}
footer #fnav .share {
	width: 180px;
	margin-left: 1rem;
}
footer #fnav .share_li {
	display: flex;
	align-items: center;
	color: #fff;
	font-size: 12px;
	margin: 10px 0;
	text-decoration: none;
}
footer #fnav .share_li:hover {
	opacity: 0.8;
}
footer #fnav .share_li img {
	width: 16px;
	margin-right: 8px;
}
footer #fnav .rBox {
	width: 730px;
}

footer #fnav .rBox nav {
	width: 100%;
	margin-bottom: 1rem;
}

footer #fnav .rBox nav a {
	color: #fff;
	text-decoration: none;
	padding: 0 .5rem;

}
footer #fnav .rBox .insta {
	width: 100%;
	text-align: right;
}

.grecaptcha-badge { visibility: hidden; }


/* ブラウザの大きさが1202px以上の場合 */
@media screen and (min-width: 1202px){
.footer_recaptcha {
    margin-top: 30px;
    padding: 1%;
    text-align: center;
    color: #ffffff;
    width: 100%;
    font-size: 0.8rem;
    }
}

/* ブラウザの大きさが1201px以下の場合 */
@media screen and (max-width: 1201px){
.footer_recaptcha {
    margin-top: 30px;
    padding: 1%;
    text-align: center;
    color: #ffffff;
    width: 100%;
    border-bottom: none;
    border-left: none;
    border-right: none;
    line-height: 20px;
    font-size: 0.8rem;
    }
}

/*　/////////トップ　項目タイトル　始///////　*/
h2.topitem_ttl {
  font-size: 1.6rem;
	font-weight: 200;
	text-align: center;
	margin-bottom: 2rem;
}


/*　/////////トップ　項目タイトル　終///////　*/

#intro {
	width: 100%;
	padding-top: 66px;
	margin-bottom: 3rem;
}
#intro p.image {
	width: 100%;
	margin-bottom: 3rem;
}
#intro .spImg {
	display: none;
}
#intro h1 {
	font-size: 1.6rem;
	font-weight: 200;
	text-align: center;
	margin-top: 5rem;
	margin-bottom: 2rem;
}
#intro p.note {
	width: 790px;
	margin: 0 auto;
	line-height: 1.5;
	text-align: center;
}
#intro .bread {
	font-family: var(--font1);
	width: 700px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	margin-top: 2rem;
}
#intro .bread a {
	color: inherit;
	text-decoration: none;
}
#intro .bread a:hover {
	opacity: 0.7;
}
#intro .bread_li {
	font-size: 0.7rem;
	margin-right: 0.2em;
	list-style: none;
}
#intro .intro-sub {
	font-size: 0.6em;
}
#intro .blog-intro {
	margin-bottom: 2rem;
}

#overview {
	width: 100%;
	background: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #F7F7F7 50%, #F7F7F7 100%);
	padding-bottom: 4rem;
	margin-bottom: 6rem;
}

#overview .wrapper {
	width: 1000px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#overview .wrapper .detail {
	width: 250px;
	padding-top: 250px;
}
#overview .wrapper .detail h2 {
	width: 250px;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 2rem;
}
#overview .wrapper .detail p.note {
	line-height: 1.5;
}

#overview .wrapper p.image {
	width: 347px;
}
#overview .wrapper p.image2 {
	margin-top: 100px;
}

h1 {
	font-size: 1.6rem;
	font-weight: 200;
	text-align: center;
	margin-bottom: 2rem;
	width: 100%;
}
p.introNote {
	width: 790px;
	margin: 0 auto 3rem;
	line-height: 1.5;
	text-align: center;
}
p.introNote span {
	font-size: 0.8rem;
}


/*　トップページ　*/
#top_mv{
  margin-top: 120px
}
#top_mv .top_mainvisual {
  position: relative;
  }
#top_mv .top_mainvisual_text {
  position: absolute;/*絶対配置*/
  top: 10%;
  left: 5%;
  }
#top_mv .top_mainvisual_text p {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  line-height: 1.6;
  writing-mode: vertical-rl;
/* 以降の設定はデザインに合わせて調整 */
  font-size: 200%;
  font-weight: 400;
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  text-shadow: 2px 2px 3px #000;
  }


@media screen and (max-width:800px) {
#top_mv {
  margin-top: 120px;
}
#top_mv .top_mainvisual_text {
  position: absolute;/*絶対配置*/
  top: 10%;
  left: 10%;
  }
#top_mv .top_mainvisual_text p {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  line-height: 1.6;
  writing-mode: vertical-rl;
/* 以降の設定はデザインに合わせて調整 */
  font-size: 1.3em;
  font-weight: 600;
  color: #fff;
  font-family: 'Noto Serif JP', serif;
  text-shadow: 2px 2px 3px #000;
  }
}

#contents {
  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;margin:0 auto 4rem;}
#contents .flex {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#contents .line+.note {
	width: 90%;
	max-width: 790px;
	margin: 0 auto 4rem;
	line-height: 1.5;
	text-align: center;
}
#contents article {
	width: 49%;
	position: relative;
	padding-bottom: 2rem;
}
#contents article .image {
	width: 100%;
	margin-bottom: 1rem;
}
#contents article .image img {
	width: 100%;
}
#contents article h2 {
	font-weight: 200;
	font-size: 1.3rem;
	text-align: center;
	margin-bottom: 1rem;
}
#contents article p.note {
	text-align: center;
	margin-bottom: 2rem;
}
#contents a.button {
	margin: 0 auto;
}
@media only screen and (max-width: 767px) {
	#contents .line+.note {
		text-align: left;
	}
}
#works {
	width: 100%;
	background-color: #F4F3F3;
	padding: 2rem 0;
	margin-bottom: 6rem;
}
#works h1 {
	font-size: 1.6rem;
	font-weight: 200;
	text-align: center;
	margin-bottom: 2rem;
}
#works .note {
	text-align: center;
	margin-bottom: 2rem;
}
#works .wrapper {

  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;
	margin: 0 auto 2rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#works .wrapper article {
	width: 30%;
	margin-bottom: 2rem;
	position: relative;
}
#works .wrapper .image {
	aspect-ratio: 300/190;
	margin-bottom: 1rem;
}
#works .wrapper .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#works .wrapper article a {
	display: block;
	position: absolute;
	z-index:2;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff;
	opacity: 0;
	transition: 0.2s;
}
#works .wrapper article a:hover {
	opacity: 0.4;
}
#works .wrapper h3 {
	font-weight: 400;
	padding: 1rem;
	box-sizing: border-box;
}
#works a.button {
	margin: 0 auto;
}
#event {
	margin-bottom: 6rem;
}
#event h2 {
	font-weight: 200;
	font-size: 1.4rem;
	text-align: center;
	margin-bottom: 4rem;
}
#event a.button {
	margin: 0 auto;
}
#topnews {
  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;margin:0 auto 4rem;}
#topnews article {
	display:flex;padding: 1rem 0;
	flex-wrap:wrap;
	justify-content:space-between;
	width: 100%;
	border-bottom: 1px solid #e4e3e3;
	box-sizing:border-box;
	position:relative;
}
#topnews article .image {
	width:150px;
}
#topnews article .wrapper {
	width:1000px;
}
#topnews article a {
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	background-color: rgba(255,255,255,0);
	transition:0.2s;
	left:0;
	right:0;
	bottom:0;
	z-index:2;
}
#topnews article a:hover {
	background-color: rgba(255,255,255,.5);

}


#topnews a.button {margin: 2rem auto 4rem;}
#topnews article .wrapper p.date {margin:0.8rem 0;}
/*　会社概要　*/
#staff {
	width: 100%;
	margin: 0 auto 6rem;
}

#staff .wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 1000px;
	margin: 4rem auto 0;

}

#staff .wrapper article {
	width: 30%;
	margin-bottom: 2rem;
}
#staff .wrapper article .image {
	width: 100%;
	margin-bottom: 1rem;
}
#staff .wrapper article .position {
	font-size: 0.8rem;
	margin-bottom: 0.5rem;
}
#staff .wrapper article .name {
	font-size: 1.2rem;
	margin-bottom: 1rem;
}

#staff .wrapper article .comment {
	line-height: 1.5;
}

#staff h1 {
	font-size: 1.6rem;
	font-weight: 200;
	text-align: center;
	margin-bottom: 2rem;
	width: 100%;
}
#staff p.note {
	width: 790px;
	margin: 0 auto 3rem;
	line-height: 1.5;
}

#officeInfo {
	margin: 6rem 0;
}
#officeInfo table {
	width: 1000px;
	margin: 0 auto;
}
#officeInfo table th {
	width: 200px;
	border-right: 1px solid #C3C3C3;
	text-align: left;
	font-weight: 400;
	padding: 1.5rem 0;
	box-sizing: border-box;
}
#officeInfo table td {
	width: 800px;
	box-sizing: border-box;
	padding: 1.5rem 0 1.5rem 1.5rem;
	line-height: 1.5;
}
#officeInfo table td iframe {
	margin-top: 1rem;
}


/*　内覧会　*/
.end_event {
	width: 1000px;
	margin: 0 auto 8rem;
	padding-top: 8rem;
}
.end_event h3 {margin-bottom: 2rem; font-weight: 400; font-size: 1.2rem;
}
.end_event iframe {
	width: 100%;
	height: 2800px;
}
.blueText {
	color: #005B81;
}
.blueBG {
	background-color: #005B81;
}

.button {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #fff;
	padding: 1.1rem 0;
	border-radius: 6px;
	transition: 0.2s;
	box-sizing: border-box;
	border: 1px solid #005B81;
	font-weight: bold;
}
.button:hover {
	background-color: #fff;
	color: #005B81;
}

#firstView {
	width: 100%;
	position: relative;
	display: flex;
	box-sizing: border-box;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 8rem;
}
#firstView article.image {
	width: 65%;
}
#firstView article.image img {
	object-fit: cover;
}

#firstView article.desc {
	position: relative;
	width: 35%;
	box-sizing: border-box;
	padding: 5%;
	padding-bottom: 0;
}


#firstView article.desc h1 {
	position: absolute;
	top: 5%;
	right: 5%;
}
#firstView article.desc h2 {
	position: relative;
	margin-bottom: 3rem;
}

#firstView article.desc h3 {
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
}
#firstView article.desc .date,
#firstView article.desc .time {
	font-size: 1rem;
	font-weight: bold;
	margin-bottom: 0.8rem;
}

#firstView article.desc .time {
	margin-bottom: 1.5rem;
}



#quality {
	width: 100%;
	margin-bottom: 8rem;
}
#quality .borderV {
	width: 1px;
	background-color: #C7C7C7;
}

#quality h1 {
	font-size: 2rem;
	text-align: center;
	margin-bottom: 6rem;
}

#quality .wrapper1 {
	width: 950px;
	margin: 0 auto 4rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
#quality .wrapper1 .qual {
	width: 49%;
	text-align: center;
}

#quality .wrapper1 .qual h2 {
	font-size: 1.2rem;
	margin-bottom: 2rem;
}
#quality .wrapper1 .qual h3 {
	font-size: 1rem;
	margin-bottom: 1rem;
	font-weight: lighter;
}
#quality .wrapper1 .qual .value {
	font-size: 8rem;
	font-weight: bold;
	margin-bottom: 1rem;
}

#quality .wrapper2 {
	width: 950px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
#quality .wrapper2 .qual2 {
	width: 28%;
	padding: 1rem 0;
}
#quality .wrapper2 .qual2 h2 {
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 2rem;
}
#quality .wrapper2 .qual2 h2 span {
	font-size: 1.3rem;
	font-weight: 600;
}
#quality .wrapper2 .qual2 p {
	line-height: 1.6;
}
#quality .wrapper2 #mado {
	background: url(../images/mado.png) no-repeat right bottom;
}
#quality .wrapper2 #kabe {
	background: url(../images/kabe.png) no-repeat right bottom;
}
#quality .wrapper2 #ki {
	background: url(../images/ki.png) no-repeat right bottom;
}
#quality .wrapper2 #sei {
	background: url(../images/sei.png) no-repeat right bottom;
}


#information {
	width: 100%;
	background-color: #F7F7F7;
	padding: 4rem 0;
	margin-bottom: 8rem;

}
#information h1 {
	font-size: 2rem;
	text-align: center;
	margin-bottom: 6rem;
}
#information .wrapper {
	width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#information .wrapper .note {
	width: 510px;
}
#information .wrapper .note table th {
	width: 160px;
	text-align: left;
	padding: 1.8rem 0;
}
#information .wrapper .note table td {
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;
}
#information .wrapper .note table td span {
	font-weight: 400;
}
#information .wrapper .note table td p {
	margin-bottom: 1rem;
}
#information .wrapper .map {
	width: 470px;
}
#information .wrapper .map iframe {
	width: 100%;
	height: 380px;
	margin-bottom: 2rem;

}


#reserve {
	margin-bottom: 8rem;
}
#reserve h1 {
	font-size: 2rem;
	text-align: center;
	margin-bottom: 6rem;
}
#reserve p.description {
	width: 780px;
	margin: 0 auto 5rem;
	text-align: center;
	line-height: 1.6;
}

#intro.contactintro {
	margin-bottom:0;
}
#intro.contactintro p.introNote {
	margin-bottom: 0;
}
#form {
	margin: 2rem auto 6rem;
}

#form table {
	width: 1000px;
	margin: 0 auto 30px;
	border-top: 1px solid #D1D1D1;
}

#form table th {
	padding: 24px 0;
	width: 255px;
	vertical-align: middle;
	text-align: left;
	border-bottom: 1px solid #D1D1D1;
	font-weight: 400;
	box-sizing: border-box;
}
#form table th span {
	font-size: 0.8rem;
	font-weight: 600;
	display: inline-block;
	padding: 0.2rem;
	box-sizing: border-box;
	color: #fff;
}
#form table th span.required {
	background-color: #DF4244;
}
#form table th span.optional {
	background-color: #7B7B7B;
}

#form table td {
	padding: 24px 0;
	width: 705px;
	line-height: 1.8;
	border-bottom: 1px solid #D1D1D1;
}
#form table td select {
	padding: 1rem;
	font-size: 1.1rem;

}
#form table td input[type="text"] {
	line-height: 1.5rem;
	width: 480px;
	padding: 0.8rem;
}
#form table td textarea {
	width: 480px;
	height: 15rem;
}
#form table td input[type="radio"] {
}

#form p.sub {
	width: 225px;
	margin: 0 auto;
}
#form input[type="submit"] {
	width: 225px;
	font-size: 1rem;
	padding: 7px 0;
	text-align: center;
	background-color: #005B81;
	color: #fff!important;
	border-style: none;
	cursor: pointer;
	border: 1px solid #005B81;
	border-radius: 6px;
}
#form p {
	width: 100%;
	text-align: center;
}
#line {
	width: 100%;
	margin-bottom: 8rem;
}
#line .im {
	width: 100%;
	background: url(../images/line.jpg) repeat-x left center;
	height: 232px;
	margin-bottom: 0.9rem;
}
#line .caution {
	width: 100%;
	text-align: right;
	font-size: 0.8rem;
}

#line_icon {
	width: 100%;
	margin: 4rem auto 2rem;
  text-align: center;
}
#line_icon .line_button {
	margin: 2rem auto 0;
  width: 232px
}

/*　家づくり　*/
.house {
	width: 100%;
	margin-bottom: 6rem;
}
.house .houseIntro {
	width: 1100px;
	margin: 0 auto 4rem;
}
.house .houseIntro h2 {
	font-size: 1.6rem;
	font-weight: 400;
	margin-bottom: 3rem;
  padding: 1rem 1rem;
  border-left: 6px double #1170ac;
}
.house .houseIntro p {
	line-height: 1.5;
}

.house .houseIntro p.image {
	width: auto;
	margin-top: 2rem;
}



/*　202504に追記　*/
.house .houseIntro .box-row {
  display: flex;
  flex-wrap:wrap;
  width: 100％;
  margin-top: 2rem;
}
.house .houseIntro .box-row .item img {
  width: 160px;
  height: auto;
  margin-right: 15px;
  margin-bottom: 15px;
}






.house .housetype1 {
	width: 1100px;
	margin: 0 auto;
	border-top: 1px solid #D8D8D8;
	box-sizing: border-box;
	padding: 4rem 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.house .housetype1 .detail {
	width: 530px;
}
.house .housetype1 .detail h3 {
	font-size: 1.3rem;
	font-weight: 400;
	margin-bottom: 2rem;
	line-height: 1.5;
}
.house .housetype1 .detail h2 {
  font-size: 1.4rem;
	font-weight: 400;
	margin-bottom: 3rem;
  padding: 1rem 1rem;
  border-left: 6px double #1170ac;
}
.house .housetype1 .detail p {
	line-height: 1.7;
}
.house .housetype1 .image {
	width: 530px;
  margin-top: 1rem;
}

.house .housetype1 .list_merit {
    position: relative;
    margin-top: 2rem;
    padding: 1.5em 1em 1em 2.5em;
    border: 2px solid #1170ac;
}

.house .housetype1 .list_merit > div {
    position: absolute;
    top: -.75em;
    left: 1em;
    padding: 0 .5em;
    background-color: #fff;
    color: #1170ac;
    font-weight: 600;
}

.house .housetype1 .list_merit ul {
    list-style-type: disc;
    margin: 0;
    padding: 0;
}

.house .housetype1 .list_merit li {
    padding: .3em .3em .3em 0;
}

.house .housetype1 .list_merit li::marker {
    color: #1170ac;
    font-size: 1.1em;
}

.house .housetype2 {
	width: 1100px;
	margin: 0 auto;
	border-top: 1px solid #D8D8D8;
	box-sizing: border-box;
	padding: 4rem 0;
}

.house .housetype2 h3 {
	font-size: 1.3rem;
	font-weight: 400;
	margin-bottom: 2rem;
	line-height: 1.5;
}

.house .housetype2 h2 {
  font-size: 1.4rem;
	font-weight: 400;
	margin-bottom: 3rem;
  padding: 1rem 1rem;
  border-left: 6px double #1170ac;
}

.house .housetype2 p {
	line-height: 1.7;
}

.house .housetype2 .image {
	width: 100%;
  margin-top: 1rem;
}



#seminar {
	width: 1100px;
	box-sizing: border-box;
	border: 1px solid 	#1170AC;
	margin: 0 auto 6rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 3rem;
}
#seminar .wrapper {
	width: 480px;
}
#seminar .wrapper h3 {
	font-size: 1.6rem;
	margin-bottom: 4rem;
	font-weight: 400;
}
#seminar .wrapper p.note {
	line-height: 1.7;
}
#seminar .image {
	width: 465px;
}
.houserun {
	margin-bottom: 6rem;
}

/*　施工事例個別記事　*/
#intro.work-intro .catchcopy {
	font-size: 1.6rem;
	font-weight: 200;
	line-height: 1.2;
	text-align: center;
	margin-top: 5rem;
	margin-bottom: 2rem;
}
#intro.work-intro .w_ttl {
	font-weight: 200;
	font-size: 1rem;
	text-align: center;
	margin-top: 5rem;
	margin-bottom: 3rem;
}
#intro.work-intro .catchcopy+.w_ttl {
	margin-top: 0;
}
#houseInfo {
	width: 100%;
	background-color: #F4F3F3;
	padding: 4rem 0;
	margin-bottom: 6rem;
}
#houseInfo .wrapper {
	width: 1000px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#houseInfo .wrapper .image {
	width: 440px;
}
#houseInfo .wrapper .note {
	width: 440px;
	line-height: 1.8;
}
#details {
	width: 1000px;
	margin: 0 auto 6rem;
}
#details .d_image {
	margin-bottom: 4rem;
}
#details .note1 {
	line-height: 1.7;
}
#favorite {
	width: 1000px;
	margin: 0 auto 6rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#favorite .wrapper {
	width: 450px;
}
#favorite .wrapper .point {
	margin-bottom: 0.5rem;
}
#favorite .wrapper .point span {
	font-size: 0.9rem;
	background-color: #1170AC;
	color: #fff;
	width: auto;
	display: inline-block;
	box-sizing: border-box;
	padding: 0.3rem;
}
#favorite .wrapper h3 {
	font-size: 1.2rem;
	line-height: 1.5;
	font-weight: 400;
	margin-bottom: 2rem;
}
#favorite .wrapper .note {
	line-height: 1.7;
}

#favorite .image {
	width: 480px;
}
#gallery {
	width: 1000px;
	margin: 0 auto 6rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#gallery .thumb {
	display: block;
	width: 186px;
	height: 184px;
	position: relative;
	overflow: hidden;
	margin-bottom: 1rem;
	cursor: pointer;
	transition: opacity 0.2s ease;
	will-change: opacity;
}
#gallery .thumb img.glr {
	position: relative;
	object-fit: cover;
	width: 186px;
	height: 184px;
}
#gallery .thumb .cross {
	width: 35px;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 2;
	background-color: rgba(0,0,0,0.6);
	text-align: center;
	padding: 0.5rem 0;
}
#gallery .thumb:hover {
	opacity: 0.8;
}

/*　施工事例一覧　*/
#workList {
	width: 1000px;
	margin: 0 auto 6rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#workList article {
	width: 30%;
	position: relative;
	margin-bottom: 3rem;
}
#workList article .image {
	aspect-ratio: 300/190;
	margin-bottom: 1rem;
}
#workList article .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#workList article a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	transition: 0.3s;
	z-index: 10;
}
#workList article a:hover {
	background-color: rgba(255,255,255,0.6);
}

/* ブログ（家のはなし）共通 */
.b_date, .b_cat, .b_tags {
	font-family: var(--font1);
	line-height: 1.4;
	text-decoration: none;
	transition: all 0.2s ease;
}
.b_date {
	font-size: 0.9rem;
}
.b_cat {
	display: inline-block;
	width: 7em;
	align-self: center;
	text-align: center;
	color: #fff;
	font-size: 0.8rem;
	font-weight: 600;
	background: #ccc;
	border: 1px solid #ccc;
	padding: 0.2em 0 0.1em;
	border-radius: 5px;
}
.b_cat.column {
	background: #1170ac;
	border-color: #1170ac;
}
.b_cat.report {
	background: #999;
	border-color: #999;
}
.b_cat.spec {
	background: #5f4c3a;
	border-color: #5f4c3a;
}
a.b_cat:hover {
	color: #333;
	background: #fff;
}
.b_tags span {
	display: inline-block;
	color: #fff;
	font-size: 0.75rem;
	line-height: 2;
}
.b_tags a {
	display: inline-block;
	color: inherit;
	text-decoration: none;
	margin-bottom: 5px;
	padding: 0 0.2em;
	position: relative;
}
.b_tags a:first-child {
	padding-left: 1em;
}
.b_tags a:after {
	content: "";
	width: calc(100% + 1em);
	height: 100%;
	background: #8098a7;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.b_tags a:hover {
	text-decoration: underline;
}

/* ブログ（家のはなし） */
#blog-article {
	width: 760px;
	margin: 0 auto 6rem;
	line-height: 2;
}
#blog-article .main_img {
	aspect-ratio: 700/440;
	margin-bottom: 2rem;
}
#blog-article .main_img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#blog-article .b_wrap {
	width: 90%;
	margin: 0 auto;
}
#blog-article .b_cat {
	margin: 0.6rem 0 0.9rem;
}
#blog-article .b_ttl {
	font-size: 1.25rem;
	font-weight: 400;
	text-align: left;
	margin-top: 0.5em;
	margin-bottom: 1.5rem;
}
#blog-article .share {
	margin: 0 0 2rem;
}
#blog-article .post_wrap {
	font-size: 0.9rem;
}
#blog-article .post_wrap p,
#blog-article .post_wrap figure {
	margin-bottom: 1rem;
}
#blog-article .post_wrap p+h2,
#blog-article .post_wrap p+h3 {
	margin-top: 3em;
}
#blog-article .post_wrap h2 {
	font-size: 1.25rem;
	margin-bottom: 1.5em;
	padding: 0.4em 0;
	border-top: 2px solid #1170AC;
	border-bottom: 2px solid #1170AC;
}
#blog-article .post_wrap h3 {
	font-size: 1.1rem;
	padding-left: 0.8em;
	margin-bottom: 1.5em;
	border-left: 3px solid #1170AC;
}
#blog-article .post_wrap img {
	display: block;
	max-width: 100%;
	height: auto;
}
a.button.blog {
	margin: 0 auto 6rem;
}

/* News一覧 */
#newsList {
	width: 1000px;
	margin: 0 auto;
}
#newsList article {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 4rem;
}
#newsList article .image {
	width: 390px;
	height: 250px;
	overflow: hidden;
}
#newsList article .wrapper {
	width: 500px;
}
#newsList article .wrapper h2 {
	font-size: 1.2rem;
	font-weight: 400;
	margin-bottom: 2rem;
}
#newsList article .wrapper p {
	line-height: 1.7;
	font-size: 0.9rem;
}
#newsList article .wrapper p.date {margin-bottom:0.8rem;}

#newsList article .wrapper a {
	width: 100%;
	text-align: right;
	display: block;
	margin: 1rem 0;
	color: #444;
}
#newsList article .wrapper p.blog_category {
	color: #444;
}
figure {
	font-size: 0.9rem;
	color: #555555;
	text-align: center;
}

/* ブログ（家のはなし）一覧*/
#ieBlogList {
	max-width: 900px;
	margin: 0 auto;
	padding-right: 20px;
	padding-left: 20px;
}
#ieBlogList a {
	color: inherit;
	text-decoration: none;
}
#ieBlogList .b_inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin-bottom: 6rem;
}
#ieBlogList .b_box {
	width: 31%;
	margin: 0 1%;
	margin-bottom: 3rem;
	font-family: var(--font1);
	line-height: 1.4;
}
#ieBlogList .b_box .image {
	aspect-ratio: 268/168;
	width: 100%;
	overflow: hidden;
}
#ieBlogList .b_box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s ease-out;
	will-change: transform;
}
#ieBlogList .b_box:hover img {
	transform: scale(1.05);
}
#ieBlogList .b_box .meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0.9em 0;
}
#ieBlogList .b_box .meta .b_cat {
	font-size: 0.75rem;
}
#ieBlogList .b_box .b_ttl {
	font-size: 0.9rem;
	line-height: 1.8;
	font-weight: 600;
}

#BlogcatList {
	max-width: 900px;
	margin: 0 auto;
	display: flex;
	justify-content: space-around;
	font-family: var(--font1);
	border-bottom: 1px solid #1170ac;
	margin-bottom: 4rem;
}
#BlogcatList a {
	color: inherit;
	text-decoration: none;
}
#BlogcatList .cat_li {
	/* width: 25%; */
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	padding: 1em 0;
	position: relative;
}
#BlogcatList .cat_li:before {
	content: "";
	width: 100%;
	height: 3px;
	position: absolute;
	left: 0;
	bottom: -2px;
}
#BlogcatList .cat_li:hover:before,
#BlogcatList .cat_li.is-current:before {
	background: #1170ac;
}
#BlogcatList .cat_li.is-current:after {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	background: url(./images/blog/down.svg) no-repeat center;
	background-size: 100%;
	position: absolute;
	bottom: -12px;
	left: calc(50% - 10px);
	z-index: 1;
}
@media screen and (min-width: 768px) {
	#BlogcatList {
		justify-content: unset;
	}
	#BlogcatList .cat_li {
		width: 25%;
	}
}

/* イベント情報一覧*/
.event-list {
	max-width: 1000px;
  margin: 0 auto;
  padding-bottom: 6rem;
}

#form .wpcf7 form div.wpcf7-response-output {
	width: 100%;
	text-align: center;
	padding: 2rem 0;
	font-weight: 600;
	font-size: 1.2rem;
}

#form .wpcf7 form span.wpcf7-not-valid-tip {
	display: block;
	font-size: 0.9rem;
	color: #dd4444;
}
#form .screen-reader-response {
	display:none;
}

#news-article {width:1000px;margin: 0 auto 100px;}
#news-article p {line-height: 1.5;}
#intro.news-intro {padding-top: 150px;
  text-align: center;}


/*　/////////レスポンシブ　始///////　*/

@media screen and (max-width:800px) {
.pcbr {
	display: none;
}
header {
	display: none;
}
#spHeader {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	padding: 0.2rem 0;
	position: fixed;
	background-color: #fff;
	z-index: 98;
	top: 0;
}
#spHeader h1 {
	width: 40%;
	margin: 1.8vw auto;
}
.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
  position: fixed;
  width: 40px;
  height: 27px;
  top: 15px;
  right: 10px;
  z-index: 100;
}
.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #1170AC;
  border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 12px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}
.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(12px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg);
  background-color: #fdfdfd;
}
.menu-trigger.active span:nth-of-type(2) {
  left: 200%;
  opacity: 0;
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
  -webkit-animation: active-menu-bar02 .8s forwards;
  animation: active-menu-bar02 .8s forwards;
  background-color: #fdfdfd;
}
@-webkit-keyframes active-menu-bar02 {
  100% {
    height: 0;
  }
}
@keyframes active-menu-bar02 {
  100% {
    height: 0;
  }
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-11px) rotate(45deg);
  transform: translateY(-11px) rotate(45deg);
  background-color: #fdfdfd;
}
#mob-nav {
	display: none;
	opacity: 0;
	transition: 0.3s;
}

#mob-nav.active {
	display: block;
	position: fixed;
	z-index: 99;
	width: 100%;
	height: 100vh;
	background-color: rgba(17,112,172,0.9);
	box-sizing: border-box;
	padding-top: 80px;
  -webkit-animation: active-menu-bg .4s forwards;
  animation: active-menu-bg .4s forwards;
  top: 0;
  right: -100vw;
}
@-webkit-keyframes active-menu-bg {
  100% {
    opacity: 1;
    right: 0;
  }
}
@keyframes active-menu-bg {
  100% {
    opacity: 1;
    right: 0;
  }
}

#mob-nav p a {
	display: block;
	width: 100%;
	color: #fdfdfd;
	text-decoration: none;
	box-sizing: border-box;
	padding: 4vw 15%;
	font-size: 4vw;
}
#mob-nav .buttonWrapper {
	width: 90%;
	position: absolute;
	bottom: 3rem;
	left: 5%;
}

#mob-nav .buttonWrapper a.button {
	background-color: #fff;
	color: #1170AC;
	margin-bottom: 1rem;
	width: 100%;
}

#mob-nav .buttonWrapper a.button.gr {
	background-color: #03c755;
	color: #fff;
	margin-bottom: 1rem;
	width: 100%;
}



footer #contact .wrapper {
	width: 90%;
	margin: 0 auto;
}
footer #contact .wrapper .box .tel img {
	display: none;
}

footer #contact .wrapper .box .tel {
	font-size: 2rem;
}
footer #contact .wrapper .box {
	width: 100%;
	padding: 1rem;
	margin-bottom: 1rem;
}
footer #contact h2 {
	font-size: 1.2rem;
}
footer #fnav .rBox nav {
	display: none;
}
footer #fnav .wrapper h1 {
	margin-bottom: 1rem;
}
footer #fnav .rBox {
	width: 100%;
}
footer #fnav .rBox .insta {
	text-align: center;
}
footer #fnav .wrapper .address {
	margin-bottom: 1rem;
}

#intro p.image {
	display: block;
	/* padding-top: 3rem; */
	margin-bottom: 3rem;
}
#intro h1 {
	font-size: 1.2rem;
	margin-top: 3.5rem;
}
#intro p .pcImg {
	display: none;
}
#intro p .spImg {
	display: block;
}
#intro p.note {
	width: 90%;
	margin: 0 auto;
}
p.introNote {
	width: 90%;
	margin: 0 auto;
}
#intro .bread {
	width: 90%;
}

#overview .wrapper {
	width: 90%;
	margin: 0 auto;
}
#overview .wrapper .detail {
	width: 100%;
	padding-top: 0;
}
#overview .wrapper p.image {
	width: 49%;
	margin-top: 2rem;
}
.imgRunner {
	display: none;
}
.spRunner {
	width: 100%;
	display: block;
}


/*　トップページ　*/
#works .wrapper {
	width: 100%;
}
#contents {width:100%;}
#contents article {
	width:90%;
  margin: 0 auto;
}

#contents article h2 {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	font-size: 1.2rem;
}
#contents article p.note {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.5;
	text-align: left;
}

#works h1 {
	font-size: 1.2rem;
}
#works .note {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.5;
	text-align: left;
}
#works .wrapper {
	width: 90%;
	margin: 0 auto;
}
#works .wrapper article {
	width: 100%;
}
#event h2 {
	font-size: 1.2rem;
	line-height: 1.5;
}
#topnews {width:100%;}
#topnews article {
width:90%;margin:0 auto;
}
#topnews article .image {width:33%;}
#topnews article .wrapper {width:63%;}
#topnews article .wrapper p.date {margin-top: 0; font-size:0.9rem;}
#topnews article .wrapper h2 {font-size:0.9rem;line-height:1.5;}

/*　会社概要　*/
#staff .wrapper {
	width: 90%;
}
#staff .wrapper article {
	width: 100%;
}

#officeInfo table {
	width: 90%;
}
#officeInfo table th {
	display: block;
	width: 100%;
	border-right: none;
	border-bottom: 1px solid #C3C3C3;
	padding-bottom: 0.5rem;
}

#officeInfo table td {
	display: block;
	width: 100%;
}
#officeInfo table td iframe {
	width: 100%;
}

#entryBtn {
	display: none;
}

.pc_br {
	display: none;
}

#form table {
	width: 95%;
	margin: 0 auto;
}
#form table th,
#form table td {
	display: block;
	width: 100%;
	box-sizing: border-box;
}
#form table th {
	padding-bottom: 0.1rem;
}
#form table td input[type="text"] {
	width: 100%;
	padding: 0.1rem;
	box-sizing: border-box;
}
#form table td textarea {
	width: 100%;
	height: 5rem;
}
#line .im {
	height: 100px;
}
#about table {
	width: 95%;
	margin: 0 auto;
}
#about table th {
	width: 100px;
}
.house .houseIntro {
	width: 90%;
	margin: 0 auto 4rem;
}
.house .housetype1,
.house .housetype2 {
	width: 90%;
}
.house .housetype1 .detail h3,
.house .housetype2 .detail h3 {
	font-size: 1.2rem;
}
#seminar {
	width: 90%;
	padding: 1rem;
}
#seminar .wrapper {
	width: 100%;
}
#seminar .wrapper h3 {
	font-size: 1.3rem;
	margin-bottom: 2rem;
}
#seminar .image {
	width: 100%;
}

/*　施工事例　*/
#houseInfo {
	width: 100%;
}
#houseInfo .wrapper {
	width: 90%;
	margin: 0 auto;
}
#houseInfo .wrapper .image {
	width: 100%;
	margin-bottom: 1rem;
}
#houseInfo .wrapper .note1 {
	width: 100%;
}
#details {
	width: 100%;
}
#details .note1 {
	width: 90%;
	margin: 0 auto;
}
#favorite {
	width: 100%;
}
#favorite .wrapper {
	width: 90%;
	margin: 0 auto 1rem;
}
#favorite .image {
	width: 100%;
}
#gallery {
	width: 100%;
}
#gallery .thumb {
	margin-bottom: 0.5rem;
}
/*　施工事例一覧　*/
#intro.work-intro h1 {
	margin-top: 0;
}
#intro.work-intro p.image {
	padding-top: 0;
	margin-bottom: 3rem;
}
#workList {
	width: 90%;
	margin: 0 auto 6rem;
}
#workList article {
	width: 100%;
	margin-bottom: 3rem;
}
#workList article .image {
	margin-bottom: 1rem;
}
/*家のはなし*/
#blog-article {
	width: 90%;
}
#blog-article .b_wrap {
	width: 100%;
}
.wp-block-image img {
	width: 100%;
	height: auto;
}
#recommends {
	width: 90%;
	margin: 0px auto 3px auto;
}
#recommends .wrapper article {
	width: 100%;
	margin-bottom: 2rem;
}
#topics {
	width: 90%;
	margin: 0 auto 4rem;
}
/* News一覧 */
#newsList {
	width: 90%;
}
#newsList article .image {
	margin-bottom: 1rem;
	width: 100%;
}
#newsList article .wrapper h2 {
	font-size: 1rem;
}
/*家のはなし一覧*/
#ieBlogList {
	width: 90%;
	padding: 0;
}
#ieBlogList .b_box {
	width: 48%;
}
/*イベント一覧*/
.tabs {
	width: 100%;
}
.tab_content_description article {
	width: 100%;
}
/*新着情報*/
#news-article {width:95%;margin:0 auto 2rem;}



}
/*　/////////レスポンシブ　終///////　*/


@media screen and (max-width: 767px) {
.navigation .nav-links .page-numbers:hover,
.navigation .nav-links .current {
  opacity: 1;
  border-color: #1170AC;
  text-underline-offset: 20px;
}
}