@charset "utf-8";
/* CSS Document */

.smp{display: none;}

body{
	margin: 0px;
	font-family: "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 20px;
    color:#444;
}

a:link {color: #444;text-decoration: none;}
a:visited {color: #444;	text-decoration: none;}
a:hover {color: #000;text-decoration: none;}
a:active {color: #036;text-decoration: none;}
.example { cursor: pointer; } 
a img{border: none;}

.cf:before,.cf:after{content:"";display:block;overflow:hidden;}
.cf:after{clear:both;}
.cf{zoom:1;}

.f-oswald{font-family: 'Oswald', sans-serif; letter-spacing: 0.05em;}

hr.type1 {
border-width: 1px 0px 0px 0px;
border-style: solid;
border-color: #cccccc;
height: 1px;
}


/* NEW と　プライスダウン*/
.mark-new{bcakground:#CC66BC;}
.mark-down{bcakground:#5F63C8;}


.wrap{width: 1200px; margin: 0 auto;}
#main-content{padding: 50px 0;width: 1200px; margin: 0 auto;}
#content{width:890px; float: right;}
#page-content{width:890px; margin: 0 auto;}
#side{width: 270px;	float: left;margin-right: 40px;}


/* position 設定
----------------------------------------*/
.position-r{position: relative}

h1{
	margin: 0px;
	padding: 0px;
	line-height: 13px;
	text-align: right;
	font-size: 12px;
	font-weight: normal;
    position: absolute;
    top:0; right: 0;
}

h2{font-size: 28px; font-weight: bold; margin: 0 0 13px 0; padding: 0; text-align: center;}
h2 span.subtxt{font-size: 12px; display: block; font-weight: normal; margin-top: 8px; letter-spacing: 0.05em;} 

.pankuzu{font-size: 80%; margin-bottom: 30px; color: #999;}

/* header erea
---------------------------------------------------------*/
#header{padding: 10px 0;}
#header .h-logo{display: table-cell;}
#header .h-logo-name{display: table-cell;}
#header .h-logo-name img{height: 50px; width: auto; margin:0 0 10px 5px;}
#header .h-right-box{position: relative; bottom: 10px; right:0;}
#header .h-tel{position: absolute; bottom: 0; right:100px;}
#header .h-tel strong{color: #CC66BC; font-size: 30px;}
#header .h-favorite-box{position: absolute; bottom: 0; right:0;width: 100px;}
#header .h-favorite{position: absolute; bottom: -3px; right:10px; z-index: 0;}
#header .h-favorite img{width: 43px; height: 56px;}
#header .h-favorite-count{
    position: absolute; bottom: 8px; right:6px; z-index: 2;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font-size: 11px;
    background: #CC66BC;
    height: 20px;
    width: 20px;    
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;}
#header .h-favorite-txt{font-size: 11px; position: absolute; bottom: -12px; right:0;}


/*　header menu
----------------------------------------------------*/
.primary-nav {
	border-bottom: 1px solid #ccc;border-top: 1px solid #ccc;
	text-align: center;
	clear: both;
	position: relative;
    min-width: 1200px;
}
.primary-nav > ul{margin: 0; padding: 0;}
.primary-nav > ul > li{
	display: inline-block;
	-webkit-transition : all .2s linear;
	transition : all .2s linear;
}
.primary-nav > ul > li.home img{height: 20px; width: auto;}
.primary-nav > ul > li:hover{background: #E5E5E5;}
.primary-nav > ul > li.home:hover{background-color: #fff;}

.primary-nav > ul > li > a {
	padding: 0 20px 0;
	line-height: 70px;
	display: block;
	font-size: 18px;
}
.sub-nav {
	clear: both;
	visibility: hidden;
	opacity: 0;
	position: absolute;
	background: #E5E5E5;
	margin: 0;
	-webkit-transition : all .2s linear;
	transition : all .2s linear;
	z-index: 101;
	left: 0;
}
.account-nav .sub-nav {
	text-align: left;
	padding: 15px 20px;
	min-width: 120px;
	left: 50%;
	margin: 10px 0 0 -80px;
}
.account-nav .sub-nav:before {
	background: #f0f0f0;
	content: '';
	display: block;
	position: absolute;
	transform: rotate(45deg);
	top: 0;
	left: 50%;
	width: 10px;
	height: 10px;
	margin: -5px 0 0 -5px;
}
.primary-nav .sub-nav {
	width: 960px;
	padding: 20px -webkit-calc(50% - 480px);
	padding: 20px calc(50% - 480px);

	border-bottom: 1px solid #ccc;
	text-align: center;
}

li:hover .sub-nav {
	opacity: 1;
	visibility: visible;
}

.primary-nav .sub-nav li {
	font-size: 14px;
	float: left;		
	margin: 10px 20px;
	width: 25%;
	width: -webkit-calc(25% - 40px);
	width: calc(25% - 40px);
    border: solid 1px #666;
    background-color: #fff;
	box-sizing: border-box;
    list-style: none;
}
.primary-nav .sub-nav li a{display: block;line-height: 1.5;padding: 10px 0; }
.primary-nav .sub-nav a:hover{background-color: #F9F9F9;}

.sub-nav li .icon{display: block; text-align: center;}
.sub-nav li .icon img {	
	width: auto;
	max-height: 28px;
	margin: 0 0 5px;
}


/* side
--------------------------------------------*/

#side .side-navi{background-color:#E6E6E6;}
#side .side-navi-ttl{background-color: #666666; color: #fff; text-align: center; padding: 10px 0; margin-bottom: 20px;}
#side .side-navi-ttl .eg{font-size: 60%; letter-spacing: 0.1em;}
#side .search-type{margin: 20px 20px 10px; font-size: 110%; font-weight: 500;}
#side ul.side-nav{margin: 10px 20px; padding: 10px 20px 20px; border-bottom: 1px #666 solid;}
#side ul.side-nav:last-child{border-bottom:none;}
#side ul.side-nav li{padding: 5px 0;}


/*　pagetop
-------------------------------------------*/
#pagetop {
  position: fixed;
  right: 10px;
  bottom: 150px;
  z-index: 1000;
  width: 50px;
}
#pagetop a {
    font-size: 2.5rem!important;
    text-align: center;
    display: block;
    text-decoration: none;
    border: 1px solid #aaa;
    padding: 4px 0;
    background-color: rgba(255,255,255,0.50);
    color: #666;
}

/* footer erea
-------------------------------------------------*/

#footer{border-top: solid #ccc 1px; padding: 50px 0 0; width: 100%; min-width:1200px;}

#footer .add-container{text-align: center; padding: 30px 0 50px; font-size: 14px; line-height: 1.5em;width: 600px; margin: 0 auto;}
#footer .add-container strong{display: block; margin-top: 5px;}
#footer .f-logo{text-align: center;}
#footer .f-logo img{width: 260px; height: auto;}

#footer ul.btn{display:table;border-spacing: 20px 0; margin: 20px 20px 0 10px;}
#footer ul.btn li{
display:table-cell;
vertical-align:middle;
text-align:center;
}

#footer .f-navi{
    background-color: #666;
    padding: 20px 0;
    text-align: center;
    color: #fff;
    font-size: 12px;
}
#footer .f-navi a:link,#footer .f-navi a:visited{color:#fff;}
#footer .f-navi a:hover{color:#ccc;}

#copyright{text-align: center; font-size: 12px; padding: 10px 0;letter-spacing: 0.1em;}



/*  button
---------------------------------------------*/

a.btn-contact, a.btn-phone, a.btn-favorite-f{
  padding: 15px 30px 15px 20px;
  margin: 15px 0;
  display: block;
  color: #fff !important;
  background: #CC66BC;
  text-decoration: none;
  font-size:14px;
  text-align:center;
  text-decoration:none !important;
}
a.btn-contact:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 1px 10px 0 10px;
    background-repeat: no-repeat;
    background-image: url(../img/ic_mail.svg);
    background-size: contain;
    vertical-align: middle;
}
a.btn-favorite-f:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 1px 10px 0 10px;
    background-repeat: no-repeat;
    background-image: url(../img/ic_phone.svg);
    background-size: contain;
    vertical-align: middle;
}
a.btn-contact:hover,a.btn-phone:hover,a.btn-favorite-f:hover {
    background-color: #C042AC;
}

a.btn-favorite-f:before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    margin: 0 10px 0 10px;
    background-repeat: no-repeat;
    background-image: url(../img/ic_favorite_white.svg);
    background-size: contain;
    vertical-align: middle;
}
a.btn-contact:hover,a.btn-phone:hover {
    background-color: #C042AC;
}

a.btn-blog{
  padding: 15px 20px 25px 20px;
  margin: 15px 0;
  display: block;
  border: solid 1px #666;
  background: #fff;
  text-decoration: none;
  font-size:24px;
  font-weight: bold;
  text-decoration:none !important;
  position: relative;
}
a.btn-blog:before {
    content: "";
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 5px 20px 0 10px;
    background-repeat: no-repeat;
    background-image: url(../img/ic_edit_24px.svg);
    background-size: contain;
    vertical-align: middle;
}
a.btn-blog span{position: absolute; bottom: 13px; left:32%; font-size: 50%; font-weight: normal;}

a.btn-mail{
  padding: 15px 20px 25px 20px;
  margin: 15px 0;
  display: block;
  border: solid 1px #666;
  background: #fff;
  text-decoration: none;
  font-size:24px;
  font-weight: bold;
  text-decoration:none !important;
  position: relative;
}
a.btn-mail:before {
    content: "f0e0";
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 1px 10px 0 10px;
    vertical-align: middle;
}







/* SOLD OUT / RESERVE
--------------------------------------------------*/
/*詳細ページ用*/
.situation{
	font-size: 60px;
	color: #666666;
	position: absolute;
	top: 150px;
	left: 130px;
	/*	filter:glow(color=black ,strength=1);　*/
	font-weight: bold;
	line-height: 80px;
}
.situation a:link{
	color: #CCCCCC;
	text-decoration: none;
}
.situation a:hover {color: #FFFFFF;text-decoration: none;}
.situation a:visited{color: #FFFFFF;text-decoration: none;}

/*トップページ用*/
.situation1{
	font-size: 24px;
	color: #666666;
	position: absolute;
	top: 60px;
	/*	filter:glow(color=black ,strength=1);　*/
	font-weight: bold;
	text-align: center;
	width: 180px;
	left: 30px;
	line-height: 30px;
}
.situation1 a:link{color: #FFFFFF;text-decoration: none;}
.situation1 a:hover {color: #FFFFFF;text-decoration: none;}
.situation1 a:visited{color: #FFFFFF;text-decoration: none;}

/*お気に入り物件用*/
.situation2{
	font-size: 22px;
	color: #666666;
	position: absolute;
	top: 40px;
	/*	text-shadow: #000 0px 0px 1px;
	filter:glow(color=black ,strength=1);　*/
	font-weight: bold;
	text-align: center;
	width: 150px;
	left: 5px;
}
.situation2 a:link{color: #FFFFFF;text-decoration: none;}
.situation2 a:hover {color: #FFFFFF;text-decoration: none;}
.situation2 a:visited{color: #FFFFFF;text-decoration: none;}


/*検索一覧用*/
.situation3{
	font-size: 22px;
	color: #666666;
	position: absolute;
	top: 45px;
	/*	text-shadow: #000 0px 0px 1px;
	filter:glow(color=black ,strength=1);　*/
	font-weight: bold;
	text-align: center;
	width: 160px;
	left: 10px;
}
.situation3 a:link{color: #FFFFFF;text-decoration: none;}
.situation3 a:hover {color: #FFFFFF;text-decoration: none;}
.situation3 a:visited{color: #FFFFFF;text-decoration: none;}

/*thanks
------------------------------*/
#thanks{margin-top: 50px;}
#thanks .ttl{font-size: 150%;text-align: center;}
#thanks .comment{margin: 50px 0; line-height: 2em;}