.section-academy-banner{ height: 584px; background-image: url('../../../../images/academy/pharmacy/banner-desktop.png?v=1');background-position: center center; background-size: cover; }
.pharmacy-logo{ position: absolute; width: 187px; height: 224px; left: calc(100% / 1.25); top: calc(70% / 7);  background: url('../../../../images/academy/pharmacy/logo-desktop.svg'); }
.div-academy-banner{ text-align: left; }
.text-academy-banner{ font-weight: 600; font-size: 48px; letter-spacing: 1.25px; color: #192463; margin-top: 140px; margin-bottom: 35px; }
.text-academy-banner-sub{ font-weight: 600; font-size: 40px; letter-spacing: 1.25px; color: #A8E052; margin-bottom: 30px;  }
.text-academy-banner-detail{ font-weight: 400; font-size: 18px; line-height: 140%; letter-spacing: 0.2px; color: rgba(25, 36, 99, 0.8); max-width: 540px; margin-bottom: 36px; }
.btn-academy{ background: #A8E052; box-shadow: 0 2px 14px rgba(0, 0, 0, 0.08); backdrop-filter: blur(4px); }
.btn-academy:hover{ background: #b4e46b; }
.btn-outline-course-select {  color: #000000; border: 1px solid #000000; padding-top: 4px; height: 48px;  border-radius: 8px; width: 182px;  }
.btn-outline-course-select:hover, .btn-outline-course-select:focus { color: #fff; background-color: #A8E052;  border-color: #E1E1E1; }
.alertCourse{ width: 100%; min-height: 60px; background-color: rgba(245,255,242,0.03); border-radius: 10px; border: 1px dashed #A8E052; padding: 15px; font-size: small; color: red; vertical-align: middle; text-align: center; }

.section-academy-nav{ margin-top: 48px; margin-bottom: 48px; }
.navigate-academy { position: relative; display: flex;  align-items: center; color: #573C73; height: 40px; background: #f5f5f5;  border-radius: 4px 0 0 4px; padding-left: 21px;  padding-right: 10px; }
.navigate-academy.now { color: #573C73;  background: #f5f5f5;   border-radius: 0; }
.navigate-academy:hover{ color: #192463; background: #A8E052; font-weight: 500; }
.navigate-academy::after { content: " "; height: 0; width: 0; position: absolute;   right: -13px;  border-style: solid; border-width: 20px 0 20px 13px;  border-color: transparent  #f5f5f5;  z-index: 10; }
.navigate-academy.now:hover::after, .navigate-academy.bf:hover::after{ content: " "; height: 0; width: 0; position: absolute;   right: -12px;  border-style: solid; border-width: 20px 0 20px 13px;  border-color: transparent  #A8E052;  z-index: 10; }
.navigate-academy.now::after { content: " "; height: 0;   width: 0;    position: absolute;  right: -13px;    border-style: solid;   border-width: 20px 0 20px 13px; border-color: transparent  #f5f5f5;  z-index: 10; }
.navigate-academy.bf::before { content: " ";  height: 0; width: 0;  position: absolute;   right: -14.5px;   border-style: solid;   border-width: 20px 0 20px 13px;   border-color: transparent rgba(177,177,178,0.43); z-index: 10; }

.section-academy-about{ }
.div-academy-about{ text-align: left; }
.text-academy-about{ font-weight: 600; font-size: 36px; color: #192463;  line-height: 100%; margin-top: 20px; margin-bottom: 20px;  }
.text-academy-about-sub{ font-weight: 600; font-size: 32px; letter-spacing: 1.25px; color: #A8E052; margin-bottom: 24px; }
.text-academy-about-detail{ font-weight: 400; font-size: 16px; line-height: 160%; max-width: 600px; text-align: left; color: #757575; }
.div-academy-about-detail{ padding-top: 24px; }
.div-player{ padding-left: 36px; margin-bottom: 48px; }
.plyr{ width: 496px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 35px; }

.section-academy-path{ padding-top: 40px; padding-bottom: 80px; background-color: #F5F7FE !important; }
.section-academy-path .container{  text-align: center; }
.academy-path-title{ font-weight: 600; font-size: 40px; line-height: 120%; letter-spacing: 0.25px; margin-bottom: 25px;  }
.academy-path-title-sub{   font-weight: 400;  font-size: 18px; color: #757575; line-height: 160%; margin-bottom: 48px;  }
.academy-path-image{  display: flex; justify-content: center;  }
.academy-path-image-size{  width: 496px; height: 311px; box-shadow: 5px 5px 10px #d7d7d7; border-radius: 20px; }
.academy-path-image-padding{ padding-right: 35px; }

.section-academy-career{ padding-top: 80px; padding-bottom: 80px; display: block; }
.section-academy-career-ipad{ display: none; }
.academy-career-title{ font-weight: 600; font-size: 32px; color: #192463; margin-top: 30px; margin-bottom: 26px; }
.academy-career-title-sub{   font-weight: 600;  font-size: 32px; color: #A8E052; margin-bottom: 32px;  }
.academy-career-detail{   font-weight: 400;  font-size: 16px; color: #757575; line-height: 160%; width: 650px;  }
.academy-career-image{ display: flex;  flex-direction: row-reverse; }
.academy-career-image-size{  width: 496px; height: 306px; box-shadow: 5px 5px 10px #d7d7d7; border-radius: 20px; }

.container-course {
    width: 496px; = border-radius: 10px;  overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); margin: 20px;
    border-radius: 12px;
}
.container-course-image {  position: relative; }
.container-course-image img { display: block; width: 100%; height: 311px;  }
.course-text-overlay {
    position: absolute; bottom: 0; left: 0; width: 100%;
    background-color: rgba(48, 48, 48, 0.5);
    color: white;  padding: 10px; text-align: center; font-size: 16px;
}

.section-academy-course{ padding-top: 80px; padding-bottom: 80px; background-color: #F8F8F9 !important;  }
.academy-course-div{ display: flex; justify-content: center; }
.academy-course-title{ font-weight: 600; font-size: 40px; color: #000000; line-height: 120%; letter-spacing: 0.25px; margin-right: 8px; margin-bottom: 34px; }
.academy-course-title-sub{ font-weight: 600; font-size: 40px; color: #A8E052; line-height: 120%; letter-spacing: 0.25px; margin-bottom: 34px; }
.academy-course-condition{ padding-top: 15px; padding-bottom: 0; width: 560px; display: flex; justify-content: center; }
.academy-course-button{ width: 190px; height: 48px; margin-bottom: 10px; }
.academy-course-button-center{ margin-left: 10px; margin-right: 10px; }
.academy-course-search{ min-width: 360px; margin-right: 10px; }
.academy-course-select{ min-width: 190px; }
#div_course{ margin-top: 50px; }
.card-course-title{ color: #A8E052; } .card-course-title:hover{  color: #85c624; }
.card-news-title{ font-weight: 300; color: #000000; font-size: 18px;  line-height: 140%; }
option, .form-select { font-weight: 250; font-size: 16px; line-height: 140%; letter-spacing: 0.01em; color: #757575;   }
::placeholder { font-weight: 250; font-size: 16px; line-height: 140%; letter-spacing: 0.01em; color: #757575;   }
::-ms-input-placeholder { font-weight: 250; font-size: 16px; line-height: 140%; letter-spacing: 0.01em; color: #757575;   }
.btn-outline-course {  color: #767676; border: 1px solid #E1E1E1; padding-top: 12px; height: 48px;  border-radius: 8px; width: 100%; }
.btn-outline-course:hover, .btn-outline-course:focus, .btn-check:checked + .btn-outline-course { color: #fff; background-color: #A8E052;  border-color: #E1E1E1; }

.section-academy-content{ height: 342px; background-image: url('../../../../images/academy/pharmacy/content-desktop-fade.png');background-position: center center; background-size: cover; }
.section-academy-content .container{ text-align: center; }
.div-academy-content{ display: flex; flex-direction: row; }
.text-academy-content{ font-weight: 600; font-size: 32px; color: #192463; margin-top: 50px; margin-bottom: 15px;  text-shadow: 1px 1px 2px #FFFFFF; }
.text-academy-content-sub{ font-weight: 600; font-size: 32px; color: #A8E052; margin-top: 50px; margin-bottom: 15px; margin-left: 10px;  text-shadow: 1px 1px 2px #FFFFFF; }
.text-academy-content-detail{ font-weight: 400; font-size: 16px; line-height: 160%; letter-spacing: 0.2px; color: #757575; max-width: 880px; margin-bottom: 36px; text-shadow: 1px 1px 2px #FFFFFF; }

.div-academy-content-news{ display: flex;  align-items: center; height: 342px; }
.div-academy-content-news-sub{ display: flex;  flex-direction: column; width: 100%; }
.div-academy-content-news-sub-detail{ display: flex;  justify-content: center; }
.text-academy-content-news{ font-weight: 600; font-size: 32px; color: #192463; margin-bottom: 35px;  text-shadow: 1px 1px 2px #FFFFFF; }

.section-academy-contents{ margin-top: 50px;  }
.div-academy-contents{ display: flex;  align-items: center; }
.div-academy-contents-sub{ display: flex;  flex-direction: column; width: 100%; }
.div-academy-contents-sub-detail{ display: flex;  justify-content: center; }
.text-academy-contents{ font-weight: 600; font-size: 32px; color: #192463;  margin-bottom: 25px;  text-shadow: 1px 1px 2px #FFFFFF; }
.text-academy-contents-sub{ font-weight: 600; font-size: 32px; color: #A8E052; margin-bottom: 5px; margin-left: 10px;  text-shadow: 1px 1px 2px #FFFFFF; }

.section-academy-bottom{ height: 316px; margin-bottom: 95px;  }
.section-academy-bottom .container{ display: flex; flex-direction: row;  }
.academy-bottom-image-left{ margin-right: 15px; margin-bottom: 10px; }
.academy-bottom-right{ display: flex; flex-direction: column; }
.academy-bottom-image-shadow{ box-shadow: 5px 5px 10px #d7d7d7; border-radius: 20px; }
.academy-bottom-image-right{ min-width: 411px; width: 100%; height: 150px; }
.academy-bottom-image-right-top{ margin-bottom: 14px; }
.academy-bottom-image-right-down{  }

.section-academy-contact{ height: 90px; background-color: #A8E052 !important;  }
.section-academy-contact .container{ display: flex; flex-direction: row; padding-top: 25px; }
.academy-contact-title{ font-weight: 400; font-size: 20px; line-height: 160%; letter-spacing: 0.9px; color: #FFFFFF; margin-right: 32px; padding-top: 5px; }
.academy-contact-image{ width: 42px; height: 42px; }
.academy-contact-image-padding{ margin-left: 20px; }

.nav-link:hover {  color: #A8E052; }
.pagination-academy .page-item.active .page-link{ color: #fff; border-color: #A8E052; background-color : #A8E052; }
.pagination-academy .page-link:hover{  color: #A8E052; border: 1px solid #A8E052; }
.pagination-academy .page-link{   color: #A8E052; }

.btn-content-share{
    cursor: pointer; display: flex; justify-content: center; align-items: center; width: 35px; height: 35px; color: #757575; border-radius: 50%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) -1.52%, rgba(244, 244, 244, 0.2) 101.52%);
    border: 1px solid #E1E1E1; filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.1)) drop-shadow(0px 4px 14px rgba(0, 0, 0, 0.08));
}
.btn-show-course-detail:hover, .btn-content-share:hover { color: #fff; background: #A8E052; background-color: #A8E052;  border-color: #A8E052; }

.value-steps-container {  display: flex; justify-content: space-around; align-items: center; padding: 20px;  }
.value-step { display: flex; flex-direction: column; align-items: center;  text-align: center; }
.value-step-image-container { background-color: #fff; border-radius: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); overflow: hidden;  margin-bottom: 10px; }
.value-step-image-container img { display: block; width: 196px; height: auto; }
.value-step-title { font-weight: bold; margin-bottom: 5px; margin-top: 15px; }
.value-step-description {  font-size: 0.9em; width: 196px; color: #555; margin-top: 10px; }
.value-connector {  flex-grow: 1; width: 97px; position: relative; margin-bottom: 75px; }
@media (max-width: 768px) {
    .value-steps-container { flex-direction: column; align-items: stretch; }
    .value-step {  margin-bottom: 30px; }
    .value-connector { display: none; }
}
.value-line-with-dots { display: flex; align-items: center; justify-content: center;  width: 97px;  margin: auto auto; }
.value-dot { width: 11px; height: 11px; background-color: #aaff80; border-radius: 50%; }
.value-dashed-line { flex-grow: 1; height: 2px; background-color: transparent; border-top: 2px dashed #aaff80;  margin: 0 10px; }

.card-image-box{ position: relative; max-height: 300px; height: auto; }
.card-image-top{ height: 300px;  object-fit: cover; }

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px),
only screen and (min-device-width: 481px) and (max-device-width: 767px),
only screen and (min-width: 768px) and (max-width: 1024px),
only screen and (min-width: 481px) and (max-width: 767px){
    .section-academy-banner{ height: 417px; background-image: url('../../../../images/academy/pharmacy/banner-ipad.png?v=1'); }
    .pharmacy-logo{ position: absolute; width: 0; height: 0; background:none; }
    .text-academy-banner{ margin-top: 90px; margin-bottom: 30px; }
    .text-academy-banner-sub{ font-size: 32px;  margin-bottom: 22px;  }
    .text-academy-banner-detail{ margin-bottom: 28px;  width: 560px; }

    .div-player{ display: flex;  justify-content: center; padding-left: 0;  }
    .div-academy-about{ text-align: center; padding-bottom: 60px; }
    .text-academy-about{ font-weight: 500; font-size: 36px;  margin-top: 20px; margin-bottom: 24px; color: black; }
    .text-academy-about-sub{ font-size: 40px; margin-bottom: 32px;  }
    .text-academy-about-detail{ font-weight: 300; font-size: 18px; color: black; letter-spacing: -0.006em; max-width: 620px; text-align: center; margin-bottom: 40px; }
    .plyr{ max-width: 500px; }

    .section-academy-path{ padding-bottom: 0; }
    .academy-path-title{ font-size: 32px; margin-bottom: 10px; }
    .academy-path-title-sub{   font-size: 16px; margin-bottom: 20px;  }
    .academy-path-image{  }
    .academy-path-image-size{  width: 327px; height: 205px; }
    .academy-path-image-padding{ padding-right: 25px; }
    .container-course {  width: 100%;}
    .container-course-image img { height: auto;  }

    .section-academy-career{ display: none; }
    .section-academy-career-ipad{ display: block; }
    .value-line-with-dots { width: 160px; }
    .academy-career-title{ font-size: 24px; color: #192463; margin-top: 0; margin-bottom: 18px; }
    .academy-career-title-sub{   font-size: 24px; margin-bottom: 24px;  }
    .academy-career-detail{  font-size: 12px; width: 330px;  }
    .academy-career-image{  }
    .academy-career-image-size{  width: 325px; height: 200px; }

    .section-academy-content{ background-image: url('../../../../images/academy/pharmacy/content-ipad.png');  }
    .section-academy-content .container{ }
    .div-academy-content{  }
    .text-academy-content{ margin-top: 36px; margin-bottom: 15px;  }
    .text-academy-content-sub{ margin-top: 36px; margin-bottom: 15px; margin-left: 10px;  }
    .text-academy-content-detail{ max-width: 600px; margin-bottom: 36px;  }

    .section-academy-bottom{ display: none; }
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px), only screen and (max-width: 480px) {
    .section-academy-banner{ height: 642px; background-image: url('../../../../images/academy/pharmacy/banner-iphone.png?v=1'); }
    .pharmacy-logo{ position: absolute; width: 0; height: 0;background: none; }
    .div-academy-banner{ text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
    .text-academy-banner{ font-size: 32px; margin-top: 185px; margin-bottom: 30px; }
    .text-academy-banner-sub{  font-size: 24px; margin-bottom: 30px;  }
    .text-academy-banner-detail{  margin-bottom: 32px; width: 330px; text-align: center; }

    .div-academy-about{ text-align: center;  padding-bottom: 60px;  }
    .text-academy-about{ font-size: 32px; margin-top: 15px; color: black;  }
    .text-academy-about-sub{ font-size: 32px;    }
    .text-academy-about-detail{ font-size: 16px; color: black;  line-height: 160%; max-width: 360px; display: block;  margin-top: 35px; margin-bottom: 35px; text-align: center; }
    .div-player{ display: flex;  justify-content: center; padding-left: 0; margin-bottom: 15px;  }
    .plyr{ max-width: 370px; }

    .section-academy-path{ padding-bottom: 0; }
    .academy-path-title{ font-size: 32px; margin-bottom: 10px; }
    .academy-path-title-sub{  font-size: 16px; padding-left: 30px; padding-right: 30px; margin-bottom: 20px;   }
    .academy-path-image{ flex-direction: column; }
    .academy-path-image-size{  width: 327px; height: 205px; }
    .academy-path-image-padding{ padding-right: 0; padding-bottom: 40px; }
    .container-course {  width: 90%;}
    .container-course-image img { height: auto;  }


    .section-academy-career{ }
    .section-academy-career-ipad{ display: none; }
    .academy-career-title{  font-size: 24px; margin-top: 0; margin-bottom: 18px; text-align: center; }
    .academy-career-title-sub{  font-size: 24px; margin-bottom: 24px; text-align: center; }
    .academy-career-detail{ font-size: 12px;  width: 100%; text-align: center; padding-left: 40px; padding-right: 40px; }
    .academy-career-image{  }
    .academy-career-image-size{  }

    .section-academy-course{ padding-top: 50px; padding-bottom: 50px; }
    .academy-course-div{  }
    .academy-course-head{   display: flex;  flex-direction: column; justify-content: center; }
    .academy-course-title{ text-align: center; font-size: 32px; margin-bottom: 8px; }
    .academy-course-title-sub{ text-align: center; font-size: 32px; margin-bottom: 8px; }
    .academy-course-condition{  width: 400px;  }
    .academy-course-button{ width: 130px;  }
    .academy-course-button-center{ margin-left: 6px; margin-right: 6px; }
    .academy-course-search{ min-width: 235px;  }
    .academy-course-select{ min-width: 155px; }
    #div_course{ margin-top: 50px; }
    #div_course_waiting{  }
    option, .form-select {  font-size: 13px;   }
    ::placeholder { font-size: 13px;   }
    ::-ms-input-placeholder { font-size: 13px;   }
    .div-card-course{ display: flex; justify-content: center;  }
    .card-course{ max-width: 360px; height:430px; margin-left: 8px; }

    .section-academy-content{  background-image: url('../../../../images/academy/pharmacy/content-iphone.png');  }
    .section-academy-content .container{ text-align: center;  }
    .div-academy-content{ display: flex; justify-content: center; }
    .text-academy-content{ font-size: 24px; margin-top: 28px; margin-bottom: 15px;  }
    .text-academy-content-sub{ font-size: 24px; margin-top: 28px; margin-bottom: 15px; margin-left: 10px;  }
    .text-academy-content-detail{ font-size: 12px; padding-left: 15px; padding-right: 15px; max-width: 100%; margin-bottom: 36px; text-align: center; }

    .section-academy-bottom{ display: none; }

    .section-academy-contact{ margin-top: 45px; }
    .section-academy-contact .container{  }
    .academy-contact-title{ margin-right: 14px; padding-top: 5px; }
    .academy-contact-image{  }
    .academy-contact-image-padding{ margin-left: 10px; }
}