@charset "UTF-8";

/*========== メイン画像イメージ ===============*/

.main-image {
width: 100%;
height: 653px;
background-image: url(../../img/othergoods/main-image2.png);
background-position: center top;
background-repeat: no-repeat;
background-color: #EAEBEA;
opacity: 1;
}
.main-image .wrapper {
background-image: url(../../img/othergoods/main-image.png);
background-position: center top;
background-repeat: no-repeat;
position: relative;
}
.main-image .main-logo {
width: 393px;
left: auto;
right: auto;
top: 220px;
z-index: 20;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%) 
}
.main-image .main-logo h2 {
width: 100%;
clear: both;
}

@media screen and (max-width: 640px) {
.main-image {
width: 100%;
height: auto;
background-image: none;
padding-bottom: 75px;
margin-top: 160px;
}
.main-image .wrapper {
background-image: none;
position: static;
}
.main-image .main-logo {
display:none;
}
.main-image .main-logo h2 {
display:none;
}
}

/*========== 実績 ===============*/
.contents {
width: 100%;
padding-bottom: 300px;
background-color: #EAEBEA;
padding-top: 190px;
}
.contents .wrapper {
width: 1010px;
margin-left: auto;
margin-right: auto;
}
.contents .title {
width: 337px;
margin-left: auto;
margin-right: auto;
margin-bottom: 100px;
}
.contents .job {
width: 100%;
}
.job ul li {
width: 428px;
height: 50px;
padding-left: 30px;
padding-right: 30px;
margin-right: 30px;
margin-bottom: 70px;
background-color: #FFFFFF;
border: 1px solid #3697E1;
display: block;
font-size: 2.2rem;
line-height: 50px;
font-weight: 500;
float: left;
}
.job ul li:nth-child(even){
margin-right: 0px;
}
.job ul li:last-child {
background-color: rgb( 54, 151, 225);
color: #FFFFFF;
}
.shop-info {
width: 100%;
padding-top: 125px;
padding-bottom: 130px;
background-color: #3697E1;
margin-bottom: 260px;
}
.shop-info .wrapper {
width: 1100px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.shop-info .title {
width: 510px;
height: 70px;
margin-left: auto;
margin-right: auto;
text-align: center;
background-color: #464646;
position: absolute;
top: -195px;
left: 295px;
}
.shop-info .title h2 {
font-size: 2.9rem;
color: #FBFBFB;
line-height: 70px;
word-spacing: 1px;
font-weight: 500;
}
.shop-info .map-box {
width: 760px;
border: 1px solid #FFFFFF;
margin-left: auto;
margin-right: auto;
padding-top: 35px;
padding-bottom: 35px;
padding-left: 45px;
padding-right: 45px;
position: relative;
}
.shop-info .map-box p {
line-height: 1.8;
color: #FFFFFF;
}
.shop-info .map-box .map-marc {
position: absolute;
right: 40px;
top: 50px;
width: 122px;
height: 47px;
}
.shop-info .photo {
width: 1010px;
margin-left: auto;
margin-right: auto;
margin-top: 125px;
}
.shop-info .photo img {
width: 491px;
height: auto;
float: left;
margin-right: 28px;
margin-bottom: 28px;
}
.shop-info .photo img:nth-child(even) {
margin-right: 0px;
margin-bottom: 28px;
}
.footer {
margin-top: 0%;
}



@media screen and (max-width: 640px) {
.contents {
width: 86%;
padding-left: 7%;
padding-right: 7%;
padding-bottom: 220px;
padding-top: 0px;
}
.contents .wrapper {
width: 100%;
padding-left: 0%;
padding-right: 0%;
}
.contents .title {
width: 65%;
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
}
.job ul li {
width: 94%;
height: 60px;
padding-left: 3%;
padding-right: 3%;
margin-right: 0px;
margin-bottom: 15px;
line-height: 60px;
font-size: 2.6rem;
}
.shop-info {
padding-top: 150px;
padding-bottom: 100px;
margin-bottom: 220px;
}
.shop-info .wrapper {
width: 86%;
padding-left: 7%;
padding-right: 7%;
}
.shop-info .title {
width: 85%;
height: 68px;
margin-left: auto;
margin-right: auto;
text-align: center;
background-color: #464646;
position: static;
top: auto;
left: auto;
margin-top: -218px;
margin-bottom: 80px;
}
.shop-info .map-box {
width: 86%;
border: 1px solid #FFFFFF;
margin-left: auto;
margin-right: auto;
padding-top: 35px;
padding-bottom: 65px;
padding-left: 7%;
padding-right: 7%;
position: relative;
}
.shop-info .map-box .map-marc {
position: absolute;
right: -1px;
top: 257px;
width: 122px;
height: 47px;
}
.shop-info .photo {
width: 86%;
margin-left: auto;
margin-right: auto;
margin-top: 90px;
}
.shop-info .photo img {
width: 100%;
height: auto;
float: left;
margin-right: 0px;
margin-bottom: 20px;
}
.shop-info .photo img:nth-child(even) {
margin-right: 0px;
margin-bottom: 20px;
}
.footer {
margin-top: 0%;
}
}

@media print{
.header-logo a .alignleft.sp, #header .mod_inner .panel.sp, #header .mod_inner .menu_btn.sp, #header .mod_inner .panel.sp,  .main-image .sp {
display: none;
}
}