@charset "utf-8";

:root{
  --vh: 0;
}
/* 各種色変更など変更用
 * ========================================================================== */
html {
  overflow-y: scroll;
}

/**
/* 各種リンク色指定
 * ========================================================================== */
a:link, a:visited, a:hover, a:active { color: #151515;}
.reqBtn { background: #8C7245 !important; color: #fff !important}
.resBtn { background: #5b493e !important; color: #fff !important}
.onlineBtn { background: #5b493e !important; color: #fff !important}
.limitedBtn { background: #fff !important; border: #5b493e solid 1px !important;}

/**
/* ヘッダー
 * ========================================================================== */
/*.loaded header{ opacity: 1; }*/
header::before {
/*BRANZBLUE
	background-image: url("../../img/header-bg-BRANZBLUE.png");*/
/*DARKBROWN
	background-image: url("../../img/header-bg-DARKBROWN.png");*/
/*BLACK
	background-image: url("../../img/header-bg-BLACK.png");*/
/*WHITE*/
	background-image: url("../img/header-bg-WHITE.png");
/*BLUE
	background-image: url("../../img/header-bg-BLUE.png");*/
/*LIGHTBLUE
	background-image: url("../../img/header-bg-LIGHTBLUE.png");*/
/*BLUEGREEN
	background-image: url("../../img/header-bg-BLUEGREEN.png");*/
/*LIGHTBROWN
	background-image: url("../../img/header-bg-LIGHTBROWN.png");*/
/*GRAY
	background-image: url("../../img/header-bg-GRAY.png");*/
}
header nav .inner .cv-wrap a,
header nav .inner .cv-wrap .contact { color:#fff; background: #8C7245;}
header > .contact { background: #8C7245;}
header .menu-trigger .line { background-color: #222;}

/**
/* ヘッダーお問い合わせ・インフォメーションエリア　電話番号アイコン
 * ========================================================================== */
/*背景色が濃色の場合やアイコン変更が必要な場合は変更する*/
.tel-link .tel-num a::before {
	background: url(../img/icon-tel-black.svg) no-repeat center center;
	width: 38px;
  height: 30px;
}

/**
/* ロゴ
 * ========================================================================== */
/*ロゴを変更する場合下記を調整*/
h1 a {
    /* background-image: url("../img/logo_hoshigaoka_pc.svg"); */
	background-image: url("../img/logo_pc.svg");
	width: 374px;
	height: 28px;
}
header nav .logo { width: 240px;}
header nav .logo img { width: 100%;}

@media screen and (max-width:1024px) {
    h1 a {
        /* background-image: url("../img/logo_hoshigaoka_sp.svg"); */
		background-image: url("../img/logo_sp.svg");
		width: 110px;
        height: auto;
        aspect-ratio: 90 / 33;
    }
	header nav .logo { width: 128px;}
}

/**
/* インフォメーションスライダー　背景色　文字色　ドット色
 * ========================================================================== */
#infoArea { background: #1a1a1a !important; color: #fff;}
#infoArea .slick-dots li button { background: rgba(255,255,255,.4);}
#infoArea .slick-dots li.slick-active button { background: rgba(255,255,255,1);}

/**
/* 行動提起　背景色　文字色
 * ========================================================================== */
#actionproposal { background: #2d2d2d !important;}
#actionproposal p { color: #fff !important;}

/**
/* 物件セールスポイント　スマホ時スライダー　ドット色
 * ========================================================================== */
/*背景色が濃色の場合や視認性が悪い場合は変更する*/
.meritItems .slick-dots li button:before { color: #000 !important;}
.meritItems .slick-dots li.slick-active button:before {  color: #000 !important;}

/**
/* フッター　各種背景色　文字色
 * ========================================================================== */
#page-prev-next-btns { background: #1a1a1a;}
#page-prev-next-btns > a { color: #fff;}
#tel-footer { color: #fff; background: #000;}
#textlink-footer { color: #fff; background: #000;}
.other-links a { color: #fff;}

/**
/* フッター　コンバージョンボタン
 * ========================================================================== */
/*限定サイトボタンがない場合は　justify-content: center;　とする*/
/*#cv-limited { justify-content: center;}*/

/**
/* フッター　電話番号アイコン
 * ========================================================================== */
/*フッター背景色が淡色の場合やアイコン変更が必要な場合は変更する*/
#tel-footer .tel-link .tel-num a::before { background-image: url(../img/icon-tel-white.svg);}