@charset "UTF-8";

/* メイン */
.main_wrap{height: calc(100vh - 82px);}
.main_wrap .page_tit{}
.main_wrap .page_tit i{color: rgba(96,80,70,0.2)!important;}
.main_img img{height: 100%;}
.main_img{width: 100%;height: 100%;}
.main_img figure{position: absolute;height: 21%;}
.main_img figure:nth-of-type(1){left: 31%;top: 8%;}/* 夕方 */
.main_img figure:nth-of-type(2){right: 18%;bottom: 12.5%;}/* らふむーず */
.main_img figure:nth-of-type(3){left: 8%;bottom: 20%;}/* 電車 */
.main_img figure:nth-of-type(4){right: 32%;top: 12.5%;}/* 大学 */
.main_img figure:nth-of-type(5){left: 27%;bottom: 10%;}/* 並木 */
.main_img figure:nth-of-type(6){right: 11%;top: 32%;}/* 橋 */
.main_img figure:nth-of-type(7){left: 11%;top: 22%;}/* スタバ */
.main_img figure:nth-of-type(8){right: 38%;bottom: 4%;}/* 噴水 */
.main_copy{text-align: center;position: absolute;left: 0;top: 0;bottom: 0;margin: auto 0; width: 100%;height: 24.8vh;}
.main_copy small{font-size: 2.1vh;}
.main_copy figure{margin-top: 3vh;}
.main_copy figure img{height: 17vh;}
.lead{padding: 3em 0;}
.lead p{text-align: center;font-size: 0.9em;line-height: 1.5;}

@media screen and (min-width: 769px) and (max-width: 1310px) {
.main_img img{height: auto;}
.main_img figure{height: auto;width: 13%;}
}

@media screen and (max-width: 768px) {
.main_wrap{height: calc(100vh - 55px);}
.layer main .page_tit{top: 2%;}
.main_img img{height: 100%;}
.main_img{width: 100%;height: 100%;}
.main_img figure{position: absolute;height: 11%;}
.main_img figure:nth-of-type(1){left: 20%;top: 5%;}/* 夕方 */
.main_img figure:nth-of-type(2){right: 10%;bottom: 25%;}/* らふむーず */
.main_img figure:nth-of-type(3){left: 8%;bottom: 30%;}/* 電車 */
.main_img figure:nth-of-type(4){right: 20%;top: 8%;}/* 大学 */
.main_img figure:nth-of-type(5){left: 20%;bottom: 10%;}/* 並木 */
.main_img figure:nth-of-type(6){right: 5%;top: 26%;}/* 橋 */
.main_img figure:nth-of-type(7){left: 7%;top: 24%;}/* スタバ */
.main_img figure:nth-of-type(8){right: 20%;bottom: 4%;}/* 噴水 */
.main_copy{text-align: center;position: absolute;left: 0;top: 0;bottom: 0;margin: auto 0; width: 100%;height: 24.8vh;}
.main_copy small{font-size: 1.8vh;}
.main_copy figure{margin-top: 2vh;}
.main_copy figure img{height: 13vh;}
.lead{padding: 2em 0;}
.lead p{font-size: 0.85em;}
}

/* コンテンツ */
#contents{background: #f7f7f7;padding-bottom: 0;}
#contents .item{animation-name: fadeInUp;}
.img_item{display: flex;flex-wrap: wrap;margin-top: 1.5em;}
#hill_top .img_item figure:nth-of-type(1){width: 56em;animation-name: fadeInUp;}
#hill_top .img_item figure:nth-of-type(2){width: 29em;margin: 4em 0 0 2em;animation-name: fadeInRight;/* position: absolute; */bottom: 0;right: -3em;}
#hill_top .img_item figure:nth-of-type(2) img{width:80%}
#hill_top .img_item figure:nth-of-type(3){width: 21em;position: absolute;bottom: 3.5em;right: 0;animation-name: fadeInRight;}
#contents .item + .item{margin-top: 2.5em;}
#letchworth_road .img_item{justify-content: space-between;}
#letchworth_road .img_item figure:nth-of-type(1){width: 18em;animation-name: fadeInUp;order: 2;}
#letchworth_road .img_item figure:nth-of-type(2){width: 22.5em;margin: 4.5em 0 0 0;animation-name: fadeInLeft;order: 1;}
#letchworth_road .img_item figure:nth-of-type(3){width: 23em;position: absolute;bottom: 2.5em;left: 7em;animation-name: fadeInLeft;}
.map_img{display: flex;margin-top: 2.5em;}
.map_img figure{mix-blend-mode: multiply;}
#hazard_risk{padding: 3.5em 0;margin-top: 3.5em;background: #f6f5f0;}
#hazard_risk .wrap1024{display: flex;justify-content: space-between;flex-wrap: wrap;gap: 2.5em 0;}
#hazard_risk .wrap1024 .item{width: 20em;}
#hazard_risk .wrap1024 figure{width: 30em;animation-name: fadeInUp;}
#hazard_risk .hazard_risk_note{margin-top:2em;position: absolute;bottom: 2em;width: 90%;animation-name: fadeInUp;}
#area{padding: 3.5em 0;}
#area .wrap1024{display: flex;justify-content: space-between;flex-wrap: wrap;gap: 2.5em 0;}
#area .wrap1024 .item{width: 28em;}
#area .wrap1024 figure{width: 22em;animation-name: fadeInUp;}

@media screen and (min-width: 769px) {
.map_img figure:nth-of-type(2){animation-delay: 0.3s;}
#hazard_risk .wrap1024 figure:nth-of-type(1){animation-delay: 0.3s;}
}

@media screen and (max-width: 768px) {
.img_item{margin-top: 1.5em;font-size: 1.84vw;}
#contents .item + .item{margin-top: 2em;}
#hill_top .img_item figure:nth-of-type(2){left: 0;}
.map_img{flex-wrap: wrap;justify-content: center;gap: 1.5em 0;margin-top: 1.5em;}
.map_img figure:nth-of-type(1) img{width: 100vw;max-width: none;margin: 0 -1em;}
.map_img figure:nth-of-type(2){width: 80vw;}
#hazard_risk{padding: 2.5em 0;margin-top: 2.5em;background: #f6f5f0;}
#hazard_risk .wrap1024{gap: 1.5em 0;}
#hazard_risk .wrap1024 .item{width: 100%;}
#hazard_risk .wrap1024 figure{width: 100%;margin-inline: auto;animation-name: fadeInUp;}
#hazard_risk .hazard_risk_note{margin-top: 0;position: unset;width: 100%;animation-name: fadeInUp;}
#area{padding: 2.5em 0;;}
#area .wrap1024{gap: 1.5em 0;}
#area .wrap1024 .item{width: 100%;}
#area .wrap1024 figure{width: 100%;margin-inline: auto;animation-name: fadeInUp;}

}