header {
    height: 6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: sticky;
    top: 0;
    padding: 0 1.5rem;
    z-index: 7777;
    background: #fff;
}
header h1 {
    width: 10rem;
}
header h1 a {
    width: 100%;
}
header h1 a img {
    width: 100%;
}
header #menuBtn {
    width: 2.5rem;
    position: absolute;
    right: 1.5rem;
}
header #menuBtn img {
    width: 100%;
}

.navBg {
    background: rgba(0, 0, 0, 0.3);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    z-index: 8888;
}
nav {
    background-color: #fff;
    display: flex;
    flex-flow: column nowrap;
    width: 50%;
    height: 100%;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 9999;
    padding: 6rem 1.5rem 0;
}
nav button {
    width: 2.5rem;
    position: absolute;
    top: 2rem;
    right: 1.5rem;
}
nav button img {
    width: 100%;
}
nav > a {
    font-size: 1.8rem;
    font-weight: 800;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 0;
    color: #006971;
}
nav > a:nth-of-type(1) {
    padding: 0;
    color: #333;
}
nav > a img {
    width: 2rem;
}
nav .sub {
    display: flex;
    flex-flow: column nowrap;
    gap: 1.5rem;
}
nav .sub a {
    font-size: 1.8rem;
    color: #747474;
}

main {
    padding: 0 1.5rem 10rem;
}
main > a {
    background-color: #bfe7e7;
    background-image: url(../img/home_img.png);
    background-size: 10rem;
    background-repeat: no-repeat;
    background-position: right 1.5rem center;
    border-radius: 1rem;
    height: 12rem;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    padding: 0 1.5rem;
    gap: 0.5rem;
    margin-bottom: 2rem;
}
main > a h2 {
    font-size: 2rem;
    font-weight: 600;
    color: #006b73;
}
main > a p {
    line-height: 1.2;
    font-size: 1.8rem;
    font-weight: 600;
}
main #searchFrm {
    padding: 2rem 0;
}
main #searchFrm h2 {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 2rem;
}
main #searchFrm select {
    border: none;
    font-size: 1.8rem;
    background-color: #efefef;
    border-radius: 0.5rem;
    padding: 1.5rem 0 1.5rem 5rem;
    width: 100%;
    color: #939393;
    background-image: url(../img/home_icon3.png), url(../img/home_icon1.png);
    background-size: 2rem, 1.5rem;
    background-repeat: no-repeat;
    background-position: left 1.5rem center, right 1.5rem center;
    margin-bottom: 2rem;
}
main #searchFrm select option {
    font-size: 1.6rem;
}
main #searchFrm select:nth-of-type(2) {
    background-image: url(../img/home_icon4.png), url(../img/home_icon1.png);
}
main #searchFrm > input {
    border: none;
    font-size: 1.8rem;
    background-color: #efefef;
    border-radius: 0.5rem;
    padding: 1.5rem 0 1.5rem 5rem;
    width: 100%;
    color: #939393;
    background-image: url(../img/home_icon5.png);
    background-size: 2rem;
    background-repeat: no-repeat;
    background-position: left 1.5rem center;
    margin-bottom: 2rem;
}
main #searchFrm > button {
    color: #fff;
    background: #006b73;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-size: 1.8rem;
    border-radius: 0.5rem;
    width: 100%;
    padding: 1.5rem 0;
}
main #searchFrm > button img {
    width: 2rem;
}
main .menuWrap {
    padding: 2rem 0;
}
main .menuWrap h2 {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 2rem;
}
main .menuWrap .menu {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    gap: 2rem;
}
main .menuWrap .menu a {
    width: calc(50% - 1rem);
    font-size: 1.8rem;
    color: #fff;
    line-height: 1.2;
    background-image: url(../img/home_icon6.png);
    background-repeat: no-repeat;
    background-size: auto 4rem;
    background-position: right 1.5rem center;
    background-color: #008ca5;
    border-radius: 0.5rem;
    height: 8rem;
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
}
main .menuWrap .menu a:nth-of-type(2) {
    background-image: url(../img/home_icon7.png);
}
main .menuWrap .menu a:nth-of-type(3) {
    background-image: url(../img/home_icon8.png);
}
main .menuWrap .menu a:nth-of-type(4) {
    background-image: url(../img/home_icon9.png);
}
main .saveWrap {
    padding: 2rem 0;
}
main .saveWrap h2 {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 2rem;
}
main .saveWrap .save {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}
main .saveWrap .save a {
    width: 50%;
    height: 8rem;
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    font-size: 1.8rem;
    border-radius: 0.5rem;
    color: #fff;
    background-image: url(../img/home_icon10.png);
    background-repeat: no-repeat;
    background-size: 4rem;
    background-position: right 1.5rem center;
    background-color: #02a9b5;
}
main .saveWrap .save a:nth-of-type(2) {
    background-image: url(../img/home_icon11.png);
}

.scrollWrap {
    display: flex;
    flex-flow: column nowrap;
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    gap: 1rem;
}
.scrollWrap button {
    width: 4rem;
}
.scrollWrap button img {
    width: 100%;
}

/* 약국 리스트 */
main #filterFrm {
    display: flex;
    flex-flow: column nowrap;
    gap: 2rem;
}
main #filterFrm .selectWrap {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}
main #filterFrm .selectWrap select {
    width: 50%;
    font-size: 1.8rem;
    border: 1px solid #e7e7e7;
    background: none;
    border-radius: 0.5rem;
    color: #959595;
    padding: 1.5rem 2rem 1.5rem 4rem;
    background-image: url(../img/home_icon3.png), url(../img/home_icon1.png);
    background-size: 2rem, 1.5rem;
    background-repeat: no-repeat;
    background-position: left 1.5rem center, right 1.5rem center;
}
main #filterFrm .selectWrap select:nth-of-type(2) {
    background-image: url(../img/home_icon4.png), url(../img/home_icon1.png);
}
main #filterFrm .selectWrap select option {
    font-size: 1.8rem;
}
main #filterFrm > input {
    font-size: 1.8rem;
    padding: 1.5rem 0 1.5rem 5rem;
    border: 1px solid #e7e7e7;
    border-radius: 0.5rem;
    background-color: #fff;
    background-image: url(../img/sub_icon1.png);
    background-size: 2rem;
    background-repeat: no-repeat;
    background-position: left 2rem center;
}
main #filterFrm > input::placeholder {
    color: #959595;
}
main #filterFrm > button {
    color: #fff;
    background: #006b73;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-size: 1.8rem;
    border-radius: 0.5rem;
    width: 100%;
    padding: 1.5rem 0;
}
main #filterFrm > button img {
    width: 2rem;
}
main .searchToggle {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}
main .searchToggle input {
    font-size: 1.8rem;
    height: 5rem;
    border: 1px solid #e7e7e7;
    display: flex;
    align-items: center;
    border-radius: 0.5rem;
    background-color: #fff;
    background-image: url(../img/sub_icon1.png);
    background-size: 2rem;
    background-repeat: no-repeat;
    background-position: left 2rem center;
    padding-left: 5rem;
    width: calc(100% - 5rem);
}
main .searchToggle input::placeholder {
    color: #959595;
}
main .searchToggle button {
    background: #bee7e7;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5rem;
    height: 5rem;
}
main .searchToggle button img {
    width: 30%;
}
main .status {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 0;
}
main .status h2 {
    font-size: 2rem;
    font-weight: 800;
}
main .status h2 span {
    font-size: 2rem;
    font-weight: 800;
    color: #006b73;
}
main .status h2 span.open {
    color: #00a6be;
}
main .status h2 span.rest {
    color: #08b59c;
}
main .status h2 span.night {
    color: #0884b6;
}
main .status a {
    border-radius: 0.5rem;
    padding: 0.8rem 2rem;
    color: #fff;
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #00a6be;
}
main .status a.rest {
    background: #08b59c;
}
main .status a.night {
    background: #0884b6;
}
main .status a.all {
    background: #006b73;
}
main .status a img {
    width: 1.5rem;
}
main .result {
    display: flex;
    flex-flow: column nowrap;
    gap: 2rem;
}
main .result > a {
    border-radius: 1rem;
    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    display: flex;
    flex-flow: column nowrap;
    gap: 0.5rem;
}
main .result > a .tagScrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
main .result > a .tagScrap .tag {
    display: flex;
    gap: 0.5rem;
}
main .result > a .tagScrap .tag span {
    font-size: 1.4rem;
    padding: 0.5rem 0;
    width: 5rem;
    text-align: center;
    border-radius: 0.5rem;
    color: #fff;
    background: #00a5bd;
}
main .result > a .tagScrap .tag span.rest {
    background: #08b59c;
}
main .result > a .tagScrap .tag span.night {
    background: #0884b6;
}
main .result > a .tagScrap button {
    width: 3rem;
}
main .result > a .tagScrap button img {
    width: 100%;
}
main .result > a .nameCall {
    display: flex;
    align-items: center;
    gap: 1rem;
}
main .result > a .nameCall h3 {
    font-size: 1.8rem;
    font-weight: 800;
}
main .result > a .nameCall a {
    width: 2rem;
}
main .result > a .nameCall a img {
    width: 100%;
}
main .result > a .address {
    font-size: 1.6rem;
    line-height: 1.4;
}
main .noResult {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    padding-top: 10rem;
}
main .noResult img {
    width: 1.5rem;
    margin-bottom: 3rem;
}
main .noResult strong {
    margin-bottom: 1rem;
    font-size: 1.8rem;
    font-weight: 800;
}
main .noResult span {
    font-size: 1.6rem;
}
main .pagination {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 3rem;
}
main .pagination button {
    font-size: 1.6rem;
    color: #aeaeaf;
}
main .pagination button.active {
    color: #333;
}

/* 약국 상세페이지 */
main > .title {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 0 1.5rem;
}
main > .title img {
    width: 3rem;
}
main > .title span {
    font-size: 1.8rem;
    font-weight: 800;
}
main .detail {
    padding: 0 1.5rem;
}
main .detail h3 {
    font-size: 1.6rem;
    margin-bottom: 1rem;
}
main .detail p {
    font-size: 1.6rem;
    margin-bottom: 1.5rem;
}
main .detail p span {
    font-size: 1.6rem;
}
main .detail p span.dutyAddr {
    line-height: 1.4;
}
main .detail .time span:nth-of-type(1) {
    margin-left: 2rem;
}
main .rest {
    color: #005e67;
}
main .mapWrap {
    border-top: 1px solid #e7e7e7;
}
main .mapWrap h3 {
    padding: 2rem 1.5rem;
    font-size: 1.6rem;
    font-weight: 800;
}
main .mapWrap #vMap {}
main .mapWrap #vMap .mapmenu {
    display: none !important;
}
main #regularBtn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 1.8rem;
    color: #fff;
    padding: 2rem 0;
    background: #006b73;
    margin-top: 4rem;
}
main #regularBtn img {
    width: 1.5rem;
}
#completeBg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.5rem;
}
#completeBg .complete {
    width: 100%;
    padding: 3rem 0;
    background: #fff;
    border-radius: 1rem;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
}
#completeBg .complete p {
    font-size: 1.6rem;
    font-weight: 600;
}
#completeBg .complete span {
    font-size: 1.6rem;
    margin-bottom: 0.5rem;
}
#completeBg .complete a {
    padding: 1rem 4rem;
    font-size: 1.6rem;
    color: #fff;
    background: #00626a;
    border-radius: 0.5rem;
    width: max-content;
}

/* 스크랩 */
main > h2 {
    padding: 4rem 0 2rem;
    font-size: 2rem;
    font-weight: 800;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
main > h2 button {
    font-size: 1.6rem;
}

/* 비대면 */
main .yakSwiper {
    height: max-content;
    overflow: hidden;
    padding-bottom: 5rem;
}
main .yakSwiper .swiper-wrapper {}
main .yakSwiper .swiper-pagination {
    bottom: 2rem;
}
main .yakSwiper .swiper-button-next {
    position: unset;
}
main .yakSwiper .swiper-button-next img {
    width: 2rem;
}
main .yakSwiper .swiper-button-next::after {
    display: none;
}
main .yakSwiper .swiper-button-prev {
    position: unset;
}
main .yakSwiper .swiper-button-prev img {
    width: 2rem;
}
main .yakSwiper .swiper-button-prev::after {
    display: none;
}
main .yakSwiper .swiper-pagination-bullet-active {
    background: #006b73;
}
main .yakSwiper .swiper-wrapper .swiper-slide {
    height: 34rem;
    border-radius: 1rem;
    border: 1px solid #efefef;
}
main .yakSwiper .swiper-wrapper .swiper-slide .title {
    height: 45%;
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    padding: 0 1.5rem;
}
main .yakSwiper .swiper-wrapper .swiper-slide .title .titleWrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
main .yakSwiper .swiper-wrapper .swiper-slide h3 {
    font-size: 1.8rem;
    font-weight: 800;
    margin-bottom: 2rem;
}
main .yakSwiper .swiper-wrapper .swiper-slide .title > img {
    width: 100%;
}
main .yakSwiper .swiper-wrapper .swiper-slide .content {
    display: flex;
    align-items: center;
    border-top: 1px solid #e5e5e5;
    padding: 0 2rem;
    height: 55%;
}
main .yakSwiper .swiper-wrapper .swiper-slide pre {
    font-size: 1.6rem;
    line-height: 1.4;
}
main .yakSwiper .swiper-wrapper .swiper-slide pre b {
    font-size: 1.6rem;
    color: #00626a;
    line-height: 1.4;
}
main > h3 {
    font-size: 1.6rem;
    font-weight: 600;
}
main > pre {
    font-size: 1.6rem;
    line-height: 1.4;
    margin: 0.5rem 0 3rem;
}