:root {
  --color-primary: rgba(17,109,185, 1);
}

/* global */
.contents .inner a:hover {
  opacity: 0.8;
}

/* define parts
========================================================= */
.contents-article .item-detail-tab-contents .tab {
  border-bottom: 4px solid;
}

.contents-article .item-detail-tab-contents .tab.bottom {
  border-top: 4px solid;
  border-bottom: 0;
}

/* altanate color */
.tx-color1 {
  color: #974600;
}

/* define background color
========================================================= */
.page-header-top .link li:last-child a,
.header-top,
.gnav,
.slick-dots li:after,
.heading-lv1,
.heading-lv1-1column,
.element-news dt:before,
input.btn-lv3,
.side-others-qr-heading,
.contents-main-1column .form-flow .form-flow__label.current-flow,
.element-table7 tr:first-child th,
.element-table7 tbody tr:first-child th,
.element-table8 tr:first-child th,
.element-table8 tbody tr:first-child th,
.element-tximg7 .area-profile dt span::before,
.contents-form .contents-main .form-flow,
.contents-main-1column .element-tab-search li.active a,
.contents-main-1column .element-recommend .btn-prev a,
.contents-main-1column .element-recommend .btn-next a,
.heading-article,
.articlelist-side-heading,
.articlelist-side-section .link-more-term a,
.contents-article .article-main-info .article-heading,
.article-side-heading,
.contents-article .item-detail-tab-contents .tab .cu a,
.contents-article .heading-article-lv2:before,
.article-checklist .heading-lv1-1column,
.howto-see .heading-howto,
.howto-see .heading-attention:before,
.pagetop a,
.page-footer .pagetop a,
.modal-streetview__error .btn-close a {
  background-color: rgb(from var(--color-primary) r g b/1);
}

/* define foreground color
========================================================= */
a:hover,
.page-header-top .link li a,
.page-header-top .link2 li a,
.gnav ul li b span,
.side-search-heading,
.side-nav-heading,
.heading-lv2-1column,
.heading-lv1 a,
.heading-lv2 a,
.heading-lv3 a,
.heading-lv4 a,
.element-heading a,
.pager li.pager-prev a,
.pager li.pager-next a,
.element-firstletter li a,
.contents-main-1column .heading-kind,
.side-search ul li a:hover,
.side-nav li a:before,
.slick-dots li button:hover:before,
.slick-dots li button:focus:before,
.slick-dots li.slick-active button:before,
.side-search ul li a:before,
.side-search ul li a:hover,
.side-others-link li a:before,
.contents-main-1column .elemnet-kind-rent li a,
.contents-main-1column .elemnet-kind-buy li a,
.contents-main-1column .elemnet-kind-rent li:before,
.contents-main-1column .elemnet-kind-buy li:before,
.contents-main-1column .element-tab-search li a,
.contents-main-1column .element-btn-search input,
.contents-main-1column .element-btn-search .add-icn:before,
.heading-search-from:before,
.contents-main-1column .element-recommend a,
.contents-article .article-main-info .article-heading .article-type .type,
.side-watch .watch-list .watch-name a,
.contents-article .item-detail-tab-contents .tab a,
.sort-table .descend.active:after,
.sort-table .ascend.active:after,
.element-search-from-item a,
.element-search-from li:before,
.checklist-tab .active a,
.howto-see .heading-attention,
.element-heading a,
.pager a,
.quote:before, .quote:after,
.link-pagelist a,
a.link-pdf,
a.link-word,
a.link-excel,
a.link-powerpoint,
.element-login .tx-forget a,
.slick-dots li.slick-active button:before,
.maps-header .page-header-top .logo-s .company-link,
.map-option__all span:before,
.map-option__list span:before {
  color: rgba(from var(--color-primary) r g b/1);
}

/* define border color
========================================================= */
/* top */
.contents-main-1column .elemnet-kind-rent ul,
.contents-main-1column .elemnet-kind-buy ul,
.contents-article .item-detail-tab-contents .tab.bottom,
.contents-main-1column .element-tab-search.bottom,
.contents-map,
.howto-see .link-page a:after {
  border-top-color: rgba(from var(--color-primary) r g b/1);
}

.pager-bottom {
  border-top-color: rgba(from var(--color-primary) r g b/0.2);
}

/* bottom */
.side-search-heading,
.contents-main-1column .element-tab-search,
.contents-article .item-detail-tab-contents .tab,
.side-nav-heading {
  border-bottom-color: rgba(from var(--color-primary) r g b/1);
}

.pager {
  border-bottom-color: rgba(from var(--color-primary) r g b/0.2);
}

/* whole */
.contents-main-1column .element-tab-search li.active,
.contents-main-1column .heading-recommend,
.articlelist-side-section .articlelist-side-heading2,
.contents-article .item-detail-tab-contents .tab .cu a,
.howto-see .heading-howto2 {
  border-color: rgba(from var(--color-primary) r g b/1);
}

/* left */
.heading-lv2,
.heading-lv2-1column {
  border-left-color: rgba(from var(--color-primary) r g b/1);
}

/* right */
.page-header-top .link2 li {
  border-right-color: rgba(from var(--color-primary) r g b/0.5);
}

/* define half tone background color
========================================================= */
.element-blockquote::before,
.element-blockquote::after,
.side-search ul li a:after,
.side-nav ul li a:after,
.side-others-link li a:after {
  background-color: rgba(from var(--color-primary) r g b/0.3);
}

.side-others-qr,
.area-profile,
.element-table .element-table-heading,
.element-table th,
.element-table7 td.cell-checkbox,
.element-table7 th,
.element-table8 th,
.contents-main-1column .element-search-table th,
.contents-main-1column .element-detail-table th {
  background-color: rgba(from var(--color-primary) r g b/0.15);
}

.element-blockquote {
  background-color: rgba(from var(--color-primary) r g b/0.1);
}

.area-profile {
  background: rgba(from var(--color-black) r g b/0.1);
}

.element-news dd:nth-of-type(2n+1),
.list-definition dd,
.element-error,
.contents-main-1column .heading-area label,
.element-search-area-item.from-map .heading-area,
.contents-main-1column .element-recommend,
.contents-article .section-company .company-body,
.page-special .element-recommend,
.howto-see .heading-table,
.quote,
.element-box-bg {
  background-color: rgba(from var(--color-primary) r g b/0.075);
}

.contents-article .photo-gallery .left .thumb-list .active:after {
  border: 2px solid rgba(from var(--color-primary) r g b/1);
}

.contents-article .photo-gallery .right .btn-move a {
  background: rgba(from var(--color-primary) r g b/1);
}

.floatbox.gallery .btn-move a {
  background-color: rgba(from var(--color-primary) r g b/1);
}

.block-large-category .heading-lv2::before {
  background: url(../imgs/icon_detail.png) no-repeat left center;
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link.large-list ul li a::before,
.link-other-category .link-other::before {
  background: url(../imgs/icon_link.png) no-repeat left center;
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link.pick-up {
  border-left: 8px solid rgba(from var(--color-primary) r g b/1);
}

.small-category > span,
.element-large-category h3 {
  border-left: 6px solid rgba(from var(--color-primary) r g b/1);
}

.element-auto-link.pick-up a::before {
  background: url(../imgs/icon_link_pick.png) no-repeat left center;
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link .link-category {
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link a,
.element-auto-link.link-menu li a::before,
.element-auto-link.pick-up a,
.element-auto-link.pick-up p span,
.element-auto-link .link-category a::after,
.element-auto-search-housing h4,
.element-auto-search-housing a::before,
.small-category span,
.element-auto-link.small-list ul li a::before,
.element-auto-link.link-other-category h3,
.element-large-category h3,
.element-large-category .large-title,
.element-large-category .large-title::before,
.element-large-category .large-link::before,
.element-text-small-article .element-article-title,
.article-back span::before,
.article-next span::after {
  color: rgba(from var(--color-primary) r g b/1);
}

.block-small-category .heading-lv2::before {
  background: url(../imgs/icon_category.png) no-repeat left center;
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link.link-other-category h3::before {
  background: url(../imgs/icon_check.png) no-repeat center center;
  background-color: rgba(from var(--color-primary) r g b/1);
}

.element-text-small-article .link-category {
  background: rgba(from var(--color-primary) r g b/1);
}

.element-auto-link.link-other-category h3 {
  border-bottom: 2px dotted rgba(from var(--color-primary) r g b/0.25);
}

.link-howto-detail a:before {
  color: rgba(from var(--color-primary) r g b/1);
}

.howtoinfo-detail {
  background: rgba(from var(--color-primary) r g b/1);
}

.floating-buttons .btn {
  background-color: var(--color-primary);
  border: 2px solid var(--color-primary);
}