

/* CSS Document */

/* =========================================================
header
========================================================= */
header {
	margin-top: 39px;
	border-bottom: solid 1px #D6D4D2;
}
#pankuzuArea {
	border: none;
	background-color: #FBFBFB;
}
#pankuzu {
	height: 70px;
	line-height: 70px;
}
#pankuzu .home {
	background-position: left top 24px;
}
/* =========================================================
interviewContent
========================================================= */
#interviewContainer {
	width: 1150px;
	margin: 0 auto;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
	color: #434343;
}
#interviewContainer a {
	text-decoration: underline;
}

#content {
	width: 800px;
	float: left;
	background-color: #FFF;
	position: relative;
}

/* =========================================================
font setting
========================================================= */

@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 100;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 200;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 300;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Medium");
	font-weight: 400;
}
@font-face {
	font-family: "Yu Gothic";
	src: local("Yu Gothic Bold");
	font-weight: bold;
}

.caveat {
	font-family: 'Caveat', cursive;
}

/* インタビュー内のフォント */
#maincontainer {
	font-family: Quicksand, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
	color: #434343;
}

/* ------------------------------------------------------- */
body {
	min-width: 1150px;
	background: #FAFAF6;
}

a {
	color: #004B88;
}
a:hover {
	color: #F00;
}
a:hover img {
	opacity: 0.8;
	filter: alpha(opacity=80);
}

sup {
	font-size: 10px;
}


/* =========================================================
maincontainer
========================================================= */
#maincontainer {
}

/* =========================================================
intervewHead
========================================================= */
#intervewHead {
	margin-bottom: 50px;
	background: url(../img/bg_head_01.png) center top;
	background-attachment: fixed;
}

#headColumn {
	display: table;
	width: 100%;
	min-width: 1150px;
	max-width: 1800px;
	margin: auto;
	table-layout: fixed;
}

/* headColumnLeft */
#headColumnLeft {
	display: table-cell;
	width: 60%;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	-webkit-background-size: auto 74%;
	-moz-background-size: auto 74%;
	-o-background-size: auto 74%;
	background-size: auto 74%;
}
@media screen and (min-width: 1220px){
	#headColumnLeft {
		width: 100%;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
}

/* headColumnRight */
#headColumnRight {
	display: table-cell;
	width: 40%;
	height: 350px;
	padding: 25px 40px 40px;
	vertical-align: top;
}
@media screen and (min-width: 1220px) {
	#headColumnRight {
		width: 500px;
	}
}

/* headColumnTit */
#headColumnTit {
	min-height: 110px;
	margin-bottom: 15px;
	background: url(../img/tit_head_interview.png) no-repeat center;
	-webkit-background-size: contain;
	background-size: contain;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}

/* headColumnText */
#headColumnText {
	position: relative;
	min-height: 240px;
	padding: 80px 30px 30px;
	background: #FFF;
}

#headColumnText .category {
	position: absolute;
	top: 0;
	left: 30px;
	width: 130px;
	height: 35px;
	background: #51AB00;
	color: #FFF;
	font-size: 13px;
	line-height: 1.5em;
	text-align: center;
	padding: 15px 0 0;
}

#dateArea {
	position: absolute;
	top: 20px;
	right: 30px;
	width: 300px;
	font-size: 13px;
	color: #7E7E7E;
	text-align: right;
}
#dateArea .date {
}


#headColumnText h1 {
	color: #51AB00;
	font-size: 22px;
	font-weight: 700;
	text-indent: -3.5em;
	margin: 0 0 20px 3.5em;
}
#headColumnText .title {
	font-size: 26px;
	line-height: 1.4;
}

#headColumnText .interviewNo {
	color: #DFC352;
	font-size: 17px;
	display: none;
}
#headColumnText .interviewNo:last-child {
	font-size: 22px;
	padding-right: 0.5em;
}

/* =========================================================
containerInner
========================================================= */
#containerInner {
	width: 1150px;
	margin: 0 auto;
	overflow: hidden;
}
/* =========================================================
containerInnerLeft
========================================================= */
#containerInnerLeft {
	float: left;
	width: 800px;
	background: #FFF;
	margin: 0 0 50px;
}
/* =========================================================
containerArticle
========================================================= */
#containerArticle {
	padding: 0 40px 35px;
}
#containerArticle h2 {
	clear: both;
	padding: 55px 0 15px;
	margin-top: 50px;
	border-top: 1px solid #E1E1E1;
	font-size: 24px;
	font-weight: 700;
	color: #284358;
	line-height: 1.5;
}
#containerArticle h2:first-child {
	margin-top: 0;
	border-top: none;
}
#containerArticle ul.list,
#containerArticle p {
	padding: 10px 0;
	font-size: 17px;
	font-weight: 500;
	line-height: 1.8;
}
#containerArticle ul.list li {
	text-indent: -1em;
	margin-left: 1em;
}

#containerArticle .interview {
	padding-top: 35px;
	font-weight: 700;
	color: #51AB00;
	background: none;
}
#containerArticle p.capTxt01 {
	display: inline;
	padding-top: 15px;
	padding-bottom: 3px;
	border-bottom: 1px dashed #999;
	font-size: 20px;
	font-weight: 700;
}
#containerArticle p.capTxt01:before {
	content: "\A";
	white-space: pre;
	display: block;
	line-height: 0.8;
}
#containerArticle ul.list span,
#containerArticle p span {
	display: inline;
	font-weight: 700;
}
#containerArticle p span {
	font-weight: 700;
	color: #333;
}
#containerArticle p a {
	color: #0640B0;
}
#containerArticle p a:hover {
	color: #F00;
}
#containerArticle .centerImage {
	text-align: center;
}
#containerArticle .rightImage {
	float: right;
	padding: 15px 0 10px 20px;
}
#containerArticle .leftImage {
	float: left;
	padding: 15px 20px 10px 0;
}
#containerArticle .wideImage {
	margin: 30px 0 20px;
	clear: both;
}
/* pointColorType */
#containerArticle .pointColor01 {
	color: #C30;
}
/* pointTit */
#containerArticle .pointTit {
	display: table;
	width: 100%;
	margin: 20px 0 10px;
	background: #EEE;
	font-size: 17px;
	font-weight: 700;
}
#containerArticle .pointTit dt,
#containerArticle .pointTit dd {
	display: table-cell;
	padding: 4px 10px;
	vertical-align: middle;
}
#containerArticle .pointTit dt {
	width: 13%;
	background: #DFC352;
	text-align: center;
	color: #FFF;
}
#containerArticle .pointTit dt span {
	padding-left: 5px;
}
/* boxType */
#containerArticle .dotBox01 {
	padding: 10px 25px;
	margin: 20px 0;
	border: 1px dashed #CCC;
}
/* figcaption */
#containerArticle figcaption {
	padding: 10px 0;
	font-size: 13px;
}
/* linkBtnType */
#containerArticle .linkBtn01 {
	display: block;
	padding: 10px 20px;
	background: #DFC352;
	border-radius: 3px;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	font-weight: 700;
}
#containerArticle .linkBtn01:hover {
	color: #FFF;
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}
/* web icon */
#containerArticle i.fa {
	display: inline;
	width: 1em;
	padding-right: 10px;
	text-align: center;
	font-size: 15px;
	color: #666;
}
#containerArticle i.fa-external-link {
	color: #666;
}
#containerArticle i.fa-check {
	color: #DFC352;
}
#containerArticle iframe {
	width: 100%;
}

/* =========================================================
cornerRanking
========================================================= */
#cornerRanking {
	margin: 10px 40px 40px;
	padding: 0 0 30px;
	background: #FBFBFB;
	position: relative;
}
#cornerRanking h3 {
	background: #F4F6F1;
	font-size: 16px;
	font-weight: 700;
	padding: 16px 30px;
	margin: 0 0 15px;
}

/* cornerRankInner */
#cornerRanking .cornerRankInner {
	line-height: 1.2em;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#cornerRanking .cornerRankInner .list{
	width: 660px;
	margin: 0 auto;
	position: relative;
}
#cornerRanking .cornerRankInner .list li {
	margin-right: 10px;
	padding-top: 40px;
	display: inline-block;
	position: relative;
}
#cornerRanking .cornerRankInner .list li:last-child {
	margin-right: 0;
}
#cornerRanking .cornerRankInner .list li:nth-child(2):before{
	content: "1";
	background-image: url(../../common/img/ico_crown_01.png);
}
#cornerRanking .cornerRankInner .list li:nth-child(3):before{
	content: "2";
	background-image: url(../../common/img/ico_crown_02.png);
}
#cornerRanking .cornerRankInner .list li:nth-child(4):before{
	content: "3";
	background-image: url(../../common/img/ico_crown_03.png);
}
#cornerRanking .cornerRankInner .list li:nth-child(5):before{
	content: "4";
	background-image: url(../../common/img/ico_crown_04.png);
}
#cornerRanking .cornerRankInner .list li:nth-child(6):before{
	content: "5";
	background-image: url(../../common/img/ico_crown_04.png);
}
#cornerRanking .cornerRankInner .list li:before{
	width: 40px;
	height: 40px;
	line-height: 55px;
	border-radius: 40px;
	position: absolute;
	top: 0px;
	left: 42px;
	text-align: center;
	background-color: #FFF;
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: top 8px center;
}
#cornerRanking .cornerRankInner .list .listWrap{
	width: 122px;
	height: 200px;
	border: 1px solid #CCC;
	float: left;
	margin-top: 10px;
}
#cornerRanking .cornerRankInner .list li .pic img{
	width: 122px;
	height: 122px;
	object-fit: cover;
	font-family: 'object-fit: cover;';

}
#cornerRanking .cornerRankInner .list li .infoBox {
	text-align: center;
	font-weight: bold;
	color: #000;
}
#cornerRanking .cornerRankInner .list li .price {
	width: 100%;
	font-size: 15px;
	color: #FD7F17;
	padding: 10px 0 5px;
}
#cornerRanking .cornerRankInner .list li .rimawari_ico {
	font-size: 11px;
}
#cornerRanking .cornerRankInner .list li .red {
	font-size: 13px;
	color: #C9583F;
}
#cornerRanking .cornerRankInner .list li .address {
	width: 120px;
	font-size: 12px;
	padding-top: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* cornerLink */
#cornerRanking .cornerLink {
	position: absolute;
	top: 16px;
	right: 30px;
}
#cornerRanking .cornerLink a {
	display: inline-block;
	padding-left: 12px;
	background: url(../../common/img/ico_arrow_01.png) no-repeat 0 48%;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	font-size: 14px;
	color: #333;
	text-decoration: none;
	text-align: right;
}
#cornerRanking .cornerLink a:hover {
	color: #F00;
}


/* =========================================================
cornerCompany
========================================================= */
#cornerCompany {
	margin: 0 40px 40px;
	padding: 0 0 30px;
	background: #FBFBFB;
	border: 1px solid #F4F6F1;
	clear: both;
	overflow: hidden;
}
#ftSns {
	padding: 0 40px;
}
#cornerCompany h3 {
	background: #F4F6F1;
	font-size: 16px;
	font-weight: 700;
	padding: 16px 30px;
	margin: 0 0 25px;
}

/* cornerCompanyL */
#cornerCompanyL {
	float:left;
	width: 200px;
	margin: 0 30px;
}
#companyLogo {
	width: 200px;
	height: 200px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	background: no-repeat 0 0;
	-webkit-background-size: contain;
	background-size: contain;
	/* 画像は各記事CSSで個別指定 */
}

/* cornerCompanyR */
#cornerCompanyR {
	float:left;
	width: 430px;
	font-size: 15px;
	line-height: 1.4;
}
#cornerCompanyR .companyName {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 5px;
}
#cornerCompanyR .companyName span {
	font-size: 13px;
	display: inline-block;
}
#cornerCompanyR .companyNum span {
	font-size:15px;
	display: inline-block;
}
#cornerCompanyR span.tel {
	margin-right: 15px;
}
#cornerCompanyR span.tel:first-of-type {
	font-size:18px;
	font-weight: 700;
}
#cornerCompanyR span.free {
	display: block;
}
#cornerCompanyR .receptionTime {
}


/* condType */
.condType {
	overflow: hidden;
	margin-bottom: 20px;
}
.condType:after {
	content: '';
	display: block;
	clear: both;
}
.condType span {
	float: left;
	height: 18px;
	line-height: 18px;
	padding: 0 6px;
	margin: 0 3px 0 0;
	color: #CCC;
	font-size: 13px;
	font-weight: 700;
	font-family: Arial, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	border: 2px solid #CCC;
	border-radius: 4px;
}
.condType span.rent.on {
	border-color: #D7B03E;
	color: #D7B03E;
}
.condType span.sale.on {
	border-color: #3EC484;
	color: #3EC484;
}
.condType span.invest.on {
	border-color: #41B0E0;
	color: #41B0E0;
}
.condType span.tenant.on {
	border-color: #CC75A3;
	color: #CC75A3;
}

/* infoLinks (右袖ゲストプロフィールと共通) */
.infoLinks {
	margin-top: 20px;
}
.infoLinks dt {
	margin-top: 20px;
	padding-left: 20px;
	background: no-repeat 0 50%;
	background-size: auto 12px;
}
.infoLinks dt.infoHp {
	background-image: url(../../common/img/ico_link_01.png);
}
.infoLinks dt.infoBook {
	background-image: url(../../common/img/ico_book_01.png);
}
/*.infoLinks dd {
	margin-bottom: 15px;
}*/
.infoLinks dd a {
	display: inline-block;
}

/* URL表示だけspacing適用 */
.infoLinks .infoHp + dd {
	letter-spacing: 0.05em;
}

/* =========================================================
sidebar
========================================================= */

#sidebar section {
	border: 1px solid #E1E1E1;
	background: #FFF;
}
#sidebar section:not(:last-of-type) {
	border-bottom: none;
}
#sidebar section h1 {
	background: #F4F6F1;
	font-size: 16px;
	font-weight: 700;
	padding: 16px 0;
	text-align: center;
}

/* 追記 */
#sidebar #sideKeywordArea,
#sidebar #sideSnsArea, 
#sidebar #sideOtherInterviewArea{
	background-color: #FFF;
}
@media screen and (min-width:641px){
	#sidebar #sideKeywordArea,
	#sidebar #sideSnsArea, 
	#sidebar #sideOtherInterviewArea{
		background-color: #FFF;
		border-left: 1px solid #E1E1E1;
		border-right: 1px solid #E1E1E1;
	}
	#sidebar #sideOtherInterviewArea {
		border-bottom: 1px solid #E1E1E1;
	}
}

/* =========================================================
guestInfo
========================================================= */
#guestInfo {
	padding-bottom: 10px;
}

#guestInfo .guestProf:not(:last-of-type) {
	border-bottom: 1px solid #E1E1E1;
}

#guestInfo .guestImg {
	width: 120px;
	height: 120px;
	margin: 20px auto;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
	/* 画像は各記事CSSで個別指定 */
}

#guestInfo .guestName {
	margin: 0 20px;
	padding: 0 0 20px;
	border-bottom: 1px solid #E1E1E1;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
}
#guestInfo .guestName p span {
	display: block;
	font-size: 12px;
	line-height: 1.8;
}

#guestInfo .guestText {
	padding: 25px;
	font-size: 14px;
}
#guestInfo .guestText p {
	margin: 0 0 10px;
}

/* =========================================================
keyword / leftKeyword
========================================================= */
.leftKeyword {
	margin: 0 40px;
	padding: 30px;
	background: #F7F7F0;
	overflow: hidden;
}
.leftKeyword p {
	font-size: 13px;
	font-weight: 700;
	background-image: url(../../common/img/ico_tag_02.png);
	background-size: 13px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 0 0 15px;
	padding-left: 23px;
}
ul.tag li {
	background: #FFF;
	border:1px solid #CCC;
	border-radius: 25px;
	float:left;
	margin: 0 3px 5px 0;
	padding: 2px 10px;
}
ul.tag  li a {
	color: #666;
	text-decoration: none;
	font-size: 12px;
}
ul.tag  li:hover {
	border:1px solid #F0EDCE;
	background: #F0EDCE;
}

/* keyword */
#keyword {
	padding:0 0 20px;
}
#keyword ul {
	margin: 20px 20px 0;
	display: inline-block;
}
#keyword .more {
	text-align:right;
	padding: 15px ;
	clear:both;
	margin: 15px 20px 0;
	border-top:1px solid #E9E9E9;
}
#keyword .more i {
	color: #DFC352;
	font-size: 15px;
	font-weight: bold;
	padding-right: 5px;
}
#keyword .more a {
	display: block;
	color: #666;
	text-decoration: none;
}
#keyword .more a:hover {
	color: #DFC352;
}

/* leftKeyword */
#leftKeyword {
	margin: 40px;
	padding: 30px;
	background: #F7F7F0;
	overflow: hidden;
}
#leftKeyword p {
	font-size: 13px;
	font-weight: 700;
	background: url(../img/ico_tag_02.png) no-repeat 0 50%;
	-webkit-background-size: 13px;
	background-size: 13px;
	margin: 0 0 15px;
	padding-left: 23px;
}

/* =========================================================
snsInfo / leftSnsInfo
========================================================= */
ul.snsBtn {
	overflow: hidden;
}
ul.snsBtn li {
	float:left;
	margin: 0 3px 3px 0;
	height: 20px;
}
ul.snsBtn li a {
}
ul.snsBtn li:hover {
	opacity: 0.5;
}

/* snsInfo */
#snsInfo {
	padding: 0 0 20px;
}
#snsInfo ul {
	margin: 20px 0 0 20px;
	display: inline-block;
}

/* leftSnsInfo */
#leftSnsInfo {
	margin: 40px;
}

/* =========================================================
companyInfo
========================================================= */
#companyInfo {
	padding-bottom: 40px;
}
#infoContents li {
	min-height: 80px;
	padding: 15px 10px 15px 10px;
	border-bottom: 1px solid #E1E1E1;
	background-repeat: no-repeat;
	background-position: 15px 15px;
	-webkit-background-size: 80px;
	background-size: 80px;
}
#infoContents li:last-of-type {
	border-bottom: none;
}
#infoContents li:hover {
	/*
		opacity: 0.7;
		filter: alpha(opacity=70);
	*/
}
#infoContents li a {
	display: block;
	min-height: 80px;
	color: #434343;
	text-decoration: none;
	padding-left: 95px;
}
#infoContents li a:hover {
	color: #F00;
	text-decoration: underline;
	background-color: rgba(255,255,255,0.4);
}

#companyInfo .hp {
	background-image: url(../img/img_info_hp.png);
}
#companyInfo .consul {
	background-image: url(../img/img_info_consul.png);
}
#companyInfo .contact {
	background-image: url(../img/img_info_contact.png);
}
#companyInfo .seminar {
	background-image: url(../img/img_info_seminar.png);
}
#companyInfo .voice {
	background-image: url(../img/img_info_voice.png);
}
#companyInfo .faq {
	background-image: url(../img/img_info_faq.png);
}
#companyInfo .magazine {
	background-image: url(../img/img_info_magazine.png);
}
#companyInfo .blog {
	background-image: url(../img/img_info_blog.png);
}
#companyInfo .fb {
	background-image: url(../img/img_info_fb.png);
}
#companyInfo .media {
	background-image: url(../img/img_info_media.png);
}


/* =========================================================
containerInnerOther
========================================================= */
#containerInnerOther {
	clear: both;
	margin: 0 0 80px;
}

 /*** 追記：電話番号周り ***/
@media screen and (min-width:641px){
	#cornerCompanyR span.tel a {
			pointer-events: none;
			color: #333;
	}
}

#interviewContainer .tag span a {
	text-decoration: none;
}