﻿@charset "utf-8";

/* style */
/* -------------------------------------------------------- */
.location-sec1 {padding:300px 0 540px 0; background:url(../img/hesaka/img_02.jpg) no-repeat center bottom; background-size:100% auto; position:relative;}
.location-sec1::before {content:''; width:100%; height:100%; background:url(../img/hesaka/img_01.png) no-repeat center top; background-size:100% auto; display:block; position:absolute; top:0; left:0;}
.location-sec1 .sec {max-width:1210px; padding:0 15px; position:relative; z-index:5;}
.location-sec1 .txt1 {text-align:left;}
.location-sec1 .txt1 dt {font-size:4.5rem; line-height:2.1; letter-spacing:0.1em;}
.location-sec1 .txt1 dt span {padding:0 4.0em 0 0; display:inline-block; position:relative;}
.location-sec1 .txt1 dt span::before {content:''; width:3.5em; height:1px; background-color:#000; display:block; position:absolute; top:50%; right:0;}
.location-sec1 .txt1 dd {font-size:1.8rem; font-weight:400; line-height:2.4; margin:3.0em 0 0 0;}
.location-sec1 .txt2 {margin:290px 0 0 0;}

.location-sec2 {padding:0 0 100px 0; background-color:#f7f7f7;}
.location-sec2 .sec {max-width:1230px; padding:0 15px;}
.location-sec2 .box1 {padding:100px 0 500px 0; position:relative;}
.location-sec2 .box1 .img {width:767px; position:absolute; bottom:0; right:0;}
.location-sec2 .box2 {margin:0 -50px; padding:80px 50px; box-sizing:border-box; position:relative;}
.location-sec2 .box2 .img {max-width:574px; width:53.2%; position:absolute; top:-50px; right:-70px;}
.location-sec2 .box2 .img::before {content:'image'; font-size:1.2rem; color:#fff; position:absolute; bottom:0.4em; right:0.4em;}
.location-sec2 .box2 .ctx {margin:0 560px 0 0;}
.location-sec2 .box2.type1 {margin-top:190px; background:-webkit-linear-gradient(left, #e2eddc, #c1d9c5); background:linear-gradient(to right, #e2eddc, #c1d9c5);}

.location-sec2 .box2.type2 {margin-top:200px; background:-webkit-linear-gradient(left, #e8f1ff, #b1d4cc); background:linear-gradient(to right, #e8f1ff, #b1d4cc);}
.location-sec2 .box3 {padding:60px 50px; background-color:#fff; position:relative;}
.location-sec2 .box3 .area + .txt4 {margin-top:100px;}
.location-sec2 .box3.type1 {margin-top:60px; padding-top:100px;}
.location-sec2 .box3.type1 .area {width:266px; position:absolute; top:20px; right:50px;}
.location-sec2 .box3.type2 {margin-top:180px; padding-bottom:0;}
.location-sec2 .box3.type2 .area {width:285px; position:absolute; top:0; left:50px;}
.location-sec2 .clm1 {margin:30px 0 0 0; display:flex; flex-wrap:wrap; justify-content:space-between;}
.location-sec2 .clm1 > div {width:33.33%; padding:20px 12px 0 12px; box-sizing:border-box;}
.location-sec2 .clm1 > div.cell1 {width:49%;}
.location-sec2 .clm1 > div.cell2 {width:49%;}
.location-sec2 .clm2 {margin:50px 0 0 0; display:flex; justify-content:space-between;}
.location-sec2 .clm2 .ctx {width:53%; box-sizing:border-box;}
.location-sec2 .clm2 .img {width:47%;}
.location-sec2 .clm2.type1 .ctx {order:1;}
.location-sec2 .clm2.type1 .img {order:2;}
.location-sec2 .clm2.type1 .txt6 dt {color:#008180; padding-right:12%;}
.location-sec2 .clm2.type1 .txt6 dt + dt {border-top:dotted 1px #008180;}
.location-sec2 .clm2.type1 .txt6 dd {padding-right:12%;}
.location-sec2 .clm2.type2 .ctx {order:2;}
.location-sec2 .clm2.type2 .img {order:1;}
.location-sec2 .clm2.type2 .txt6 dt {color:#3d6992; padding-left:12%;}
.location-sec2 .clm2.type2 .txt6 dt + dt {border-top:dotted 1px #3d6992;}
.location-sec2 .clm2.type2 .txt6 dd {padding-left:12%;}
.location-sec2 .clm3 {margin:80px -50px 0 -50px;}
.location-sec2 .clm4 {margin:25px -3px 0 -3px; display:flex; flex-wrap:wrap; justify-content:center;}
.location-sec2 .clm4 > div {width:25%; padding:25px 3px 0 3px; box-sizing:border-box;}
.location-sec2 .clm4 > div.cell1 {width:58.3%;}
.location-sec2 .clm4 > div.cell2 {width:41.7%;}
.location-sec2 .txt1 {text-align:left;}
.location-sec2 .txt1 dt {font-size:4.5rem; font-weight:400; line-height:2.1;}
.location-sec2 .txt1 dd {font-size:1.6rem; font-weight:400; line-height:3.1; margin:2.0em 0 0 0;}
.location-sec2 .txt2 {text-align:left;}
.location-sec2 .txt2 dt {font-size:2.6rem; font-weight:400; line-height:2.0;}
.location-sec2 .txt2 dd {font-size:1.6rem; font-weight:400; line-height:2.0; margin:2.0em 0 0 0;}
.location-sec2 .txt3 {font-size:4.0rem; font-weight:700; font-family:'Roboto', sans-serif; line-height:1.2; text-align:center;}
.location-sec2 .txt4 {font-size:2.1rem; font-weight:700; font-family:'Roboto', sans-serif; text-align:center; margin:60px 0 0 0;}
.location-sec2 .txt5 {font-size:1.4rem; text-align:right; margin:0.5em 0 0 0;}
.location-sec2 .txt6 {text-align:left;}
.location-sec2 .txt6 dt {font-size:2.6rem; font-weight:400; line-height:2.0;}
.location-sec2 .txt6 dt span {font-size:72%;}
.location-sec2 .txt6 dt + dt {margin:0.3em 0 0 0; padding:1.0em 0 0 0;}
.location-sec2 .txt6 dd {font-size:1.6rem; font-weight:400; line-height:2.0; margin:2.0em 0 0 0;}
.location-sec2 .txt7a {margin:40px 0 0 0;}
.location-sec2 .txt7b {margin:15px 0 0 0;}
.location-sec2 .txt7c {margin:60px 0 0 0;}
.location-sec2 .txt7d {margin:70px 0 0 0;}
.location-sec2 .txt8 {font-size:1.2rem; text-align:left; margin:0.5em 0 0 0;}

.location-sec3 {padding:150px 0 130px 0;}
.location-sec3 .map {max-width:800px; margin:0 auto;}
.location-sec3 .btn {text-align:center; display:none;}
.location-sec3 .btn a {margin:50px auto 0 auto;}

.location-sec4 {padding:150px 0 130px 0;}
.location-sec4 .box1 {margin:70px 0 0 0;}
.location-sec4 .box2 {padding:95px 0 370px 0; background:url(../img/hesaka/img_09.jpg) no-repeat center bottom; background-size:100% auto;}
.location-sec4 .box2 .sec {max-width:950px; padding:0 15px;}
.location-sec4 .box2 .clm {display:flex; justify-content:space-between;}
.location-sec4 .box2 .clm > div {width:46%;}
.location-sec4 .txt2 {width:100%; border-collapse:collapse; border-spacing:0; empty-cells:show;}
.location-sec4 .txt2 th,
.location-sec4 .txt2 td {font-size:1.4rem; line-height:2.0; text-align:left;}
.location-sec4 .txt2 thead th {padding:0 0 1.0em 0;}
.location-sec4 .txt2 thead th span {font-size:1.6rem; letter-spacing:0.2em; padding:0.5em 1.0em; border:solid 1px #000; display:block;}
.location-sec4 .txt2 tbody + thead th {padding-top:50px;}
.location-sec4 .txt2 tbody td {width:1%; white-space:nowrap; padding-left:0.6em;}
.location-sec4 .img1 {max-width:1200px; margin:0 auto;}
.location-sec4 .img2 {max-width:590px; margin:110px auto 0 auto;}

@media screen and (max-width:1600px){
	.location-sec1 {background-size:1350px auto;}
	.location-sec1::before {background-size:1350px auto;}
	.location-sec4 .box2 {background-size:1350px auto;}
}
@media screen and (max-width:1490px){
	.location-sec2 .box1 {padding-bottom:33.5vw; background-size:51.4vw auto;}
	.location-sec2 .box1 .img {width:51.4vw;}
}
@media screen and (max-width:1194px){
    .location-sec1 {padding:60.0vw 0 77.0vw 0; background-size:180% auto;}
    .location-sec1::before {background-image:url(../img/hesaka/img_01_sp.png); background-size:100% auto;}
    .location-sec1 .sec {max-width:100%; padding:0 6.0vw;}
    .location-sec1 .txt1 {text-align:left;}
    .location-sec1 .txt1 dt {font-size:3.1rem; line-height:1.7; margin:0 -6.0vw 0 0;}
    .location-sec1 .txt1 dd {font-size:1.5rem; margin:2.0em 0 0 0;}
    .location-sec1 .txt2 {margin:21.0vw 5.0vw 0 -3.0vw;}

    .location-sec2 .sec {max-width:100%; padding:0 6.0vw;}
	.location-sec2 .box1 {padding:100px 0;}
	.location-sec2 .box1 .img {width:auto; margin:30px 0 0 0; position:static;}
    .location-sec2 .box2 .ctx {margin:13.0vw 0 0 0;}
	.location-sec2 .box2 {width:auto; margin:0 -50px; padding:0 30px 50px 30px;}
	.location-sec2 .box2 .img {max-width:100%; width:100%; margin:0 0 -30px 0; position:relative; top:-30px; bottom:0; right:0;}
	.location-sec2 .box2 .img::before {font-size:1.4rem;}
	.location-sec2 .box2 .ctx {margin:50px 0 0 0;}
	.location-sec2 .box2.type1 {margin-top:80px;}
	.location-sec2 .box2.type1 .img {transform:rotate(0deg);}
	.location-sec2 .box2.type2 {margin-top:80px;}
	.location-sec2 .box3.type1 {margin-top:20px; padding-top:50px;}
	.location-sec2 .box3.type1 .area {width:325px; margin:30px auto 0 auto; position:static;}
	.location-sec2 .box3.type2 {margin-top:30px; padding-bottom:0;}
	.location-sec2 .box3.type2 .area {width:325px; margin:30px auto 0 auto; position:static;}
    .location-sec2 .txt2 dt {font-size:2.0rem;}
    .location-sec2 .txt2 dd {font-size:1.5rem;}

    .location-sec3 {padding:17.0vw 0 26.0vw 0;}
    .location-sec3 .sec {padding:0;}
    .location-sec3 .map {max-width:100%; margin:0;}
    .location-sec3 .btn {display:block;}

    .location-sec4 {padding:17.0vw 0 26.0vw 0;}
    .location-sec4 .box1 {margin:25px 0 0 0; padding:60px 0;}
    .location-sec4 .box1 .sec {padding:0;}
    .location-sec4 .box2 {padding:80px 0 64.0vw 0; background-size:180% auto;}
    .location-sec4 .box2 .sec {padding:0 6.0vw;}
    .location-sec4 .box2 .clm {display:block;}
    .location-sec4 .box2 .clm > div {width:auto; margin:30px 0 0 0;}
    .location-sec4 .box2 .clm > div:first-of-type {margin-top:0;}
    .location-sec4 .txt2 th,
    .location-sec4 .txt2 td {font-size:1.1rem;}
    .location-sec4 .txt2 thead th span {font-size:1.6rem;}
    .location-sec4 .txt2 tbody + thead th {padding-top:30px;}
    .location-sec4 .img1 {max-width:100%; margin:0 auto;}
    .location-sec4 .img2 {max-width:565px; margin:45px auto 0 auto;}
}


@media screen and (max-width:767px){
	.location-sec1 {padding:60.0vw 0 77.0vw 0; background-size:180% auto;}
	.location-sec1::before {background-image:url(../img/hesaka/img_01_sp.png); background-size:100% auto;}
	.location-sec1 .sec {max-width:100%; padding:0 6.0vw;}
	.location-sec1 .txt1 {text-align:left;}
	.location-sec1 .txt1 dt {font-size:2.7rem; line-height:1.7; margin:0 -6.0vw 0 0;}
	.location-sec1 .txt1 dd {font-size:1.1rem; margin:2.0em 0 0 0;}
	.location-sec1 .txt2 {margin:21.0vw 5.0vw 0 -3.0vw;}

	.location-sec2 {padding:0 0 50px 0;}
	.location-sec2 .sec {max-width:100%; padding:0 6.0vw;}
	.location-sec2 .box1 {padding:0 0 20px 0;}
	.location-sec2 .box1 .img {width:auto; margin:60px -6.0vw 0 -6.0vw; position:static;}
	.location-sec2 .box2 {width:auto; margin:0 calc(-6.0vw + -25px); padding:0 6.0vw 50px 6.0vw;}
	.location-sec2 .box2 .img {max-width:100%; width:100%; margin:0 0 -10.0vw 0; position:relative; top:-10.0vw; bottom:0; right:0;}
	.location-sec2 .box2 .img::before {font-size:1.0rem;}
	.location-sec2 .box2 .ctx {margin:13.0vw 0 0 0;}
	.location-sec2 .box2.type1 {margin-top:80px;}
	.location-sec2 .box2.type1 .img {transform:rotate(0deg);}
	.location-sec2 .box2.type2 {margin-top:80px;}
	.location-sec2 .box3 {padding:40px 25px 50px 25px;}
	.location-sec2 .box3 .area + .txt4 {margin-top:30px;}
	.location-sec2 .box3.type1 {margin-top:20px; padding-top:50px;}
	.location-sec2 .box3.type1 .area {width:auto; margin:15px -25px 0 -25px; position:static;}
	.location-sec2 .box3.type2 {margin-top:30px; padding-bottom:0;}
	.location-sec2 .box3.type2 .area {width:auto; margin:15px -25px 0 -25px; position:static;}
	.location-sec2 .clm1 {margin:20px 0 0 0; justify-content:center;} 
	.location-sec2 .clm1 > div {width:50%; padding:20px 4px 0 4px;}
	.location-sec2 .clm1 > div.cell1 {width:100%;}
	.location-sec2 .clm1 > div.cell2 {width:100%;}
	.location-sec2 .clm2 {margin:30px 0 0 0; display:block;}
	.location-sec2 .clm2 .ctx {width:auto;}
	.location-sec2 .clm2 .img {width:auto; margin:20px 0 0 0;}
	.location-sec2 .clm2.type1 .txt6 dt {padding-right:0;}
	.location-sec2 .clm2.type1 .txt6 dd {padding-right:0;}
	.location-sec2 .clm2.type2 .txt6 dt {padding-left:0;}
	.location-sec2 .clm2.type2 .txt6 dd {padding-left:0;}
	.location-sec2 .clm3 {margin:40px -25px 0 -25px;}
	.location-sec2 .clm4 {margin:10px -2px 0 -2px;}
	.location-sec2 .clm4 > div {width:50%; padding:15px 2px 0 2px;}
	.location-sec2 .clm4 > div.cell1 {width:100%;}
	.location-sec2 .clm4 > div.cell2 {width:100%;}
	.location-sec2 .txt1 dt {font-size:2.2rem;}
	.location-sec2 .txt1 dd {font-size:1.1rem; line-height:2.4;}
	.location-sec2 .txt2 dt {font-size:1.6rem;}
	.location-sec2 .txt2 dd {font-size:1.1rem;}
	.location-sec2 .txt3 {font-size:2.0rem;}
	.location-sec2 .txt4 {font-size:1.1rem; margin:40px 0 0 0;}
	.location-sec2 .txt5 {font-size:1.0rem;}
	.location-sec2 .txt6 dt {font-size:1.6rem;}
	.location-sec2 .txt6 dd {font-size:1.0rem;}
	.location-sec2 .txt7a {margin:40px -25px 0 -25px;}
	.location-sec2 .txt7b {margin:40px -25px 0 -25px;}
	.location-sec2 .txt7c {margin:80px -25px 0 -25px;}
	.location-sec2 .txt7d {margin:80px -25px 0 -25px;}
	.location-sec2 .txt8 {font-size:1.0rem;}

	.location-sec3 {padding:17.0vw 0 26.0vw 0;}
	.location-sec3 .sec {padding:0;}
	.location-sec3 .map {max-width:100%; margin:0;}
	.location-sec3 .btn {display:block;}

    .location-sec4 {padding:17.0vw 0 26.0vw 0;}
	.location-sec4 .box1 {margin:25px 0 0 0; padding:60px 0;}
	.location-sec4 .box1 .sec {padding:0;}
	.location-sec4 .box2 {padding:80px 0 64.0vw 0; background-size:180% auto;}
	.location-sec4 .box2 .sec {padding:0 6.0vw;}
	.location-sec4 .box2 .clm {display:block;}
	.location-sec4 .box2 .clm > div {width:auto; margin:30px 0 0 0;}
	.location-sec4 .box2 .clm > div:first-of-type {margin-top:0;}
	.location-sec4 .txt2 th,
	.location-sec4 .txt2 td {font-size:1.1rem;}
	.location-sec4 .txt2 thead th span {font-size:1.3rem;}
	.location-sec4 .txt2 tbody + thead th {padding-top:30px;}
	.location-sec4 .img1 {max-width:100%; margin:0 auto;}
	.location-sec4 .img2 {max-width:265px; margin:45px auto 0 auto;}
}
