body,html{ font-family: 'Noto Sans KR', sans-serif; height: 100%; margin: 0px; font-size: 16px; }
input:focus{ outline: none;}
/*main-chat*/
.div-chat-wrap{width: 30%; height: 100%; background-color: #ececec;  position: relative; float: left;}
.div-chat-head{width: 100%; height:40px; background-color: #449862; text-align: center; color: #ffffff; line-height: 250%; font-size: 14px;}
.div-chat-txt-wrap {width: 100%; height: 50px; background-color: #0166c5; position: absolute; bottom: 0px;}
#playerElement { width: 70%; overflow: hidden; float: left;}
.btn-chat-send { width: 42px; height: 32px; background-color: #0084fd; position: absolute; right: 10px; top:10px; background-color: #ffffff; border-radius: 5px; text-align: center; font-size: 14px; font-weight: bold; line-height: 230%; cursor: pointer; }
.btn-chat-send:hover { background-color: #0B2161; color: #ffffff;}
.div-main-schedule-live { width: 100%;  position: relative;  }
.div-survey-title {width:99%; margin-left: 1%; text-align: left; font-size: 17px; margin-bottom: 10px;margin-top: 50px;}
.div-survey-section { width:99%; margin-left: 1%; text-align: left; font-size: 16px; margin-bottom: 20px;}
.div-reply {width: calc(80% - 20px); background-color: #04cc48; margin: auto; margin-bottom: 10px; padding-left: 10px;padding-right: 10px;padding-top: 10px;padding-bottom: 10px; color: #ffffff; border-radius: 10px; position: relative;word-break:break-all; font-size: 12px;margin-right: 2%;}
.div-msg { width: calc(80% - 20px); background-color: #0084fd; margin: auto; margin-bottom: 10px; padding-left: 10px;padding-right: 10px;padding-top: 10px;padding-bottom: 10px; color: #ffffff; border-radius: 10px; position: relative;word-break:break-all; font-size: 12px;margin-left: 2%;}
.txt-survey { width: 50%; height: 15px; padding: 5px;}
#div-chat-src { width: 100%; height: calc(100% - 100px); background-color: #333333; overflow-y: scroll; padding-top: 10px;}
#q4h,#q4h2,#q5h,#q5h2{ display: none;}

.div-main-schedule-goto-list-btn {top:30px;width: 18%; height: 45px; margin: auto; position: relative; font-size: 11pt; font-weight: 600; color: white; background-color: #407AF0; text-align: center; line-height: 300%; border-radius: 5px; cursor: pointer;}
.tbl-header-wrap { width: 90%; margin: auto; height: 30px; background-color: #ffffff;top: 50px; position: relative; 
    border-top: 1px solid #cccccc;border-bottom: 2px solid #cccccc; font-size: 12px; padding-top: 10px; font-weight: bold;}
    .tbl-header-list { width: 90%; margin: auto; height: 30px; background-color: #ffffff;top: 50px; position: relative; 
       border-bottom: 1px solid #cccccc; font-size: 14px; padding-top: 10px; font-size:12px }
.tbl-list-num { float: left; width: 10%; text-align: center;}
.tbl-list-title2 { float: left;width: 50%; text-align: left; text-overflow: ellipsis;white-space: nowrap; overflow: hidden;}
.tbl-list-title { float: left;width: 50%; text-align: center;}
.tbl-list-writer { float: left;width: 10%; text-align: center;}
.tbl-list-date { float: left;width: 30%; text-align: center;}
.tbl-notice-wrap {width: 1200px; margin: auto; background-color: #ffffff; height: 250px; position: relative; }
.tbl-notice-view-wrap {width: 1200px; margin: auto; background-color: #ffffff;  position: relative;  padding-bottom: 50px;}
.tbl-notice-con{ width: 90%;  border-bottom: 2px solid #444444;margin: auto; font-size: 14px; padding-top: 20px; padding-bottom: 20px;}
    a{text-decoration: none; color: #444444;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
    .div-modal-back{ width: 100%; height: 100%; background-color:rgba(0,0,0,0.8); position: fixed; z-index: 20; display: none;}
    .div-menu-mobile { width: 70%; height: 100vh; background-color: #ffffff; position: absolute;top:66px;z-index: 25; right: 0px; display: none;} 
    .div-header {width: 100%; height: 142px; position: relative; z-index: 30; background-color: #ffffff; }
    .div-header-top-wrap {right: 20px; position: absolute; height: 20px; top:10px }
    .div-header-top {width: 1200px; height: 40px; margin: auto; position: relative; }
    .div-header-top-menu {height: 15px; float: left; margin-left: 20px; font-size: 12px; cursor: pointer; letter-spacing: 0.5px; color: #848484; }
    .div-header-top-menu img { vertical-align: top; }
    .div-header-bot-wrap {width: 100%; height: 100px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; }                  
    .div-header-bot {width: 1200px; height: 100px; margin: auto; position: relative;  }
    .div-header-bot-menu-wrap {right: 20px; top: 40px; position: absolute; }    
    .div-header-bot-menu {height: 20px; float: left; margin-left: 60px; cursor: pointer; font-size: 14px; }
    .div-header-bot-logo {width: 120px; height: 44px; overflow: hidden; position: absolute; top: calc( (100px - 44px) / 2);left:20px}
    .div-header-bot-logo img { width: 100%;}
    .div-main {width: 100%;  background-color: #f2f2f2; padding-bottom:50px}
    .div-main-intro {width: 1200px; top: 30px; margin: auto; position: relative; }
    .div-main-intro img {width: 100%;}
    .div-mobile-menu { width: 25px; height: 25px; overflow: hidden; position: absolute; right: 20px; display: none; top:18px}
    .div-mobile-menu img { width: 100%;}
    .div-main-schedule {width: 1200px; margin: auto; position: relative;  margin-top: 50px; }
    .div-main-schedule-wrap {width: 1160px;  margin-top: 10px; background-color: #0B2161; position: relative;padding: 20px }  
    .div-main-schedule-image {width: 400px; float: left; }
    .div-main-schedule-image img{width: 100%;display: block; }    
    .div-main-schedule-form { margin-left: 20px; float: left;}
    .div-main-schedule-form-title { width: 720px;color: #81DAF5; position: relative; font-size: 25px; font-weight: 600; word-break: keep-all ; overflow: hidden;  }
    .div-main-schedule-form-detail {height: 30px; color: white; position: relative; font-size: 16px; font-weight: 500; margin-top: 20px;}
    .div-main-schedule-form-time {height: 50px; color: white; position: relative; font-size: 16px; font-weight: 500; margin-top: 0px;}
    .div-main-schedule-form-enter {width: 250px; height: 50px;  background-color: #81BEF7; color: white; position: relative; font-size: 18px; font-weight: 600; text-align: center; line-height: 270%; cursor: pointer; margin-top: 20px; }
    .div-clear-fix { width: 100%; clear: both;}

    .div-footer {width: 100%; height: 145px; position: relative; }
    .div-footer-wrap {width: 1200px; height: 15vh; margin: auto; position: relative; }
    .div-footer-logo {width:120px;height: 40px; top: 50px; left:20px ;position: absolute; }
    .div-footer-logo img {width:100%;}

    .div-footer-pharmaceu {left: 200px; font-size: 12px; color: #848484;  }
    .div-footer-medicine {left: 200px; font-size: 12px; color: #848484;}
    .div-footer-gcma {right: 20px; top: 80px; font-size: 13px; font-weight: 600; position: absolute; }
    .div-title { font-size: 20px; margin-top: 20px; font-weight: 500;}
    .div-footer-text { position: absolute; top:50px; left: 200px; font-size: 15px;}

    .div-main-replay {width: 1200px;  margin: auto; position: relative; }
    .div-main-replay-wrap {width: 1200px; height: 300px; position: relative; }
    .div-main-replay-elements {width:calc( 25% - 5px );float: left; position: relative; margin-right: 5px; background-color: #ffffff; margin-bottom: 20px; padding-bottom: 10px; border-radius: 5px; overflow: hidden;}
    .div-main-replay-elements:last-child{ margin-right: 0px;}
    .div-main-replay-elements img { width: 100%;}

    .div-main-replay-elements-title { font-size: 16px; margin-bottom: 20px; font-weight: 500; width: 90%;margin-left:5%; color: #444444;}
    .div-main-replay-elements-time,.div-main-replay-elements-presenter { font-size: 14px; width: 90%; margin-left: 5%;margin-bottom: 5px; color: #d5d5d5;}
    .div-header-mobile-menu{ width: 90%; margin-left: 10%; border-bottom: 1px solid #cccccc; height: 50px; line-height: 300%; }
    .div-header-top-mobile-menu{ width: 90%; margin-left: 10%;  height: 40px; color: #787878; font-size: 14px;}
    .div-header-mobile-menu:first-child { margin-top: 50px;}
    .btn-goto-play { width: 95%; background-color: aqua; height: 35px;  margin: auto; margin-top: 10px; text-align: center;background-color: #0B2161; color: #ffffff; line-height: 200%;}
    .div-contact {width: 100%; background-color: #0B2161; position: relative; }
    .div-contact-wrap {width: 1200px;  margin: auto; position: relative; }
    .div-contact-test {width: 600px; height: 300px; position: relative; float: left; background-image: url(../img/foot_icon.png); background-position: 90% 70% ; background-repeat: no-repeat;}
    .div-contact-test-title {width: 200px; top: 40px; position: relative; font-size: 23px; font-weight: 600; color: #81DAF5; }
    .div-contact-test-desc {width: 420px; height: 50px; top: 80px; position: relative; font-size: 14px; color: white; }
    .div-contact-test-check {width: 130px; height: 45px; top: 120px; border: 1px solid #ffffff; position: relative; font-size: 14px; color: white; text-align: center; line-height: 300%; cursor: pointer; }
    .div-contact-intro {width: 600px; height: 300px; position: relative; float: left; background-image: url(../img/foot_icon2.png); background-position: 90% 70% ; background-repeat: no-repeat;}
    .btn-goto-top { width: 40px; height: 40px; position: fixed; right: 20px; bottom: 50px; background-color: #ececec; z-index: 40; border: 1px solid #cccccc; font-size: 12px; text-align: center; line-height: 330%; border-radius: 30px; display: none; cursor: pointer;}
    
    .div-page-intro {width: 100%; height: 150px; z-index: 1; position: relative; background-image: url('../img/wrap_bg.png'); background-size: cover;}            
    .div-page-intro-wrap {width: 1200px; height: 80px; top: 35px ; margin: auto; z-index: 1; position: relative;  }
    .div-page-intro-detail {width: 100%; top: 50px; font-size: 12px; color: #81DAF5; z-index: 10; position: absolute;left: 20px; }
    .div-page-intro-title {width: 100%; font-size: 30px; font-weight: 500; color: white; z-index: 10; position: absolute; top:10px; left: 20px;}

    .div-main-intro-wrap {width: 1200px; margin: auto; position: relative;  background-color: #ffffff; padding-bottom: 50px; }

    .div-title-area { width: 1200px; margin: auto; margin-top: 50px;}
    .div-main-intro-sympo-image { width: 400px; margin-left: 50px; margin-top: 50px;}
    .div-main-intro-sympo-image img { width: 100%;}
    .div-main-intro-sympo-desc { width: 650px; text-align: justify;margin-left: 50px; margin-top: 50px; font-size: 12px;}
    .div-main-intro-sympo-image,.div-main-intro-sympo-desc{ float: left;}

    .div-main-intro-product-image { width: 400px; margin-left: 50px; margin-top: 50px;float: left;}
    .div-main-intro-product-image img { width: 100%;}
    .div-main-intro-product-desc { width: 650px; text-align: justify;margin-left: 50px; margin-top: 50px;float: left;}

    .div-main-news {width: 1200px;  margin: auto; position: relative;  margin-top: 50px;}
    .div-main-news-detail_wrap{width: 300px; position: relative; float: left; }
    .div-main-news-title {width: 300px;position: relative; }
    .div-main-news-detail {width: 130px; height: 40px; border: 1px solid #000000; text-align: center; line-height: 250%; position: relative; cursor: pointer; }
    .div-main-news-intro {width: 900px; height: 150px; border-top: 1px solid #bdbdbd; border-bottom: 1px solid #bdbdbd; float: left;}

    .div-main-news-intro-title { position: relative; font-size: 18px; font-weight: 600; margin-top: 35px; }
    .div-main-news-intro-time { position: relative; font-size: 13px; color: #a4a4a4; margin-top: 20px;}
    .div-main-news-intro-desc {position: relative; font-size: 15px; line-height: 150%; }
  

    .div-login-wrap { width: 500px; height: 500px; background-color: #ffffff; margin: auto;position: relative;top:50px; margin-bottom: 50px; border: 1px solid #cccccc;}
    .div-form-wrap { width: 500px;  background-color: #ffffff; margin: auto;position: relative;top:50px; margin-bottom: 50px; border: 1px solid #cccccc;}

    .div-login-title{ width: 100%; text-align: center; font-size: 25px; margin-top: 20px; word-break: break-all;}
   
    .txt-login { width: 300px; height: 20px; padding: 10px; margin: auto;position: relative; margin-left: 90px; margin-top: 20px; font-size: 18px;}
    .btn-login { width: 301px; height: 20px; padding: 10px; margin: auto;position: relative; margin-left: 90px; margin-top: 20px; background-color: #0B2161;border: 1px solid #0B2161 ;  color: #ffffff; text-align: center;line-height: 150%; cursor: pointer;}
    .txt-login-box { width: 320px; margin: auto; margin-top: 20px;}
    .txt-login-indicator { width: 320px; margin: auto; margin-top: 5px; font-size: 12px; color:red;}
    .txt-contact { width: 300px; height: 20px; padding: 10px; margin: auto;position: relative; margin-left: 90px; margin-top: 5px; font-size: 18px;}
    .div-main-inner-pic img { width: 150px;}
    .div-main-inner-pic  { width: 150px; margin: auto;}

    .div-main-intro-sub-image { width: 300px;  margin-top: 50px;float: left; font-size: 14px; text-align: center; line-height: 200%;}
    .div-main-intro-sub-image img { width: 100%;}
    .div-main-intro-sub-desc { width: 650px; text-align: justify; margin-top: 30px;float: left; font-size: 12px;}
   
    .txt_up { width: 80%; padding: 10px; resize: none;}
    .div-main-sub-sympo {width: 1200px; margin: auto; position: relative;  background-color: #ffffff; padding-bottom: 50px; }
  
    .div-head-line { width: 95%; padding-top:10px; padding-bottom: 10px; font-size: 12px;  margin: auto;}
    .div-sep-title {width: 90%;  text-align: left; margin-left: 5%; font-size: 1.2em; color: #333333; margin-top: 20px; padding-bottom: 10px;}
    .div-section-head {width: calc(95% - 40px); padding: 20px; text-align: center; margin: auto; border: 1px solid #cccccc;font-size: 1.3em; color: #333333;}
    .div-section-title {width: 95%;  text-align: left; margin: auto; border-bottom: 1px solid #cccccc;font-size: 1.2em; color: #333333; margin-top: 20px; padding-bottom: 10px; font-weight: bold;}
    .div-section-group {width: 95%;  text-align: left; margin: auto; font-size: 1.2em; color: #333333; margin-top: 20px; padding-bottom: 10px; cursor: pointer;}
    .txt-selection { resize: none; border: 1px solid #cccccc; padding: 5px; width: 300px; }
.div-section-q { width: 95%; margin-bottom: 15px; margin-left: 2.5%;}
.div-section-a { width: 90%; margin-bottom: 15px; margin-left: 5%;}
.div-section-body{width: calc(95% - 40px); padding: 20px; text-align: center; margin: auto; border: 1px solid #cccccc;font-size: 12px; color: #333333; margin-top: 30px;}

    @media screen and (max-width: 530px) { 
        .div-login-wrap, .div-form-wrap { width: 90%;}
        .txt-login, .txt-contact {width: calc(95% - 20px); margin-left: calc(2.5% - 2px );}
        .btn-login {width: calc(95% - 20px); margin-left: calc(2.5% - 2px );}
        .txt-login-box {width: 95%; margin-left: 2.5%;}
        #playerElement { width: 100%;}
        .txt-survey { width: 90%;}
    }



    @media screen and (max-width: 1000px) { 
   
    }

    @media screen and (max-width: 1199px) { 
        .div-msg { width: 80%; margin-left: 5%;}
        .div-reply { width: 80%; margin-right: 5%;}
        #playerElement { width: 100%;}
        .div-main-schedule-live { width: 100%;  position: relative;  }
        .div-chat-wrap{width: 100%}
        .tbl-header-wrap { width: 90%;}
        .tbl-header-list { width: 90%;}
        .tbl-notice-wrap { width: 100%;}
        .tbl-notice-view-wrap  { width: 100%;}
        .div-page-intro-title { width: 90%;}
        .div-page-intro-detail { width: 90%;}
        .div-main-sub-sympo{ width: 95%;padding-left: 2.5%;padding-right: 2.5%;}
        .div-main-intro-sub-image{ width: 100%;}
        .div-main-intro-sub-desc { width: 100%;}
        .div-title-area { width: 100%;}
        .div-main-news-detail { margin-left: 30px;}
        .div-main-intro-sympo-image { width: 90%; margin-left: 5%;}
        .div-main-intro-sympo-desc { width: 90%;margin-left: 5%;}
        .div-main-intro-wrap { width: 100%;}
        .div-page-intro-wrap { width: 100%;}
             h2{ margin-left: 10px;}
             .div-main-news { width: 100%;}
             .div-main-news-intro { width: 90%; margin-left: 5%; margin-top: 20px;}
            .div-title { margin-left: 20px;  font-size: 16px;}
            .div-mobile-menu { display: block;}
            .div-header { height: 66px; width: 100%;}   
            .div-header-top { display: none;}
            .div-main-intro {width: 100%; top: 0px; margin: auto; position: relative; }
            .div-main-intro img {width: 100%;}
            .div-header-bot-menu-wrap { display: none;}
            .div-header-bot{ width: 100%; height: 64px;}
            .div-header-bot-logo { width: 100px; height: 36px; left: 20px; top:15px}
            .div-header-bot-wrap { height: 65px;}
            .div-main-schedule { width: 100%;}
            .div-main-schedule-wrap { width: calc(100% - 40px); padding: 20px; }
            .div-main-schedule-form-title, .div-main-schedule-form-time,  .div-main-schedule-form-detail   { width: 100%;}
            .div-main-schedule-form-title { font-size: 1.2em; margin-top: 20px;}
            .div-main-schedule-form-time { font-size: 1.0em; margin-top: 20px;}
            .div-main-schedule-form { margin-left: 0px; width: 100%;}
            .div-main-schedule-form-enter { width: 100%; top:5px}
            .div-main-schedule-image {width: 100%;  }
            .div-footer-text { left: 20px; top: 120px; width: calc(100% - 40px);}
            .div-footer-wrap { width: 100%;}
            .div-footer-gcma { top: 220px;}
            .div-footer {width: 100%; height: 280px; position: relative; }
            .div-main-replay-elements { width: 95%; overflow: hidden; margin-left: 2.5%; margin-bottom: 20px; }
            .div-main-replay-elements img { width: 100%;}
            .div-main-replay{ width: 100%;}
            .div-main-replay-wrap { width: 100%;}
        
            .div-contact-wrap { width: 100%;}
            .div-contact-intro{ width: 90%; margin-left: 5%;}
            .div-contact-test{ width: 90%;margin-left: 5%;}
            .div-contact-test-desc {width: 90%; height: 50px; top: 80px; position: relative; font-size: 14px; color: white; }
    }

    @media screen and (orientation: landscape) {
        .div-menu-mobile { width: 70%; height: 100%; background-color: #ffffff; position: absolute;top:66px;z-index: 25; right: 0px; display: none; overflow-y: scroll;} 

 
  }