br.md { display: none; } @media (max-width: 1199px) { br.md { display: inline; } } .ad-pop { background-color: #106bb2; position: relative; } .ad-pop.closed { display: none; } @media (max-width: 1199px) { .ad-pop { height: 125px; } } @media (max-width: 767px) { .ad-pop { height: 120px; } } .ad-pop--nav { position: absolute; z-index: 10; } @media (min-width: 1200px) { .ad-pop--nav { right: 50%; top: 14px; margin-right: calc(1200px / 2 * -1); } } @media (max-width: 1199px) { .ad-pop--nav { left: 30px; bottom: 4px; } } @media (max-width: 767px) { .ad-pop--nav { left: 26px; bottom: 10px; } } .ad-pop--nav .dot { display: inline-block; } .ad-pop--nav--Pause { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-stop.png) center center no-repeat; } .ad-pop--nav--Play { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-play.png) center center no-repeat; } .ad-pop--todayClose { position: absolute; top: 48px; right: 50%; margin-right: calc(1200px / 2 * -1); z-index: 11; } @media (max-width: 1199px) { .ad-pop--todayClose { position: static; } } .ad-pop--todayClose label { display: inline-block; vertical-align: bottom; } .ad-pop--todayClose label span { color: #fff; font-size: 0.938rem; font-weight: 400; letter-spacing: -0.014rem; } @media (max-width: 1199px) { .ad-pop--todayClose label { position: absolute; right: 10px; bottom: 10px; } } @media (max-width: 767px) { .ad-pop--todayClose label { bottom: 15px; } } .ad-pop--todayClose button { display: inline-block; vertical-align: bottom; width: 48px; height: 28px; background: url(/static/nmc/img/main/today-close.png) center center no-repeat; } @media (max-width: 1199px) { .ad-pop--todayClose button { position: absolute; height: 38px; width: 38px; top: 0; right: 10px; z-index: 10; } } @media (max-width: 767px) { .ad-pop--todayClose button { top: 0; right: 0; width: 40px; height: 40px; background-size: 16px; } } .ad-pop a { display: block; padding: 20px 0 25px; max-width: 1200px; margin: 0 auto; } @media (max-width: 1199px) { .ad-pop a { padding: 10px 30px; } } @media (max-width: 767px) { .ad-pop a { padding: 16px 26px; } } .ad-pop a .title { color: #fff; font-size: 1.188rem; font-weight: 400; letter-spacing: -0.017rem; } @media (max-width: 1199px) { .ad-pop a .title { font-size: 19px; } } .ad-pop a .text { margin-top: 8px; color: #a9cfed; font-size: 0.938rem; font-weight: 300; line-height: 1.47; letter-spacing: -0.014rem; } @media (max-width: 1199px) { .ad-pop a .text { margin-top: 4px; } } @media (max-width: 767px) { .ad-pop a .text { display: none; } } #wrap { overflow: hidden; } #header { height: 80px; } #header .header-visual { height: auto; background: none; } @media (max-width: 1023px) { #header { height: auto; position: fixed; width: 100%; top: 0; left: 0; z-index: 1000; } #header.status-adVisible { position: static; position: relative; } .gnb-stiky #header { position: fixed; } } .section-nav { position: fixed; top: 26.25%; right: 0; z-index: 5000; } @media (max-width: 767px) { .section-nav { display: none; } } .section-nav a { display: block; color: #ffffff; height: 55px; width: 55px; background-color: rgba(0, 0, 0, 0.8); overflow: hidden; margin-left: auto; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .section-nav a i { float: left; width: 100%; height: 55px; background: url(/static/nmc/img/main/qnav-1.png) center center no-repeat; } .section-nav a span { float: left; line-height: 55px; vertical-align: top; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } @media (max-width: 1330px) { .section-nav a span { display: none; } } .section-nav a.active { width: auto; padding: 0 15px 0 10px; white-space: nowrap; } @media (min-width: 1331px) { .section-nav a.active i { width: 48px; } } .section-nav a.active:nth-child(1) { background-color: #c86ba9; } .section-nav a.active:nth-child(2) { background-color: #0077bb; } .section-nav a.active:nth-child(3) { background-color: #564f99; } .section-nav a.active:nth-child(4) { background-color: #564f99; } .section-nav a:nth-child(2) i { background-image: url(/static/nmc/img/main/qnav-2.png); } .section-nav a:nth-child(3) i { background-image: url(/static/nmc/img/main/qnav-3.png); } .section-nav a:nth-child(4) i { background-image: url(/static/nmc/img/main/qnav-4.png); } #sectionMain { position: relative; height: calc(100vh - 80px); } @media (max-width: 1199px) { #sectionMain { height: 100vh; } } #sectionMain .deco-scrolldown { position: absolute; left: 50%; bottom: 200px; z-index: 100; color: #ffffff; font-size: 0.813rem; line-height: 1; -webkit-transform: translateX(-50%); transform: translateX(-50%); } @media (max-width: 767px) { #sectionMain .deco-scrolldown { display: none; } } #sectionMain .deco-scrolldown .ico-scroll { background: url(/static/nmc/img/main/scroll.png) 0 0 no-repeat; display: block; height: 41px; width: 27px; margin: 10px auto 0; } #sectionMain .slick-arrow { position: absolute; top: 50%; width: 50px; height: 50px; z-index: 10; background: url(/static/nmc/img/main/mainsection-slick-arrow.png) center center no-repeat; color: transparent; } @media (min-width: 1200px) { #sectionMain .slick-arrow.slick-prev { left: 50%; margin-left: calc(1200px / 2 * -1); } } @media (max-width: 1250px) { #sectionMain .slick-arrow.slick-prev { left: 16px; } } #sectionMain .slick-arrow.slick-next { right: -50px; -webkit-transform: rotate(180deg); transform: rotate(180deg); } @media (min-width: 1200px) { #sectionMain .slick-arrow.slick-next { right: 50%; margin-right: calc(1200px / 2 * -1); } } @media (max-width: 1250px) { #sectionMain .slick-arrow.slick-next { right: 16px; } } #sectionMain .items { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: calc(100vh - 80px); width: 100%; } @media (max-width: 1199px) { #sectionMain .items { height: 100vh; } } #sectionMain .section-main--nav { position: absolute; left: 50%; bottom: 70px; z-index: 1; -webkit-transform: translateX(-50%); transform: translateX(-50%); } #sectionMain .section-main--nav .dot { display: inline-block; } #sectionMain .section-main--nav--Pause { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-stop.png) center center no-repeat; } #sectionMain .section-main--nav--Play { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-play.png) center center no-repeat; } #section-main--list .items { background-position: center 0; background-repeat: no-repeat; background-size: cover; } #section-main--list .items .design1 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; line-height: 1.55; text-align: center; background-position: center 0; height: 100%; background-size: cover; } #section-main--list .items .design1 .t1 { font-family: 'Nanum Square OTFEB'; font-size: 3.438rem; letter-spacing: -0.172rem; } @media (max-width: 767px) { #section-main--list .items:nth-child(3){background-position: calc(50% + 130px) 0;} #section-main--list .items .design1 .t1 { font-size: 2.063rem; } } #section-main--list .items .design1 .t2 { margin: 35px 0 25px; font-family: 'Nanum Square OTFL'; font-size: 1.375rem; letter-spacing: -0.069rem; } @media (max-width: 767px) { #section-main--list .items .design1 .t2 { margin: 20px 0; font-size: 0.938rem; } } #section-main--list .items .design1 .t3 { font-family: 'Nanum Square OTFR'; font-size: 2rem; } @media (max-width: 767px) { #section-main--list .items .design1 .t3 { line-height: 1.36; font-size: 1.375rem; } } #section-main--list .items .design1 .t3 strong { font-family: 'Nanum Square OTFEB'; letter-spacing: -0.1rem; } #section-main--list .items a.link { margin: 0 4px; padding: 9px 0; display: inline-block; color: #ffffff; width: 144px; border: 3px solid #fff; line-height: 1; text-align: center; } @media (max-width: 767px) { #section-main--list .items a.link { display: block; margin: 0 auto 7px; } } #section-main--list .items .design2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; line-height: 1.55; text-align: center; background-position: center 0; height: 100%; background-size: cover; } #section-main--list .items .design2 .t1 { font-family: 'Nanum Square OTFEB'; font-size: 3.438rem; letter-spacing: -0.172rem; margin: 11px 0 22px; line-height: 1; } @media (max-width: 767px) { #section-main--list .items .design2 .t1 { margin: 10px 0 10px; font-size: 33px; line-height: 1.33333; } } #section-main--list .items .design2 .t2 { margin: 0 0 30px; font-family: 'Nanum Square OTFL'; font-size: 1.375rem; letter-spacing: -0.069rem; } #section-main--list .items .design2 .t2 strong { font-weight: bold; } @media (max-width: 767px) { #section-main--list .items .design2 .t2 { font-size: 18px; line-height: 1.44444; } } #section-main--list .items .design2 .t3 a { margin: 0 4px; padding: 9px 0; display: inline-block; color: #ffffff; width: 144px; border: 3px solid #fff; line-height: 1; } @media (max-width: 767px) { #section-main--list .items .design2 .t3 a { display: block; margin: 0 auto 7px; } } #section-main--list .items .design3 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; line-height: 1.55; text-align: center; background-position: center 0; height: 100%; background-size: cover; } #section-main--list .items .design3 .t1 { font-family: 'Nanum Square OTFEB'; font-size: 3.438rem; letter-spacing: -0.172rem; margin: 24px 0 37px; line-height: 1; } @media (max-width: 767px) { #section-main--list .items .design3 .t1 { margin: 10px 0 10px; font-size: 33px; line-height: 1.33333; } } #section-main--list .items .design3 .t2 { margin: 0 0 30px; font-family: 'Nanum Square OTFL'; font-size: 1.375rem; letter-spacing: -0.069rem; } #section-main--list .items .design3 .t2 strong { font-weight: bold; } @media (max-width: 767px) { #section-main--list .items .design3 .t2 { font-size: 18px; line-height: 1.44444; } } #section-main--list .items .design3 .t3 a { margin: 0 4px; padding: 9px 0; display: inline-block; color: #ffffff; width: 144px; border: 3px solid #fff; line-height: 1; } @media (max-width: 767px) { #section-main--list .items .design3 .t3 a { display: block; margin: 0 auto 7px; } } #reservation { padding-top: 130px; padding-bottom: 113px; background-size: 100% auto; } @media (min-width: 1200px) { #reservation { background: url(/static/nmc/img/main/reservation-bg.jpg) center 0 no-repeat; min-height: 100vh; background-size: 100% 100%; } } @media (max-width: 1199px) { #reservation { padding: 80px 30px 60px; background: url(/static/nmc/img/main/reservation-bg-md.jpg) center 0 no-repeat; background-size: 100% auto; } } @media (max-width: 767px) { #reservation { padding: 60px 20px; } } #reservation .set { max-width: 1200px; margin: 0 auto; } #reservation .set > .title { margin-bottom: 20px; } #reservation .set > .title h1 { margin: 0 0 5px; color: #000; font-family: 'Nanum Square OTFEB'; font-size: 45px; font-weight: 800; line-height: 1; } #reservation .set > .title h1 .vline { font-size: 25px; } #reservation .set > .title h1 .s { font-size: 25px; } @media (max-width: 767px) { #reservation .set > .title h1 { font-size: 24px; } #reservation .set > .title h1 .vline { font-size: 24px; } #reservation .set > .title h1 .s { font-size: 14px; } } #reservation .set > .title p { color: #666; font-size: 0.938rem; font-weight: 300; line-height: 1; letter-spacing: -0.024rem; } @media (max-width: 767px) { #reservation .set > .title p { display: none; } } @media (max-width: 767px) { #reservation .set .top { border: 1px solid #ccc; padding: 19px; padding-top: 0; background-color: #ffffff; } } @media (min-width: 768px) { #reservation .set .top .reservation--internet { width: 370px; height: 275px; float: left; border: 1px solid #ccc; background-color: #ffffff; } } @media (min-width: 1200px) { #reservation .set .top .reservation--internet { padding: 27px 0 0 30px; } } @media (max-width: 1199px) { #reservation .set .top .reservation--internet { width: 21.75141%; margin-bottom: 20px; } } @media (max-width: 767px) { #reservation .set .top .reservation--internet { width: auto; float: none; } } #reservation .set .top .reservation--internet h2 { margin-bottom: 15px; color: #333; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet h2 { display: none; } } #reservation .set .top .reservation--internet p { color: #808080; font-size: 0.938rem; font-weight: 400; line-height: 1; letter-spacing: -0.014rem; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet p { display: none; } } #reservation .set .top .reservation--internet .reservation-1-ico1 { background: url(/static/nmc/img/main/reservation-1-ico1.png) center 0 no-repeat; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet .reservation-1-ico1 { background-position: center center; background-size: auto 51px; } } #reservation .set .top .reservation--internet .reservation-1-ico2 { background: url(/static/nmc/img/main/reservation-1-ico2.png) center 5px no-repeat; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet .reservation-1-ico2 { background-position: center center; background-size: auto 45px; } } #reservation .set .top .reservation--internet .reservation-1-ico3 { background: url(/static/nmc/img/main/reservation-1-ico3.png) center 5px no-repeat; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet .reservation-1-ico3 { background-position: center center; background-size: auto 45px; } } #reservation .set .top .reservation--internet .reservation-1-ico4 { background: url(/static/nmc/img/main/reservation-1-ico4.png) center 5px no-repeat; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet .reservation-1-ico4 { background-position: center center; background-size: auto 45px; } } #reservation .set .top .reservation--internet .btns { display: inline-block; width: 100%; } @media (min-width: 1200px) { #reservation .set .top .reservation--internet .btns { padding-top: 38px; } } @media (max-width: 767px) { #reservation .set .top .reservation--internet .btns { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #reservation .set .top .reservation--internet .btns a { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } } #reservation .set .top .reservation--internet a { color: #363636; font-size: 1.063rem; font-weight: 500; text-align: center; line-height: 1; letter-spacing: -0.016rem; } @media (min-width: 1200px) { #reservation .set .top .reservation--internet a { float: left; width: 50%; } } @media (max-width: 1199px) { #reservation .set .top .reservation--internet a { display: block; text-align: center; } } @media (min-width: 768px) { #reservation .set .top .reservation--internet a.mobile { display: none; } } #reservation .set .top .reservation--internet a i { display: block; height: 93px; } #reservation .set .top .reservation--internet .temp-lg { display: none; } @media (min-width: 1200px) { #reservation .set .top .reservation--internet .temp-lg { display: block; padding-right: 30px; } #reservation .set .top .reservation--internet .temp-lg li { overflow: hidden; padding-bottom: 20px; } #reservation .set .top .reservation--internet .temp-lg li i { float: left; width: 44px; font-size: 25px; color: #02819c; line-height: 1; padding-top: 5px; } #reservation .set .top .reservation--internet .temp-lg li span { float: left; width: calc(100% - 44px); font-size: 15px; } #reservation .set .top .reservation--internet .temp-lg a.link { float: none; display: block; margin: 0 auto; font-size: 15px; color: #4f4f4f; text-align: center; padding: 0; width: 130px; line-height: 38px; border: 1px solid #4f4f4f; } } #reservation .set .top .reservation--internet .temp-sm { display: none; } @media (max-width: 1199px) { #reservation .set .top .reservation--internet .temp-sm { display: block; } } @media (min-width: 768px) and (max-width: 1199px) { #reservation .set .top .reservation--internet .temp-sm .txt-md { word-break: keep-all; display: block; padding: 22px; font-size: 15px; color: gray; line-height: 1.467; } } #reservation .set .top .reservation--quick { float: left; border: 1px solid #ccc; width: 508px; height: 275px; padding: 27px 33px 0 30px; background-color: #ffffff; } @media (min-width: 1200px) { #reservation .set .top .reservation--quick { margin-left: 25px; } } @media (max-width: 1199px) { #reservation .set .top .reservation--quick { width: 74.71751%; float: right; margin-bottom: 20px; } } @media (max-width: 767px) { #reservation .set .top .reservation--quick { display: none; } } #reservation .set .top .reservation--quick h2 { margin-bottom: 15px; color: #333; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } #reservation .set .top .reservation--quick p { color: #777; font-size: 0.938rem; font-weight: 400; line-height: 1.6; letter-spacing: -0.014rem; } #reservation .set .top .reservation--quick p strong { color: #cd409f; font-weight: 400; } #reservation .set .top .reservation--quick p em { color: #444; } #reservation .set .top .reservation--quick form { margin-top: 15px; } #reservation .set .top .reservation--quick form .title { color: #444; font-size: 0.938rem; font-weight: 500; line-height: 1.47; padding-left: 13px; position: relative; } #reservation .set .top .reservation--quick form .title::before { content: ''; width: 3px; height: 3px; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); background-color: #000000; } #reservation .set .top .reservation--quick form .title.f { margin-right: 18px; } #reservation .set .top .reservation--quick form .title.f + label { margin-right: 28px; } #reservation .set .top .reservation--quick form .l { display: inline-block; width: 100%; } #reservation .set .top .reservation--quick form .l label { display: block; } #reservation .set .top .reservation--quick form .l * { vertical-align: top; } #reservation .set .top .reservation--quick form .l .title { height: 40px; width: 60px; line-height: 40px; float: left; } #reservation .set .top .reservation--quick form .m { margin: 10px 0 7px; } #reservation .set .top .reservation--quick form .m input { height: 40px; width: calc(100% - 60px); } #reservation .set .top .reservation--quick form .b label { display: block; float: left; width: calc(100% - 100px); } #reservation .set .top .reservation--quick form .b input { height: 40px; width: calc(100% - 60px); border-right-width: 0; } #reservation .set .top .reservation--quick form .b button { float: left; height: 40px; padding: 0; background-color: #4f4f4f; color: #ffffff; font-size: 0.938rem; font-weight: 500; width: 100px; } @media (min-width: 768px) { #reservation .set .top .reservation--tel { float: right; border: 1px solid #ccc; background-color: #ffffff; padding: 27px 30px 0 30px; } } @media (min-width: 1200px) { #reservation .set .top .reservation--tel { width: 270px; height: 275px; } } @media (max-width: 1199px) { #reservation .set .top .reservation--tel { float: none; clear: both; padding: 24px 0 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (max-width: 767px) { #reservation .set .top .reservation--tel { display: block; padding: 0; border-top: 1px solid #ccc; } } #reservation .set .top .reservation--tel h2 { color: #333; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } @media (max-width: 1199px) { #reservation .set .top .reservation--tel h2 { width: 14.12429%; text-align: center; line-height: 1.3; } } @media (max-width: 767px) { #reservation .set .top .reservation--tel h2 { display: none; } } #reservation .set .top .reservation--tel dl { padding: 15px 0 10px; } @media (min-width: 768px) and (max-width: 1199px) { #reservation .set .top .reservation--tel dl { width: 27.9661%; padding: 5px 0 0; padding-left: 34px; vertical-align: top; border-left: 1px solid #ccc; min-height: 84px; } #reservation .set .top .reservation--tel dl.ars { padding-top: 10px; } } #reservation .set .top .reservation--tel dl dt { color: #444; font-size: 1rem; font-weight: 500; line-height: 1; } #reservation .set .top .reservation--tel dl dt i { margin-right: 5px; } #reservation .set .top .reservation--tel dl dt a { color: #444; } @media (max-width: 1199px) { #reservation .set .top .reservation--tel dl dd { padding-top: 6px; } } @media (max-width: 767px) { #reservation .set .top .reservation--tel dl dd { padding-top: 0; } } #reservation .set .top .reservation--tel dl dd.point { color: #cd409f; font-size: 1.313rem; font-weight: 700; line-height: 1; margin-top: -2px; } #reservation .set .top .reservation--tel dl dd.point a { color: #cd409f; } @media (min-width: 1200px) { #reservation .set .top .reservation--tel dl.f { overflow: hidden; border-bottom: 1px solid #ccc; } #reservation .set .top .reservation--tel dl.f dt { float: left; margin-right: 17px; } #reservation .set .top .reservation--tel dl.f dd { float: left; vertical-align: top; } } #reservation .set .top .reservation--tel dl.m dd { margin-top: -5px; } #reservation .set .top .reservation--tel dl.b dd span { display: block; } @media (min-width: 1200px) { #reservation .set .top .reservation--tel dl.b dd { padding-left: 27px; } } @media (max-width: 767px) { #reservation .set .top .reservation--tel dl.b { display: block; } #reservation .set .top .reservation--tel dl.b dt { float: none; } #reservation .set .top .reservation--tel dl.b dd { float: none; padding-left: 27px; } #reservation .set .top .reservation--tel dl.b dd span { display: inline-block; margin-left: 10px; } } @media (max-width: 767px) { #reservation .set .top .reservation--tel dl { padding: 10px 0 0; width: auto; float: none; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #reservation .set .top .reservation--tel dl:nth-child(3) { display: none; } #reservation .set .top .reservation--tel dl dt { -ms-flex-preferred-size: 114px; flex-basis: 114px; } } #reservation .set .bottom { padding-top: 22px; clear: both; display: block; } #reservation .set .bottom:before, #reservation .set .bottom:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } @media (max-width: 767px) { #reservation .set .bottom { padding-top: 13px; } } #reservation .set .bottom .reservation--link1 { float: left; width: 370px; height: 330px; background-color: #02819c; padding: 29px 0px 0 0px; color: #ffffff; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--link1 { width: 100%; height: 80px; float: none; padding: 0; background-color: transparent; margin-bottom: 16px; } } #reservation .set .bottom .reservation--link1 h2 { color: #fff; font-size: 1.438rem; font-weight: 700; line-height: 1; letter-spacing: -0.021rem;margin-left:33px; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--link1 h2 { display: none; } } #reservation .set .bottom .reservation--link1 p { margin-top: 18px; color: #fff; font-size: 0.938rem; font-weight: 300; line-height: 1; letter-spacing: -0.009rem; margin-left:33px; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--link1 p { display: none; } } #reservation .set .bottom .reservation--link1 .btns { margin-top: 28px; overflow: hidden; text-align: center; font-size: 1.063rem; font-weight: 500; letter-spacing: -0.053rem; } #reservation .set .bottom .reservation--link1 .btns a { float: left; width: 50%;height: 140px; color: #fff; margin-bottom:15px } #reservation .set .bottom .reservation--link1 .btns a i { display: block; height: 100px; } #reservation .set .bottom .reservation--link1 .btns a i.reservation-4-ico1 { background: url(/static/nmc/img/main/reservation-4-ico1.png) center 10px no-repeat; } #reservation .set .bottom .reservation--link1 .btns a i.reservation-4-ico2 { background: url(/static/nmc/img/main/reservation-4-ico2.png) center 10px no-repeat; } #reservation .set .bottom .reservation--link1 .btns a + a { border-left: 1px solid #43a2b6; } #reservation .set .bottom .reservation--link1 .btns2{border-top: 1px solid #43a2b6; } #reservation .set .bottom .reservation--link1 .btns2 a{float: left; width: 50%; height:59px; text-align:center;color: #fff; line-height:59px;} #reservation .set .bottom .reservation--link1 .btns2 a + a { border-left: 1px solid #43a2b6; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--link1 .btns {float:left; width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 13px 0px 16px -4.5px; } #reservation .set .bottom .reservation--link1 .btns a { height: 80px; -webkit-box-flex: 1; padding:0; -ms-flex-positive: 1; flex-grow: 1; text-align: center; background-color: #02819c; color: #fff; font-size: 1.063rem; font-weight: 500; line-height: 1.38; letter-spacing: -0.053rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 4.5px; position: relative; } #reservation .set .bottom .reservation--link1 .btns a i {display: none} #reservation .set .bottom .reservation--link1 .btns2{ float:left;width: 50%; border-top:0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 13px -4.5px 16px 0px; } #reservation .set .bottom .reservation--link1 .btns2 a { height: 80px;padding:0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; text-align: center; background-color: #02819c; color: #fff; font-size: 1.063rem; font-weight: 500; line-height: 1.38; letter-spacing: -0.053rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 4.5px; position: relative; } } @media (max-width: 1199px) and (max-width: 767px) { #reservation .set .bottom .reservation--link1 .btns a { padding-left: 0; } #reservation .set .bottom .reservation--link1 .btns a i { display: none; } } @media (max-width: 767px){ #reservation .set .bottom .reservation--link1{height:auto} #reservation .set .bottom .reservation--link1 .btns,#reservation .set .bottom .reservation--link1 .btns2{float:none;width:100%;margin: 8px -4.5px 8px; } #reservation .set .bottom .reservation--link1 .btns a,#reservation .set .bottom .reservation--link1 .btns2 a{height: 60px; } } #reservation .set .bottom .reservation--link2 { position: relative; float: left; width: 250px; height: 330px; margin-left: 25px; background: #007db3; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--link2 { float: left; width: calc(100% - 360px - 18px); height: 226px; margin: 0; } #reservation .set .bottom .reservation--link2 ul li a { height: 45.2px !important; padding-top: 7px !important; } #reservation .set .bottom .reservation--link2 ul li a br{display:none;} } @media (max-width: 767px) { #reservation .set .bottom .reservation--link2 { width: calc(100% - 9px); float: none; margin-bottom: 20px; } } #reservation .set .bottom .reservation--link2 ul li a { height: 66px; display: block; width: 100%; color: #fff; padding-top: 17px;padding-left: 70px; font-weight: 500; background:url(/static/nmc/img/main/reservation-5-ico.png) no-repeat;background-position:20px 20px;} #reservation .set .bottom .reservation--link2 ul li.icon01 a{background-position:20px 20px;} #reservation .set .bottom .reservation--link2 ul li.icon02 a{background-position:20px -60px;} #reservation .set .bottom .reservation--link2 ul li.icon03 a{background-position:20px -140px;} #reservation .set .bottom .reservation--link2 ul li.icon04 a{background-position:20px -220px;} #reservation .set .bottom .reservation--link2 ul li.icon05 a{background-position:20px -300px;} @media (min-width: 768px) {#reservation .set .bottom .reservation--link2 ul li.icon01 a{line-height: 1.4em; padding-top:10px}} @media (max-width: 1199px) { #reservation .set .bottom .reservation--link2 ul li.icon01 a{background-position:20px 10px;} #reservation .set .bottom .reservation--link2 ul li.icon02 a{background-position:20px -70px;} #reservation .set .bottom .reservation--link2 ul li.icon03 a{background-position:20px -150px;} #reservation .set .bottom .reservation--link2 ul li.icon04 a{background-position:20px -230px;} #reservation .set .bottom .reservation--link2 ul li.icon05 a{background-position:20px -310px;} } #reservation .set .bottom .reservation--link2 ul li:nth-child(n+2) { border-top: 1px solid #67b2d2; } #reservation .set .bottom .reservation--popupzone { float: right; width: 527px; position: relative; } @media (max-width: 1199px) { #reservation .set .bottom .reservation--popupzone { width: 360px; margin-right: 9px; } } @media (max-width: 767px) { #reservation .set .bottom .reservation--popupzone { width: calc(100% - 9px); float: none; margin-top: 0; } } #reservation .set .bottom .reservation--popupzone--nav { position: absolute; right: 14px; bottom: 0; z-index: 1; } #reservation .set .bottom .reservation--popupzone--nav .dot { display: inline-block; } #reservation .set .bottom .reservation--popupzone--nav--Pause { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-stop.png) center center no-repeat; } #reservation .set .bottom .reservation--popupzone--nav--Play { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-play.png) center center no-repeat; } @media (max-width: 767px) { #reservation .set .bottom .reservation--popupzone a img { width: 100%; } } @media (max-width: 1199px) { #reservation .set .bottom .reservation--popupzone a img { width: 100%; } } .slick-dots-white li { display: inline-block; margin-right: 6px; } .slick-dots-white button { overflow: hidden; margin: 0; padding: 0; width: 14px; height: 14px; border-radius: 15px; border: 1px solid #fff; background-color: transparent; color: transparent; vertical-align: top; } .slick-dots-white .slick-active button { background-color: #ffffff; } #publicHealth { padding: 130px 0 127px; background-size: 100% 100%; background-color: #618ab1; background-repeat: no-repeat; } @media (min-width: 1200px) { #publicHealth { background: #618ab1 url(/static/nmc/img/main/health-bg.jpg) center 0 no-repeat; background-size: 100% 100%; min-height: 100vh; } } @media (max-width: 1199px) { #publicHealth { padding: 80px 30px 60px; background-size: auto; background-image: url(/static/nmc/img/main/health-bg-rt.png), url(/static/nmc/img/main/health-bg-bl.png); background-position: right top, left bottom; } } @media (max-width: 767px) { #publicHealth { padding: 60px 20px 26px; } } #publicHealth > .set { max-width: 1200px; margin: 0 auto; } #publicHealth > .set > .title { margin-bottom: 18px; } #publicHealth > .set > .title h1 { margin: 0 0 14px; color: #fff; font-family: 'Nanum Square OTFEB'; font-size: 45px; font-weight: 800; line-height: 1; } #publicHealth > .set > .title h1 .vline { font-size: 25px; } #publicHealth > .set > .title h1 .s { font-size: 25px; } @media (max-width: 767px) { #publicHealth > .set > .title h1 { font-size: 24px; } #publicHealth > .set > .title h1 .vline { font-size: 24px; } #publicHealth > .set > .title h1 .s { font-size: 14px; } } #publicHealth > .set > .title p { color: #fff; font-size: 0.938rem; font-weight: 300; line-height: 1; letter-spacing: -0.024rem; } @media (max-width: 767px) { #publicHealth > .set > .title p { display: none; } } #publicHealth .topMid-set { position: relative; } @media (min-width: 1200px) { #publicHealth .topMid-set { height: 520px; } } @media (max-width: 1199px) { #publicHealth .topMid-set { display: block; } #publicHealth .topMid-set:before, #publicHealth .topMid-set:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } } @media (min-width: 1200px) { #publicHealth .top { float: left; width: 784px; } } @media (max-width: 1199px) { #publicHealth .top { display: block; margin-bottom: 20px; } #publicHealth .top:before, #publicHealth .top:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } } @media (max-width: 767px) { #publicHealth .top { margin-bottom: 0; } } @media (min-width: 1200px) { #publicHealth .mid { float: left; width: 784px; margin-top: 30px; } } @media (max-width: 1199px) { #publicHealth .mid { float: left; width: 44.63277%; } } @media (max-width: 767px) { #publicHealth .mid { float: none; width: auto; } } #publicHealth .carendar { background-color: #ffffff; } @media (min-width: 1200px) { #publicHealth .carendar { position: absolute; right: 0; top: 0; width: 377px; height: 520px; } } @media (max-width: 1199px) { #publicHealth .carendar { position: relative; float: right; width: 52.25989%; } } @media (max-width: 767px) { #publicHealth .carendar { width: auto; float: none; margin-top: 10px; } #publicHealth .carendar * { display: none; } #publicHealth .carendar > a { display: block; padding: 23px 0; text-align: center; background-color: #ffffff; color: #444; font-size: 1.125rem; font-weight: 700; line-height: 1; letter-spacing: -0.056rem; } #publicHealth .carendar > a i { background: url(/static/nmc/img/main/carendar-ico.png) 0 0 no-repeat; display: inline-block; width: 24px; height: 24px; vertical-align: middle; margin-right: 6px; } } #publicHealth .carendar h2 { color: #000; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; height: 68px; padding-top: 24px; } @media (min-width: 1200px) { #publicHealth .carendar h2 { text-align: center; } } @media (max-width: 1199px) { #publicHealth .carendar h2 { padding-left: 24px; } } #publicHealth .carendar .carendar--ctrl { position: relative; color: #363636; font-family: 'Nanum Square'; font-size: 1.375rem; font-weight: 700; line-height: 1; letter-spacing: -0.069rem; background-color: #e6e6e6; text-align: center; height: 65px; padding-top: 24px; } #publicHealth .carendar .carendar--ctrl button { position: absolute; top: 0; width: 45px; height: 65px; } #publicHealth .carendar .carendar--ctrl--prev { left: 0; background: url(/static/nmc/img/main/ctrl-prev-13x24.png) center center no-repeat; } #publicHealth .carendar .carendar--ctrl--next { right: 0; background: url(/static/nmc/img/main/ctrl-next-13x24.png) center center no-repeat; } @media (min-width: 1200px) { #publicHealth .carendar .carendar--table-cal { padding-bottom: 15px; border-bottom: 1px solid #ccc; } } @media (max-width: 1199px) { #publicHealth .carendar .carendar--table-cal { height: 310px; } } #publicHealth .carendar .carendar--table-cal table { width: 100%; table-layout: fixed; } #publicHealth .carendar .carendar--table-cal table thead th { height: 53px; border-bottom: 1px solid #e6e6e6; } #publicHealth .carendar .carendar--table-cal table td { text-align: center; } #publicHealth .carendar .carendar--table-cal table [aria-disabled=true] { color: #d2d2d2 !important; } #publicHealth .carendar .carendar--table-cal table tr td { height: 40px; } #publicHealth .carendar .carendar--table-cal table tr td:first-child { color: #F06A6A; } #publicHealth .carendar .carendar--table-cal table tr td:last-child { color: #7A96B8; } #publicHealth .carendar .carendar--table-cal table tr td a { display: block; width: 37px; height: 37px; border-radius: 30px; margin: auto; line-height: 37px; } #publicHealth .carendar .carendar--table-cal table tr td a.classOk { background-color: #b75294; color: #ffffff; } #publicHealth .carendar .carendar--table-cal table tr td .day { display: block; margin: auto; width: 37px; height: 37px; line-height: 29px; border-radius: 30px; border: 4px solid #0d93df; color: #363636; } #publicHealth .carendar .deco { position: absolute; } @media (min-width: 1200px) { #publicHealth .carendar .deco { padding-bottom: 35px; bottom: 0; width: 100%; text-align: center; } } @media (max-width: 1199px) { #publicHealth .carendar .deco { top: 25px; right: 13px; } } #publicHealth .carendar .deco span { display: inline-block; margin-left: 22px; } @media (max-width: 1199px) { #publicHealth .carendar .deco span { margin-left: 8px; } } #publicHealth .carendar .deco i { border-radius: 20px; display: inline-block; width: 26px; height: 26px; vertical-align: middle; margin-right: 8px; } @media (max-width: 1199px) { #publicHealth .carendar .deco i { width: 17px; height: 17px; margin-right: 4px; } } #publicHealth .carendar .deco .today { border: 4px solid #0d93df; } #publicHealth .carendar .deco .classOk { background-color: #b75294; } #publicHealth .bottom { margin-top: 31px; clear: both; } @media (max-width: 1199px) { #publicHealth .bottom { margin-top: 20px; } } #publicHealth .mobile-btns { display: none; } @media (max-width: 767px) { #publicHealth .mobile-btns { display: block; display: block; margin-bottom: 10px; } #publicHealth .mobile-btns:before, #publicHealth .mobile-btns:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #publicHealth .mobile-btns a { float: left; width: calc(50% - 5px); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #ffffff; color: #444; font-size: 1rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.015rem; height: 90px; } #publicHealth .mobile-btns a i.findPublicMedicalInstitution-ico { background: url(/static/nmc/img/main/findPublicMedicalInstitution-ico.png) 0 0 no-repeat; display: inline-block; width: 19px; height: 20px; margin-right: 18px; vertical-align: middle; } #publicHealth .mobile-btns a i.findEmergencyRoom-ico { background: url(/static/nmc/img/main/findEmergencyRoom-ico.png) 0 0 no-repeat; width: 24px; height: 24px; display: inline-block; vertical-align: middle; margin-right: 13px; } #publicHealth .mobile-btns a + a { float: right; } } #publicHealth .findPublicMedicalInstitution { position: relative; float: left; width: 377px; height: 245px; padding: 35px 0 0 41px; background: #fff url(/static/nmc/img/main/health--publichealthcare-bg.jpg) right bottom no-repeat; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } @media (max-width: 1199px) { #publicHealth .findPublicMedicalInstitution { width: 44.77401%; height: 180px; padding: 25px 0 0 25px; background-size: contain; } } @media (max-width: 767px) { #publicHealth .findPublicMedicalInstitution { display: none; } } #publicHealth .findPublicMedicalInstitution h2 { margin-bottom: 16px; color: #444; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } @media (max-width: 1199px) { #publicHealth .findPublicMedicalInstitution h2 { margin-bottom: 10px; } } #publicHealth .findPublicMedicalInstitution p { display: block; color: #666; font-size: 0.938rem; font-weight: 400; line-height: 1.67; letter-spacing: -0.047rem; } @media (max-width: 1199px) { #publicHealth .findPublicMedicalInstitution p { line-height: 1.57; } } #publicHealth .findPublicMedicalInstitution a { margin-top: 19px; display: inline-block; padding: 7px 12px; background-color: #747474; color: #fff; font-size: 0.875rem; font-weight: 300; line-height: 1; letter-spacing: -0.044rem; border-radius: 3px; } @media (max-width: 1199px) { #publicHealth .findPublicMedicalInstitution a { margin-top: 15px; } } #publicHealth .findPublicMedicalInstitution a::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #publicHealth .freehealthclass { position: relative; float: left; width: 377px; height: 245px; margin-left: 30px;background:#fff; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } @media (max-width: 1199px) { #publicHealth .freehealthclass { width: 52.25989%; float: right; margin-left: 0; height: 180px; background-image: none; } } @media (max-width: 767px) { #publicHealth .freehealthclass { width: 100%; } } #publicHealth .freehealthclass h2 { color: #444; font-size: 1rem; font-weight: 700; line-height: 1; letter-spacing: -0.05rem; margin: 0 22px 0 30px; height: 52px; border-bottom: 1px solid #ccc; padding-top: 21px; } @media (max-width: 1199px) { #publicHealth .freehealthclass h2 { border: none; margin: 0 0 0 45px; height: auto; padding-top: 31px; } } @media (max-width: 767px) { #publicHealth .freehealthclass h2 { margin-left: 20px; padding-top: 14px; } } #publicHealth .freehealthclass .slick-arrow { position: absolute; top: 37px; width: 13px; height: 24px; overflow: hidden; color: transparent; z-index: 1; } #publicHealth .freehealthclass .slick-arrow.slick-prev { left: 22px; background: url(/static/nmc/img/main/ctrl-prev-13x24.png) 0 0 no-repeat; } @media (max-width: 1199px) { #publicHealth .freehealthclass .slick-arrow.slick-prev { left: 8px; } } #publicHealth .freehealthclass .slick-arrow.slick-next { right: 22px; background: url(/static/nmc/img/main/ctrl-next-13x24.png) 0 0 no-repeat; } @media (max-width: 1199px) { #publicHealth .freehealthclass .slick-arrow.slick-next { right: 8px; } } #publicHealth .freehealthclass--ctrl { position: absolute; right: 20px; top: 20px; line-height: 0; z-index: 10; } @media (max-width: 767px) { #publicHealth .freehealthclass--ctrl { top: 14px; right: 14px; } } #publicHealth .freehealthclass--ctrl .page { color: #444; font-size: 1rem; font-weight: 400; line-height: 16px; letter-spacing: -0.05rem; } #publicHealth .freehealthclass--ctrl button { display: inline-block; width: 13px; height: 16px; } #publicHealth .freehealthclass--ctrl--stop { background: url(/static/nmc/img/main/ctrl-gray-stop.png) center center no-repeat; } #publicHealth .freehealthclass--ctrl--play { background: url(/static/nmc/img/main/ctrl-gray-play.png) center center no-repeat; } #publicHealth .freehealthclass--list .nodata { border: none; } #publicHealth .freehealthclass--list .item { position: relative; } #publicHealth .freehealthclass--list .title { padding: 18px 57px 10px; } @media (max-width: 1199px) { #publicHealth .freehealthclass--list .title { padding: 12px 46px 10px; } } #publicHealth .freehealthclass--list .title a { display: block; color: #007dc4; font-size: 1.375rem; font-weight: 700; line-height: 1.27; letter-spacing: -0.069rem; max-height: 54px; height: 54px; overflow: hidden; } #publicHealth .freehealthclass--list .title a::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #publicHealth .freehealthclass--list dl { margin: 0 57px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } #publicHealth .freehealthclass--list dl dt { display: inline; } #publicHealth .freehealthclass--list dl dd { display: inline; } @media (max-width: 1199px) { #publicHealth .freehealthclass--list dl { margin: 0 46px; } #publicHealth .freehealthclass--list dl:nth-child(3), #publicHealth .freehealthclass--list dl:nth-child(2) { display: none; } } #publicHealth .findEmergencyRoom { position: relative; padding: 35px 0 0 41px; background: #fff url(/static/nmc/img/main/health--119-bg.jpg) right bottom no-repeat; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } @media (min-width: 1200px) { #publicHealth .findEmergencyRoom { float: left; width: 377px; height: 245px; } } @media (max-width: 1199px) { #publicHealth .findEmergencyRoom { height: 183px; padding: 25px 0 0 25px; background-size: contain; } } @media (max-width: 767px) { #publicHealth .findEmergencyRoom { display: none; } } #publicHealth .findEmergencyRoom h2 { margin-bottom: 16px; color: #444; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } #publicHealth .findEmergencyRoom p { display: block; color: #666; font-size: 0.938rem; font-weight: 400; line-height: 1.67; letter-spacing: -0.047rem; } @media (max-width: 1199px) { #publicHealth .findEmergencyRoom p { line-height: 1.57; } } #publicHealth .findEmergencyRoom a { margin-top: 19px; display: inline-block; padding: 7px 12px; background-color: #747474; color: #fff; font-size: 0.875rem; font-weight: 300; line-height: 1; letter-spacing: -0.044rem; border-radius: 3px; } #publicHealth .findEmergencyRoom a::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } @media (min-width: 1200px) { #publicHealth .MoonlightChildrenHospital { float: left; width: 377px; margin-left: 30px; } } @media (max-width: 1199px) { #publicHealth .MoonlightChildrenHospital { margin-top: 20px; } } @media (max-width: 767px) { #publicHealth .MoonlightChildrenHospital { margin-top: 10px; } } #publicHealth .MoonlightChildrenHospital a { display: block; background: #25294d url(/static/nmc/img/main/health--chiled-bg.jpg) right 0 no-repeat; padding: 34px; height: 110px; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } @media (max-width: 767px) { #publicHealth .MoonlightChildrenHospital a { height: 90px; width: calc(50% - 5px); float: right; padding: 25px 0 0 65px; background: #25294d url(/static/nmc/img/main/MoonlightChildrenHospital-mobile.png) 8px center no-repeat; } } #publicHealth .MoonlightChildrenHospital a .title { display: block; margin-top: 11px; color: #ecc93c; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } @media (max-width: 767px) { #publicHealth .MoonlightChildrenHospital a .title { margin-top: 0; color: #ecc93c; font-size: 1rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.015rem; } } #publicHealth .MoonlightChildrenHospital a .txt { display: block; color: #fff; font-size: 0.938rem; font-weight: 400; line-height: 1; letter-spacing: -0.047rem; } #publicHealth .MoonlightChildrenHospital2 a { display: block; background: #fff url(/static/nmc/img/common/health--chiled-bg.png) right 20px top 25px no-repeat; padding: 20px 34px 34px 34px ; height: 110px; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } #publicHealth .MoonlightChildrenHospital2 a .title { display: block; margin-top: 6px; color: #019aa1; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } #publicHealth .MoonlightChildrenHospital2 a .txt { display: block; color: #747474; font-size: 0.938rem; font-weight: 400; line-height: 1.4; letter-spacing: -0.047rem; } @media (min-width: 1200px) { #publicHealth .MoonlightChildrenHospital2 { float: left; width: 377px; margin-left: 30px; } } @media (max-width: 1199px) { #publicHealth .MoonlightChildrenHospital2 { margin-top: 20px; } } @media (max-width: 767px) { #publicHealth .MoonlightChildrenHospital2 { margin-top: 10px; } #publicHealth .MoonlightChildrenHospital2 a { height: 90px; width: calc(50% - 5px); float: right; padding: 25px 0 0 90px; background: #fff url(/static/nmc/img/common/health--chiled-bg.png) 8px center no-repeat; background-size:70px;} #publicHealth .MoonlightChildrenHospital2 a .title { margin-top: 0; font-size: 1rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.015rem; } #publicHealth .MoonlightChildrenHospital2 a .txt{display: none;} } @media (max-width: 767px) { #publicHealth .MoonlightChildrenHospital a .txt { display: none; } } @media (min-width: 1200px) { #publicHealth .findAed { float: left; width: 377px; margin-left: 30px; margin-top: 25px; } } @media (max-width: 1199px) { #publicHealth .findAed { margin-top: 20px; } } @media (max-width: 767px) { #publicHealth .findAed { margin-top: 0; width: calc(50% - 5px); } } #publicHealth .findAed a { display: block; height: 110px; padding: 34px; background: #fff url(/static/nmc/img/main/health--aed.jpg) right bottom no-repeat; -webkit-box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); box-shadow: 0.5rem 0.813rem 0.75rem rgba(0, 0, 0, 0.07); } @media (max-width: 767px) { #publicHealth .findAed a { height: 90px; background: #fff none; padding: 22px; } } #publicHealth .findAed a .title { display: block; margin-bottom: 13px; color: #444; font-size: 1.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.062rem; } @media (max-width: 767px) { #publicHealth .findAed a .title { font-size: 1rem; line-height: 1.25; letter-spacing: -0.015rem; } } #publicHealth .findAed a .txt { display: block; color: #666; font-size: 0.938rem; font-weight: 400; line-height: 1; letter-spacing: -0.047rem; } @media (max-width: 767px) { #publicHealth .findAed a .txt { display: none; } } #publicHealth .publicHealth--quick { border: 3px solid #fff; text-align: center; } @media (min-width: 1200px) { #publicHealth .publicHealth--quick { background-color: #487ba5; } } @media (max-width: 767px) { #publicHealth .publicHealth--quick { text-align: center; overflow: hidden; } } #publicHealth .publicHealth--quick li { display: inline-block; margin: 0 46px; } @media (max-width: 1199px) { #publicHealth .publicHealth--quick li { width: calc(50% - 4px); margin: 0; } } @media (max-width: 767px) { #publicHealth .publicHealth--quick li { vertical-align: top; } } #publicHealth .publicHealth--quick li a { padding: 13px 0; display: block; color: #ffffff; } @media (max-width: 767px) { #publicHealth .publicHealth--quick li a { padding: 8px 0; font-size: 0.938rem; font-weight: 500; letter-spacing: -0.047rem; white-space: nowrap; } #publicHealth .publicHealth--quick li a.f { width: auto; } } #publicHealth .publicHealth--quick li a i { display: inline-block; height: 33px; vertical-align: middle; margin-right: 14px; } @media (max-width: 767px) { #publicHealth .publicHealth--quick li a i { display: none; } } #publicHealth .publicHealth--quick li a i.publicHealth--quick-ico-1 { width: 22px; background: url(/static/nmc/img/main/publicHealth--quick-ico-1.png) center center no-repeat; } #publicHealth .publicHealth--quick li a i.publicHealth--quick-ico-2 { width: 48px; background: url(/static/nmc/img/main/publicHealth--quick-ico-2.png) center center no-repeat; } #publicHealth .publicHealth--quick li a i.publicHealth--quick-ico-3 { width: 23px; background: url(/static/nmc/img/main/publicHealth--quick-ico-3.png) center center no-repeat; } #publicHealth .publicHealth--quick li a i.publicHealth--quick-ico-4 { width: 27px; background: url(/static/nmc/img/main/publicHealth--quick-ico-4.png) center center no-repeat; } #publicHealth .publicHealth--quick li a i.publicHealth--quick-ico-5 { width: 30px; background: url(/static/nmc/img/common/publicHealth--quick-ico-5.png) center center no-repeat; } #nationalMedical { background: #618ab1 url(/static/nmc/img/main/center-bg.jpg) center 0 no-repeat; padding: 124px 0 100px; background-size: 100% 100%; } @media (min-width: 1200px) { #nationalMedical { min-height: 835px; height: 100vh; } } @media (max-width: 1199px) { #nationalMedical { padding: 80px 30px 60px; display: block; } #nationalMedical:before, #nationalMedical:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } } @media (max-width: 767px) { #nationalMedical { padding: 60px 20px 20px; background: url(/static/nmc/img/main/center-bg-mobile.jpg) center 0 no-repeat; background-size: cover; } } #nationalMedical > .set { max-width: 1200px; margin: 0 auto; } #nationalMedical > .set > .title { margin-bottom: 18px; } #nationalMedical > .set > .title h1 { margin: 0 0 14px; color: #fff; font-family: 'Nanum Square OTFEB'; font-size: 45px; font-weight: 800; line-height: 1; } #nationalMedical > .set > .title h1 .vline { font-size: 25px; } #nationalMedical > .set > .title h1 .s { font-size: 25px; } @media (max-width: 767px) { #nationalMedical > .set > .title h1 { font-size: 24px; white-space: nowrap; } #nationalMedical > .set > .title h1 .vline { font-size: 24px; } #nationalMedical > .set > .title h1 .s { font-size: 14px; } } #nationalMedical > .set > .title p { color: #fff; font-size: 0.938rem; font-weight: 300; line-height: 1; letter-spacing: -0.024rem; } @media (max-width: 767px) { #nationalMedical > .set > .title p { display: none; } } #nationalMedical .notice { position: relative; height: 255px; } @media (max-width: 767px) { #nationalMedical .notice { height: 200px; } } #nationalMedical .notice .set { float: left; width: 25%; } #nationalMedical .notice .set .t { position: relative; z-index: 1; } #nationalMedical .notice .set button { position: relative; display: block; width: 100%; height: 51px; color: #666; font-size: 1.25rem; letter-spacing: -0.062rem; background-color: #eaeaea; line-height: 1; padding-top: 0; padding-bottom: 4px; text-indent: -20px; } @media (max-width: 767px) { #nationalMedical .notice .set button { font-size: 1rem; height: 40px; padding-bottom: 0; text-indent: -10px; } #nationalMedical .notice .set button .m { display: none; } } #nationalMedical .notice .set a.more { display: none; position: absolute; right: 0; top: 0; width: 40px; height: 50px; color: #ffffff; text-align: center; font-size: 1.375rem; font-weight: 700; line-height: 50px; } #nationalMedical .notice .set a.more::before { content: '+'; } @media (max-width: 767px) { #nationalMedical .notice .set a.more { font-size: 1.125rem; height: 40px; line-height: 40px; width: 30px; } } #nationalMedical .notice .set ul { display: none; position: absolute; } @media (min-width: 1200px) { #nationalMedical .notice .set ul { top: 70px; left: -10px; width: calc(100% + 20px); } } @media (max-width: 1199px) { #nationalMedical .notice .set ul { top: 51px; left: 0; width: 100%; padding: 22px 0 0 24px; background-color: #ffffff; height: 204px; } } @media (max-width: 767px) { #nationalMedical .notice .set ul { top: 40px; height: 160px; } } @media (min-width: 1200px) { #nationalMedical .notice .set ul li { padding: 0 10px; float: left; width: 25%; } } #nationalMedical .notice .set ul li a { position: relative; display: block; line-height: 1; } @media (min-width: 1200px) { #nationalMedical .notice .set ul li a { padding: 21px 14px 0 29px; background-color: #ffffff; height: 185px; } #nationalMedical .notice .set ul li a span { display: block; } #nationalMedical .notice .set ul li a .title { color: #222; font-size: 1.125rem; font-weight: 700; line-height: 1.44; letter-spacing: -0.028rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #nationalMedical .notice .set ul li a .title em { font-weight: inherit; padding-right: 5px; -ms-flex-preferred-size: calc(100% - 20px); flex-basis: calc(100% - 20px); max-height: 50px; overflow: hidden; } #nationalMedical .notice .set ul li a .title i { -ms-flex-preferred-size: 20px; flex-basis: 20px; } #nationalMedical .notice .set ul li a .text { margin-top: 12px; color: #777; font-size: 0.938rem; font-weight: 300; line-height: 1.6; letter-spacing: -0.024rem; max-height: 72px; overflow: hidden; } #nationalMedical .notice .set ul li a .l + .text { height: 48px; } #nationalMedical .notice .set ul li a .date { position: absolute; left: 29px; bottom: 27px; color: #666; font-size: 0.875rem; font-weight: 300; line-height: 1; } } @media (max-width: 1199px) { #nationalMedical .notice .set ul li a { height: 39px; } #nationalMedical .notice .set ul li a span { display: block; } #nationalMedical .notice .set ul li a .title { color: #222; font-size: 1.125rem; font-weight: 500; line-height: 1; letter-spacing: -0.028rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: calc(100% - 86px); height: 100%; } #nationalMedical .notice .set ul li a .title em { font-weight: inherit; -ms-flex-preferred-size: calc(100% - 20px); flex-basis: calc(100% - 20px); } #nationalMedical .notice .set ul li a .title i { -ms-flex-preferred-size: 20px; flex-basis: 20px; margin-right: 10px; } #nationalMedical .notice .set ul li a .text { display: none; } #nationalMedical .notice .set ul li a .date { position: absolute; right: 31px; top: 12px; color: #666; font-size: 0.875rem; font-weight: 300; line-height: 1; } } @media (max-width: 767px) { #nationalMedical .notice .set ul li a { height: 32px; } #nationalMedical .notice .set ul li a span { display: block; } #nationalMedical .notice .set ul li a .title { color: #222; font-size: 1rem; font-weight: 500; line-height: 1; letter-spacing: -0.028rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: calc(100%); height: 100%; } #nationalMedical .notice .set ul li a .title em { font-weight: inherit; -ms-flex-preferred-size: calc(100% - 20px); flex-basis: calc(100% - 20px); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } #nationalMedical .notice .set ul li a .title i { -ms-flex-preferred-size: 20px; flex-basis: 20px; margin-right: 10px; } #nationalMedical .notice .set ul li a .date { display: none; } } #nationalMedical .notice .set.active button { color: #ffffff; background-color: #129deb; } #nationalMedical .notice .set.active button::before { content: ''; position: absolute; left: calc(50% - 7px); bottom: -8px; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 8px solid #129deb; } #nationalMedical .notice .set.active a.more, #nationalMedical .notice .set.active ul { display: block; } #nationalMedical .nationalMedical--popupzone { position: relative; } @media (min-width: 1200px) { #nationalMedical .nationalMedical--popupzone { margin-top: 26px; float: left; width: 590px; } } @media (max-width: 1199px) { #nationalMedical .nationalMedical--popupzone { margin-top: 20px; } } @media (max-width: 767px) { #nationalMedical .nationalMedical--popupzone { margin-top: 10px; } } #nationalMedical .nationalMedical--popupzone--nav { position: absolute; left: 28px; bottom: 11px; z-index: 1; } #nationalMedical .nationalMedical--popupzone--nav .dot { display: inline-block; } #nationalMedical .nationalMedical--popupzone--nav--Pause { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-stop.png) center center no-repeat; } #nationalMedical .nationalMedical--popupzone--nav--Play { vertical-align: top; display: inline-block; width: 17px; height: 14px; background: url(/static/nmc/img/main/ctrl-play.png) center center no-repeat; } #nationalMedical .nationalMedical--popupzone a img { width: 100%; } #nationalMedical .nationalMedical--quick { float: left; background-color: #ffffff; } @media (min-width: 1200px) { #nationalMedical .nationalMedical--quick { margin-top: 26px; margin-left: 24px; padding: 0 23px; width: 282px; height: 240px; } } @media (max-width: 1199px) { #nationalMedical .nationalMedical--quick { margin-top: 20px; width: 57.06215%; padding: 22px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick { margin-top: 10px; width: 56.25%; display: block; padding: 9px 0; } } #nationalMedical .nationalMedical--quick a { display: block; height: 79px; color: #333; font-size: 1.125rem; font-weight: 700; line-height: 2.17; text-transform: uppercase; letter-spacing: -0.017rem; background-color: #ffffff; } @media (max-width: 1199px) { #nationalMedical .nationalMedical--quick a { padding: 12px 0 23px; height: auto; text-align: center; line-height: 1; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a { display: block; height: 34px; color: #333; font-size: 0.938rem; font-weight: 500; line-height: 1.13; letter-spacing: -0.014rem; padding: 0; line-height: 34px; text-align: left; } } #nationalMedical .nationalMedical--quick a i { display: inline-block; width: 96px; height: 79px; background-position: center center; background-repeat: no-repeat; vertical-align: top; } @media (max-width: 1199px) { #nationalMedical .nationalMedical--quick a i { height: 94px; width: auto; display: block; } } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a i { height: 34px; display: inline-block; width: 60px; } } #nationalMedical .nationalMedical--quick a i.ico-nationalMedical1 { background-image: url(/static/nmc/img/main/ico-nationalMedical1.png); } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a i.ico-nationalMedical1 { background-size: auto 17px; } } #nationalMedical .nationalMedical--quick a i.ico-nationalMedical2 { background-image: url(/static/nmc/img/main/ico-nationalMedical2.png); } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a i.ico-nationalMedical2 { background-size: auto 26px; } } #nationalMedical .nationalMedical--quick a i.ico-nationalMedical3 { background-image: url(/static/nmc/img/main/ico-nationalMedical3.png); } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a i.ico-nationalMedical3 { background-size: auto 18px; } } #nationalMedical .nationalMedical--quick a span { display: inline-block; vertical-align: middle; } @media (min-width: 1200px) { #nationalMedical .nationalMedical--quick a span { line-height: 79px; } } @media (min-width: 1200px) { #nationalMedical .nationalMedical--quick a + a { border-top: 1px solid #ccc; } } @media (max-width: 1199px) { #nationalMedical .nationalMedical--quick a + a { border-left: 1px solid #ccc; } } @media (max-width: 767px) { #nationalMedical .nationalMedical--quick a + a { border: none; } } #nationalMedical .magazine { float: right; } @media (min-width: 1200px) { #nationalMedical .magazine { margin-top: 26px; } } @media (max-width: 1199px) { #nationalMedical .magazine { width: 40.11299%; margin-top: 20px; } } @media (max-width: 767px) { #nationalMedical .magazine { width: 40.625%; margin-top: 10px; } } #nationalMedical .magazine a { display: block; position: relative; color: #ffffff; background-position: center center; background-size: cover; } @media (min-width: 1200px) { #nationalMedical .magazine a { width: 284px; height: 240px; } } @media (max-width: 1199px) { #nationalMedical .magazine a { height: 193px; background-size: cover; } } @media (max-width: 767px) { #nationalMedical .magazine a { height: 120px; } } #nationalMedical .magazine a .set { position: absolute; bottom: 0; width: 100%; padding: 26px 18px; background-color: rgba(52, 97, 135, 0.85); line-height: 1; } @media (max-width: 767px) { #nationalMedical .magazine a .set { padding: 8px 15px; } } #nationalMedical .magazine a .set span { display: block; } #nationalMedical .magazine a .set .t1 { color: #fff; font-size: 1.125rem; font-weight: 700; letter-spacing: -0.028rem; } @media (max-width: 767px) { #nationalMedical .magazine a .set .t1 { display: none; } } #nationalMedical .magazine a .set .t2 { margin-top: 11px; color: #fff; font-size: 0.938rem; font-weight: 300; letter-spacing: -0.024rem; } @media (max-width: 767px) { #nationalMedical .magazine a .set .t2 { margin-top: 0; line-height: 1.47; } } .ico-new { display: inline-block; width: 20px; height: 19px; line-height: 20px; vertical-align: top; border-radius: 2px; background-color: #cf61aa; text-align: center; border-radius: 2px; color: #fff; font-family: 'Nanum Square OTFEB'; font-size: 0.875rem; font-weight: 400; } .ico-new::before { content: 'N'; } .footer-sitemap { display: none; } .spot { display: none; } @media (max-width: 1199px) { img.pc { display: none; } } img.mobile { display: none; } @media (max-width: 1199px) { img.mobile { display: block; } } /*# sourceMappingURL=nmcmain.css.map */