/* Content CSS */
#location {position: relative; overflow: hidden; text-align: center;}
#location::after {position: absolute; right: 50%; bottom: -8px; width: 100%; max-width: 445px; height: 70px; background: url("../img/loc_logo.png") center / contain no-repeat; content: ""; opacity: 0.8; transform: translateX(50%);}
#location article {position: relative; padding: 0 0 50px;}
#location article:nth-child(2) {padding: 0 0 50px;}
#location article:nth-child(3) {padding: 0 0 50px;}
#location .sub_inner {position: relative; width: 100%; max-width: 1600px; margin: 0 auto; padding: 0 20px; box-sizing: border-box;}

/* font_size */
.fs_56 {font-size: 28px; font-weight: 800; line-height: 1.4; color: #000; font-family: 'Poppins'; letter-spacing: -1px;}
.fs_40 {font-size: 22px; font-weight: 700; line-height: 1.5; letter-spacing: 0.3px; color: #000;}
.fs_24 {font-size: 18px; font-weight: 700; line-height: 1.5; color: #232323;}
.fs_22 {font-size: 18px; font-weight: 600; line-height: 1.6; color: #000;}
.fs_20 {font-size: 16px; font-weight: 400; line-height: 1.7; color: #333;}

#location h2 {margin: 36px auto 26px;}

/* location_box */
#location .location_box {display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none;}
#location .location_box li {padding: 22px 18px; border-radius: 15px; background-color: #f8f8f7; text-align: left;}
#location .location_box li p {margin: 8px 0 0;  word-break: keep-all; text-align: center;}
#location .location_box li p span {font-weight: 700;}
#location .location_box li strong {display: flex; align-items: center; gap: 5px; justify-content: center;}
#location .location_box li:nth-child(1) strong::before {display: inline-block; width: 12px; height: 20px; background: url("../img/loc_icon1.png") center / contain no-repeat; content: ""; transition: transform 0.4s ease;}
#location .location_box li:nth-child(2) strong::before {display: inline-block; width: 12px; height: 20px; background: url("../img/loc_icon2.png") center / contain no-repeat; content: ""; transition: transform 0.4s ease;}

/* hover */
#location .location_box li:nth-child(1):hover strong::before {transform: scaleX(-1);}
#location .location_box li:nth-child(2):hover strong::before {transform: scaleX(-1);}

/* map_box */
#location .map_box {position: relative; margin: 24px 0 48px;}

/* map */
#location .map {position: relative; z-index: 2; width: 100%; height: 320px; margin: 0; overflow: hidden; border-radius: 20px; transform: none;}
#location .map .wrap_map {width: 100%; height: 100%;}
#location .map .map_border {display: none;}

/* h3 */
#location h3 {position: relative; margin: 0 0 10px; padding-left: 12px; text-align: left;}
#location h3::before {position: absolute; top: 8px; bottom: 0; left: 0; width: 3px; height: 20px; background: #ed6f20; content: "";}

/* region */
#location .region {position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; column-gap: 0; margin: 0; padding: 0; list-style: none; text-align: left;}
#location .region li {display: flex; min-width: 0; min-height: 0; gap: 16px; padding: 20px 8px; border-bottom: 1px solid #222; box-sizing: border-box; transition: background-color .3s;}
#location .region li > span {color: #d1d2d2; font-family: 'Poppins';}
#location .region li > div {min-width: 0;}
#location .region li p {margin: 4px 0 0; word-break: keep-all;}
#location .region li:hover {background-color: #f8f8f7;}

@media (max-width: 420px) {
    #location .sub_inner {padding: 0 14px;}
    #location h2 {margin: 30px auto 26px;}
    #location .location_box li {padding: 20px 14px;}
    #location .map {height: 270px;}
    #location .region li {gap: 14px; padding: 18px 4px;}
    #location .region li p {font-size: 13px;}
}