@charset "utf-8";



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	border: 0;
	font: inherit;
	font-size: 100%;
	margin: 0;
	padding: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, main, nav, section { display: block; }
body {
	background-color: #fff;
	color: #000;
	-webkit-font-smoothing: subpixel–antialiased;
	-moz-osx-font-smoothing: auto;
	line-height: 1.2;
	text-rendering: optimizeLegibility;
}
ol, ul, ol li, ul li { list-style: none; }
table {
	border-collapse: collapse;
	border-spacing: 0;
}
html {
	font-size: 14px;
	overflow-y: scroll;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl { clear: none; }
img {
	border: none;
	height: auto;
	-ms-interpolation-mode: bicubic;
	line-height: 1;
	margin: 0;
	overflow: hidden;
	padding: 0;
	vertical-align: bottom;
	max-width: 100%;
}
a:link, a:visited {
	color: #000;
	text-decoration: none;	
}
a:hover, a:active {
	color: #f44336;
	text-decoration: nonee;
}
a:focus { outline: none; }
a:hover img { opacity: 0.6; }


/* Font -----------------------------------------------------------------------------------------*/
body,
input,
textarea,
select { font-family: "游明朝", "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; }

.footer .comment span { font-family: Arial, Helvetica, "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }





/* Wrapper --------------------------------------------------------------------------------------*/
.header, .global, .body, .social, .sitemap, .footer { width: 100%; }
.wrapper {
	margin: 0 auto;
	width: 90%;
	max-width: 960px;
}
.global .wrapper {
	width: 100%;
	max-width: 980px;
}
#concept .image,
#company .companyinfo .image {
	margin: 0 auto;
	width: 100%;
	max-width: 960px;
}


/* Midashi --------------------------------------------------------------------------------------*/
.midashi {
	height: 110px;
	margin-top: 90px;
	position: relative;
	width: 100%;
}
.midashi:before {
	border-top: solid 1px #e0e0e0;
	content: "";
	position: absolute;
	top: 83px;
	left: 0;
	width: 100%;
}
.midashi.nonborder:before { border: none; }
.midashi .wrapper { position: relative; }
.midashi.h2non { margin-top: 40px; }

.midashi h2 {
	background-color: #323232;
	border-radius: 50%;
	color: #fff;
	font-size: 1rem;
	height: 110px;
	letter-spacing: 1px;
	line-height: 112px;
	text-align: center;
	width: 110px;
}
.midashi h2.long { letter-spacing: 0; }

.midashi h3 {
	font-size: 2rem;
	letter-spacing: 4px;
	padding-right: 20px;
	position: absolute;
	top: 37px;
	left: 140px;
}
.midashi h3.short { letter-spacing: 0px; }
.midashi.h2non h3 {
	float: left;
	position: static;
	padding-top: 37px;
	padding-right: 15px;
}
.midashi h3 span {
	font-size: 20px;
	vertical-align: middle;
}
.midashi.h3center h3 {
	padding-top: 10px;
	position: static;
	text-align: center;
}

.midashi .sub {
	float: left;
	font-size: 1rem;
	line-height: 1.2;
	padding-top: 37px;
}


/* Header ---------------------------------------------------------------------------------------*/
.header {
	background-color: #fff;
	padding: 65px 0 53px;
	width: 100%;
}


/* Global ---------------------------------------------------------------------------------------*/
.global {
	background-color: #fff;
	border-bottom: solid 1px #e0e0e0;
	z-index: 10001;
}
/*.global*/ .menu {
	background: #fff url(../images/global_menu.svg) no-repeat left top;
	background-size: 48px 48px;
	cursor: pointer;
	display: none;
	height: 48px;
	position: fixed;
	top: 0;
	left: 0;
	width: 48px;
	z-index: 10002;
}

/* Mainmenu */
.global .mainmenu { background-color: #fff; }
.global .mainmenu > li {
	float: left;
	margin-left: 1.7%;
	position: relative;
	text-align: center;
	/*width: 12.5%;*/
}
.global .mainmenu > li:first-child { margin-left: 0; }
.global .mainmenu > li.home { width: 8%; }
.global .mainmenu > li.news { width: 10%; }
.global .mainmenu > li.concept { width: 12%; }
.global .mainmenu > li.gallery { width: 12%; }
.global .mainmenu > li.planning { width: 14%; }
.global .mainmenu > li.company { width: 10%; }
.global .mainmenu > li.contact { width: 14%; }
.global .mainmenu > li.blog { width: 8%; }

.global .mainmenu > li > a {
	border-bottom: solid 4px #fff;
	color: #555;
	display: inline-block;
	font-size: 1rem;
	height: 34px;
	line-height: 39px;
	padding: 0 0.5em;
}
.global .mainmenu > li.on > a,
.global .mainmenu > li > a:hover {
	border-color: #f44336;
	color: #000;
}

/* SubMenu */
.global .submenu {
	border-top: solid 1px #e0e0e0;
	border-right: solid 1px #e0e0e0;
	border-left: solid 1px #e0e0e0;
	display: none;
	position: absolute;
	top: 38px;
	left: -36px;
	text-align: center;
	width: 168px;
	z-index: 10003;
}
.global .planning .submenu {
	left: -72px;
	width: 248px;
}
.global .submenu li a {
	background-color: #f5f5f5;
	border-bottom: solid 1px #e0e0e0;
	color: #757575;
	display: block;
	font-size: 1rem;
	height: 49px;
	line-height: 49px;
}
.global .submenu li a:hover { color: #000; }


/* SNS ------------------------------------------------------------------------------------------*/
.sns { padding-top: 120px; }

.sns .facebook,
.sns .twitter,
.sns .tumblr {
	float: left;
	margin-right: 10px;
	width: 32px;
}
.sns .pagetop {
	float: right;
	position: static;
	width: 32px;
}

#contact .sns .facebook,
#contact .sns .twitter,
#contact .sns .tumblr { display: none; }


/* Footer ---------------------------------------------------------------------------------------*/
.footer {
	background-color: #f7f7f7;
	margin-top: 30px;
}

/* Sitemap */
.footer .sitemap {
	color: #757575;
	padding-top: 50px;
}
.footer .sitemap > li {
	float: left;
	font-size: 1rem;
	margin-left: 5%;
	width: 16%;
}
.footer .sitemap > li:first-child { margin-left: 0; }
.footer .sitemap li ul {
	border-top: solid 3px #e0e0e0;
	margin-top: 4px;
	font-size: 0.857rem;
	padding-top: 10px;
}
.footer .sitemap li li { padding-top: 5px; }
.footer .sitemap a { color: #757575; }
.footer .sitemap a:hover { color: #f44336; }

/* Company */
.footer .contact {
	border-left: solid 5px #f44336;
	color: #757575;
	margin-top: 40px;
	padding: 7px 15px;
}

.footer .company {
	float: left;
	margin-right: 15px;
}
.footer .company .name {
	font-size: 1.428rem;
	font-weight: bold;
	letter-spacing: 3px;
}
.footer .company .address {
	font-size: 0.928rem;
	padding-top: 5px;
}

.footer .tel {
	float: left;
	margin-right: 15px;
}
.footer .tel .text {
	font-size: 0.785rem;
	letter-spacing: 2px;
}
.footer .tel .no {
	font-size: 1.714rem;
	letter-spacing: 3.5px;
	padding-top: 7px;
}

.footer .button { float: left; }
.footer .button a {
	background-color: #bdbdbd;
	color: #fff;
	display: block;
	font-size: 1rem;
	height: 41px;
	line-height: 41px;
	text-align: center;
	width: 170px;
}
.footer .button a:hover { background-color: #000; }

.footer .comment {
	color: #999;
	font-size: 0.785rem;
	line-height: 1.4;
	padding: 30px 0 15px;
	text-align: justify;
}

.footer .comment span {
	display: block;
	padding-top: 15px;
	text-align: left;
}





/* コンセプト -----------------------------------------------------------------------------------*/
.conceptlife { padding-bottom: 60px; }
.conceptlife img { width: 100%; }

.conceptlife .image { padding-top: 60px; }

.conceptlife .title {
	font-size: 2rem;
	letter-spacing: 5px;
	padding-top: 130px;
	text-align: center;
}

.conceptlife .text {
	font-size: 1.142rem;
	letter-spacing: 1.5px;
	line-height: 2.3;
	margin: 0 auto;
	padding-top: 65px;
	text-align: justify;
	width: 60%;
}


/* 建築作品（一覧） -----------------------------------------------------------------------------*/
.architectlist ul {
	margin: 0 auto;
	padding-top: 30px;
}
.architectlist li {
	background-color: #fafafa;
	border-top: solid 1px #f5f5f5;
	border-right: solid 1px #e0e0e0;
	border-bottom: solid 1px #e0e0e0;
	border-left: solid 1px #f5f5f5;
	box-sizing: border-box;
	float: left;
	height: 490px;
	margin-top: 30px;
	margin-right: 3.5%;
	padding: 14px;
	position: relative;
	width: 31%;
}
.architectlist li:nth-child(3n) { margin-right: 0; }

.architectlist .image {
	height: 270px;
	margin-bottom: 10px;
	overflow: hidden;
	position: relative;
	width: 100%;
}
.architectlist .image img {
	position: absolute;
	width: 100%;
}
.architectlist .new {
	color: #f44336;
	font-size: 1rem;
	padding-left: 2px;
}
.architectlist h4 {
	font-size: 1.428rem;
	line-height: 1.4;
}
.architectlist .outline {
	color: #999;
	font-size: 0.857rem;
	line-height: 1.5;
	position: absolute;
	bottom: 12px;
	left: 15px;
}


/* 建築作品（詳細） -----------------------------------------------------------------------------*/
/* メインイメージ */
.architectdetail .image { margin: 0 auto; }
.architectdetail .image img { width: 100%; }
.architectdetail img { width: 100%; }

/* 本文 */
.architectdetail .comment {
	line-height: 2;
	margin: 0 auto;
	padding: 100px 0;
	text-align: justify;
	width: 70%;
}

/* タイトル */
.architectdetail .comment h3 {
	font-size: 2rem;
	line-height: 1.4;
	padding: 0;
	text-indent: -0.5em;
}
/* コメント */
.architectdetail .comment p {
	font-size: 1.142rem;
	letter-spacing: 5px;
	padding: 20px 0 50px;
}


/* 概要 -----------------------------------------------------------------------------------------*/
.architectdetail .outline {
	letter-spacing: 5px;
	margin: 0 auto;
	padding-top: 100px;
	width: 77%;
}

/* 見出し */
.architectdetail .outline h4 {
	font-size: 1.285rem;
	text-indent: -0.5em;
}
/* 概要 */
.architectdetail .outline dl {
	border-bottom: solid 1px #e0e0e0;
	font-size: 1rem;
	line-height: 1.3;
	padding-top: 25px;
}
.architectdetail .outline dt {
	border-top: solid 1px #e0e0e0;
	float: left;
	padding: 15px 0 11px 5%;
	width: 30%;
}
.architectdetail .outline dd {
	border-top: solid 1px #e0e0e0;
	float: left;
	padding: 15px 0 11px;
	width: 65%;
}


/* ギャラリー -----------------------------------------------------------------------------------*/
.architectdetail .gallery img { width: auto; }
.architectdetail .gallery {
	margin: 0 auto;
	padding-top: 190px;
}

/* 見出し */
.architectdetail .gallery h4 {
	color: #757575;
	font-size: 1.428rem;
	float: left;
}
/* プロジェクトブログ */
.architectdetail .gallery .blog { float: right; }
.architectdetail .gallery .blog a {
	background: #e0e0e0 url(../images/arrow_blog.svg) no-repeat right top;
	color: #757575;
	display: block;
	font-size: 0.857rem;
	height: 22px;
	line-height: 24px;
	padding-right: 22px;
	padding-left: 10px;
}
/* ギャラリー */
.architectdetail .gallery ul { padding-top: 15px; }
.architectdetail .gallery li {
	float: left;
	margin-top: 30px;
	margin-right: 0.2%;
	width: 24.85%;
}
.architectdetail .gallery li:nth-child(4n) { margin-right: 0; }
.architectdetail .gallery li a {
	background-color: #f7f7f7;
	box-sizing: border-box;
	display: block;
	/*height: 238px;*/
	text-align: center;
	/*width: 238px;*/
}
.architectdetail .gallery li img {
	/*height: auto;*/
	width: 100%;
}


/* 左右矢印 */
.architectdetail .leftarrow {
	position: fixed;
	left: 20px;
}
.architectdetail .rightarrow {
	position: fixed;
	right: 20px;
}
.architectdetail .leftarrow a,
.architectdetail .rightarrow a {
	background-color: rgba(0, 0, 0, 0);
	border-radius: 50%;
	display: block;
	height: 76px;
	width: 76px;
}
.architectdetail .leftarrow a:hover,
.architectdetail .rightarrow a:hover { background-color: rgba(0, 0, 0, 0.8); }


/* プロジェクト ---------------------------------------------------------------------------------*/
.project {
	border-bottom: solid 1px #e0e0e0;
	padding: 90px 0;
}
.project img { width: 100%; }

.project .data { position: relative; }
.project .title {
	float: right;
	width: 45%;
}
.project .image {
	float: left;
	min-height: 330px;
	width: 52%;
}
.project .image p { margin-top: 20px; }

.project h4 {
	font-size: 2rem;
	margin-top: 70px;
	text-indent: -0.5em;
}
.project .new {
	background-color: #f44336;
	color: #fff;
	font-size: 0.928rem;
	height: 18px;
	line-height: 18px;
	margin-top: 10px;
	text-align: center;
	width: 43px;
}
.project .outline {
	font-size: 1rem;
	line-height: 1.7;
	position: absolute;
	bottom: 0;
	left: 55%;
}
.project .blog {
	position: absolute;
	right: 0;
	bottom: 0;
}
.project .blog a {
	background: #e0e0e0 url(../images/arrow_blog.svg) no-repeat right top;
	color: #757575;
	display: block;
	font-size: 0.857;
	height: 22px;
	line-height: 24px;
	padding-right: 22px;
	padding-left: 10px;
}
.project .blog a:hover {
	background-color: #000;
	background-image: url(../images/arrow_blog_over.svg);
	color: #fff;
}

.project .comment {
	font-size: 1rem;
	line-height: 2.2;
	margin-top: 35px;
	text-align: justify;
}


.thumbnail {
	border-bottom: solid 1px #e0e0e0;
	line-height: 1.3;
	margin-top: 15px;
	padding-bottom: 25px;
	position: relative;
	overflow: hidden;
}
.thumbnail li:hover { opacity: 0.6; }
.thumbnail li {
	cursor: pointer;
	float: left;
	margin-top: 15px;
}
.thumbnail .image { overflow: hidden; }
.thumbnail .image img { width: 100%; }
.thumbnail .text {
	font-size: 0.857rem;
	height: 1.3em;
	margin-top: 10px;
	overflow: hidden;
}

.thumbnail .scrollwrapper { overflow: hidden; }
.thumbnail .scroll {
	margin-left: auto;
	overflow-x: scroll;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	width: 96%;
}
.thumbnail .rightarrow,
.thumbnail .leftarrow {
	display: none;
	position: absolute;
	top: 50%;
	z-index: 99999;
}
.thumbnail .rightarrow { right: 0; }
.thumbnail .leftarrow { left: 0; }
.thumbnail .rightarrow a,
.thumbnail .leftarrow a {
	background-color: rgba(0, 0, 0, 0);
	background-size: 76px 76px;
	border-radius: 50%;
	display: block;
	height: 76px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 76px;
}
.thumbnail .rightarrow a:hover,
.thumbnail .leftarrow a:hover { background-color: rgba(0, 0, 0, 0.8); }
.thumbnail .rightarrow a { background-image: url(../images/architect_arrow_right.svg); }
.thumbnail .leftarrow a { background-image: url(../images/architect_arrow_left.svg); }


/* 家が出来るまで -------------------------------------------------------------------------------*/
.buildtable * { box-sizing: border-box; }
.buildtable .container { background-image: url(../images/build_line.png); }

.buildread .read {
	font-size: 1rem;
	line-height: 2;
	padding: 0 0 20px 140px;
	text-align: justify;
	width: 70%;
}

.buildtable .comment {
	font-size: 0.857rem;
	line-height: 1.6;
	padding-top: 40px;
}

.buildtable td {
	font-size: 0.857rem;
	letter-spacing: 2px;
	padding-top: 15px;
	padding-bottom: 15px;
	vertical-align: top;
}
.buildtable .border td { background: url(../images/build_border.png) repeat-x left center; }

.buildtable .day {
	padding-top: 0;
	width: 140px;
}
.buildtable .mk1 { width: 30px; }
.buildtable .my {
	background-color: #fff;
	text-align: center;
	width: 310px;
}
.buildtable .you {
	background-color: #fff;
	text-align: center;
	width: 310px;
}
.buildtable .mk2 { width: 30px; }
.buildtable .other { width: 140px; }

.buildtable .my p {
	border-bottom: solid 4px #bdbdbd;
	margin: 0 auto;
	padding-bottom: 5px;
	width: 60px;
}
.buildtable .you p {
	border-bottom: solid 4px #f44336;
	margin: 0 auto;
	padding-bottom: 5px;
	width: 60px;
}

.buildtable .attr {
	background-color: #fff;
	color: #f44336;
	height: 39px;
	line-height: 41px;
	text-align: center;
}

.buildtable .rowt { background: url(../images/build_bordertb.png) repeat-x left top; }
.buildtable .rowr { border-right: solid 1px #757575; }
.buildtable .rowb { background: url(../images/build_bordertb.png) repeat-x left bottom; }
.buildtable .rowl { border-left: solid 1px #757575; }

.buildtable .box0 {
	background-color: #757575;
	border-radius: 4px;
	color: #fff;
	font-size: 0.785rem;
	line-height: 1.5;
	padding: 10px 0;
	text-align: center;
}
.buildtable .box0.l { margin-right: 10px; }
.buildtable .box0.r { margin-left: 10px; }
.buildtable .box1 {
	background-color: #e0e0e0;
	font-size: 1rem;
	height: 50px;
	line-height: 52px;
	margin: 0 10px;
	text-align: center;
}
.buildtable .box3 {
	background-color: #f5f5f5;
	font-size: 1rem;
	height: 50px;
	line-height: 52px;
	margin: 0 10px;
	text-align: center;
}
.buildtable .box1.l2,
.buildtable .box3.l2 {
	height: 94px;
	line-height: 1.5;
	padding-top: 24px;
}

.buildtable .circle1 {
	background-color: #757575;
	border-radius: 50%;
	color: #fff;
	font-size: 0.857rem;
	height: 80px;
	line-height: 82px;
	margin: 0 auto;
	text-align: center;
	width: 80px;
}
.buildtable .circle1.l2 {
	line-height: 1.1;
	padding-top: 28px;
}

.buildtable .box1 a {
	background: #e0e0e0 url(../images/build_arrow.svg) no-repeat right center;
	color: #000;
	display: block;
	font-size: 1rem;
	height: 50px;
	line-height: 52px;
	text-align: center;
}
.buildtable .box1 a.open { background-image: url(../images/build_arrow_open.svg); }
.buildtable .box1 a:hover { background-color: #c4c4c4; }
.buildtable .box2 a {
	background: #757575 url(../images/build_arrow2.svg) no-repeat right center;
	color: #fff;
	display: block;
	font-size: 20px;
	height: 50px;
	line-height: 52px;
	text-align: center;
}
.buildtable .box2 a.open { background-image: url(../images/build_arrow2_open.svg); }
.buildtable .box2 a:hover { background-color: #3f3f3f; }
.buildtable .box3 a {
	background: #f5f5f5 url(../images/build_arrow.svg) no-repeat right center;
	color: #000;
	display: block;
	font-size: 1rem;
	height: 50px;
	line-height: 52px;
	text-align: center;
}
.buildtable .box3 a.open { background-image: url(../images/build_arrow_open.svg); }
.buildtable .box3 a:hover { background-color: #c1c1c1; }

.buildtable dd {
	background-color: #fff;
	font-size: 0.857rem;
	line-height: 2;
	margin-bottom: 60px;
	padding: 20px 10px;
	text-align: justify;
}
.buildtable dd p {
	font-weight: bold;
	padding-top: 10px;
}
.buildtable dd li {
	line-height: 1.4;
	padding-left: 16px;
	padding-bottom: 10px;
	text-indent: -16px;
}


/* FP -------------------------------------------------------------------------------------------*/
.planner p {
	font-size: 1rem;
	line-height: 2;
	margin: 0 auto;
	padding-bottom: 2em;
	text-align: justify;
	width: 70%;
}


.plannerflow ol { padding-top: 60px; }
.plannerflow li {
	padding-bottom: 30px;
	margin-left: 60px;
}
.plannerflow .no {
	background-color: #e0e0e0;
	color: #fff;
	float: left;
	font-size: 4.5rem;
	height: 67px;
	line-height: 69px;
	text-align: center;
	width: 67px;
}
.plannerflow .text {
	float: left;
	padding-left: 15px;
	width: 70%;
}
.plannerflow .title {
	font-size: 1.428rem;
	font-weight: bold;
	letter-spacing: 3px;
}
.plannerflow .comment {
	font-size: 1rem;
	letter-spacing: 2px;
	line-height: 1.8;
	padding-top: 10px;
	text-align: justify;
}


.plannerfee p {
	font-size: 1rem;
	letter-spacing: 2px;
	line-height: 1.7;
	text-align: justify;
}


.plannerpartner p {  }
.plannerpartner .wrapper { position: relative; }
.plannerpartner .name {
	font-size: 1.428rem;
	font-weight: bold;
	line-height: 1.5;
	padding-left: 75px;
}

.plannerpartner .link {
	position: absolute;
	top: 6px;
	left: 62%;
}
.plannerpartner .link a {
	background-color: #bdbdbd;
	display: block;
	color: #fff;
	font-size: 1rem;
	letter-spacing: 3px;
	height: 41px;
	line-height: 41px;
	text-align: center;
	width: 160px;
}
.plannerpartner .link a:hover { background-color: #000; }

.plannerpartner .address {
	font-size: 1rem;
	letter-spacing: 2px;
	line-height: 1.7;
	padding-top: 15px;
	padding-left: 75px;
}


/* 会社情報 -------------------------------------------------------------------------------------*/
/* 基本情報 */
.companyinfo {
	padding-top: 55px;
	padding-bottom: 40px;
}
.companyinfo img { width: 100%; }

/* データ */
.companyinfo table {
	border-top: solid 1px #e0e0e0;
	margin-top: 60px;
	width: 100%;
}
.companyinfo tr { border-bottom: solid 1px #e0e0e0; }
.companyinfo th,
.companyinfo td {
	font-size: 1rem;
	line-height: 1.5;
	letter-spacing: 3px;
	padding: 16px 0;
	text-align: justify;
}
.companyinfo th {
	padding-right: 10px;
	padding-left: 30px;
	text-align: left;
	white-space: nowrap;
	vertical-align: top;
}
.companyinfo td { padding-right: 30px; }



/* スタッフ */
.companystaff { padding-bottom: 40px; }
.companystaff img { width: 100%; }

/* 代表取締役 */
.companystaff .president { padding: 40px 0; }
.companystaff .president .image {
	float: left;
	width: 53%;
}
.companystaff .president .text {
	float: right;
	width: 44%;
}
.companystaff .president .comment {
	font-size: 1rem;
	line-height: 1.8;
	margin-top: -5px;
	text-align: justify;
}
.companystaff .president .name {
	font-size: 1.142rem;
	letter-spacing: 3px;
	padding-top: 45px;
}
.companystaff .president .position { letter-spacing: 0; }
.companystaff .president .ruby {
	color: #757575;
	font-size: 0.857rem;
	letter-spacing: 2px;
}
.companystaff .president .profile {
	font-size: 0.785rem;
	letter-spacing: 1px;
	line-height: 1.7;
	padding-top: 40px;
	text-align: justify;
}

/* 所員 */
.companystaff .staffs img { width: auto; }

.companystaff .staffs { padding-top: 45px; }
.companystaff .staff {
	float: left;
	margin-bottom: 45px;
	position: relative;
	width: 33.33%;
}
.companystaff .staff .name {
	font-size: 1rem;
	letter-spacing: 3px;
	position: absolute;
	left: 175px;
	bottom: 5px;
}
.companystaff .staff .ruby {
	color: #757575;
	font-size: 0.857rem;
	letter-spacing: 0;
}

/* アクセス */
.companyaccess { margin-top: -26px; }

/* 住所、TEL */
.companyaccess .access { border-top: solid 1px #e0e0e0; }
.companyaccess .data,
.companyaccess .access {
	font-size: 1rem;
	line-height: 1.5;
	padding: 16px 0;
	text-align: justify;
}

.companyaccess dt {
	float: left;
	width: 85px;
}
.companyaccess dd { float: left; }

.companyaccess iframe { height: 540px; }


/* リンク ---------------------------------------------------------------------------------------*/
.linkinterior .wrapper,
.linkmedia .wrapper,
.linkstove .wrapper {
	border-bottom: solid 1px #e0e0e0;
	font-size: 1rem;
	letter-spacing: 1px;
}
.linkinterior .wrapper { padding-top: 55px; }
.linkmedia .wrapper { padding-top: 35px; }
.linkstove .wrapper {
	border: none;
	padding-top: 35px;
}

.linkinterior h4,
.linkmedia h4,
.linkstove h4 {
	float: left;
	width: 18%;
}

.linkinterior ul,
.linkmedia ul,
.linkstove ul {
	float: left;
	padding-bottom: 30px;
}
.linkstove ul { padding-bottom: 0; }

.linkinterior li,
.linkmedia li {
	padding-bottom: 20px;
}
.linkstove li { position: relative; }
.linkinterior li span,
.linkmedia li span,
.linkstove li span {  }

.linkstove .text {
	position: absolute;
	bottom: 0;
	left: 290px;
	width: 300px;
}

.linkinterior a span,
.linkmedia a span,
.linkstove a span { color: #b5b6b5; }

.linkinterior a:hover,
.linkmedia a:hover,
.linkstove a:hover,
.linkinterior a:hover span,
.linkmedia a:hover span,
.linkstove a:hover span { color: #f44336; }


/* お問い合わせ ---------------------------------------------------------------------------------*/
.contactform {
	background-color: #e0e0e0;
	margin-top: -30px;
	padding: 85px 0;
}

.contactform .item { padding-bottom: 20px; }

.contactform .label {
	display: block;
	float: left;
	font-size: 1rem;
	height: 47px;
	line-height: 49px;
	padding-right: 15px;
	text-align: right;
	width: 230px;
}
.contactform .label span {
	color: #f44336;
	font-size: 0.785rem;
}

.contactform .privacy { padding-top: 30px; }
.contactform .privacy .text {
	float: left;
	font-size: 1rem;
	letter-spacing: 1px;
	line-height: 1.5;
	padding-top: 14px;
	width: 600px;
}
.contactform .privacy ol { padding-bottom: 40px; }
.contactform .privacy li {
	padding-top: 25px;
	padding-left: 30px;
	text-indent: -30px;
}

.contactform input[type="text"] {
	border: none;
	border-radius: 3px;
	font-size: 1rem;
	height: 47px;
	padding: 0 10px;
}
.contactform textarea {
	border: none;
	border-radius: 3px;
	font-size: 1rem;
	padding: 10px;
}



.contactform select {
	-moz-appearance: none;
	-webkit-appearance: none;
	-o-appearance: none;
	-ms-appearance: none;
	appearance: none;
	background: none transparent;
	border: 0;
	border-radius: 0;
	box-sizing: content-box;
	color: inherit;
	font-size: inherit;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}

.contactform .custom {
	overflow: hidden;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	position: relative;
	border-radius: 0.2em;
	background-color: white;
}
.contactform .custom > select {
	width: 130%;
	padding: 9px 30px 9px 10px;
	font-size: 1rem;
}
.contactform .custom:after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 1.8em;
	display: block;
	content: "";
	background: url(../images/form_select_arrow.png) center no-repeat;
	pointer-events: none;
}



.contactform .value {
	font-size: 1.428rem;
	height: 47px;
	line-height: 47px;
	padding: 0 10px;
}

.contactform input[type="radio"],
.contactform input[type="checkbox"] { display: none; }

.contactform .radio,
.contactform .checkbox {
	cursor: pointer;
	display: block;
	float: left;
	height: 47px;
	line-height: 47px;
	padding-right: 15px;
	padding-left: 30px;
	position: relative;
}
.contactform .radio:after,
.contactform .checkbox:after {
	background-color: #fff;
	border-radius: 3px;
	content: "";
	display: block;
	height: 21px;
	position: absolute;
	top: 12px;
	left: 0px;
	width: 21px;
	z-index: 9;
}
.contactform .radio:after { border-radius: 50%; }

.contactform .radio:before {
	background-color: #000;
	border-radius: 50%;
	content: "";
	display: block;
	height: 9px;
	opacity: 0;
	position: absolute;
	top: 18px;
	left: 6px;
	width: 9px;
	z-index: 99;
}
.contactform input[type="radio"]:checked + .radio:before { opacity: 1; }

.contactform .checkbox:before {
	border-right: 3px solid #000;
	border-bottom: 3px solid #000;
	display: block;
	content: "";
	height: 9px;
	opacity: 0;
	position: absolute;
	top: 15px;
	left: 7px;
	transform: rotate(45deg);
	width: 5px;
	z-index: 99;
}
.contactform input[type="checkbox"]:checked + .checkbox:before { opacity: 1; }


.contactform .age { float: left; }
.contactform .cat { float: left; }
.contactform .cat .label { width: 120px; }


.contactform .name input,
.contactform .email input,
.contactform .emailchk input,
.contactform .tel input,
.contactform .content input { width: 320px; }
.contactform .post input { width: 160px; }
.contactform .address input { width: 60%; }
.contactform .age input { width: 75px; }
.contactform .comment textarea {
	height: 160px;
	width: 60%;
}


.contactform .submitoff,
.contactform .submit { padding-top: 85px; }
.contactform .submit { display: none; }

.contactform .submitoff span,
.contactform .submit a {
	background-color: #f44336;
	color: #fff;
	display: block;
	font-size: 1.428rem;
	height: 39px;
	line-height: 41px;
	margin: 0 auto;
	text-align: center;
	width: 370px;
}
.contactform .submitoff span { background-color: #c2c2c2; }


.contactcomment {
	font-size: 1rem;
	letter-spacing: 3px;
	padding: 80px 0 0;
	text-align: center;
}


.contactform .thanks {
	font-size: 1rem;
	letter-spacing: 3px;
	line-height: 2;
	padding: 80px 0;
	text-align: center;
}


/* ブログ ---------------------------------------------------------------------------------------*/
.blogcontents .article {
	float: left;
	padding-top: 30px;
	width: 71%;
}
.blogcontents img {  }

.blogcontents .entry {
	background: url(../images/blog_shadow.jpg) no-repeat right bottom;
	margin-bottom: 70px;
	padding-right: 11px;
	padding-bottom: 11px;
}
.blogcontents .container {
	background-color: #fafafa;
	border-top: solid 1px #f5f5f5;
	border-right: solid 1px #e0e0e0;
	border-bottom: solid 1px #e0e0e0;
	border-left: solid 1px #f5f5f5;
	padding: 30px 45px;
}

.blogcontents .date {
	color: #757575;
	font-size: 1rem;
	text-align: right;
}
.blogcontents h4 {
	font-size: 1.428rem;
	padding-top: 15px;
}
.blogcontents .body {
	font-size: 1rem;
	line-height: 2;
	padding-top: 35px;
	text-align: justify;
	word-wrap: break-word;
}
.blogcontents .body p { padding-bottom: 2em; }
.blogcontents .body a { color: #f44336; }
.blogcontents .body a:hover { text-decoration: underline; }


.blogcontents .entrycategory {
	color: #757575;
	font-size: 1rem;
	text-align: right;
}
.blogcontents .entryfooter {
	padding-top: 15px;
	position: relative;
}
.blogcontents .sns {
	padding-top: 0;
	padding-left: 0;
}
.blogcontents .sns p { padding-bottom: 10px; }
.blogcontents .post {
	color: #757575;
	font-size: 1rem;
	padding-top: 10px;
	text-align: right;
}


.blogcontents .navi {
	float: right;
	padding-top: 15px;
	width: 25%;
}

.blogcontents .navi h4 {
	color: #757575;
	font-size: 1rem;
	line-height: 1.1;
	padding: 15px 0;
}
.blogcontents .navi h5 {
	font-size: 1rem;
	line-height: 1.1;
	padding-bottom: 10px;
	text-indent: -8px;
}
.blogcontents .navi li {
	font-size: 1rem;
	line-height: 1.5;
	padding-bottom: 5px;
}

.blogcontents .navi ul { padding-bottom: 25px; }
.blogcontents .navi .house,
.blogcontents .navi .new { padding-bottom: 50px; }
.blogcontents .navi .news li,
.blogcontents .navi .days li,
.blogcontents .navi .house li {
	padding-left: 14px;
	text-indent: -14px;
}
.blogcontents .navi .new li {
	padding-left: 51px;
	text-indent: -51px;
}





.blogcontents .project {
	border: none;
	padding-bottom: 0;
}


/* コメント -------------------------------------------------------------------------------------*/
#comments {
}
#comments p {
	font-size: 1rem;
	line-height: 1.6;
	padding-bottom: 0;
}

#comments h4 { padding-bottom: 30px; }
#comments .comment-list li {
	border-bottom: dotted 1px #e0e0e0;
	margin-bottom: 40px;
	padding-bottom: 40px;
}
#comments .comment-list li:last-child { border: none; }
#comments .comment-author {
	font-size: 0.857rem;
	padding-top: 20px;
	text-align: right;
}
#comments .reply { display: none; }

#comments #respond {
	border-top: solid 1px #e0e0e0;
	margin-top: 40px;
}
#comments #respond .required { color: #f44336; }
#comments #respond h3 {
	font-size: 1.428rem;
	padding-top: 15px;
}
#comments #respond br { display: none; }
#comments #respond .comment-notes,
#comments #respond .comment-form-author,
#comments #respond .comment-form-email,
#comments #respond .comment-form-url,
#comments #respond .comment-form-comment { padding-bottom: 20px; }
#comments #respond .comment-form-comment { padding-top: 20px; }

#comments #respond input[type="text"] {
	border: solid 1px #e0e0e0;;
	border-radius: 3px;
	font-size: 1rem;
	height: 47px;
	padding: 0 10px;
	width: 90%;
}
#comments #respond textarea {
	border: solid 1px #e0e0e0;;
	border-radius: 3px;
	font-size: 1rem;
	padding: 10px;
	width: 90%;
}

#comments #respond #siteguard_captcha { width: 100px; }
#comments label { display: block; }

#comments #respond .form-submit { text-align: center; }
#comments #respond input[type="submit"] {
	background-color: #323232;
	border: none;
	color: #fff;
	font-size: 1rem;
	height: 27px;
	margin-top: 15px;
	width: 250px;
}










/*-----------------------------------------------------------------------------------------------*/
/* 建築作品（エントリー） -----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.entrydetail input,
.entrydetail select,
.entrydetail textarea {
	font-family: "游明朝", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 18px;
	width: 90%;
}
.entrydetail input[type="file"] { width: 500px !important; }
.entrydetail .system input[type="text"] { width: 200px !important; }
.entrydetail input[type="radio"],
.entrydetail input[type="checkbox"],
.entrydetail select { width: auto !important; }
.entrydetail textarea { height: 200px; }

.entrydetail .gallery input {
	margin-top: 10px;
	margin-left: 40px;
}

.entrydetail input[type="submit"],
.entrydetail input[type="reset"] {
	height: 24px !important;
	width: 200px !important;
}

.entrydetail input[type="submit"],
.entrydetail input[type="reset"] {
	height: 40px !important;
	margin: 0 20px;
	width: 200px !important;
}


.entrydetail .system {
	margin: 40px auto;
	width: 674px;
}
.entrydetail .system div { padding-top: 10px; }
.entrydetail .system .back {
	padding: 10px 0;
}
.entrydetail .submit {
	margin: 40px 0;
	text-align: center;
}

.entrydetail img { margin-top: 10px; }
.entrydetail .gallery img { margin-top: 0 !important; }



.midashi .add {
	font-size: 18px;
	position: absolute;
	top: 48px;
	left: 370px;
}
.entrylist .view0,
.entrylist .view1 {
	font-size: 14px;
	padding-top: 10px;
}
.entrylist .view0 { color: #e0e0e0; }
.entrylist .control {
	font-size: 18px;
	position: absolute;
	bottom: 12px;
	left: 0;
	text-align: center;
	width: 100%;
}
.project.entrylist .control {
	padding-top: 60px;
	position: static !important;
	text-align: left;
	width: 100%;
}
.project.entrylist .title { padding-top: 20px !important; }



/* メインイメージ -------------------------------------------------------------------------------*/
.entrydetail .image {
	margin: 0 auto;
	padding-bottom: 20px;
	width: 674px;
}
.entrydetail .image img { width: auto; }


/* 本文 -----------------------------------------------------------------------------------------*/
.entrydetail .comment { padding: 20px 0; }

/* タイトル */
.entrydetail .comment h3 { text-indent: 0; }
/* コメント */
.entrydetail .comment p {
	letter-spacing: 0;
	padding: 20px 0;
}
.entrydetail .comment img { width: auto; }


.entrydetail .image span {
	display: block;
	font-size: 12px;
	padding-top: 10px;
	padding-left: 100px;
}
.entrydetail .comment p span {
	display: block;
	font-size: 12px;
	letter-spacing: 0;
	padding-left: 115px;
}


/* 概要 -----------------------------------------------------------------------------------------*/
/* 見出し */
.entrydetail .outline h4 { text-indent: 0; }


/* ギャラリー -----------------------------------------------------------------------------------*/
.entrydetail .gallery {
	padding-top: 100px;
	width: 742px;
}
.entrydetail.projectdetail .gallery {
	padding-top: 20px;
	width: auto;
}
.entrydetail .gallery.view {
	margin: 0 auto;
	padding-top: 0;
	width: 960px;
}
/* 見出し */
.entrydetail .gallery h4 { float: none; }
/* プロジェクトブログ */
.entrydetail .gallery .blog {
	float: none;
	font-size: 18px;
	padding-top: 10px;
	padding-left: 40px;
}
.entrydetail.projectdetail .gallery .blog { padding-left: 0; }
/*-----------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------- 建築作品（エントリー） */
/*-----------------------------------------------------------------------------------------------*/













@media(max-width:1060px){
/* SubMenu */
.global .blog .submenu { left: auto; right: 0; }
}





@media(max-width:830px){
html { font-size: 13px; }

/* 建築作品（一覧） -----------------------------------------------------------------------------*/
.architectlist li { margin-right: 3%; width: 47%; }
.architectlist li:nth-child(3n) { margin-right: 3%; }
.architectlist li:nth-child(2n) { margin-right: 0; }
}





@media(max-width:768px){/*body{background-color:#f00;}*/
/* Midashi --------------------------------------------------------------------------------------*/
.midashi { height: 63px; }
.midashi:before { top: 49px; }
.midashi h2 { font-size: 0.785rem; height: 63px; letter-spacing: 0; line-height: 64px; width: 63px; }
.midashi h3 { font-size: 1.5rem; letter-spacing: 0; top: auto; bottom: 20px; left: 75px; }
.midashi.h2non h3 { float: none; padding-top: 17px; }
.midashi h3 span { font-size: 1.285rem; }
.midashi .sub { padding-top: 17px; }

/* Header ---------------------------------------------------------------------------------------*/
.header { padding: 10px 0; position: fixed; top: 0; left: 0; width: 100%; z-index: 10000; }
.header .wrapper { width: 100%; }
.header h1 { margin-left: 48px; }
.header h1 img { height: 28px; }

/* Global ---------------------------------------------------------------------------------------*/
/*.global*/ .menu { display: block; }
.global { background-color: #323232; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; position: fixed; top: 0; left: -80%; width: 80%; }
/* Mainmenu */
.global .mainmenu { background-color: #323232; }
.global .mainmenu > li { float: none; margin-left: 0; text-align: left; width: 100% !important; }
.global .mainmenu > li > a { border-bottom: solid 2px #fff; color: #fff; display: block; height: 49px; line-height: 49px; }
.global .mainmenu > li.on > a, .global .mainmenu > li > a:hover { color: #fff; }
/* SubMenu */
.global .submenu { border-top: none; position: static; text-align: left; text-indent: 1em; width: 100% !important; }

/* SNS ------------------------------------------------------------------------------------------*/
.sns .facebook, .sns .twitter, .sns .tumblr { width: 26px; }
.sns .pagetop { float: none; position: fixed; right: 5%; bottom: 20px; width: 26px; }

/* Footer ---------------------------------------------------------------------------------------*/
.footer { padding-top: 30px; }
/* Sitemap */
.footer .sitemap { display: none; }
/* Company */
.footer .contact { margin-top: 0; }
.footer .company { float: none; }
.footer .company .name { font-size: 1.142rem; }
.footer .tel { float: none; margin-top: 10px; }
.footer .tel .no { font-size: 1rem; padding-top: 5px; }
.footer .button { float: none; margin-top: 10px; }


/* コンセプト -----------------------------------------------------------------------------------*/
.conceptlife .title { font-size: 1.714rem; padding-top: 80px; }
.conceptlife .text { font-size: 1rem; padding-top: 65px; width: auto; }


/* 建築作品（詳細） -----------------------------------------------------------------------------*/
.architectdetail .comment { padding: 50px 0; width: 100%; }
.architectdetail .comment h3 { font-size: 1.714rem; }
.architectdetail .comment p { font-size: 1rem; }
.architectdetail .outline { padding-top: 50px; width: 100%; }
.architectdetail .outline h4 { font-size: 1.142rem; }
.architectdetail .outline dl { padding-top: 15px; }
.architectdetail .gallery { padding-top: 80px; }
.architectdetail .gallery li { margin-top: 15px; margin-right: 0.2%; width: 49.9%; }
.architectdetail .gallery li:nth-child(4n) { margin-right: 0.2%; }
.architectdetail .gallery li:nth-child(2n) { margin-right: 0; }
.architectdetail .leftarrow { left: 0; }
.architectdetail .rightarrow { right: 0; }
.architectdetail .leftarrow a, .architectdetail .rightarrow a { height: 60px; width: 60px; }

/* プロジェクト ---------------------------------------------------------------------------------*/
.project { padding: 40px 0; }
.project .title { float: none; width: auto; }
.project .image { float: none; min-height: none; width: auto; }
.project h4 { font-size: 1.714rem; margin-top: 15px; }
.project .outline { font-size: 0.857rem; margin-top: 15px; position: static; }
.thumbnail .leftarrow a, .thumbnail .rightarrow a { background-size: 60px 60px; height: 60px; width: 60px; }

/* 家が出来るまで -------------------------------------------------------------------------------*/
.buildread .read { padding: 20px 0; width: auto; }

/* FP -------------------------------------------------------------------------------------------*/
.planner p { width: 100%; }
.plannerflow li { margin-left: 0; }
.plannerflow .no { float: none; font-size: 3.071rem; height: 47px; line-height: 49px; width: 47px; }
.plannerflow .text { float: none; padding-left: 0; width: 100%; }
.plannerflow .title { padding-top: 15px; }
.plannerpartner .name { padding-left: 0; }
.plannerpartner .link { position: static; }
.plannerpartner .address { padding-left: 0; }

/* 会社情報 -------------------------------------------------------------------------------------*/
.companyinfo td { letter-spacing: 0; }
.companystaff .president .image { float: none; width: 100%; }
.companystaff .president .text { float: none; margin-top: 15px; width: 100%; }
.companystaff .staff { float: none; width: 100%; }
.companyaccess dt { float: none; padding-top: 15px; width: 100%; }
.companyaccess dd { float: none; }
.companyaccess iframe { height: 260px; }

/* リンク ---------------------------------------------------------------------------------------*/
.linkinterior h4, .linkmedia h4, .linkstove h4 { float: none; width: 100%; }
.linkinterior ul, .linkmedia ul, .linkstove ul { float: none; padding-top: 20px; }
.linkinterior li, .linkmedia li { padding-left: 2em; }
.linkinterior li span, .linkmedia li span, .linkstove li span { display: block; }
.linkstove .text { position: static; padding-top: 10px; width: 100%; }

/* お問い合わせ ---------------------------------------------------------------------------------*/
.contactform .label { float: none; padding-right: 0; text-align: left; width: auto; }
.contactform .privacy .text { float: none; width: auto; }
.contactform .age { float: none; }
.contactform .cat { float: none; }
.contactform .cat .label { width: auto; }
.contactform .name input, .contactform .email input, .contactform .emailchk input, .contactform .tel input, .contactform .content input { width: 90%; }
.contactform .post input { width: 90%; }
.contactform .address input { width: 90%; }
.contactform .comment textarea { width: 90%; }
.contactform .submitoff span, .contactform .submit a { width: 100%; }

/* ブログ ---------------------------------------------------------------------------------------*/
.blogcontents .article { float: none; width: 100%; }
.blogcontents img { height: auto; width: 100%; }
.blogcontents .entry { background: url(../images/blog_shadow.jpg) no-repeat right bottom; margin-bottom: 70px; padding: 0 11px 11px; }
.blogcontents .container { padding: 15px; }
.blogcontents .sns { height: 50px; }
.blogcontents .post { color: #757575; font-size: 1rem; padding-top: 10px; text-align: right; }
.blogcontents .navi { float: none; padding-top: 15px; width: 100%; }
.blogcontents .navi .newarea, .blogcontents .navi .linkarea { display: none; }
.blogcontents .navi .newscontents { display: none; }
.blogcontents .navi h4 { background: url(../images/build_arrow.svg) no-repeat right center; border-bottom: solid 1px #e0e0e0; cursor: pointer; height: 50px; line-height: 52px; padding: 0; }
.blogcontents .navi h4.open { background-image: url(../images/build_arrow_open.svg); }
.blogcontents .navi h5 { border-bottom: solid 1px #e0e0e0; height: 50px; line-height: 52px; padding-bottom: 0; }
.blogcontents .navi li { border-bottom: solid 1px #e0e0e0; font-size: 1rem; line-height: 1.5; padding-top: 15px; padding-bottom: 13px; }

#comments #respond input[type="submit"] { width: 90%; }
}





@media(max-width:530px){/*body{background-color:#0f0;}*/
html { font-size: 12px; }

/* 建築作品（一覧） -----------------------------------------------------------------------------*/
.architectlist li { margin-right: 0; width: 100%; }
.architectlist li:nth-child(3n) { margin-right: 0; }
}





@media(max-width:320px){/*body{background-color:#00f;}*/
}










/* floatクリア */
.cf { zoom: 1; }
.cf:after { clear: both; content: ""; display: block; }