@charset "utf-8";

:root {
	--main-theme-color:    #2e5293;
	--sub-theme-color:     #686868;
	--sub-theme-color-txt: #80745c;
	--main-theme-color-bg: #d9d9d9;
}
main section.key-visual {
	background: url(../images/main_sp.jpg) center bottom / cover no-repeat #ffffff;
}
section.key-visual .point {
	background: rgb(3,255,255,0.7);
}
section.pickup .products .item > a.yaris {
	background-image: url(../images/pickup_yaris.jpg);
}
section.pickup .products .item > a.note {
	background-image: url(../images/pickup_note.jpg);
}
section.pickup .products .item > a.mazda2 {
	background-image: url(../images/pickup_mazda2.jpg);
}
section.pickup .products .item > a.sienta {
	background-image: url(../images/pickup_sienta.jpg);
}
section.pickup .products .item > a.fit {
	background-image: url(../images/pickup_fit.jpg);
}
section.pickup .products .item > a.roomy {
	background-image: url(../images/pickup_roomy.jpg);
}
section.pickup .products .item .product-detail {
	background: var(--main-theme-color-bg);
}
section.pickup .products .item .product-detail .recommend figure .brand {
	border-bottom: 2px solid var(--main-theme-color);
}
section.pickup .products .item .product-detail .recommend > a .price {
	background: var(--main-theme-color);
	border: 1px solid var(--main-theme-color);
}
section.pickup .products .item .product-detail .recommend > a:hover .price {
	color: var(--main-theme-color);
}
section.pickup .products .item .product-detail .recommend > a:hover .price:after {
    border-right: 3px solid var(--main-theme-color);
    border-bottom: 3px solid var(--main-theme-color);
}
section.pickup .products .item .product-detail .recommend > a:hover .price:before {
    background: var(--main-theme-color);
}
section.pickup .products .item .product-detail .recommend .plus-mark {
	background: var(--main-theme-color);
}
section.stores .detail .store .store-name {
	color: var(--sub-theme-color-txt);
}
section.stores .detail .store .button-link a {
	background-color: var(--sub-theme-color);
	border: 1px solid var(--sub-theme-color);
}
section.stores .detail .store .button-link a:hover {
	color: var(--sub-theme-color);
}
section.vehicle-types > div.swiper-container {
	background: var(--main-theme-color-bg);
}

/*-- タブレット／PC用スタイリング --*/
@media screen and (min-width:768px) {
	main section.key-visual {
		background: url(../images/main_pc.jpg) center bottom / cover no-repeat #ffffff;
	}
	section.pickup .products .item .product-detail .recommend > a:hover .price:after {
	    border-right: 7px solid var(--main-theme-color);
	    border-bottom: 7px solid var(--main-theme-color);
	}
}