@charset "UTF-8";

.town_planning_map{max-width: 800px;margin: 40px auto 0;}
.town_planning_map .cap_o{padding-right: 4.5%;}

.town_planning_item{padding: 0 10px;display: flex;justify-content: space-between;flex-wrap: wrap;}
.town_planning_item > li{width: calc(47.85% - 10px);margin-left: 10px;background: #e4dac4;padding: 30px 20px;margin-top: 40px;}
.town_planning_item > li::before{content: "";display: block; width: calc(100% - 22px);height: calc(100% - 22px);border: 1px solid #a68d50;position: absolute;top:0;bottom:0;left:0;right: 0;margin: auto;z-index: 1;pointer-events: none;}
.town_planning_item > li i{display: flex;justify-content: center;align-items: center;line-height: 1;color: #fff;font-size: 24px;width: 1.3em;height: 1.3em;border: 1px solid #fff;background: #a68d50;position: absolute;left: -0.5em;top: -0.5em;border-radius: 50%;z-index: 1;padding-bottom: 0.1em;font-family: 'EB Garamond', serif;}
.town_planning_item > li .item_tit{font-size: 21px;}

.town_planning_img{margin-top: 45px;}

@media screen and (min-width: 769px) {
.town_planning_item > li:nth-of-type(even){animation-delay: 0.2s;}
}

@media screen and (max-width: 768px) {
.town_planning_map{margin-top: 20px;}

.town_planning_item{padding: 0;}
.town_planning_item > li{width: calc(100% - 7px);margin-left: 7px;padding: 17px 15px;margin-top: 20px;}
.town_planning_item > li::before{content: "";display: block; width: calc(100% - 12px);height: calc(100% - 12px);border: 1px solid #a68d50;position: absolute;top:0;bottom:0;left:0;right: 0;margin: auto;z-index: 1;pointer-events: none;}
.town_planning_item > li i{font-size: 20px;}
.town_planning_item > li .item_tit{font-size: 16px;}

.town_planning_img{margin-top: 45px;overflow: hidden; height: 50vw;}
.town_planning_img img{width: auto;height: calc(100% - 1.5em);left: 50%;transform: translateX(-50%);max-width: none;}
}