@charset "utf-8";

/*--------------------------------------------------*/
/*		http://
/*		/css/index.css
/*--------------------------------------------------*/
/*		$index
/*--------------------------------------------------*/
/*			$index.......目次
/*			$layout......全体・部分的なレイアウト
/*			$visual......visual部分
/*--------------------------------------------------*/



/*--------------------------------------------------*/
/*			$layout
/*--------------------------------------------------*/
.intro{padding-bottom: 1em; font-size: 1.6rem; line-height: 1.6;}
.cat-navi{padding-bottom: 40px;}
.cat-navi ul{-webkit-justify-content: center; justify-content: center;}
.cat-navi li{width: 128px; margin-right: 10px;}
.cat-navi li:last-child{margin-right: 0;}
.cat-navi a{display: block; padding: .5em 0; color: #fff; font-size: 1.6rem; font-weight: bold; line-height: 1; text-align: center; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
.cat-navi .latest a{border: 1px #e9b47f solid; background-color: #e9b47f;}
.cat-navi .mansion a{border: 1px #012456 solid; background-color: #012456;}
.cat-navi .newhouse a{border: 1px #9e0000 solid; background-color: #9e0000;}
.cat-navi .house a{border: 1px #008820 solid; background-color: #008820;}
.cat-navi .land a{border: 1px #810080 solid; background-color: #810080;}
.cat-navi .rent a{border: 1px #a59f00 solid; background-color: #a59f00;}
.cat-navi .revenue a{border: 1px #ef4b90 solid; background-color: #ef4b90;}
.cat-navi .latest a:hover,.cat-navi .latest.current a{background-color: #fff; color: #e9b47f;}
.cat-navi .mansion a:hover,.cat-navi .mansion.current a{background-color: #fff; color: #012456;}
.cat-navi .newhouse a:hover,.cat-navi .newhouse.current a{background-color: #fff; color: #9e0000;}
.cat-navi .house a:hover,.cat-navi .house.current a{background-color: #fff; color: #008820;}
.cat-navi .land a:hover,.cat-navi .land.current a{background-color: #fff; color: #810080;}
.cat-navi .rent a:hover,.cat-navi .rent.current a{background-color: #fff; color: #a59f00;}
.cat-navi .revenue a:hover,.cat-navi .revenue.current a{background-color: #fff; color: #ef4b90;}
@media screen and (max-width: 767px) {
.intro{padding-bottom: 2em; font-size: 1.2rem;}
.cat-navi{padding-bottom: 1.5625%;}
.cat-navi ul{-webkit-justify-content: flex-start; justify-content: flex-start;}
.cat-navi li{width: 30%; margin: 0 5% 15px 0;}
.cat-navi li:first-child{width: 100%; margin: 0 0 15px 0;}
.cat-navi li:nth-child(4n){margin-right: 0;}
.cat-navi a{font-size: 1.4rem;}
}



/*--------------------------------------------------*/
/*			$visual
/*--------------------------------------------------*/
#lower-visual{margin-bottom: 30px; background: url(/images/article/visual_pc.jpg) no-repeat center top; background-size: cover;}
#lower-visual h2{margin-left: -2.2em;}
@media screen and (max-width: 767px) {
#lower-visual{margin-bottom: 7.8125%; background: url(/images/article/visual_sp.jpg) no-repeat center top; background-size: cover;}
}



/*--------------------------------------------------*/
/*			$box01
/*--------------------------------------------------*/
#box01 li{width: 300px; margin: 0 30px 30px 0; border: 1px #ccc solid; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#box01 li:nth-child(3n){margin-right: 0;}
#box01 a{display: block; width: 100%; height: 100%; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#box01 dl{position: relative; padding: 20px;}
#box01 dt{position: absolute; left: 0; top: 0; z-index: 2; width: 130px; padding: .5em 0; color: #fff; font-size: 1.4rem; font-weight: bold; line-height: 1; text-align: center; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#box01 .mansion dt{border: 1px #012456 solid; background-color: #012456;}
#box01 .newhouse dt{border: 1px #9e0000 solid; background-color: #9e0000;}
#box01 .house dt{border: 1px #008820 solid; background-color: #008820;}
#box01 .land dt{border: 1px #810080 solid; background-color: #810080;}
#box01 .rent dt{border: 1px #a59f00 solid; background-color: #a59f00;}
#box01 .revenue dt{border: 1px #ef4b90 solid; background-color: #ef4b90;}
#box01 .ph{overflow: hidden; position: relative; width: 260px; height: 170px; background-color: #efefef; font-size: 0; line-height: 0;}
#box01 .ph img{position: absolute; left: 50%; top: 50%; width: auto; height: auto; max-width: 100%; max-height: 100%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
#box01 .txt{font-size: 1.4rem; line-height: 2; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
#box01 .mansion a:hover{border: 1px #012456 solid; background-color: #012456;}
#box01 .newhouse a:hover{border: 1px #9e0000 solid; background-color: #9e0000;}
#box01 .house a:hover{border: 1px #008820 solid; background-color: #008820;}
#box01 .land a:hover{border: 1px #810080 solid; background-color: #810080;}
#box01 .rent a:hover{border: 1px #a59f00 solid; background-color: #a59f00;}
#box01 .revenue a:hover{border: 1px #ef4b90 solid; background-color: #ef4b90;}
#box01 .mansion a:hover dt{background-color: #fff; color: #012456;}
#box01 .newhouse a:hover dt{background-color: #fff; color: #9e0000;}
#box01 .house a:hover dt{background-color: #fff; color: #008820;}
#box01 .land a:hover dt{background-color: #fff; color: #810080;}
#box01 .rent a:hover dt{background-color: #fff; color: #a59f00;}
#box01 .revenue a:hover dt{background-color: #fff; color: #ef4b90;}
#box01 a:hover .txt{color: #fff;}
@media screen and (max-width: 767px) {
#box01 ul{padding-bottom: 4.6875%}
#box01 li{width: 48%; margin: 0 4% 10px 0;}
#box01 li:nth-child(2n){margin-right: 0;}
#box01 li:nth-child(3){margin-right: 4%;}
#box01 li:nth-child(9){margin-right: 4%;}
#box01 dl{padding: 3.125%;}
#box01 dt{width: 51.72%; font-size: 1rem;}
#box01 .ph{width: 100%; height: 75px;}
#box01 .txt{font-size: 1rem;}
}