@charset "utf-8";


/*main_Visual*/
.main_Visual {
  position: relative;
}
.main_Visual > div {
position: absolute;
top: 55%;
left: 50%;
transform: translate(-50%,-50%);
width: 94%;
}
.main_Visual .ttl,
.lead_area .ttl {
width: 60%;
max-width: 286px;
margin: 0 auto 60px;
}
.main_Visual .copy {
font-size: 20px;
line-height: 2.0;
letter-spacing: 0.15em;
}

.text-cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 53%;
    padding: 3% 0;
}

.text-cont h3 {
    position: relative;
    font-size: 20px;
    line-height: 2.0;
    letter-spacing: 0.15em;
    color: #a78d3f;
    text-align: center;
}

.text-cont h3 span {
    font-size: 200%;
    letter-spacing: 0.2em;
}

.text-cont span.line {
    font-size: unset;
    display: block;
    width: 24%;
    margin: 0 auto 2em;
}

.copy {
text-align: center;
font-size: 18px;
line-height: 2.4;
}

.copy.single_unit.pc {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
/* width: fit-content; */
width: 100%;
margin: 0 auto;
font-size: 18px;
letter-spacing: 0.1em;
text-align: left;
}
.cl-g{color: #6a5625;}
.cl-g-h{color: #cca75e;}
.cl-g-h2 {color: #c9bb98;}

.copy.single_unit .single_unit_txt {
    text-align: center;
}

.lead_area {
position: relative;
background: url(../img/lead_img.jpg)no-repeat center;
background-size: cover;
width: 100%;
height: 0;
padding-top: 44.285714285714286%;
}
.lead_area > div {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 94%;
}

.lead_area .ttl {
width: 60%;
max-width: 236px;
margin: 0 auto 60px;
}
.lead_area .copy {
text-align: center;
}
.deco {
position: absolute;
right: 10px;
bottom: 10px;
width: 135px;
}


.area_map {
position: relative;
margin: 0 auto 100px;
}
.area_map {
max-width: 94%;
max-width: 1200px;
margin: 80px auto 0;
}

.area_map [class^="area0"] {
position: absolute;
animation: flash 4s linear infinite;
transition: 0.3s;
}
.area_map [class^="area0"]:hover {
    filter: hue-rotate(-190deg);
}
/*
.area_map .area01:hover,
.area_map .area02:hover,
.area_map .area03:hover,
.area_map .area04:hover{
animation: unset;
}
*/
.area_map .area01 {
top: 64.68189233278956%;
left: 17.916666666666667%;
width: 32.5%;
}
.area_map .area02 {
top: 22.593800978792822%;
left: 9.083333333333334%;
width: 29.5%;
}
.area_map .area03 {
top: 5.709624796084829%;
left: 39.75%;
width: 30.833333333333333%;
}
.area_map .area04 {
top: 41.68026101141925%;
left: 37.333333333333333%;
width: 27%;
}

@keyframes flash {
	0% {
		opacity: 1;
	}
	48% {
		opacity: 0.4;
	}
	52% {
		opacity: 0.4;
	}
	100% {
		opacity: 1;
	}
}

.contents_box:not(:first-of-type) {
padding: 100px 0 0;
}
.contents_box .bg_area{
position: relative;
width: 100%;
}
/*
.contents_box.historic .bg_area{
background: url(../img/historic_img_bg.jpg)no-repeat top;
background-size: contain;
}
*/
.contents_box .bg_area .bg{
position: absolute;
top: 0;
left: 0;
background: url(../img/historic_img_bg.jpg)no-repeat top;
background-size: cover;
display: block;
width: 100%;
height: 0;
padding-top: 518px;
}
.contents_box.historic .bg_area .bg{
background: url(../img/historic_img_bg.jpg)no-repeat top;
background-size: cover;
}
.contents_box.park .bg_area .bg{
background: url(../img/park_img_bg.jpg)no-repeat top;
background-size: cover;
}
.contents_box.central .bg_area .bg{
background: url(../img/central_img_bg.jpg)no-repeat top;
background-size: cover;
}
.contents_box.academic .bg_area .bg{
background: url(../img/academic_img_bg.jpg)no-repeat top;
background-size: cover;
}

.contents_box.central .bg_area > figure{
width: 94%;
max-width: 1000px;
margin: 60px auto 0;
}

.contents_box figure {
}
.contents_box .text_area {
width: 94%;
margin:  auto;
padding: 80px 0 60px;

}
.contents_box .text_area p {
text-align: center;
font-feature-settings: "palt";
letter-spacing: 0.12em;
font-size: 16.5px;
line-height: 2;
padding-top: 1.5em;
}
.contents_box .copy {
color: #6a5625;
letter-spacing: 0.1em;
}
.contents_box ul {
display: flex;
justify-content: space-between;
width: 94%;
max-width: 1200px;
margin: 0 auto;
}
.contents_box li {
width: 23%;
}
.contents_box li figure {
position: relative;
}
.contents_box li figure::after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-50%,50%);
display: block;
width: 2px;
height: 50px;
background: #6a5625;;
}
.contents_box li p {
text-align: center;
line-height: 1.6;
color: #6a5625;
padding-top: 2em;
}
[id^="area0"] {
padding-top: 0x;
margin-top: -0px;
}

/*=========================================================================================================
sp
=========================================================================================================*/
@media screen and (max-width: 767px) {
.main_Visual>figure {
background: #000;
}
.main_Visual>figure img {
opacity: 0.4;
}
.main_Visual>div.sp {
position: absolute;
top: 60%;
left: 50%;
transform: translate(-50%,-50%);
    width: 94%;
    margin: 0 auto;
}
.main_Visual>div.sp .ttl {
    width: 40%;
    max-width: 236px;
    margin: 0 auto 30px;
}
.main_Visual .copy {
text-align: center;
    font-size: 18px;
    letter-spacing: 0.16em;
    line-height: 1.8;
    font-feature-settings: "palt";
}
.copy {
    text-align: left;
    font-size: 18px;
    line-height: 1.8;
}
.lead_area {
 position: relative;
background: url(../img/lead_img_sp.jpg)no-repeat center;
    padding: 60px 0;
    padding-top: 68.75%;
    background-size: cover;
}
.copy.single_unit.sp {
font-size: 16px;
margin: 60px auto;
}
.copy.single_unit {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    font-size: 16px;
    line-height: 1.8;
}
.lead_area > div {
width: 94%;
margin: 0 auto;
}
.lead_area .ttl {
    width: 40%;
    max-width: 236px;
    margin: 0 auto 30px;
}
.lead_area .ttl img {
    margin-left: -3%;
}
  .copy.single_unit.sp {
    font-size: 16px;
    margin: 60px auto;
  }
.lead_area .copy .adjust {
    padding-left: 4%;
}
.deco {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 96px;
}

.area_map {
margin:0 auto 0;
}
.area_map figure{
max-width: 100%;
margin: 0 auto;
}
.area_map .area01 {
top: 66.301600673967987%;
left: 17.375%;
width: 49.625%;
}
.area_map .area02 {
top: 21.988205560235889%;
left: 3.875%;
width: 45.125%;
}
.area_map .area03 {
top: 4.296545914069082%;
left: 50.75%;
width: 47.125%;
}
.area_map .area04 {
top: 42.122999157540017%;
left: 47%;
width: 41.125%;
}
.contents_box:not(:first-of-type) {
    padding: 0;
}
.contents_box:not(:last-of-type) {
    padding: 0 0 60px;
}
.contents_box .text_area {
width: 80%;
    padding: 30px 0 30px;
}
.contents_box .text_area p {
    text-align: left;
    font-size: 13px;
    line-height: 2;
    padding-top: 1.5em;
}
.contents_box ul {
flex-wrap: wrap;
}
.contents_box li {
    width: 42%;
    margin: 0 auto;
}
.contents_box li:nth-child(3),
.contents_box li:nth-child(4){
margin: 30px auto 0;
}
.contents_box li p {
    font-size: 13px;
    padding-top: 2.5em;
}
.contents_box.central .bg_area > figure {
    width: 76%;
    margin: 40px auto 0;
}
.copy.single_unit .inner{
width: 90%;
}

.copy.single_unit .single_unit_txt {
}

}