@charset "utf-8";
.map .root_daum_roughmap .wrap_controllers {display: none;}
.map .root_daum_roughmap_landing {border-radius:1rem 1rem 0 0}
.adr {
    display: flex;
    align-items: center;
    padding: 3rem 2rem 2rem;
    border: 1px solid #ddd;
    border-radius: 0 0 1rem 1rem;
    justify-content: space-between;
    width: 100%;
}
.adr ul {
    display: flex;
    flex-wrap: wrap;
}
.adr ul li {width: 50%;display: flex;align-items: center;font-weight: 300;margin-bottom: 1rem;}

.adr ul li i {background-color:var(--color-main);color:#fff;border-radius:50%;font-size:1.5rem;width: 50px;height: 50px;display: flex;justify-content: center;align-items: center;margin-right: .5rem;}
.adr ul li span {font-size: var(--font-size2);font-weight:500;margin-right:1rem}
.adr .local {width: 16%;text-align: center;background-color: #e2f5fd;border-radius: 1rem;position: relative;}
.adr .local a {
    display: block;
    padding: 1rem;
    width: 100%;
    height: 100%;
    /* color: var(--color-main); */
    font-weight: 600;
}
.traffic {
    margin: 5% 0 10%;
}
.traffic ul {
    border-top: 1px solid #ddd;
}
.traffic ul li {display: flex;padding: 2rem 0;align-items: center;justify-content: space-between;flex-wrap: wrap;}
.traffic li:first-child {border-bottom: 1px dashed #ddd;}
.traffic .traffic_img {width: 300px;height: 300px;border: 1px dashed var(--color-main);padding: 2rem;border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;}
.traffic .traffic_img img {/* border:1px solid var(--color-main); *//* padding:2rem; *//* border-radius: 50%; */}
.traffic .traffic_list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.traffic .traffic_list h5 {width: 20%;margin-bottom: 1rem;font-size: 24px;color: var(--color-main);}
.traffic .traffic_list div {width: 80%;}
.traffic .bus_stop strong {
    padding-right: 2rem;
    font-size: 20px;
    font-weight: 500;
}
.traffic .bus_stop {
    background-color: #f5f5f5;
    padding: 1rem;
    display: flex;
    justify-content: center;
    border-radius: 1rem;
    margin-top: 2rem;
    width:100%
}
.traffic .traffic_list dl {
    width: 40%;
}
.traffic .traffic_list dl dt {
    font-weight: 500;
    margin-bottom: .5rem;
}
.traffic .traffic_list dl dd {
    font-weight: 300;
}
.how {margin-top:3rem}
.how dl {
    border-top: 2px solid var(--color-main);
    display: flex;
    flex-wrap: wrap;
}
.how dt {
    background-color: #f4f4f4;
    width: 20%;
    text-align: center;
    padding: 1rem;
    font-weight: 500;
    border-bottom: 1px solid #ddd;
    display: flex;
    justify-content: center;
    align-items: center;
}
.how dd {
    width: 80%;
    padding: .5rem 1rem;
    border-bottom: 1px solid #ddd;
}
.how dd ul {
    padding: 1em;
}
.how dd ul li {list-style: square;margin-bottom: 1rem;}
.how dd ul li::marker {color:#ccc}
.how dd ul li span {color: #f26d20;font-weight:500;}
.how dd ul li span.mt1 {margin-top: .5rem;display: block;}
.how dd ul li strong {font-weight:500;/* padding-bottom: .5rem; */display: block;}

/* PC */ 
@media only screen and (min-width:1280px) and (max-width: 1600px)  {
    
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .adr {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 2rem;
}
    .adr ul {width:100%;border-right: unset;/* border-bottom: 1px dashed #ddd; *//* justify-content: center; */}
    .adr ul li {width: unset;margin-right: 2rem;margin-bottom: 1rem;}
    
    .adr .local {
    margin-top: 2rem;
    width: 40%;
}
    .traffic {margin:15% 0}
    .traffic .traffic_img {
    width: 160px;
    height: 160px;
    margin: 0 auto 1rem;
    padding: 0;
}
    .traffic .traffic_img img {
    width: 65%;
}
    .traffic .traffic_list {
    width: 75%;
}
    .adr ul li:first-child, .adr ul li:last-child {width:100%;flex-wrap: wrap;}
    
}

/* 모바일 가로, 모바일 세로 (해상도 ~ 767px)*/ 
@media all and (max-width:767px) {
    .adr {padding: 1rem;}
    .adr ul li {margin-right:0;width:100%;display: flex;margin-bottom: 0;word-break: keep-all;font-size: 4.5vw;}
    
    .adr ul li i {
    width: 10%;
    /* height: auto; */
    font-size: 1.3rem;
    background-color: unset;
    color: var(--color-main);
    display: inline-flex;
    justify-content: flex-start;
    margin-right: 0;
}
    .adr ul li span {width: 17%;margin-right: 0;display: inline-block;}
    .adr .local {width:100%}
    .traffic ul li:first-child {padding-top:0}
    .traffic .traffic_list {width:100%;}
    .traffic .traffic_list h5 {
    /* text-align: center; */
    margin: 1rem 0;
    width: 100%;
}
    .traffic .traffic_list dl dd {font-size:4.5vw}
    .traffic .traffic_list dl {width:100%;margin-bottom: 1rem;}
    .traffic .bus_stop {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 1rem;
}
    .traffic .bus_stop  p {word-break:keep-all; font-size:4.5vw}
	.spon_how dt, .spon_how dd {width:100%}
}