@charset "utf-8";
/*
CSS Document 
allisxen@gmail.com
*/
@import url(gnufix.css);
@import url('//fonts.googleapis.com/css2?family=Nanum+Brush+Script&display=swap');
body{font-size:15px}
body,h1, h2, h3, h4, h5, h6,textarea, select{font-family: 'Noto Sans KR', sans-serif;}
_body{font-family: 'Nanum Gothic', sans-serif;}
caption{caption-side: unset; color:inherit;}
.eqheight {display:flex;flex-wrap: wrap; -ms-display:flexbox; /*ie10*/ padding:0 5px;}
.eqheight [class^='col-']{ display:flex;flex-direction: column;}
.fa{ font-family:FontAwesome,"Font Awesome 5 Free";}
#content,p{ word-break:keep-all;}

.nav-top-sub{ background:rgba(72,84,106,.8); font-size:90%; min-height:8px;}
.nav-top-sub .col{ display:flex;align-items:flex-end;justify-content:flex-end; }
.nav-top-sub ul{ margin-bottom:5px}
.nav-top-sub li{ display:inline-block; margin-left:12px;}
.nav-top-sub .title{ color:#fff;}
.nav-top-sub a{ color:rgba(255,255,255,.8); margin-left:10px}
.nav-top-sub a.btn_admin{ color:#fff; padding:2px 6px; height:2em; line-height:1.5em}

.navbar{ padding:1rem 0;}
.dropdown-menu{ font-size:.875rem;}
.dropdown-item.active, .dropdown-item:active{ background:rgba(0,0,0,.5);}
@media (min-width: 768px) {}
.navbar-expand-lg .navbar-nav .nav-link{padding-left:1rem; padding-right:1rem;}


.con-container h1,.con-container h2,.con-container h3{ font-size:2em; color:#5798d2; font-weight:500; letter-spacing:-.5px; position:relative; padding:0 0 12px 0; margin-top:4rem; margin-bottom:38px;}
/*.con-container h1:first-of-type,
.con-container h2:first-of-type,*/
.con-container h3:first-of-type{ margin-top:0;}
.con-container h1 strong{ color:#000; font-weight:900; }
.con-container h1:before,
.con-container h2:before,
.con-container h3:before{ content:' '; position:absolute; bottom:0; left:0; width:54px; height:2px; background:#969696;}

.con-container h2{ font-size:1.8em; color:#b27f1e; margin-bottom:1rem; letter-spacing:-2px}
.con-container h2:before{ background:#cbb58b; width:50px; height:3px;bottom:-6px;}
.con-container h3{ color:#E9586B; font-size:1.429em; padding:0 0 0 10px; margin-top:3rem; margin-bottom:1.5rem;}
.con-container h3:before{ background:#E9586B; width:4px; height:auto; bottom:0; top:.25em;}
.con-container h4{ color:#626262; font-size:1.286em; margin-top:2rem;margin-bottom:1rem;}
.con-container h4:before{ content:'-'; color:#E9586B; font-size:1.143em; margin-right:5px; display:inline-block;}

.con-container h2{ color:rgba(0, 0, 0, .71);}
.con-container h2:before{ background-color:#E9586B; bottom:auto; top:-14px;}

.con-container h3.center{ text-align:center;}
.con-container h3.center:before{ display:none;}


.contentpage #content ul.list{ padding:0; margin-bottom:0}
.contentpage #content ol.list{padding-left:26px;}
.contentpage #content ol.list{ list-style-position: inside; }
.contentpage #content ul.list li{list-style:none; position:relative; padding-left:12px;margin-bottom:8px;}
.contentpage #content ul.list li:last-child{ margin-bottom:0;}
.contentpage #content ul.list li:before { position:absolute; left:0; top:-2px;content: "\2022"; color:#777; }
.contentpage #content .list li ul{ margin:10px 0 0 20px;}
.contentpage #content ol.list>li{counter-increment: list;list-style-type: none;position: relative; margin-bottom:8px;}
.contentpage #content ol.list>li:before {color: #e75204;content: counter(list) ".";left:-32px;position: absolute;text-align: right;width: 26px;}

.list-group-numbered>li{counter-increment: list; }
.list-group-numbered>li::before {content: counter(list) ". ";}
.site-footer{ background:#2d2d2d; padding-top:60px; padding-bottom:40px; color:#c5c5c5;}
.subpage .site-footer{margin-top:60px;}
.site-footer .logo-alt{ opacity:.6;}
.site-footer .heading{ font-size:1.4em;}
.site-footer .heading span{ font-size:.7em; display:block;}
.site-footer a{ color:#DCDCDC;}
.site-footer a:hover{ color:#fff;}
.site-footer address{ font-size:.92em;}
.site-footer p{ margin-bottom:.4rem;}
.site-footer .copyright{font-size:.9em; color:#A9A9A9; margin:15px 0;}
.site-footer .social-link{ padding-top:15px; border-top:1px solid #3f3f3f;}
.site-footer .social-link a{ margin-bottom:6px; margin-left:20px;}
.site-footer .social-link a:first-child{ margin-left:0;}
.site-footer .social-link [class^='fa']{ margin-right:5px; }
.site-footer a.admin-link{ color:#888; font-size:.8em}

/* board #####################################################################*/
.write_div{ position:relative;}
._write_div input:valid + label.sound_only,
write_div input:not(:placeholder-shown) + label.sound_only,
.write_div input:focus + label.sound_only,
.write_div textarea:not(:placeholder-shown) + label.sound_only,
.write_div textarea:focus + label.sound_only{ display:block; position:absolute;top:-6px; left:8px; width:auto; height:1.1em; line-height:1; font-size:.92em; padding:0 3px!important; background:#fff; color:#999;}
label.sound_only strong{ display:none;}
.write_div .title{ font-weight:700;}

.bo_cate_link_faculty{ min-width:96px; text-align:center;}
.list-cate2{ background:#afd5ab; font-size:.9em; border-radius:5px; padding:0 6px; margin-right:5px; font-weight:400;}

#bo_list .bo_tit .fa-fire{ color:#CC0000;}
#bo_list .bo_tit .fa-download{ font-size:10px; height:auto; width:auto; padding:5px 4px 3px; line-height:normal}

.download.dn-pdf{ display:inline-block; padding:.6em 1em; border:1px solid #dfdfdf; border-radius:5px; box-shadow:1px 1px 5px 0px hsl(232, 36%, 96%)}
.download.dn-pdf i{ font-size:1.5em; margin-right:5px; vertical-align:middle; color:#990000;}
.download.dn-pdf a{ color:#555;}
.download .file-size{ font-size:.76em; color:#fff; background:#777; display:inline-block; padding:1px 6px; border-radius:4px;}

#regist .form-group label{ color:#777; font-weight:700; font-size:.86em; margin-bottom:2px}
#regist .form-row{ margin-bottom:.5rem;}
#regist #bo_list .td_datetime{ width:120px; font-size:.9em;}
#regist #bo_list .td_datetime time{ display:block;}
.btn_bo_user .dn-excel{ width:auto; padding-top:.375rem}
.inner-striped td{background-color: rgba(0,0,0,.05);}
.table-striped tbody tr:nth-of-type(2n+1) .inner-striped{ background:#fff;}


/* con ###################################################################### */

.header-page{ text-align:center; background-color:#777; padding:60px 0; margin-bottom:50px;background-size:cover;position:relative;}
.header-page::before {content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-image:linear-gradient(rgba(0, 0, 0, 0.5),rgba(255, 255, 255, 0.1) 80%)}
/* .header-page{background-image:url(../img/bg-header-page.jpg); } */
.header-page{background-image:url(../img/bg-header-page.v2.jpg); }
.faculty .header-page{background-image:url(../img/bg-header-page1.jpg);}
.education .header-page{background-image:url(../img/bg-header-page2.jpg);}

.header-page h1{ margin:0; color:#fff; text-shadow:1px 2px 4px rgba(0, 0, 0, 1); position:relative; font-size:2.2em;animation: fadein .8s;}
.header-page h1 span{border-bottom:4px solid rgba(255,255,255,.6);}
.header-page h1:after{ content:attr(data-subheading); display:block; margin-top:20px; font-size:.4em; font-weight:normal; color:rgba(255,255,255,.7)}

@keyframes fadein {
    from {
        opacity:0;
        top:15px;
    }
    to {
        opacity:1;
        top:0;
    }
}
.lnb .container{position:relative;}
.breadcrumb{ position:absolute; right:10px; top:10px; background:transparent; text-align:right; font-size:.86em; }
.breadcrumb,
.breadcrumb a{ color:#FFFFFF; color:rgba(255,255,255,.86)}
.breadcrumb-item + .breadcrumb-item::before{ content:'\203A'; font-family:FontAwesome }

#splash{ margin-top:2rem;}
#splash .slides li{position:relative;}
#splash .slogan{ width:70%;right:20px; bottom:10%; font-size:1.6em; line-height:1.2; font-weight:700; color:#fff;word-break:keep-all;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.55);}
#splash .slogan b{ font-size:70%; font-weight:400; display:block; margin-bottom:10px;}
#splash .flex-direction-nav{ margin-bottom:0;}

.flex-control-paging{ position:relative; bottom:auto;}
.flex-control-paging li{ width:10px; height:10px;}
.flex-control-paging li a{ background-color:#777;}
.flex-control-paging a.flex-active{ background-color:#e26f7d;}

.main-service,
.latest{ margin:3rem 0;}


.main-service h2{ font-size:1.9em; font-weight:700; margin-bottom:1rem}
.main-service [data-subheading]:after{content: attr(data-subheading); color:#e26f7d; font-size:.6em; margin-left:.6em}
.main-service [class^='col-'] { padding-bottom:20px;}
.main-service h3{ position:relative; margin-bottom:40px; font-size:1.6em; font-weight:700; color:rgba(72,84,106,.9);}
.main-service h3::after{ content:' '; position:absolute; left:0; bottom:-20px; width:50px; height:1px; background:#3554ae;}
.main-service [class^='col-']:hover h3{ color:#c05461}
.main-service [class^='col-']:hover h3::after{ background-color:#c05461}
.main-service p{ color:#777; font-size:.96em; line-height:1.5; margin-bottom:25px; min-height:5rem}
.main-service a{ border:1px solid #aaa; color:#727272; padding:10px 30px; color:#222; font-family:Raleway; font-size:.86em; font-weight:bold; text-decoration:none;}
.main-service a:hover{ color:#FFFFFF; background:#c05461; border-color:#c05461}

.zoom{ overflow:hidden; }
.zoom img{transition: all .5s; }
.main-service [class^='col-']:hover .zoom img{transform: scale(1.2); transform-origin: center;}


.latest .title{ margin-top:20px; font-size:1.9em; font-weight:700}
.latest .title:after{content: attr(data-subheading); color:#e26f7d; font-size:.5em; display:block; margin-top:.5em}
.latest ul{ margin-bottom:0;}
.latest li{border-bottom:1px solid rgba(0,0,0,.08); transition: all .4s;}
.latest li a{ color:#333; text-decoration:none; display:block;width:100%; padding:25px 36px 25px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all; position:relative}
.latest li:hover{ border-color:#e26f7d;}
.latest li .date{ color:#777; border:1px solid rgba(0,0,0,.15); text-align:center; display:inline-block; min-width:130px; padding:5px 10px; font-size:.85em; margin-right:2rem;transition: all .3s; }
.latest li:hover .date{ background:#e26f7d; color:#fff;}
.latest li a .fas{ position:absolute; font-size:80%; right:10px; top:35px; color:#999;}
.latest li a:hover .fas{ color:#c05461;}
.link-arrow{ display: flex;align-items: center;flex-basis: auto; margin-bottom:10px;}
.link-arrow .txt{ margin-right:10px; font-size:.84em; color:#333}  
.link-arrow .arrow { display: block; width: 38px; height: 38px; border: 1px solid #ccc; border-radius: 50%; position: relative; }
.link-arrow .arrow::before,.link-arrow .arrow::after{position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }
.link-arrow .arrow::before {left: 15px; width: 5px; height: 5px; border-top: 2px solid #3b3b3b; border-right: 2px solid #3b3b3b; transform: rotate(45deg);}
.link-arrow:hover .arrow { background:#e26f7d; border-color:#e26f7d }
.link-arrow:hover .arrow::before {border-color:white;}

.subheader-page{margin-bottom:6rem}
.subheader-page .description{ height:100%; background:#fff; margin-top:1em; padding:1.5rem;border: 0.7rem solid #e4e4e4;border-left: 0 none; position:relative;  }
.subheader-page .description:after{ content:'Department of Human Systems Medicine'; display:block; color:#c2c2c2; background:#fff; position:absolute; bottom:-1.3em; left:0; padding:0 10px;}
.subheader-page .description h3{ font-size:1.8em;}
.subheader-page .description h3 small{ display:block; color:#999; font-size:.6em}
.subheader-page .description h4{ margin-top:2rem;}
.subheader-page .description .majors li{ display:inline-block; font-size:.9em; margin-left:.5rem; border:1px solid rgba(0,0,0,.2); background:#65728a; color:#fff; padding:4px 8px}
.subheader-page .description .majors li:first-child{ margin-left:0;}


.zoom-pop{ position:relative; display:block}
.zoom-pop:after{ content:'\f00e'; font-size:1.4rem; display:block; padding:6px 12px; background:rgba(0,0,0,.6);position:absolute; right:0; bottom:0; color:#fff; font-family:FontAwesome, "Font Awesome 5 Free";}

#location .table tbody th{ background:#f7f7f7; font-weight:500; width:160px; text-align:center; vertical-align:middle;}
#location .table tbody .col-sort{ width:140px; vertical-align:middle}
#location .table tbody .col-number{ color:#777;}
.map-campus .fas{ color:#777;}
.icon-bus{ padding-left:14px;}
.icon-bus:before { content: "\f207";font-family:FontAwesome, "Font Awesome 5 Free"; margin-right:.5em}
.icon-bus.blueline:before{ color:#0066CC;}
.icon-bus.greenline:before{ color:green;}
.icon-bus.airline:before{ color:#65a6d2;}
.icon-bus.townline:before{ color:#109a00;}

.bus .bar,
.bus .triangle{ margin-left:.5em; margin-right:.5em; vertical-align:middle; font-size:.6em; color:#999;}

.metro .title{ font-weight:500; display:inline-block; min-width:180px}
.metro .fa-stack{ font-size:.7em;}
.metro .fa-stack-1x{ color:#fff;}
.metro .fa-stack-2x{ color:#fa6434;}
.metro .line4 .fa-stack-2x{ color:#2d9ede;}

#course #content .table thead th,
#course #content .table tbody th{ background:#f7f7f7; word-break:keep-all;white-space:nowrap;}
#course #content .table thead th{ vertical-align:middle;}

.major-select{counter-reset: section;}
.major-select h3{ cursor:pointer; margin-top:15px; margin-bottom:5px; font-size:1.1em; color:#888;}
.major-select h3:hover{ color:#E9586B;}
.major-select h3.active{ color:#E9586B; margin-top:30px; font-size:1.3em;}
.major-select h3::before {
  counter-increment: section; 
  content: counter(section)'.'; margin-right:5px; position:relative; background:none; top:auto; bottom:auto; width:auto;
}
.major-select h3::after { content:'';
display:block; position:absolute;
    background: #999;
    width: 4px;
    height: auto;
    bottom: 0;
    top: .2em; left:0;
}
.major-select h3.active::after{ background:#E9586B;}
.major-select .table-responsive{ display:none;}

.tabs .nav-tabs{ border-bottom:1px solid #bebebe; margin-bottom:20px;}
.tabs .nav-tabs li{ width:50%; text-align:center; }
.tabs .nav-tabs>li > a{ display:block;border-radius:0; padding:10px; font-size:1em; font-weight:bold; color:#999;border-bottom:6px solid #fff; margin-right:0; text-decoration:none;transition: all .5s;}
.tabs .nav-tabs > li > a.active{border-bottom:6px solid #456e9b; color:#222; background:rgba(0,0,0,.07);}
.tabs .nav-tabs > li > a:hover{border-bottom:6px solid #79a0ca;}

.zoom{ overflow:hidden;}
.zoom img{transition: all .4s; margin-bottom:0; border-bottom: 9px solid #e26f7d;}
.zoom:hover img{transform: scale(1.05);transform-origin: center;}

.ico-before:before{font-family:FontAwesome, "Font Awesome 5 Free"; margin-right:.4em; font-weight:700}
.crew a[href^="mailto:"]{ font-size:.64em; font-weight:normal; margin-left:6px;}
.crew a[href^="mailto:"]:before{content:'\f003'; font-family:FontAwesome; margin-right:4px}
#management .crew a[href^="mailto:"]{ display:block; margin-left:0; margin-top:4px}

.crew .media{ margin-bottom:40px;}
.crew .media h3{ padding-left:0; color:#636363; margin-bottom:25px; font-size:1.429em; font-weight:700}
.crew .media h3 small{ font-size:.7em; display:block; margin-top:.5em}
.crew .media h3:before{ display:none;}
.crew .media .description{ margin-bottom:4px;}
.crew .media img{ border-bottom:4px solid #e26f7d}
.crew .media .view-more{ font-size:.9em; padding:2px 4px; color:#fff; background:#743c59}

.crew .media .description{ color:#767676; position:relative;transition: all .5s;}
.crew .media .description.over-con{ max-height:210px; overflow:hidden; padding-bottom:20px }
.crew .media .over-con::before {
  content: '';
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 72%, white 88%, white 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  height:100%;
  pointer-events:none;
}
.crew .media .description.over-con-open{  padding-bottom:35px;}
.crew .media .description .readtoggle{ display:none;position:absolute; left:0; bottom:0; padding:2px 6px; border:1px solid #dedede; font-size:.86em; cursor:pointer;}
.crew .media .over-con .readmore{ display:block; }
.crew .media .over-con-open .readless{ display:block; background:rgba(0,0,0,.5); color:#fff; }

.crew .program-involved,
.crew .cate-involved{ display:block; margin-bottom:.5em; color:#555; font-weight:normal;}
.crew .program-involved:before{ content: "\f02d";}
.crew .cate-involved:before{ content: "\f51c";}
.viewpage .crew .media figure img{ margin-right:1rem} 

.autograph{font-family: 'Nanum Brush Script', cursive; font-weight:bold; font-size:2.2em; margin-left:.3em; color:#626262; letter-spacing:6px}

.agenda .table th .title{ display:block; color:#48546a; font-weight:400;}


#vision .purpose figure {display:flex;flex-wrap:wrap;align-items:center;justify-content:center; position:relative; background:#000;}
#vision .purpose figure:before { content: ''; position: absolute; top: 10px; bottom: 10px; left: 10px; right: 10px; border:1px solid #fff; }
#vision .purpose figcaption {position:absolute; font-size:1.14em; color:#fff; font-weight:500; width:100%; text-align:center; padding:0 10px;}
#vision .purpose figure img{ opacity:.5;transition: all .5s;}
#vision .purpose figure:hover img{ opacity:1;}

.slogan.vision{ text-align:center; margin-bottom:30px; font-size:1.5em; background:rgba(72,84,106,.8); color:#fff; padding:10px;}
.slogan.vision > div{ border:1px solid rgba(255,255,255,.7);; padding:15px;}
.slogan.vision .title{ display:block; margin-bottom:1em; color:#81D4FA; font-size:.8em;}

.vision-ability h3{ font-size:1.2em; margin-bottom:.5rem}
.vision-ability .list-group-item{transition: all .25s; min-height:52px}
.vision-ability .list-group-item:hover{ background:#E1F5FE; font-size:1.1em;}



#faq h4.panel-title{font-weight:normal; font-size:1.2em;padding:0; margin:0; }
#faq h4.panel-title:before{ display:none;}
#faq h4.panel-title a{ display:block; width:90%; text-decoration:none; color:rgba(72,84,106,.9); padding:15px 0; }
#faq h4.panel-title a.collapsed{ color:#999;}
#faq h4.panel-title a:before{font-weight:normal;font-family: FontAwesome;content: "\f146"; margin-right:8px;}
#faq h4.panel-title a.collapsed:before{content: "\f0fe";}
#faq .panel{ border:0 none;}
#faq .panel-heading{ background:none; border:0; padding:0;}
#faq .panel-body{padding:15px; border:1px solid #e5e5e5; margin-bottom:20px; background:rgba(0,0,0,.025); line-height:1.8}


/* rwd ####################################################################### */
@media (min-width: 576px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1200px) {}

@media (max-width: 575.98px) {}
@media (max-width: 767.98px) {
body{ font-size:14px;}
.header-page{ padding:30px 0;}
.header-page .lnb{ display:none;}
.navbar-brand-two img{ width:230px;}
#splash{ margin-top:.5rem;}
#splash .slogan{ font-size:.74em; width:90%;}
.latest{ margin:1rem 0;}
.main-service{ margin:2rem 0;}

.latest .link-arrow{align-self: flex-end; transform: translateY(-30px);}
.latest li a{ padding:10px 25px 10px 0;}
.latest li .date{ display:block; padding:2px 6px; min-width:60px; max-width:100px; font-size:.8em; margin-bottom:5px;}
.latest li a .fas{ top:46px;}

.subheader-page .title-img{ max-width:200%; width:200%; height:auto;}
.subheader-page .description{ border-width:.4rem; border-left:0.4rem solid #e4e4e4; padding:.75rem}
.subheader-page .description::after { font-size:.7em;}
.subheader-page .description .majors li{ font-size:.8em; margin-left:0; margin-bottom:4px}

.metro .title{ display:block;}

.media figure{ width:64px; margin-right:10px}
.media figure img{ width:100%; height:auto;}

.site-footer{ padding-top:30px;}
.site-footer .logo-alt{ margin-bottom:15px;}
.site-footer .heading{ display:none;}
.site-footer .social-link a{ margin-left:10px;}
}
@media (max-width: 991.98px) {}
@media (max-width: 1199.98px) {}

@media (min-width: 576px) and (max-width: 767.98px) {}
@media (min-width: 768px) and (max-width: 991.98px) {}
@media (min-width: 992px) and (max-width: 1199.98px) {}
@media (min-width: 1200px) {}