@charset "UTF-8";
/* CSS Document */
/*============================================================================================
↓ファーストビュー
============================================================================================*/
#top-first {
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
	display: table;
}
#top-first li {
	vertical-align: top;
	display: table-cell;
}
#top-first li:first-child { /*左側のBOX*/
	width: 70%;
	height: auto;
}
#top-first li:last-child { /*左側のBOX*/
	width: 30%;
	max-height: 300px;
}
#top-first li:first-child .slide-contents {
	width: 98%;
	position: relative;
}
#top-first li:first-child .slide-contents img {
	width: 100%;
}
#slider-next a {
	position: absolute;
	width: 32px;
	height: 31px;
	top: 50%;
	right: 0;
	margin-top: -25px;
	display: block;
	z-index: 999;
	text-indent: -9999px;
	background-image: url(../../top-img/slide-next.png);
	background-size: cover;
	background-repeat: no-repeat;
}
#slider-prev a {
	position: absolute;
	width: 32px;
	height: 31px;
	top: 50%;
	left: 0;
	margin-top: -25px;
	display: block;
	z-index: 999;
	text-indent: -9999px;
	background-image: url(../../top-img/slide-prev.png);
	background-size: cover;
	background-repeat: no-repeat;
}

@media screen and (max-width: 640px) {
#top-first {
	display: block;
}
#top-first li {
	display: block;
}
#top-first li:first-child { /*左側のBOX*/
	display: none;
	height: auto;
}
	
#top-first li:first-child .slide-contents {
	width: 100%;
}
#top-first li:first-child .slide-contents img {
	width: 100%;
}
#top-first li:last-child { /*左側のBOX*/
	display: none;
}
#slider-next a {
	display: none;
}
#slider-prev a {
	display: none;
}
}
#top-first li:last-child #box-top { /*右・上BOX*/
	width: 100%;
	height: 50%;
	z-index: -99999999999999;
	position: relative;
}
.video {
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	z-index: -99999999999;
}
.video iframe { /*youtube埋め込み*/
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -99999999999;
}
.video h2 {
	position: absolute;
	right: 0;
	bottom: 0;
	padding-bottom: 10px;
	display: block;
	font-size: 2.8em;
	color: #E83E0B;
	letter-spacing: 0.08em;
	line-height: 1em;
	text-align: right;
	z-index: 9;
}
#top-first li:last-child #box-bottom { /*右・下BOX*/
	height: 50%;
}
a.btn-recruit { /*リクルートへのボタン*/
	display: block;
	border: solid 4px #E83E0B;
	background-image: url(../../top-img/next-rec.png);
	background-repeat: no-repeat;
	background-color: #FFFFFF;
	background-size: contain;
	background-position: center center;
	line-height: 1.4em;
	font-weight: bold;
	box-sizing: border-box;
	position: relative;
	color: #E83E0B;
	font-size: 1.6em;
	padding-top: 38.5%;
}
.btn-recruit:hover {
	background-color: #fad8ce;
}
a.btn-recruit span img {
	width: auto;
	height: 100%;
}
#movie-sp {
	display: none;
}

@media screen and (max-width: 640px) {
#movie-sp {
	width: 100%;
	display: block;
}
#movie-sp img {
	width: 100%;
	display: block;
	box-sizing: border-box;
}
#movie-sp a:hover {
	background-color: #E83E0B;
	color: #fff;
}
}
/*============================================================================================
↓チラシお知らせ店舗
============================================================================================*/
#second {
	background-color: #f5f4f4;
	margin-top: 30px;
	padding: 30px 0;
	position: relative;
	border-bottom: 5px solid #E83E0B;
}
#second #inner {
	max-width: 1080px;
	margin: 0 auto;
}

@media screen and (max-width: 768px) {
#second {
	max-width: 960px;
	margin-top: 0px;
	background-color: #fff;
	padding: 0 0;
	margin-top: 30px;
}
#second #inner {
	padding: 0px 0px;
	width: 100%;
}
}

@media screen and (max-width: 640px) {
#second {
	background-color: #fff;
}
#second #inner {
	padding: 0 0px;
}
}
/*チラシお知らせ */	
#second .info-etc {
	background-color: #fff;
	width: 47.25%;
	padding: 16px 8px 22px 8px;
	float: left;
}
#news h3, #info h3 {
	margin-bottom: 10px;
	display: inline-block;
}
#second .info-etc p {
	font-size: 1em;
	font-weight: 300;
	text-align: left;
}
#second .info-etc #news .day {
	margin-right: 10px;
}
#second .list {
	border-bottom: dotted 1px;
	padding-top: 10px;
	padding-bottom: 10px;
	vertical-align: middle;
}
#second .info-etc .list:first-child {
	border-top: 1px solid #362a2a;
}
#second .info-etc .no-b {
	border-top: none !important;
}
.check-title a {
	font-weight: 500 !important;
	color: #E83E0B !important;
	float: left;
}
.more {
	font-size: 0.8em;
	font-weight: 500;
	text-align: right;
	margin-top: 10px
}
.info-etc .more a {
	color: #E83E0B;
}
#second a:hover {
	color: #E83E0B;
	text-decoration: underline
}
#second #info .icon {
	float: left;
	width: 69px;
	margin-right: 5px;
}
#second #info .icon img {
	width: 69px;
	vertical-align: middle
}
#second .chirashi {
	padding: 6px 0px 0px 0px !important;
}
#second #news {
	margin-top: 10px;
}
#second #news .icon {
	font-size: 0.8em;
	font-weight: 300;
	float: left;
	background-color: #E83E0B;
	margin-right: 10px;
	width: 70px;
	padding: 2px 0;
	background-color: #fff;
	border: solid 1px #E83E0B;
}
#second #news .icon p {
	color: #E83E0B;
	text-align: center;
	margin-top: 4px;
}
#second #news .check a {
	color: #E83E0B;
	text-align: left;
}
#second #news .icon-check {
	font-size: 0.8em;
	font-weight: 300;
	background-color: #E83E0B;
	margin-right: 3px;
	width: 50px;
	float: left;
	padding: 2px 0 4px 0;
}
#second #news .icon-check p {
	margin-top: 4px;
	color: #fff;
	text-align: center;
}
#second #news .list {
	overflow: hidden;
	padding: 10px 0px;
}
#second #news .tpi {
	margin-top: 6px;
}

@media screen and (max-width: 768px) {
#second #news .icon-check, #second #news .icon {
	font-size: 1em !important;
}
#second .info-etc {
	width: 100%;
	float: none;
	padding: 0px 0px 0px 0px;
}
h3 {
	font-size: 1em;
	vertical-align: middle;
	letter-spacing: 0.08em;
	font-weight: 500;
}
#second .list-all {
	display: table;
	width: 100%;
}
#second #info {
	margin: 0 20px;
	padding-top: 20px;
}
#second .info-etc p {
	line-height: 1.2em;
}
#second #info .list1 {
	display: table-cell;
}
#second #news {
	margin: 0 20px;
	padding-bottom: 20px;
}
#second .info-etc .no-b {
	border-top: 1px solid #362a2a !important;
}
#second .chirashi {
	padding: 0px !important;
}
}

@media screen and (max-width: 640px) {
#news h3 img {
	width: 280.5px;
}
#second .info-etc .no-b {
	border-top: none !important;
}
#second .info-etc {
	float: none;
	display: block;
}
#second #info {
	display: block;
}
#second .info-etc p {
	font-size: 0.9em;
	text-align: left;
	vertical-align: middle;
	line-height: 1.2em;
}
#second .list-all {
	display: block;
}
#second #info .list1 {
	display: block;
}
#second #news {
	margin-top: 30px;
}
#second #news .icon {
	width: 50px;
}
}
/*店舗情報 */
#second #shop {
	width: 47.25%;
	float: right;
	background-color: #f5f4f4;
	padding-bottom: 30px;
}
#second #shop-sp {
	display: none;
}
#second #shop h3 {
	font-size: 1.1em;
	background-color: #E83E0B;
	color: #fff;
	vertical-align: middle;
	padding-top: 14px;
	padding-bottom: 8px;
	letter-spacing: 0.2em;
	font-weight: normal;
}
#second #shop h3 .en-title {
	font-size: 1.8em;
	vertical-align: middle;
}
#second #shop #data {
	position: relative;
	width: 48.45%;
	text-align: right;
	display: block;
	margin-bottom: 8px;
}

@media screen and (max-width: 768px) {
#second #shop {
	width: 100%;
	float: none;
}
}
/*各店舗写真 */	
#second #shop #kawakita {
	background-image: url(../../top-img/shop-kawakita.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #tazuru {
	background-image: url(../../top-img/shop-tazuruhama.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #kaga {
	background-image: url(../../top-img/shop-kaga.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #komatsu {
	background-image: url(../../top-img/shop-komatsu.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #nonoichi {
	background-image: url(../../top-img/shop-nonoichi.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #asahi {
	background-image: url(../../top-img/shop-asahi.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #kaikotsu {
	background-image: url(../../top-img/shop-kaikotsu.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}
#second #shop #kanazu {
	background-image: url(../../top-img/shop-kanazu.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 70px 0px;
}

@media screen and (max-width: 768px) {
#second #shop .shop-all {
	padding: 0 50px;
}
#second #shop #kawakita {
	background-size: cover;
}
#second #shop #tazuru {
	background-size: cover;
}
#second #shop #kaga {
	background-size: cover;
}
#second #shop #komatsu {
	background-size: cover;
}
#second #shop #nonoichi {
	background-size: cover;
}
#second #shop #asahi {
	background-size: cover;
}
#second #shop #kaikotsu {
	background-size: cover;
}
#second #shop #kanazu {
	background-size: cover;
}
}

@media screen and (max-width: 640px) {
#second #shop #data {
	display: none;
}
#second #shop .shop h3 {
	display: none;
}
#second #shop #shop-sp {
	display: block;
	width: 100%;
}
#second #shop #shop-sp h3 {
	width: 100%;
}
#second #shop #shop-sp table {
}
#second #shop .shop-all {
	padding: 0 20px;
}
/*アコーディオン*/
#second #shop #shop-sp dt h3 {
	color: #fff;
	background-color: #E83E0B;
	font-size: 1.2em;
	padding: 16px 0;
}
#second #shop #shop-sp dd {
	border: 1px solid #E83E0B;
	padding: 0px 40px;
	text-align: left
}
#second #shop #shop-sp dd {
	border: 1px solid #E83E0B;
	padding: 20px;
}
#second #shop #shop-sp img {
	margin-left: 5px;
	width: 39px;
}
#second #shop #shop-sp table {
	width: 100%;
}
#second #shop #shop-sp tr {
	border-bottom: 1px dashed #999999;
}
#second #shop #shop-sp tr:last-child {
	border-bottom: none;
}
#second #shop #shop-sp tr td {
	text-align: left;
	padding: 10px 0px;
}
#shop-sp .name {
	font-size: 1.2em;
	font-weight: 500;
}
#shop-sp .tel {
	font-size: 1.2em;
	font-weight: 500;
}
}
/*店舗情報文字 */	
#second #shop #data .data {
	position: absolute;
	text-align: right;
	right: 0;
	top: 0;
	background-image: url(../../top-img/bg-white.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding: 12px 20px 40px 30px;
	margin-top: 20px;
	display: block;
}
#second #shop #data img {
	height: 15px;
	width: 39.5px;
}
#second #shop #data .data {
	display: block;
}
#second #shop #data .data:hover {
	background-image: url(../../top-img/bg-white-over.png);
}
.name {
	font-size: 1.1em;
	font-weight: 500;
	margin-top: 2px;
	margin-bottom: 10px;
	color: #E83E0B;
	letter-spacing: 0.1em;
	line-height: 1em;
}
.tel {
	font-size: 1em;
	color: #E83E0B;
	font-weight: 500;
	line-height: 1em;
}
/*============================================================================================
↓ピックアップ
============================================================================================*/
#third {
	border-bottom: 5px solid #E83E0B;
}
#third .inner {
	max-width: 1080px;
	margin: 30px auto;
}
#third h3, #fourth h3 {
	max-width: 428px;
	margin: auto;
}
#third h3 img, #fourth h3 img {
	width: 100%;
}
#third .inner img {
	margin: 0 auto;
	width: 95%;
}
#third .inner .pick-up .pick {
	position: relative;
}
#third .inner .pick-up .pick .icon-new {
	position: absolute;
	right: 0;
	top: 0;
	width: 58px !important;
}
#third .inner .pick-up .pick a:hover {
	opacity: 0.8;
	filter: alpha(opacity=70);
	-ms-filter: “alpha( opacity=80 )”;
}
#third .inner .about {
	padding: 0 20px;
}
#third .inner h5 {
	margin-top: 10px;
	font-weight: 500;
	line-height: 1.4em;
}
#third .inner p {
	margin-top: 10px;
	font-size: 0.9em;
	line-height: 1.4em;
	text-align: left;
	font-weight: 300;
}

@media screen and (max-width: 768px) {
#third .inner {
	width: 80%;
}
#third .inner h5 {
}
#third .inner p {
	font-size: 1em;
}
}

@media screen and (max-width: 640px) {
#third .inner {
	width: 90%;
}
#third .inner img {
	width: 100%
}
.red h3 {
	padding: 0px 8px 20px 8px;
}
#third .inner p {
	text-align: center;
}
}
/*============================================================================================
↓事業内容
============================================================================================*/
#fourth .inner {
	max-width: 1080px;
	margin: 30px auto 0px;
}
#fourth #business {
	width: 100%;
	margin-top: 20px;
}
#fourth #business ul {
	width: 100%;
}
#fourth #business2 {
	margin: auto;
	max-width: 66.6%;
}
#fourth #business2 ul {
	width: 100%;
	margin: auto;
}
#fourth #business li {
	width: 33.3%;
	float: left;
	margin-bottom: 20px;
}
#fourth #business2 li {
	width: 50%;
	float: left;
}
#fourth li .business {
	border: 1px solid #362a2a;
	box-sizing: border-box;
}
#fourth #business li:first-child .business {
	margin-right: 2%;
	box-sizing: border-box;
}
#fourth #business li:nth-child(2) .business {
	margin: 0 1%;
	box-sizing: border-box;
}
#fourth #business li:last-child .business {
	margin-left: 2%;
	box-sizing: border-box;
}
#fourth #business2 li:first-child .business {
	margin-right: 2%;
	box-sizing: border-box;
}
#fourth #business2 li:last-child .business {
	margin-left: 2%;
	box-sizing: border-box;
}
#fourth .business {
	background-repeat: no-repeat;
}
#fourth #business .business .homecenter {
	background-image: url(../../top-img/business1.jpg);
	background-size: cover;
}
#fourth #business li:first-child .business h4 a {
	height: 100px;
}
#fourth #business li:first-child .business h4 a .home {
	padding: 35px 0px;
}
#fourth #business li:first-child .business h4 a img {
	float: left;
	padding-left: 10px;
}
#fourth #business .business .homecenter {
	background-image: url(../../top-img/business1.jpg);
	background-size: cover;
}
#fourth #business .business .solar {
	background-image: url(../../top-img/business2.jpg);
	background-size: cover;
}
#fourth #business .business .rinova {
	background-image: url(../../top-img/business3.jpg);
	background-size: cover;
}
#fourth #business2 .business .gas {
	background-image: url(../../top-img/business4.jpg);
	background-size: cover;
}
#fourth #business2 .business .internet {
	background-image: url(../../top-img/business6.jpg);
	background-size: cover;
}
#fourth .business a:hover {
	background-color: #E83E0B;
}
#fourth .business .icon {
	vertical-align: middle;
	margin-right: 10px;
}
#fourth .business h4 a {
	width: 100%;
	color: #fff;
	font-weight: 400;
	font-size: 1.2em;
	line-height: 1.2em;
	display: block;
}
#fourth .business h4 img {
	width: 50px;
	height: 100px;
}
#fourth p {
	font-size: 0.9em;
	font-weight: 300;
	line-height: 1.4em;
	text-align: left;
	padding: 8px 0px 0px 0px;
	width: 100%;
	letter-spacing: 0.1em;
}
#fourth .business-about {
	padding: 0 20px;
}
#fourth .business .more {
	display: block;
	margin-right: 0px;
	display: block;
	width: 100%;
	height: 30px;
}
#fourth .business .more a {
	display: block;
	width: 126px;
	height: 30px;
	color: #FFF;
	background-image: url(../../top-img/more-back.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center right;
	float: right;
}
#fourth .business .more a p {
	display: block;
	text-align: right;
	width: 80%;
}
#fourth .business .more a:hover {
	background-image: url(../../top-img/more-back_on.jpg);
	background-color: #FFF;
}
#fourth .sp-icon {
	display: none;
}

@media screen and (max-width: 640px) {
#fourth #business2 {
	margin: auto;
	max-width: 100%;
}
#fourth #business li {
	width: 100%;
	float: none;
	margin-bottom: 0px;
}
#fourth #business2 li {
	width: 100%;
	float: none;
}
#fourth li{
	margin-bottom: 10px !important;
}
#fourth #business li:first-child .business {
	margin-right: 0%;
}
#fourth #business li:nth-child(2) .business {
	margin: 0%;
}
#fourth #business li:last-child .business {
	margin-left: 0%;
}
#fourth #business2 li:first-child .business {
	margin-right: 0%;
}
#fourth #business2 li:last-child .business {
	margin-left: 0%;
}
}