/**
* 권역임시 포털 스타일
**/
.xn_potal{
    display: block;
    width: 100%;
}

/**** Common ************************************************/

.xn_potal * {max-height:1000000px;margin:0;padding:0;box-sizing:border-box;}
.xn_potal img,fieldset,button {border:none;outline:0}
.xn_potal hr,button img {display:none;}
.xn_potal input,select,button,textarea {vertical-align: top;font-size:15px;font-weight:400;color:#666;line-height:1.63;letter-spacing:-0.04em;font-family:'Noto Sans KR','Malgun Gothic','맑은 고딕','돋움',Dotum,'굴림',Gulim,Tahoma,Verdana,Geneva,sans-serif,Apple Gothic,AppleGothic;box-sizing:border-box;outline:0;}
.xn_potal h1,h2,h3,h4,h5,h6 {letter-spacing: -0.04em;}
.xn_potal input[type=submit] {cursor:pointer;appearance:none;-moz-appearance:none;-webkit-appearance:none;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;}
/* select::-ms-expand {display: none;}*/
.xn_potal ul,li {list-style:none;}
.xn_potal a {display:block;font-weight:400;color:#606060;text-decoration:none;vertical-align:top;}
.xn_potal a:hover,a:active,a:focus,a:visited {text-decoration:none;}
.xn_potal table {width:100%;table-layout:fixed;border-collapse:collapse;border-spacing:0;text-align:center;}
.xn_potal table img {vertical-align:top;}
.xn_potal th,td {vertical-align:middle;word-wrap:break-word;word-break:break-all;}
.xn_potal form  {margin:0;padding:0;}
/*img {width:100%;vertical-align:top;}*/
.xn_potal img {vertical-align:top;max-width: 100%;}
.xn_potal table img {width:auto;vertical-align:middle;}
.xn_potal legend  {position:absolute;left:0;top:0;width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;}/* For Screen Reader */ 
.xn_potal caption {width:0;height:0;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999px;overflow:hidden;visibility:hidden;}
.xn_potal em {font-style:normal;}
.xn_potal b {font-weight: 500;}
.xn_potal strong {font-weight: 700;}
.xn_potal .blind {position:absolute;left:-9999px;top:-9999px;}
.xn_potal .fl {float:left;}
.xn_potal .fr {float:right;}
.xn_potal .mc {margin:0 auto;}
.xn_potal .clear:after {content:"";display:block;clear:both;}
.xn_potal .wrap {width: 100%;width:1250px;margin:0 auto;}

#wrap {position:relative;margin:-1px 0 0;padding:0 0 0 0;width:100%;overflow: hidden;}


/* Main */
.xnpo1_main_visual {
    position: relative;height: 60.625em; background-size:cover;}
.xnpo1_slogan {position: absolute;top: 34%;left: 50%;width: 100%;max-width: 1250px;transform:translateX(-50%);}
.xnpo1_slogan h3 {
    width: 540px;
    max-width: 100%;
    height: 60px;
    background-size: 100%;
    font-size: 50px;
    font-weight: bold;
    color: #fff;
    line-height: 70px;
}
.xnpo1_slogan h3 .xnpo1_slogan-title{
    font-size: 24px;
    font-weight: bold;
    line-height: 47px;
}

.xnpo1_slogan h3 .xnpo1_slogan-subtitle{
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.xnpo1_banner2 > ul > li > h3 .xnpo1_banner2-1-title{
    font-size: 24px;
}

.xnpo1_banner {position: absolute;bottom: 12.371%;left: 50%;width: 100%;max-width: 1250px;transform:translateX(-50%);}
.xnpo1_banner ul li {float: left;width: calc((100% / 3) - 30px);margin-left: 45px;text-align: center;}
.xnpo1_banner ul li:first-child {margin-left: 0;}
.xnpo1_banner ul li .img {display: inline-block;vertical-align: top;width: 264px;height: 65px;max-width: 100%;}
.xnpo1_banner ul li:nth-child(1) .img {background: url(xnpo1_main-01.jpg) no-repeat center center;background-size:100%;}
.xnpo1_banner ul li:nth-child(2) .img {background: url(xnpo1_main-02.jpg) no-repeat center center;background-size:100%;}
.xnpo1_banner ul li:nth-child(3) .img {background: url(xnpo1_main-03.jpg) no-repeat center center;background-size:100%;}
.xnpo1_banner ul li a {position: relative;top: 0;padding: 2.5em 0;background-color: #fff;border-radius:1.5em 0 1.5em 0;transition:.3s;}
.xnpo1_banner ul li a p {position: relative;max-width: 146px;margin: 1.25em auto 0;padding-left: 0.75em;border-bottom: 1px solid #333;font-weight: 700;line-height: 2.75;color: #333;text-align: left;transition:.3s;}
.xnpo1_banner ul li a p:after {display: inline-block;content: '';position: absolute;top: 50%;right: 0.75em;transform:translateY(-50%);width: 1em;height: 1em;background: url(xnpo1_link.png) no-repeat left top;background-size:100%;}
.xnpo1_banner ul li:hover a {top: -30px;}

#header{
    height: 84px;
}

#header .xn-header-menu,
#header .navbar-static-top,
#header .navbar-static-top .container,
#header .navbar-static-top .container .navbar-header,
#header .xn-header-menu li a {
    height: 84px;
}

#header .xn-header-menu li a {
    line-height: 82px;
}

#header .xn-main-catalog-header-logo{
    /* margin-top: 10px; */
}

#header .btn-login {
    margin-top: 25px;
}

.xnp-widget-course .xnbw-item-container-wrap{
    width: 1270px;
}

.xn-widget-container.board .xnbw-items-container .xnbw-item-container .xnbw-post-list-title,
.xn-widget-container.board .xnbw-items-container .xnbw-item-container .xnbw-post-list-created{
    display: inline-block;
    vertical-align: top;
}

.xnp-widget-course .xnbw-items-container{
    width: 1360px;
}
.xnp-widget-course .xnbw-items-btn-wrap{
    display: inline-block;
}

/* nav */
#header .xn-header-menu{
    display: table;
    height: auto;
    table-layout: fixed;
    width: 100%;
    max-width: 480px;
}
#header .xn-header-menu li {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    text-align: center;
    float: none;
    width: auto;
    font-size: 1em;
    
}
#header .xn-header-menu li:before {
    display: block;
    content: '';
    position: absolute;
    top: 43px;
    left: 0;
    width: 1px;
    height: 17px;
    margin-top: -8px;
    background-color: #ddd;
}
#header .xn-header-menu li:first-child:before {
    display: none;
}
#header .xn-header-menu li:hover {
    background-color: #eee;
}
#header .xn-header-menu li a {
    display: block;
    height: auto;
    font-size: 1.25em;
    font-weight: 600;
    line-height: 84px;
    color: #111;
}

#header .btn-dropdown-user-menu{
    margin: 22px 0;
}

#footer .xn-main-catalog-footer-info{
    display: flex;
    align-items: center;
    margin: auto;
}

#footer .xn-main-catalog-footer-info .xn-main-footer-logo{
    background: url(footer_logo6.svg) no-repeat top left;
    width: 240px;
    height: 56px;
    background-size: contain;
}

#footer .xn-main-catalog-footer-info .xn-main-footer-logo .xn-main-footer-logo-image{
    display: none;
}
#footer .xn-main-catalog-footer-upper{
    padding: 4px 0;
}
/* Media */
@media (max-width:1400px){
     .xnpo1_media {box-sizing:border-box; padding:0 20px;}
     #footer {box-sizing:border-box; padding:40px 20px;}
}

.xnpo1_mo {display:none;}

@media (max-width:1280px){
   #footer .xnpo1_ft_logo {display: none;}
   #footer .xnpo1_address {padding-left: 0;}
   #footer .xnpo1_address p span:last-child:before {display: none;}
   .xnpo1_banner2 > ul > li > h3 .xnpo1_banner2-1-title {
    /* font-size: 16px; */
}
}

@media (max-width:1200px){
}


@media (max-width:1024px){
    .xnpo1_slogan h3 img {height:3.75em}
    .xnpo1_banner ul li {width: calc((100% / 3) - 10px); margin-left: 15px;}
   
}

@media (max-width:960px){
    .xnpo1_banner ul li img {width: 80%;}
}

@media (max-width:800px){
    .xnpo1_pc {display: none;}
    .xnpo1_mo {display: block;}
    .xnpo1_media {padding:0 2vw;}
    .xnpo1_main_visual {height: 124vw;}
    .xnpo1_slogan {top: 14vw;text-align: center;}
    .xnpo1_slogan h3 {margin: 0 auto;height: 50px;background-size:auto 100%}
    .xnpo1_banner {top: 27vw;bottom: auto; width:74%;}
    .xnpo1_banner ul li .img {height: 50px;background-size:auto 100% !important}
    .xnpo1_banner ul li a {padding:4vw 0;}
    .xnpo1_banner {}
    .xnpo1_banner ul {text-align: center;}
    .xnpo1_banner ul li {display: inline-block; width:100%; margin:0; margin-bottom: 20px; }
    .xnpo1_banner ul li a {padding:4vw 0;}
    .xnpo1_banner2 > ul > li > h3 .xnpo1_banner2-1-title {
        font-size: 18px;
    }
}

@media (max-width:640px){
    .xnpo1_slogan {top: 13vw;}
    .xnpo1_slogan h3 {height: 7.5vw;    font-size: 26px; }

    .xnpo1_banner ul li {margin-bottom: 2vw;}
    .xnpo1_banner ul li .img {height: 10vw;}
    .xnpo1_banner ul li a p {width: 36%;font-size:3.2vw; margin:2vw auto 0;line-height:2;}
}
/**
* View Common Styles - 기본형

* 01 header
    ** 01-1 submenu
* 02 content
    ** 02-1 visual
        ***  02-1-1 slogan
        ***  02-1-2 xn-login
    ** 02-2 manual
    ** 02-3 widget
* 03 footer
* 04 반응형
    ** 04-1 mobile 320px ~ 768px
        *** 04-1-1 header
        *** 04-1-2 모바일 메뉴
        *** 04-1-3 visual
        *** 04-1-4 manual
        *** 04-1-5 widget 게시판
        *** 04-1-6 footer
    ** 04-2 web 769px ~ 1280px
        *** 04-2-1 header
        *** 04-2-2 widget
        *** 04-2-3 footer
* 05 학교별 custom 변경사항

**/

.xn-login-container .user-login-prefix{
    width: 100%;
    height: 45px;
    font-size: 16px;
    color: #333;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

.xn-login-container .user-login-prefix-info{
    color: #286bfc;
    font-size: 14px;
    margin-top: 10px;
    display: inline-block;
}


.xn-login-container .user-login-prefix-info-phone-description-ul {
    display: inline-block;
    list-style: initial;
}

.xn-login-container .user-login-prefix-info-phone-description-li {
    list-style: initial;
    text-align: left;
}

/**
* 01 header
**/

#header .xn-global-top-container{
    display: block;
    background: #eee;
    height: 36px;
    width: 100%;
    font-size: 14px;
}

#header .xn-global-top-container .xn-global-top{
    display: block;
   width: 1250px;
   margin: 0 auto;
   color:#333;
   padding: 7px 0px;
}


#header .btn-login{
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 20px;
    color: #333 !important;
    padding: 8px 15px;
    -webkit-appearance: none;
}

#header .btn-login:hover{
    background-color: #f3f3f3;
    border: 1px solid #ddd;
}

#header .xn-header-menu li{
    font-weight: 500;
}

/**
* 01 header
    ** 01-1 submenu
**/

/* 서브메뉴 보이지 않게 처리 */
#header .xn-sub-menu-outer-wrapper{
    display: none !important;
}

/**
* 02 content
    ** 02-1 visual
**/

#content {
    /* padding-top: 120px !important; */
}

#content #visual{
    background: url(main_visual.jpg) no-repeat top;
}

#content .main_visual_slide{
    display: inline-block;
    width: 100%;
    height: 500px;
}

#content #visual .visual-container{
    width: 1250px;
    height: 500px;
    padding: 160px 0px;
}

/**
* 02 content
    ** 02-1 visual
        ***  02-1-1 slogan
**/
#content #visual .visual-slogan-container{
    position: absolute;
    z-index: 999;
    width: 100%;
}
#content #visual .visual-container .main-slogan-wrap{
    z-index: -999;
    text-shadow: 1px 1px 2px black;
    margin-top: 20px;
}

#content #visual .visual-container .main-slogan-wrap h1{
    margin: 0 auto;
    font-weight: 700;
    line-height: 1.6;
    text-shadow: 1px 1px 2px black;
}

#content #visual .visual-container .main-slogan-wrap .sub-title{
    font-size: 24px;
    color: white;
}
.xn-widget-slider-container .xnws-caption {
    width: 1250px;
    top: 50%;
    bottom: initial;
    left: 50%;
    right: 50%;
    transform: translate(-50%, -50%);
    text-align: left;
    padding: 0;
}
#content .xn-widget-slider-container .xnws-caption .title1, 
#content .xn-widget-slider-container .xnws-caption .title2 {
    font-size: 40px;
    font-weight: 700;
    display: block;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
#content xn-widget-slider-container .xnws-caption .title1 {
    margin-bottom: 0px;
}
#content xn-widget-slider-container .xnws-caption .title2 {
    margin-bottom: 15px;
}
#content .xn-widget-slider-container .xnws-caption .sub-title {
    color: #fff;
    font-weight: bold;
    font-size: 22px;
    margin-top: 10px;
text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
    display: inline-block;
}
@media (min-width:320px) and (max-width:768px) {
.xn-widget-slider-container .xnws-caption {
    width: 100%;
    text-align: center;
}
#content {
    padding-top: 0px !important;
}
#content .xn-widget-slider-container .xnws-caption .title1, #content .xn-widget-slider-container .xnws-caption .title2{
    font-size: 24px;
}
}
@media (min-width:769px) and (max-width:1280px) {
.xn-widget-slider-container .xnws-caption {
    width: 1008px;
}
}




/**
* 02 content
    ** 02-1 visual
        ***  02-1-2 xn-login
**/

/* login 전*/
#content #visual .xn-main-login-container{
    background: rgba(0,0,0,0.3);
    width: 280px;
    height: 260px;
    margin-top: -20px;
}

#content #visual .xn-main-login-container .xn-main-lms-link-wrap{
    background-color: #333333;
    width: auto;
    height: 50px;
    margin: 20px;
    border-radius: 2px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

#content #visual .xn-main-login-container .xn-main-lms-link-wrap:hover{
    background-color: #212529;
}

#content #visual .xn-main-login-container .xn-main-link-wrap a{
    text-align: center;
}

/* login 후*/
#content #visual .xn-main-login-container .xn-sso-login-btn{
    display: none;
    /*width: auto;
    height: 50px;
    margin: 20px;
    background-color: #006cb8;
    border: 1px solid #0766a9;
    padding: 10px;
    border-radius: 2px;*/
}

#content #visual .xn-main-login-container .xn-sso-login-btn:hover{
    background-color: #0c5c95;
}

#content #visual .xn-main-login-container .xn-main-mypage-link-wrap a{
    margin: 0;
    padding-left: 14px;
}

#content #visual .xn-main-login-container .xn-main-login-container-title-wrap .xn-main-login-container-title,
#content #visual .xn-main-login-container .xn-main-login-container-title-wrap .xn-logout-btn,
#content #visual .xn-main-login-container .xn-sso-login-icon,
#content #visual .xn-main-login-container .xn-main-mypage-link-wrap,
#content #visual .xn-main-login-container .xn-main-link-wrap .xn-main-link-icon.xn-main-lms
#content #visual .xn-sso-login-btn-wrap .xn-sso-login-btn-wrap{
    display: none;
}
#content #visual .xn-main-login-container .xn-general-login-btn-wrap {
    display: block;
}
#content #visual .xn-main-login-container .xn-general-login-btn-wrap .xn-general-login-btn{
    width: 200px;
    height: 50px;
    margin: 20px;
    margin-top: 10px;
    background-color: #006cb8;
    border: 1px solid #0766a9;
    padding: 15px 10px;
    border-radius: 2px;
    color: #fff;
}

#content #visual .xn-main-login-container .xn-main-link-wrap .xn-main-link-icon {
    width: 25px;
    height: 25px;
    margin-right: 5px;
    margin-top: -2px;
}

/**
* 02 content
** 02-2 manual
**/

#content .xnp-manual-wrap{
    position: relative;
    top: -258px;
    right: 0;
    width: 1250px;
    height: 140px;
    margin: 0 auto;
    padding: 0 40px;
    z-index: 9999;
}

#content .xnp-manual-wrap .xnp-manual{
    float: right;
}

#content .xnp-manual-wrap .xnp-manual-container{
    width: 200px;
    height: 56px;
    border-bottom: 1px solid rgba(255,255,255,0.5);
}

#content .xnp-manual-wrap .xnp-manual-container:hover{
    background-color: rgba(256, 256, 256, 0.1);
    text-decoration: none;
}

#content .xnp-manual-wrap .xnp-manual-container a:hover{
    text-decoration: none;
}

#content .xnp-manual-wrap .xnp-manual-container .box{
    padding: 10px 2px;
}

#content .xnp-manual-wrap .xnp-manual-container .manual-text{
    color: #ffffff;
    line-height: 2.5;
}

#content .xnp-manual-wrap .xnp-manual-container .manual-download-icon{
    width: 24px;
    height: 24px;
    margin-top: 3px;
    display: inline-block;
    float: right;
    cursor: pointer;
    background: url(download.svg) no-repeat center center;
    background-size: cover;
}


/**
* 02 content
** 02-3 widget 게시판
**/
/**
* 02 content
** 02-3 content widget 공지사항, 이용안내 게시판 내 탭 제거
**/

#content .xnp-widget-container{
    width: 1250px;
}

#content .xnp-widget-container .xnp-widget-board,
#content .xnp-widget-container .xnp-widget-menual{
    display: inline-block;
    width: 592px;
    margin-top: -95px;
    vertical-align:top;
}

#content .xnp-widget-container .xn-widget .xn-widget-container{
    text-align: left;
}

#content .xnp-widget-container .xn-widget .xn-widget-container.board{
    padding: 0px 0px 40px 0px;
    background: none;
}

#content .xnp-widget-container .xnp-widget-course-list .xn-widget .xn-widget-container{
    padding: 15px 0px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-title,
#content .xnp-widget-container .xncw-top-container .xncw-title-wrap .xncw-title{
    font-size: 21px;
    font-weight: bold;
}

#content .xnp-widget-container .xnp-widget-board .xnbw-title-wrap,
#content .xnp-widget-container .xnp-widget-menual .xnbw-title-wrap{
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
    margin-bottom: 4px;
}

#content .xnp-widget-container .xncw-top-container .xncw-title-wrap .xncw-title{
    text-align: center;
}


#content .xnp-widget-container .xnbw-top-container{
    position: relative;
}

#content .xnp-widget-container .xnp-widget-menual{
    float: right;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap .xnbw-category-tab-wrap{
    display: none;
    width: 100%;
    text-align: left;
    border-bottom: 1px solid #222;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap .xnbw-category-tab-wrap .xnbw-all-tab.selected,
#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap .xnbw-category-tab-wrap .xnbw-category-tab.selected{
    font-weight: bold;
    border: 1px solid #333;
    border-bottom: 1px solid #fff;
    color: #333;
    margin-right: 0px;
    background-color: #fff;
    margin-bottom: -1px;
    height: auto;
    padding: 8px 15px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap .xnbw-category-tab-wrap .xnbw-all-tab,
#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap .xnbw-category-tab-wrap .xnbw-category-tab{
    display: inline-block;
    padding: 8px 15px;
    height: auto;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-items-container{
    border: 0px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-more-tab{
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 25px;
    background: url(more_tab.png) no-repeat center center;
    line-height: 20px;
    border: 1px solid #ddd;
    padding: 15px 0px;
    color: transparent;
    background-color: #ffffff;
    margin-top: -3px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-more-tab:hover{
    background-color: #eee;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-category-wrap{
    width: 100%;
    margin-top: 5px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-items-container{
    display: block;
    width: 100%;
    height: auto;
    min-height: 182px;
    padding: 0px;
    vertical-align: top;
    /* margin-top: -18px; */
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-items-container .xnbw-item-container{
    padding: 5px 0px;
}

#content .xnp-widget-container .xn-widget-container.board .xnbw-items-container .xnbw-item-container .xnbw-post-list-category{
    padding: 3px 5px 1px 5px;
    border: 1px solid #333;
    color:#333;
    border-radius: 15px;
    background: none;
    min-width: 70px;
    max-width: 70px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: top;
    margin-top: 0px;
}

.xn-widget-container.board .xnbw-items-container .xnbw-item-container .xnbw-post-list-title,
.xn-widget-container.board .xnbw-items-container .xnbw-item-container .xnbw-post-list-created{
    display: inline-block;
    vertical-align: top;
}


/** =================================================
* 03 footer
================================================= **/

#footer{
    float: left;
}

#footer .footer_link,
#footer .xn-main-catalog-footer-info{
    width: 1250px;
    padding: 20px 0;
}


/** =================================================
* 04 반응형
    ** 04-1 mobile 320px ~ 768px
================================================= **/

@media (min-width:320px) and (max-width:768px) {
    /* 04-1-1 header */
    #header .xn-global-top-container .xn-global-top {
        width: 100%;
    }
    #header .navbar-static-top .container{
        width: 100%;
    }

    #header .xn-main-catalog-header-logo-image{
        width: auto;
        height: 43px;
        margin: 11px 0px;
    }

    /* 04-1-2 모바일 메뉴 */
    #header .navbar-collapse.collapse.in.mobile li{
        padding: 5% 10%;
        border-bottom: 1px solid #f5f5f5;
    }

    #header .navbar-collapse.collapse.in.mobile li > ul{
        background-color: #f5f5f5;
    }

    #header .navbar-collapse.collapse.in.mobile .xn-1depth-menu-wrap .xn-2depth-menu-wrap{
        padding: 12px 0px;
        border-bottom: 1px solid #ffffff;
        padding-left: 10px;
        font-size: 14px;
    }

    #header .navbar-collapse.collapse.in.mobile,
    #header .navbar-collapse.collapse.in.mobile .nav-item.xn-2depth-menu-wrap{
        text-align: center;
        padding: 0 10px;
    }


    /* *** 04-1-3 visual */
    #content #visual{
        background-size: cover;
        height: 500px;
    }

    #content #visual .visual-container{
        width: 100%;
        padding: 40px 15px;
        height: 500px;
    }

    #content #visual .visual-container .main-slogan-wrap{
        background-size: 100%;
        margin-top: 20px;
    }

    #content #visual .visual-container .main-slogan-wrap h1{
        font-size: 30px;
        line-height: 1.2;
    }

    #content #visual .visual-container .main-slogan-wrap .sub-title{
        font-size: 20px;
    }

    #content #visual .visual-container .xn-main-login-container{
        padding: 0px;
        margin-top: 20px;
    }

    #content #visual .visual-container .xn-main-login-container .xn-main-link-wrap{
        background-color: #bb3423;
        border: 0;
        border-radius: 4px;
    }

    #content #visual .visual-container .xn-main-login-container .xn-main-link-wrap:hover{
        background-color: #a02d1f;
    }

    #content #visual .visual-container .xn-main-login-container .xn-main-link-wrap.xn-main-mypage-link-wrap{
        background-color: rgba(65, 65, 65, 0.9);
        border: 0;
        border-radius: 4px;
    }

    #content #visual .visual-container .xn-main-login-container .xn-main-link-wrap.xn-main-mypage-link-wrap:hover{
        background-color: #111111;
    }

    #content #visual .xn-main-login-container .xn-sso-login-btn{
        background-color: #006cb8;
    }

    #content #visual .xn-sso-login-btn-wrap .btn.btn-primary.btn-login.xn-sso-login-btn{
        display: none;
        background-color: rgba(55, 56, 58, 1);
        width: 310px;
        height: 56px;
        border: 1px solid rgba(0, 0, 0, 0.2);
        border-radius: 7px;
        text-align: center;
        font-size: 18px;
        padding: 13px 0px 10px 5px;
        -webkit-appearance: none;
        margin: 10px;
    }

    #content #visual .xn-sso-login-btn-wrap .btn.btn-primary.btn-login.xn-sso-login-btn:hover{
        background-color: rgba(39,39,41);
    }

    #content #visual .xn-main-login-container .xn-sso-login-icon{
        display: none;
    }

    /* *** 04-1-4 manual */
    #content .xnp-manual-wrap{
        top: -55px;
        height: 55px;
        width: 100%;
        background: rgba(0, 0, 0, 0.2);
        padding: 0;
        z-index: 9999;
    }

    #content .xnp-manual-wrap .xnp-manual{
        float: inherit;
    }

    #content .xnp-manual-wrap .manual-stu{
        border-right: 1px solid rgba(256, 256, 256, 0.3);
    }

    #content .xnp-manual-wrap .manual-stu,
    #content .xnp-manual-wrap .manual-prof{
        height: 55px;
        text-align: center;
        width: 50%;
        float: left;
    }

    #content .xnp-manual-wrap .manual-stu .box,
    #content .xnp-manual-wrap .manual-prof .box{
        margin:0 auto;
    }

    #content .xnp-manual-wrap .xnp-manual-container .box {
        padding: 0px;
    }

    #content .xnp-manual-wrap .xnp-manual-container .manual-download-icon{
        margin-top: 15px;
    }

    #content .xnp-manual-wrap .manual-stu .manual-stu-icon,
    #content .xnp-manual-wrap .manual-prof .manual-prof-icon{
        background-image: none;
        width: 0px;
        height: 0px;
        padding: 0;
        margin: 0;
    }

    #content .xnp-manual-wrap .manual-stu .manual-text,
    #content .xnp-manual-wrap .manual-prof .manual-text{
        font-size: 14px;
        line-height: 4;
        margin: 0px 3px;
    }

    #content .xnp-manual-wrap .manual-stu .ic_download,
    #content .xnp-manual-wrap .manual-prof .ic_download{
        width: 20px;
        height: 20px;
        margin: 7px 10px 17px;
        background-size: cover;
        line-height: 2;
    }

    /* *** 04-1-5 widget 게시판*/
    #content .xnp-widget-container{
        width: 100%;
        float: left;
        margin-top: 15px;
    }

    #content .xnp-widget-container .xnp-widget-board,
    #content .xnp-widget-container .xnp-widget-menual{
        width: 100%;
        margin: 0px;
        padding: 0px 0px 10px 0px;
        display: inline-block;
        background-color: #eee;
    }

    #content .xnp-widget-container .xnp-widget-board .xn-widget,
    #content .xnp-widget-container .xnp-widget-menual .xn-widget{
        background-color: #fff;
        padding: 10px;
    }

    #content .xnp-widget-program, #content .xnp-widget-course {
        display: block;
        width: 100%;
    }

    #content .xnp-widget-container .xn-widget-container.board .xnbw-items-container{
        height: auto;
    }

    #content .xnp-widget-container .xn-widget .xn-widget-container.board{
        padding: 10px 0px;
        display: inline-block;
    }

    .xn-widget .xn-widget-container.course{
        padding: 20px 0px;
    }

    #content .xncw-top-container .xncw-title-wrap {
        display: inline-block;
        vertical-align: top;
    }

    #content .xnp-widget-container .xncw-top-container .xncw-more{
        display: inline-block;
        float: right;
        vertical-align: top;
        padding: 0px;
    }

    #content .xnp-widget-container .xnp-widget-course-list .xnbw-item-container{
        margin: 0px 0px 10px 0px;
        width: 350px;
        display: block;
    }

    #content .xnp-widget-menual .xncw-top-container{
        text-align: left;
        padding: 0 10px;
    }

    #content .xnp-widget-menual .xncw-top-container .xncw-more{
        position: absolute;
        padding-right: 0;
    }

    #content .xnp-widget-course-list .xncwi-container .xncwi-info-container.program .xncwi-recruitment-wrap div{
        display: inline-block;
        width: 100%;
    }

    #content .xnp-widget-course-list .xncwi-container .xncwi-background{
        height: 196px;
    }

    #content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-title,
    #content .xnp-widget-container .xncw-top-container .xncw-title-wrap .xncw-title,
    #content .xnp-widget-menual .xncw-top-container .xncw-title-wrap .xncw-title{
        font-size: 24px;
    }

    #content .xnp-widget-container .xn-widget-container.board .xnbw-top-container .xnbw-more-tab{
        width: 40px;
        height: 40px;
    }

    #content .xn-widget .xn-widget-container .xnbw-items-container{
        width: 100%;
    }

    .xnp-widget-course .xnbw-items-btn-wrap {
        display: none;
    }

    .xnp-widget-course .xnbw-item-container-wrap {
        width: 100%;
    }

    /* *** 04-1-6 footer */

    #footer{
        height: auto;
    }

    #footer .footer_link,
    #footer .xn-main-catalog-footer-info{
        width: 100%;
        text-align: center;
    }

}

/** =================================================
    ** 04-2 web 769px ~ 1280px
================================================= **/

@media (min-width:769px) and (max-width:1280px) {
    #header .xn-global-top-container .xn-global-top {
        width: 100%;
    }

    /* *** 04-2-1 header */
    #header .navbar-static-top .container,
    #content .xnp-manual-wrap,
    #content #visual .visual-container{
        width: 984px;
    }


    /* *** 04-2-2 widget 게시판*/
    #content .xnp-widget-container{
        width: 1008px;
    }

    #content .xnp-widget-container .xnp-widget-board,
    #content .xnp-widget-container .xnp-widget-menual{
        display: inline-block;
        width: 482px;
    }

    #content .xnp-widget-program,
    #content .xnp-widget-course{
        display: inline-block;
        width: 100%;
    }

    #content .xnp-widget-course-list .xnbw-item-container{
        width: 233px;
    }

    #content .xnp-widget-course-list .xncwi-container .xncwi-background{
        height: 131px;
    }

    #content .xnp-widget-container .xnp-widget-course-list .xnbw-item-container{
        margin: 8px;
    }

    #content .xn-widget .xn-widget-container .xnbw-items-container{
        width: 980px;
    }

    #content .xnp-widget-menual .xncw-top-container .xncw-more{
        right: 0;
        padding-right: 0;
    }

    #content .xn-widget .xnbw-items-container .xnbw-item-container-wrap{
        width: 100%;
    }

    #content .xnp-widget-course .xn-widget .xnbw-items-container .xnbw-item-container-wrap{
        width: calc(100% - 90px);
    }

    #content .xnp-widget-course .xn-widget .xn-widget-container .xnbw-items-container {
        width: 1080px;
    }


    #content .xn-widget .xnbw-items-container .xnbw-item-container-wrap .xnbw-item-container{
        margin: 10px;
    }


    /* *** 04-2-3 footer */

    #footer .footer_link,
    #footer .xn-main-catalog-footer-info{
        width: 984px;
    }
}


/** =================================================
* 05 학교별 custom 변경사항
================================================= **/

/* ** 로그인 버튼 컬러 */

#content #visual .visual-container .xn-main-login-container .xn-main-link-wrap{
    background-color: #bb3423;
}

#content #visual .visual-container .xn-main-login-container .xn-main-link-wrap:hover{
    background-color: #a02d1f;
}

#content #visual .xn-main-login-container .xn-sso-login-btn,
#content #visual .xn-sso-login-btn-wrap .btn.btn-primary.btn-login.xn-sso-login-btn{
    background-color: #006cb8;
}

#content #visual .xn-main-login-container .xn-sso-login-btn:hover,
#content #visual .xn-sso-login-btn-wrap .btn.btn-primary.btn-login.xn-sso-login-btn:hover{
    background-color: #0c5c95;
}

/** =================================================
* 기본형 스타일 끝
================================================= **/


/** =================================================
* 06 충북권역 대학원격지원센터 메인
================================================= **/

@font-face {
    font-family: 'NanumSquare';
    src: url('./NanumSquareEB.woff2') format('woff2'),
        url('./NanumSquareEB.woff') format('woff'),
        url('./NanumSquareEB.eot') format('eot'),
        url('./NanumSquareEB.otf') format('otf');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'NanumSquare';
    src: url('./NanumSquareB.woff2') format('woff2'),
        url('./NanumSquareB.woff') format('woff'),
        url('./NanumSquareB.eot') format('eot'),
        url('./NanumSquareB.otf') format('otf');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'NanumSquare';
    src: url('./NanumSquareL.woff') format('woff'),
        url('./NanumSquareL.eot') format('eot'),
        url('./NanumSquareL.ttf') format('ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Noto Sans KR';
    src: url('./NotoSansKR-Regular.woff2') format('woff2'),
        url('./NotoSansKR-Regular.woff') format('woff'),
        url('./NotoSansKR-Regular.otf') format('otf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.xnpo1_main_visual {height: 770px;background: url(xnpo1_visual.jpg) no-repeat center center;}
.xnpo1_slogan {top: 50%;transform:translate(-50%,-50%);text-shadow:2px 2px 5px rgba(0,0,0,0.25);}
.xnpo1_slogan span {font-family: 'NanumSquare';display: block;font-size: 18px;font-weight: 900;color: #fff;margin-bottom: .7em;}
.xnpo1_slogan h3 {font-family: 'NanumSquare';height: auto;font-size: 60px;width: 100%;}

.xnpo1_banner2 {font-size: 1em;position: absolute;top: 50%;left: 50%;transform:translate(-50%,-50%);width: 100%;max-width: 1240px;}
.xnpo1_banner2:after {display: block;clear: both;content: '';}
.xnpo1_banner2 > ul {float: right;text-align: center;color: #fff;}
.xnpo1_banner2 > ul > li {float: left;position: relative;margin-left: 20px;width: 320px;height: 480px;border-radius:20px 0 20px 0;overflow: hidden;box-shadow:5px 5px 20px rgba(0,0,0,0.18);}
.xnpo1_banner2 > ul > li.xnpo1_banner2-1 {background: url(./xnpo1_banner1.jpg) no-repeat center center;background-size:cover; padding: 70px 20px;}
.xnpo1_banner2 > ul > li.xnpo1_banner2-2 {background: url(./xnpo1_banner2.jpg) no-repeat center center;background-size:cover;}
.xnpo1_banner2 > ul > li > h3 {position: relative;font-family: 'NanumSquare';font-size: 30px;font-weight: 900;line-height: 1.125;padding-bottom: 23px;margin-bottom: 34px;}
.xnpo1_banner2 > ul > li > h3:before {display: block;content: '';position: absolute;bottom: 0;left: 50%;width: 20px;height: 2px;background-color: #fff;margin-left: -10px;}
.xnpo1_banner2 > ul > li > ul {display: inline-block;vertical-align: top;text-align: left;margin-right: 1em;}
.xnpo1_banner2 > ul > li > ul > li {font-family: 'Noto Sans KR';font-size: 18px;line-height: 1.5556;position: relative;padding-left: 1em;}
.xnpo1_banner2 > ul > li > ul > li:before {display: block;content: '';position: absolute;top: .6em;left: 0;width: 4px;height: 4px;background-color: #fff;border-radius:50%;}
.xnpo1_banner2 > ul > li > ol {position: absolute;bottom: 70px;left: 50%;transform:translateX(-50%);width: 280px;text-align: left;}
.xnpo1_banner2 > ul > li > ol > li {margin-top: 5px;}
.xnpo1_banner2 > ul > li > ol > li > a {display: block;}
.xnpo1_banner2 > ul > li > ol > li > a > p {font-family: 'NanumSquare';position: relative;padding-left: 15px;font-size: 18px;line-height: 50px;font-weight: 900;color: #fff;background: rgba(0,0,0,0.4);}
.xnpo1_banner2 > ul > li > ol > li > a > p:before {display: block;content: '';position: absolute;top: 50%;right: 15px;width: 17px;height: 17px;margin-top: -9px;background: url(./xnpo1_link1.png) no-repeat center center;background-size:100%;}
.xnpo1_banner2 > ul > li:nth-child(2) > span {display: block;position: absolute;bottom: 70px;left: 50%;transform:translateX(-50%);width: 148px;height: 148px;margin-bottom: 10px;background: #fff url(./xnpo1_ico1.jpg) no-repeat center center;;border-radius:50%;box-shadow:5px 5px 20px rgba(0,0,0,0.18);transition:.5s;}
.xnpo1_banner2 > ul > li:nth-child(2) > span:before {display: block;content: '';position: absolute;top: -10px;left: -10px;width: calc(100% + 20px);height: calc(100% + 20px);border-radius:50%;box-shadow:5px 5px 20px rgba(0,0,0,0.18);}
.xnpo1_banner2 > ul > li:nth-child(2) > ol {height: 0;overflow: hidden;bottom: 255px;transition:.5s;}
.xnpo1_banner2 > ul > li:nth-child(2):hover > ol {height: 330px;bottom: 70px;}
.xnpo1_banner2 > ul > li:nth-child(2):hover > span {opacity: 0;}

#footer .xn-main-catalog-footer-info .xn-main-footer-copyright{
    margin-top: 0;
}
@media (max-width: 1280px){
	#header .navbar-static-top .container, #content .xnp-manual-wrap, #content #visual .visual-container {width: 100%;}
	#footer .footer_link, #footer .xn-main-catalog-footer-info {width: 100%;}
	#header .navbar-static-top {padding-left: 16px; padding-right: 16px;}

	.xnpo1_slogan {left: 0;transform:translateY(-50%);width: auto;}
	.xnpo1_slogan h3 {font-size: 50px;}
	.xnpo1_banner2 {left: auto;right: 20px;transform:translateY(-50%);width: auto;}
	.xnpo1_banner2 > ul > li {height: 460px;}
	/* .xnpo1_banner2 > ul > li > h3 {font-size: 24px;} */
	/* .xnpo1_banner2 > ul > li > ol {width: 160px;} */
	/* .xnpo1_banner2 > ul > li > ul > li {font-size: 16px;}
	.xnpo1_banner2 > ul > li > ol > li > a > p {font-size: 14px;padding-left: 1em;} */
	.xnpo1_banner2 > ul > li:nth-child(2) > span {width: 128px;height: 128px;background-size:50% !important;}
    .xnpo1_banner2 > ul > li > ol > li > a > p:before{ right: 10px; }
}
@media (max-width: 800px){
	.xnpo1_slogan {top: 20%;width: 100%;}
	.xnpo1_slogan h3 {font-size: 45px;}
	.xnpo1_banner2 {top: 220px;right: auto;left: 0; transform:none; width: 100%;}
	.xnpo1_banner2 > ul {float: none;text-align: center;}
	.xnpo1_banner2 > ul > li {display: inline-block;float: none; vertical-align: top;}
	.xnpo1_banner2 > ul > li:first-child {margin-left: 0;}
}
@media (max-width: 640px){
	.xnpo1_main_visual {height: 82vh;}
	.xnpo1_slogan {top: 5%;transform:none;}
	.xnpo1_slogan h3 {font-size: 9vw;line-height: 1;}
	.xnpo1_slogan span {font-size: 4vw;}
    .xnpo1_banner2{
        top: 160px;
    }
	.xnpo1_banner2 > ul > li {width: 80%; height: 80vw;}
	.xnpo1_banner2 > ul > li > h3 {font-size: 6vw;margin: 10vw 0 5vw;padding-bottom: 5vw;}
	.xnpo1_banner2 > ul > li > ul > li {font-size: 3.3vw;}
	.xnpo1_banner2 > ul > li > ol {bottom: 10vw;width: 80%;}
	.xnpo1_banner2 > ul > li > ol > li {margin-top: 1vw;}
	.xnpo1_banner2 > ul > li > ol > li > a > p {font-size: 2.5vw;line-height: 7vw;padding-left: 3vw;}
	.xnpo1_banner2 > ul > li > ol > li > a > p:before {right: 2vw;width: 3vw;height: 4vw;margin-top: -2vw;}
	.xnpo1_banner2 > ul > li:nth-child(2) > span {bottom: 10vw;margin-bottom: 2.5vw;width: 25vw;height: 25vw;}
	.xnpo1_banner2 > ul > li:nth-child(2) > span:before {top: -2.5vw;left: -2.5vw;width: calc(100% + 5vw);height: calc(100% + 5vw);}
	.xnpo1_banner2 > ul > li:nth-child(2) > ol {bottom: 49vw;}
	.xnpo1_banner2 > ul > li:nth-child(2):hover > ol {height: 39vw;bottom: 10vw;}
    .xnpo1_banner2 > ul > li:first-child{
        padding: 0;
    }
    #footer .xn-main-catalog-footer-info .xn-main-footer-logo{
        max-width: 350px;
    }
    #footer .xn-main-catalog-footer-info .xn-main-footer-copyright{
        text-align: left;
    }
}

/** =================================================
* 충북권역 대학원격지원센터 메인 스타일 끝
================================================= **/

/* Login */
.xn-biotech-catalog .xn-main-login-container.xn-main-login-container-link {
}
.xn-biotech-catalog .xnm_main_Login {
    position:absolute;
    top:50%;
    right:50%;
    margin-right:-660px;
    transform:translateY(-50%);
    padding:30px;
    background:rgba(35,31,32,0.7) url(./xnm_main_Login_bg.png) no-repeat right bottom;
    border-radius:10px 0 10px 0;
    z-index:1;
}	
.xn-biotech-catalog .xnm_main_Login h3 {
    margin-bottom:10px;
    width: 250px;
    height: 108px;
}
.xn-biotech-catalog .xnm_main_Login h3 a {
    display: block;
}
.xn-biotech-catalog .xnm_main_Login h3 a.xnm_main_Login1 {
    background: #8ac63f;
    border: 1px solid #d0e4b4;
}
.xn-biotech-catalog .xnm_main_Login h3 a.xnm_main_Login2 {
    background: url(./xnm_main_Login2_bg.jpg) repeat-x left top;background-size:auto 100%;;
    border: 1px solid #0065b5;
}
.xn-biotech-catalog .xnm_main_Login h3 a img {
    max-width: 100%;
}
.xn-biotech-catalog .xnm_main_Login ul {
    margin-bottom: 0;
}
.xn-biotech-catalog .xnm_main_Login ul li {
    margin-bottom:1px;
}
.xn-biotech-catalog .xnm_main_Login ul li:last-child {
    margin-bottom:0;
}
.xn-biotech-catalog .xnm_main_Login ul li a {
    display:block;
    position:relative;
    font-size:15px;
    line-height:50px;
    padding-left:12px;
    color:#fff;
    background-color:#231f20;
}
.xn-biotech-catalog .xnm_main_Login ul li a img {
    display: block;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}
.xn-biotech-catalog .xnm_main_Login ul li a:hover {
    text-decoration:none;
}
.xn-biotech-catalog .xnm_main_Login ul li a:before {
    display:block;
    content:'';
    position:absolute;
    right:0;
    bottom:0;
    width:10px;
    height:10px;
    box-sizing:border-box;
    border-bottom:10px solid #ddd;
    border-top:0;
    border-left:10px solid transparent;
    border-right:0;
    opacity:0;
    transition:.3s;
}
.xn-biotech-catalog .xnm_main_Login ul li:nth-child(1) a:before {
    border-bottom-color:#0065b5;
}
.xn-biotech-catalog .xnm_main_Login ul li:nth-child(2) a:before {
    border-bottom-color:#8dc63f;
}
.xn-biotech-catalog .xnm_main_Login ul li:nth-child(3) a:before {
    border-bottom-color:#eaeceb;
}
.xn-biotech-catalog .xnm_main_Login ul li:hover a:before {
    opacity: 1;
}

#content #visual.xn-biotech-catalog  .xn-main-login-container {
    font-family: 'Noto Sans Kr';
    z-index:3;
    position:absolute;
    top: 50%;
    left: auto;
    right: 50%;
    margin-top: -135px;
    margin-right: -629px;
    background: none;
    float: none;
    padding: 0;
    width: 250px;
    height: auto;
}		
#content #visual.xn-biotech-catalog  .xn-main-login-container .xn-main-login-container-title-wrap {
    display: none;
}
#content #visual.xn-biotech-catalog  .xn-main-login-container .xn-general-login-btn.xn-general-login-btn-green,
#content #visual.xn-biotech-catalog  .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {
    width: 250px;
    height: 108px;
    margin: 0;
    font-size: 21px;
    font-weight: 500;
    line-height: 1.2;
    background: #0050bf;
    border: 1px solid #003c90;
    text-align: center;
    padding: 18px ​0px;
}
#content #visual.xn-biotech-catalog  .xn-main-login-container .xn-general-login-btn{			
    padding-top: 20px;
}
#content #visual.xn-biotech-catalog  .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {			
    padding-top: 5px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-btn:hover {
    background: #004ab1;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap a:lang(en) {
    padding: 0;
    font-size: 0px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap:lang(en){
    padding-top: 20px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap:lang(en) a:before {
    content: 'Go to My Courses';
    font-size: 22px;
    position: absolute;
    top: 60px;
    width: 100%;
    left: 0px;
}	
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {
    background:#11a84e;
    border-color: #0d7939;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-mypage-link-wrap {
    display: none !important;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-icon,
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon {
    display: block;
    width: 60px;
    height: 40px;
    margin: 0 auto;
    background: url(./xnm_main_Login1_ico.png) no-repeat center center;
    background-size: auto 100%;
    transition:.3s;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon {
    background: url(./xnm_main_Login2_ico.png) no-repeat center center;
}
#content #visual.xn-biotech-catalog .xn-main-login-container:hover .xn-sso-login-icon,
#content #visual.xn-biotech-catalog .xn-main-login-container:hover .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon{
    transform:scale(1.1)
}

#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-login-container-title-wrap {
    display: none;
}

#content #visual.xn-biotech-catalog .xn-main-login-container .xn-sso-login-btn{			
    padding-top: 20px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {			
    padding-top: 5px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-sso-login-btn:hover {
    background: #8ac63f;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap a:lang(en) {
    padding: 0;
    font-size: 0px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap:lang(en){
    padding-top: 20px;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap:lang(en) a:before {
    content: 'Go to My Courses';
    font-size: 22px;
    position: absolute;
    top: 60px;
    width: 100%;
    left: 0px;
}	

#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-mypage-link-wrap {
    display: none !important;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-sso-login-icon,
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon {
    display: block;
    width: 60px;
    height: 40px;
    margin: 0 auto;
    background: url(./xnm_main_Login1_ico.png) no-repeat center center;
    background-size: auto 100%;
    transition:.3s;
}
#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon {
    background: url(./xnm_main_Login2_ico.png) no-repeat center center;
}
#content #visual.xn-biotech-catalog .xn-main-login-container:hover .xn-sso-login-icon,
#content #visual.xn-biotech-catalog .xn-main-login-container:hover .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon{
    transform:scale(1.1)
}

#content .xnp-widget-container.xnp-widget-container-bio .xnp-widget-board, 
#content .xnp-widget-container.xnp-widget-container-bio .xnp-widget-menual{
    margin-top: 40px;
}

@media (min-width:320px) and (max-width:768px) {
    .xn-biotech-catalog .xnm_main_Login {     
        margin-right: -512px;
    }
}

@media (min-width:769px) and (max-width:1280px) {
    .xn-biotech-catalog .xnm_main_Login {     
        margin-right: -512px;
    }
    #content #visual.xn-biotech-catalog .xn-main-login-container{
        margin-right: -482px;
    }
}



@media (max-width:960px) {
	/* Main */
        .xn-biotech-catalog #xnm_main_visual .carousel-caption .xnm_wrap h3 {
			font-size: 35px;
		}
}
@media (min-width:320px) and (max-width:768px) {	
	/* Main */		
        #content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-btn-wrap {
            display: inline-block;
            float: left;
        }
        .xn-biotech-catalog .xnm_main_Login {
			left:50%;
			right:auto;
			transform:translateX(-50%);
			width:100%;
			max-width:485px;
		}
		.xn-biotech-catalog .xnm_main_Login:after {
			display:block;
			clear:both;
			content:'';
		}
		.xn-biotech-catalog .xnm_main_Login h3 {
			display: none;
			float:left;
			width: 49%;
			margin-bottom: 0;
		}
		.xn-biotech-catalog .xnm_main_Login ul {
			float:right;
			width: 56%;
		}
		.xn-biotech-catalog .xnm_main_Login h3 a {
			height:152px;
			padding-top:20px;
		}
        #content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-btn.xn-general-login-btn-green, #content #visual .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {
            width: 175px;
            height: 152px;
            padding:  35px 0px !important;
        }

		#content #visual.xn-biotech-catalog .visual-container .xn-main-login-container .xn-sso-login-btn {
			background: #8ac63f;
		}
		#content #visual.xn-biotech-catalog .visual-container .xn-main-login-container .xn-main-link-wrap {
			background: url(./xnm_main_Login2_bg.jpg) repeat-x left top;
			background-size: auto 100%;
		}
		#content #visual.xn-biotech-catalog .visual-container .xn-main-login-container {
			width: auto;
			height: 0;
			padding: 10px 0 0 30px;
			right: auto;
			left: 50%;
			transform:translateX(-50%);
			width: 100%;
		    max-width: 485px;
		}
        #header .navbar-light .navbar-toggler{
            width: 84px;
            height: 84px;
        }
        #header .xn-main-catalog-header-logo {
            max-width: 290px;
        }
        .xn-widget-slider-container .xnws-caption{
            top: 30%;
        }
        #footer .xn-main-footer-copyright a{
            color:#ddd;
        }
}
@media (max-width:540px) {	
	/* Main */
		#xnm_main_visual .carousel-caption .xnm_wrap h3 {
			font-size:5.5vw;
			padding-bottom:5vw;
			margin-bottom:3vw;
		}
		.xn-biotech-catalog .xnm_main_Login {
			top:53%;
			width:90%;
			padding:6vw;
			background-size:auto 17vw;
		}
		.xn-biotech-catalog .xnm_main_Login h3 a {
			height:32vw;
		}
		.xn-biotech-catalog .xnm_main_Login ul li {
			margin-bottom:.5vw;
		}
		.xn-biotech-catalog .xnm_main_Login ul li a {
			font-size: 2.5vw;
			padding-left:3vw;
			line-height:10.5vw;
		}
		.xn-biotech-catalog .xnm_main_Login ul li a img {
			right:.5em;
			width:4vw;
		}
		#content #visual.xn-biotech-catalog .visual-container .xn-main-login-container {
			margin-top: 2vw;
			padding: 7vw 0 0 11vw;
		}
		#content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-btn.xn-general-login-btn-green.btn-primary{
			width: 31vw;
			height: 32vw;
			padding-top: 9vw;
			font-size: 4vw;
            background: #0050bf;
            border: 1px solid #003c90;
		}
        #content #visual.xn-biotech-catalog .xn-main-login-container a{
            -webkit-appearance: none;
            -webkit-border-radius: 0;

		}
		#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap {
			width: 31vw;
			height: 32vw;
			padding-top: 6vw;
			font-size: 3.8vw;
		}
		#content #visual.xn-biotech-catalog .xn-main-login-container .xn-general-login-btn-green,
		#content #visual.xn-biotech-catalog .xn-main-login-container .xn-main-link-wrap.xn-main-lms-link-wrap .xn-main-link-icon {
			width: 14vw;
			height: 8.6vw;
			background-size: auto 100% !important;
		}
	/* Footer */
		#footer {
			padding: 16px;
		}
		#footer .xn-main-catalog-footer-info {
			flex-direction: column;
			align-items: flex-start;
		}
		#footer .xn-main-catalog-footer-info .xn-main-footer-logo {
			margin-bottom: 10px;
		}
}

#content .xnm_main_Login .right-arrow {
    margin-left: 7px;
    display: inline-block;
    width: 20px;
    height: 40px;
    vertical-align: middle;
    background: url(./chevron-right.svg) repeat-x 28px 8px;
}
#header .navbar-static-top .container .navbar-header .float-left:first-of-type{
    display: none;
}
@media screen and (max-width: 1280px) {
    #header .navbar-static-top .container .navbar-header .float-left:first-of-type{
        display: block;
    }
}
#header.xnmain-header .navbar-static-top .container .navbar-header .float-left:first-of-type{
    display: block;
}
@media screen and (max-width: 1280px) {
    #header.xnmain-header .navbar-static-top .container .navbar-header .float-left:first-of-type{
        display: block;
    }
}
#footer .xn-main-catalog-footer-upper{
  max-width: 1250px;
  margin: auto;
}