﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
  color: #0366d6;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  /* Margin bottom by footer height */
  
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px; /* Vertically center the text there */
}




/* Hiwebnet Kiosk styles
-------------------------------------------------- */
.hwn_carousel{
  user-select: none;
}

.bg_orange_very_light{background-color: #FBF4E3; color:#EF7D3E;}
.bg_orange_light{background-color: #F4A67A;}
.bg_orange{background-color: #EF7D3E; color:#ffffff;}
.bg_orange_dark{background-color: #D26931; color:#ffffff;}
.color_orange_very_light{color: #FBF4E3;}
.color_orange_light{color: #F4A67A;}
.color_orange, .mdh_flow_list ul li{color: #EF7D3E;}
.color_orange_dark{color: #D26931;}

.bg_yellow_light{background-color: #F6CA58;}
.bg_yellow{background-color: #EDAF17; color:#ffffff;}
.bg_yellow_dark{background-color: #C59216; color:#ffffff;}
.color_yellow_light{color: #F6CA58;}
.color_yellow{color: #EDAF17;}
.color_yellow_dark{color: #C59216;}

.bg_green_very_light{background-color: #E2EEE6; color:#27A350;}
.bg_green_light{background-color: #91CC9C; color:#ffffff;}
.bg_green{background-color: #27A350; color:#ffffff;}
.color_green_very_light{color: #E2EEE6;}
.color_green_light{color: #91CC9C;}
.color_green{color: #27A350;}

.bg_blue_light{background-color: #E5E7EE; color:#162A4F;}
.bg_blue{background-color: #3256A6; color:#ffffff;}
.bg_blue_dark{background-color: #192A51; color:#ffffff;}
.color_blue_light{color: #E5E7EE;}
.color_blue{color: #3256A6;}
.color_blue_dark{color: #192A51;}



.vh-100{ 
  height: 100vh !important;
}

.carousel .carousel-item .row .col-12 img {
    height: 50vh !important;
}

.hwn_carousel{ }
.hwn_pg {width: 100vw; height: 100vh; position: relative; padding : 2.6vw 2.0vh;}
.hwn_page_01 {padding:0 !important}
.hwn_pg .hwn_pg_in{width:100%; height: 100%; position: relative;}
.hwn_pg .hwn_pg_in .main_title,.hwn_pg .hwn_pg_in .main_logo, .hwn_pg .hwn_pg_in .main_img, .hwn_pg .hwn_pg_in .mdh_icon_list{position: absolute;}
.hwn_pg .hwn_pg_in .main_title{width: 40vw; left:10vw; top: 13vh;}
.hwn_pg .hwn_pg_in .main_logo{width: 80vw; left:10vw; top : 20vh; }
.hwn_pg .hwn_pg_in .main_img{width: 40vh; bottom: 8vh; left:50%; transform:translateX(-50%); z-index: 101;}
.hwn_pg .hwn_pg_in .mdh_icon_list{height: 17vh; bottom: 23vh; right:0vw; padding-left:140vw; margin-right: 120vw;   z-index: 100;}

.mdh_icon_list.animate__animated.animate__slideInRight {
  animation-duration: 20s;
  animation-timing-function: linear;
}

/* .hosp_logo{height: 2.2vh; position: fixed; top:2vh; left: 2.6vw;} */

.hosp_logo{
  position: fixed;
  top: 1vh;
  left: 1.6vw;
  width: 12vh;
  height: 5vh;
}
.hosp_logo .logo_inner{
  display: block; 
  width: 100%;
  height: 100%;
  color: rgba(0, 0, 0,0%);
  background: no-repeat top center url('../resources/hospital/default/images/hosp_logo_white.png'); 
  background-size: 100%;
}
.hosp_logo.logo_basic .logo_inner{background-image: url('../resources/hospital/default/images/hosp_logo.png'); }
.hosp_logo.logo_white .logo_inner{background-image: url('../resources/hospital/default/images/hosp_logo_white.png'); }
.hosp_logo.logo_orange .logo_inner{background-image: url('../resources/hospital/default/images/hosp_logo_orange.png'); }
.hosp_logo.logo_green .logo_inner{background-image: url('../resources/hospital/default/images/hosp_logo_green.png'); }
.hosp_logo.logo_blue .logo_inner{background-image: url('../resources/hospital/default/images/hosp_logo_blue.png'); }


ul, li{list-style: none; padding-left: 0;}

.type_1{
  top: 24vh;
  position: absolute;
  left: 15%;
}
.type_1 li{
  font-size: 4.5vh;
  font-weight: 900;
  line-height: 13vh;
}
.hwn_page_02{}
.hwn_page_02 .type_1 li{
  text-shadow: 4px 4px 8px rgba(0, 0, 0, 30%);
  
}

.hi{content: " ";
  display: inline-block;
  width: 7vh;
  height: 7vh;
  background-size: 100% 100%;
  margin-bottom: -2.5vh;
  margin-left: 3vw;}
.hi_medical_appointment{background-image: url('../resources/hospital/default/images/icons/medical-appointment_icon.png');}
.hi_diagnosis{background-image: url('../resources/hospital/default/images/icons/diagnosis_icon.png');}
.hi_donate{background-image: url('../resources/hospital/default/images/icons/donate_icon.png');}

.hwn_page_02 .animate__animated.animate__backInLeft.step_01 { --animate-duration: 1s; }
.hwn_page_02 .animate__animated.animate__backInLeft.step_02 { animation-delay: 1s; }
.hwn_page_02 .animate__animated.animate__backInLeft.step_03 { animation-delay: 2s; }

.box_QR{position:fixed; bottom: 1.2vh; right: 3vw; display: block; width: 16vh; height: 16vh;  z-index: 99999999;}
.box_QR_in { width: 100%; height: 100%; display: block; background: no-repeat center center url('../resources/hospital/default/images/icons/qr_code_icon_null.png'); background-size: 100%; position: relative; }
.box_QR::after { content: "QR을 스캔해주세요"; color:#454045; font-size: 1vh; letter-spacing: -0.05em; font-weight: 900; text-align: center; line-height: 1; position: absolute; bottom: 17%; left: 50%; transform: translateX(-50%); width: 100%; }
.hosp_qrcode_img{display: block; position: absolute; width: 48%; height: 48%; top: 24%; left: 50%; transform: translateX(-50%); }
.hosp_qrcode_img .qrimg_inner { display: block; color: rgba(0, 0, 0,0%); width: 100%; height: 100%; background: no-repeat top left url('../resources/hospital/default/images/hosp_qrcode.png'); background-size: 100% 100%; }
.box_QR.animate__animated.animate__tada { animation-duration: 2s; }

/* mockup */
.mockup { position: absolute; display: block; width: 100%; height: 100%; }
.mockup .mockup_frame { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; background-image: url('../resources/hospital/default/images/mockup_type_1_frame.png'); background-position: center center; background-size: contain; background-repeat: no-repeat; z-index: 99999; }
.mockup .mockup_display { position: absolute; display: block; top: 24.3%; left: 26%; width: 31.7%; height: 37%; border-radius: 1vh; background-image: url('../resources/hospital/default/images/mockup_contents_main.png'); background-size: 100% 100%; background-repeat: no-repeat; background-position: top left; z-index: 1; }

/* mockup_type_1 */
.mockup_type_1 { width: 24vh; height: 47vh; top: 45%; left: 50%; transform: translate(-50%, -50%); }
.mockup_type_1 .mockup_frame { background-image: url('../resources/hospital/default/images/mockup_type_1_frame.png'); }
.mockup_type_1 .mockup_display { top: 1.8%; left: 7.5%; width: 87%; height: 96%; border-radius: 1vh; }

/* mockup_type_2 */
.mockup_type_2 { width: 37.5vh; height: 47vh; top: 45%; left: 50%; transform: translate(-50%, -50%); }
.mockup_type_2 .mockup_frame { background-image: url('../resources/hospital/default/images/mockup_type_2_frame.png'); }
.mockup_type_2 .mockup_display { top: 1.8%; left: 21%; width: 54%; height: 92%; border-radius: 1vh; }

/* mockup_type_3 */
.mockup_type_3 { top: 50vh; left: 50vw; transform: translate(-70%, -62%); width: 33vh; height: 47vh; }
.mockup_type_3 .mockup_frame { background-image: url('../resources/hospital/default/images/mockup_type_3_frame.png'); }
.mockup_type_3 .mockup_display { top: 7.3%; left: 23.5%; width: 50.5%; height: 76%; border-radius: 1vh; }


/* page 3 */
.mdh_flow_list{}
.mdh_flow_list ul{white-space: nowrap;}
.mdh_flow_list ul li { font-size: 3vh; font-weight: 900; background: #ffffff; margin-bottom: 1vh; padding: 0.5vh 1.5vh; }

.hwn_page_03{}
.hwn_page_03 .mockup_type_3{}
.hwn_page_03 .mdh_flow_list { position: fixed; top: 50%; left: 50%; transform: translate(50%,-50%); z-index: 9999999; }

.mdh_flow_list ul li:nth-child(1).animate__bounceInLeft{
  animation-duration: 0.8s;
  animation-delay: 0.8s;
}
.mdh_flow_list ul li:nth-child(2).animate__bounceInLeft{
  animation-duration: 0.8s;
  animation-delay: 1.6s;
}
.mdh_flow_list ul li:nth-child(3).animate__bounceInLeft{
  animation-duration: 0.8s;
  animation-delay: 2.4s;
}
.mdh_flow_list ul li:nth-child(4).animate__bounceInLeft{
  animation-duration: 0.8s;
  animation-delay: 3.2s;
}