@charset "tf-8";

/*----------------------------------------------------------------------------------------

	page.css

----------------------------------------------------------------------------------------*/

/* 共通 //
////////////////////////////////////////////////////////////////////*/

#smp-header h1 {
	border-bottom: 8px solid #beaf87;
}
.main {
	margin: 30px 10px 60px;	
}
.main .line01 {
	margin-bottom: 20px;
}
.accent, .shd {
	color: #f33;
}
.shd {
	margin-bottom: 10px;
	font-size: 1.5rem;
}
* + .shd {
	margin-top: 30px;
}

.main ul {
	margin: 20px 0;
}
.main li:not(:last-child) {
	margin-bottom: 10px;
}
.disc li {
	list-style-type: disc;
	list-style-position: inside;
}

.main .btn02 {
	margin-top: 20px;
}
.main .btn02:not(:last-child){
	margin-bottom: 20px;
}

/* table //
---------------------------------------------- */

.table-stye01 {
	box-sizing: border-box;
	width: 100%;
}
.table-stye01 th,
.table-stye01 td {
	box-sizing: border-box;
	padding: 5px 10px;
	border: 1px solid #ccc;
	text-align: center;
}
.table-stye01 th {
	background: #f0f0f0;
	white-space: nowrap;
}
.table-stye01 td {
	text-align: left;
}

/* オーナー様へ //
////////////////////////////////////////////////////////////////////*/

#owner .nagare ol {
	margin: 20px 0;
}
#owner .nagare li {
	padding: 0 5px 5px;
	background-color: #beaf87;
	border-radius: 4px;
	position: relative;
	line-height: 1.6;
}
#owner .nagare li + li {
	margin-top: 20px;
}
#owner .nagare li::before {
	margin: auto;
	right: 0;
	bottom: -17px;
	left: 0;
	color: #beaf87;
}
#owner .nagare h4 {
	margin-bottom: 0;
	padding: 11px 5px 11px 75px;
	position: relative;
	color: #414042;
	line-height: 1.3;
}
#owner .nagare h4 i {
	box-sizing: border-box;
	margin: auto;
	width: 60px;
	height: 25px;
	background-color: #414042;
	border: 1px solid #fff;
	border-radius: 4px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 5px;
	color: #fff;
	font-size: 1.3rem;
	line-height: 25px;
	text-align: center;
	vertical-align: middle;
}
#owner .nagare li div {
	padding: 8px;
	background-color: #fff;
}
#owner .nagare li div p:not(:last-child) {
	margin-bottom: 10px;
}

/* お役立ち情報 //
////////////////////////////////////////////////////////////////////*/


/* お役立ちコーナー ///
---------------------------------------------- */

#useful .corner {
	margin-top: 20px;
}
#useful .corner section {
	padding: 5px;
	background-color: #efe9dc;
}
#useful .corner ul {
	margin: 0;
	overflow: hidden;
}
#useful .corner li:not(:last-child) {
	margin-bottom: 5px;
}
@media(min-width: 360px) {
	#useful .corner li {
		width: calc(50% - (5px / 2));
		float: left;
	}
	#useful .corner li:nth-child(2n) {
		float: right;
	}
}

/*----------*/

#useful .corner h3 {
	margin-bottom: 5px;
	background-color: #e0d5be;
	color: #f60;
	font-size: 1.5rem;
	text-shadow: #fff 0px 2px, #fff 2px 0px, #fff -2px 0px, #fff 0px -2px, #fff -1px -1px, #fff 1px 1px, #fff 1px -1px, #fff -1px 1px;
	text-align: center;
}
#useful .corner a {
	padding: 7px 0;
	padding-left: 30px;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 4px;
	display: block;
}
#useful .corner a::before {
	left: 10px;
}

#useful #baibai h5,
#useful #chintai h5 {
	margin:  30px 0 10px;
	font-size: 1.4rem;
}
#useful #baibai .shd + h5,
#useful #chintai .shd + h5 {
	margin-top: 0;
}
#useful #baibai ol > li:not(:last-child),
#useful #chintai ol > li:not(:last-child) {
	margin-bottom: 19px;
}

/* 賃貸 チェック項目 ///
---------------------------------------------- */

#check-list {
	margin-bottom: 30px;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
}
#check-list ul {
	margin: 0;
	width: 620px;
}
#check-list li {
	width: 100px;
	position: relative;
	float: left;
	text-align: center;
}
#check-list li:not(:last-child) {
	margin-right: 30px;
}
#check-list a {
	padding: 10px;
	background-color: #80cf42;
	border-radius: 4px;
	display: block;
	color: #fff;
	text-shadow: #309c0b 0px 2px, #309c0b 2px 0px, #309c0b -2px 0px, #309c0b 0px -2px, #309c0b -1px -1px, #309c0b 1px 1px, #309c0b 1px -1px, #309c0b -1px 1px;
}
#check-list li::before {
	margin: auto;
	top: 0;
	right: -28px;
	bottom: 0;
	color: #80cf42;
}

/* Q&A ///
---------------------------------------------- */

#useful.qa .list {
	margin: 20px 0;	
}
#useful.qa .list ul {
	margin: 0 10px;
}
#useful.qa .list li {
	margin-bottom: 0;
}

/*Qマーク*/
#useful.qa .list h3,
#useful.qa dt {
	margin-bottom: 6px;
	padding: 8px 0 8px 40px;
	border-bottom: 1px dotted #ccc;
	position: relative;
	color: #333;
	font-size: 1.5rem;
	font-weight: normal;
	line-height: 1.5;
}
#useful.qa .list h3::before,
#useful.qa dt::before {
	margin: auto;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color: #f60;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	color: #fff;
	font-size: 1.4rem;
	line-height: 30px;
	text-align: center;
	content: "Q";
}

/*----------*/

#useful.qa .list ul + h3 {
	margin-top: 30px;
}
#useful.qa .icon-all a::before {
	color: #f60;
}
#useful.qa .list a {
	padding: 10px 0 10px 15px;
	display: block;
}

/*----------*/

#useful.qa dd {
	margin-right: 10px;
	padding-left: 40px;
	position: relative;
}
#useful.qa dd:not(:last-child) {
	margin-bottom: 30px;
}
#useful.qa dd::before {
	margin: auto;
	width: 25px;
	height: 25px;
	background-color: #f90;
	border-radius: 50%;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 3px;
	color: #fff;
	line-height: 25px;
	text-align: center;
	content: "A";
}

/*----------*/

#useful.qa .q {
	margin-top: 60px;
}

/* 会社案内 //
////////////////////////////////////////////////////////////////////*/

#company .gaiyou > .line02 {
	margin-top: 0;
}
#company * + .picArea01 {
	margin-top: 20px;
}
#company .picArea01 {
	overflow: hidden;
}
#company .picArea01 figure {
	width: calc(50% - 5px);
	float: left;
}
#company .picArea01 figure:nth-of-type(even) {
	float: right;
}
#company .picArea01 figcaption {
	text-align: center;	
}

/* diarypro //
////////////////////////////////////////////////////////////////////*/

#diarypro .diary {
	word-break: break-all;
}
#diarypro .diary  .text p a {
	text-decoration: underline;
}
#diarypro img {
	width: auto;
}
#diarypro ul > li {
	margin-bottom: 0;
	border-bottom: 1px dotted #ccc;
}
#diarypro li > a {
	padding: 10px 0;
	display: block;
}
#diarypro hr {
	margin: 15px 0;
	border: none;
	height: 1px;
	background-color: #ccc;
}
#diarypro .table-box select , #diarypro .table-box [type="submit"] {
	height: 40px;
	-webkit-appearance: none;
	appearance: none;
}
#diarypro .table-box select {
	box-sizing: border-box;
	width: calc(100% - 90px);
	padding-left: 10px;
	border: 1px solid #bebebe;
	border-radius: 3px;
	background: url(/smp/images/common/select.png) no-repeat right 9px center / 5px;
	float: left;
}
#diarypro .table-box [type="submit"] {
	box-sizing: border-box;
	width: 80px;
	border: none;
	border-radius: 3px;
	float: right;
	color: #fff;
}

/*----------*/

#diarypro iframe{
	width: 100%;
	height: 150px;
}
#diarypro p , #diarypro a img {
	margin-bottom: 10px;
}

/*----------*/

.bottom-links > a {
	padding: 0 10px;
	height: 42px;
	border-radius: 4px;
	display: inline-block;
	color: #fff;
	font-size: 12px;
	line-height: 42px;
}
.bottom-links {
	overflow: hidden;
}

.bottom-links > a:last-child {
	float: right;
	background-size: 11px;
}
.bottom-links > a:first-child {
	float: left;
	background-size: 11px;
}
#diarypro > p {
	margin-bottom: 20px;
}

.page-nav {
	margin-top: 15px;
	overflow: hidden;
}
.page-nav > a {
	padding: 0 15px;
	background-color:#ebe7db;
	font-size: 12px;
	display: inline-block;
	border-radius: 4px;
}
.page-nav > a:first-child {
	float: left;
	background-size: 11px;
	height:42px;
	line-height:42px;
}
.page-nav > a:last-child {
	float: right;
	background-size: 11px;
	height:42px;
	line-height:42px;
}
.page-nav > a.page-prev {
	padding-left: 30px;
	float:left;
	background-size: 11px;
}
.page-nav > a.page-prev::before {
	left: 10px;
}
.page-nav > a.page-next {
	padding-right: 30px;
	float: right;
	background-size: 11px;
}
.page-nav > a.page-next::after {
	right: 10px;
}

/*----------*/

#diarypro .ichiran-nav {
	margin: 20px 0;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}
#diarypro .ichiran-nav a {
	width: 100%;
	background-color: #ebe7db;
	border: 1px solid #ccc;
	background-size: 11px;
	height: 42px;
	line-height: 42px;
	display: inline-block;
	border-radius: 4px;
	font-size: 12px;
	text-align: center;
}

/*----------*/

#diarypro form[action$="diary.cgi"] {
	overflow: hidden;
}
#diarypro form[action$="diary.cgi"] select[name="field"], #diarypro form[action$="diary.cgi"] input[type="submit"] {
	box-sizing: border-box;
	height: 40px;
	border-radius: 3px;
	font-size: inherit;
	-webkit-appearance: none;
	appearance: none;
}
#diarypro select[name="field"] {
	box-sizing: border-box;
	padding-left: 10px;
	width: calc(100% - 90px);
	height: 40px;
	background: url(/smp/images/common/select.png?cache-0) no-repeat right 9px center / 5px;
	border: 1px solid #bebebe;
	float: left;
}
#diarypro form[action$="diary.cgi"] input[type="submit"] {
	width: 80px;
	background-color: #beaf87;
	border: none;
	color: #fff;
	float: right;
}

/* スマホのログイン画面 ///
---------------------------------------------- */

.dps-message {
	margin-top: 40px;
	color: #f80;
	font-weight: bold;
	text-align: center;
}