/*
#40768c
#a9b1b5
#4c4948 グレー
#221714 黒
*/
.mainimgarea {position:relative;}
.mainimgarea .bgcover {position:absolute;top:0px;left:0px;width:100%;height:100%;
	background:#000 url(../img/showroom/showroom_main.jpg) no-repeat center center;transform:scale(2.3);}
.mainimgarea.on .bgcover {transform:scale(1.0);transition:7s;}
.mainimgarea .cover {position:absolute;top:0px;left:0px;width:100%;height:100%;background:rgba(0,0,0,0.6);opacity:0;}
.mainimgarea:hover .cover {opacity:1;transition:3s;}
.mainimgarea .mainimg {position:relative;z-index:100;}

.showroomwrap {background:#fff;}
.copyarea .imagebox {text-align:center;}
.copyarea .imagebox img {width:100px;}
.copyarea .imagebox p {font-size:14px;color:#333;}

a.telbtn {background-image:url(../img/cmn/telicon.svg);}
a.mailbtn {background-image:url(../img/cmn/mailicon.svg);}

.telbox {text-align:center;}
.telbox h2 {font-size:1.4rem;margin-bottom:5px;}
.telbox p {margin-bottom:15px;}
.telbox .tel {width:300px;max-width:100%;}

.contents01 {}
section .contentarea.contents01 {background:#333;padding: 0px;}
.contents01 .collist {margin-top:10px;background:#eee;}
.contents01 .data {padding:5vh 5vw;}
.contents01 .data p.f120 {margin-bottom:10px;}
.contents01 .data h2 {font-size:1.0rem;color:#999;}
.contents01 .data h3 {font-size:2.0rem;margin-bottom:20px;}
.contents01 .data p {line-height:1.5em;}
.contents01 .data strong {display:inline-block;margin-top:7px;}
.contents01 .image {background-repeat:no-repeat;background-position:center center;background-size:cover;}
.contents01 .image.hattyoubori {background-image:url(../img/showroom/img_hatchobori.jpg);}
.contents01 .image.toranomon {background-image:url(../img/showroom/img_toranomon.jpg);}



.maparea {}
.maparea {padding:10px;}
.maparea .map {filter:grayscale(100%);width:100%;height:100%;}

.contents02 {}
.contents02 h2 {text-align:center;font-size:1.4rem;margin-bottom:70px;}
.contents02 .data {padding-right:30px;}
.contents02 .data h3 {font-size:2.0rem;margin-bottom:20px;}

.contents02 .inner img {width:100%;}
.contents02 .imagebox {position:relative;}
.contents02 .imagebox {}
.contents02 .imagebox .cover {position:absolute;top:0px;left:0px;height:100%;width:100%;background:rgba(0,0,0,0.7);opacity:0;}
.contents02 .imagebox:hover .cover {opacity:1;transition:0.4s;}
.contents02 .imagebox a {display:inline-block;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);width:80%;}
.contents02 .imagebox:hover a {}
.contents02 .inner .imagelist {}
.contents02 .inner .imagelist .inner {width:25%;float:left;}
.contents02 .inner .imagelist .inner p {font-size:0.8rem;text-align:center;}



/*PC*/
@media (min-width: 897px){
	.copyarea .textbox {width:calc(100% - 140px);float:left;}
	.copyarea .imagebox {width:140px;float:left;}
	.contents01 .data {width:40%;}
	.contents01 .maparea {width:40%;}
	.contents01 .image {width:20%;}
}
/*SP*/
@media (max-width: 896px){
	.mainimg {height:130px;}
	.copyarea .imagebox {padding:30px 0px;}
	.copyarea a.telbtn {margin-top:30px;}
	.copyarea a.btn2, span.btn2 {width:80%;margin-left:10%;}
	.copyarea .imagebox img {width:80px;}

	.contents01 .data h3 {font-size:1.6rem;}
	.contents01 .data {padding-bottom:3vh;}
	.telbox .popup {width:100%;padding:50px 30px;}
	.contents01 .image {height:150px;width:100%;}

	.contents02 h2 {margin-bottom:20px;}
	.contents02 .data {padding-bottom:50px;}
	.contents02 .data h3 {font-size:1.6rem;}
	.contents02 .data a.btn2 {margin-top:30px;width:80%;margin-left:10%;}
	.contents02 .showroomlink {text-align:center;padding-top:30px;}
}


