/*--------------------------------------------------------------------------

메인 CSS
※ Ctrl + F 키워드 검색해서 찾아주세요.※

[ 공통타이틀 ]
[ 메인 슬라이드 ]
[ 전체 패딩 값 ]
[ 아젠다 퀵메뉴 ]
[ 갤러리 ]
[ 아젠다 소식 ]
- 공지사항
- 단국대학교 일본연구소 HK+ 사업연구소 정보

[ 롤링 배너 ]


--------------------------------------------------------------------------*/
.indexLayout{
    color:#111;
    letter-spacing: -0.6px;
}
.mobile_box{display: none;}
.p_box{display:block;}
@media screen and (max-width:768px) {
    .none_mobile_box{display: none;}
    .mobile_box{display: block;}
    .p_box{display:none;}
}
/*====================================
          [ 공통타이틀 ]
====================================*/
.page-title{
    font-size:28px;
    line-height:38px;
    font-weight: 600;
    color:#111;
    text-align: left;
    margin-bottom: 30px;
    padding-right:120px;
}
.indexLayout{max-width: 2000px; margin: auto;}
@media all and (max-width:990px) {
    .page-title{
        font-size:24px;
        line-height:32px;
    }
}
@media all and (max-width:768px) {
    .page-title{
        font-size:22px;
        margin-bottom:20px;
    }
}


/*====================================
          [ 메인 슬라이드 ]
====================================*/
.slideSection{height:620px; position:relative;}
.mobile_visual{display: none !important;}
/********** SLIDER **********/

.indexLayout .slide:first-child { display: block;}
/********** TEXT **********/
.indexLayout .slideImg{}
.indexLayout .slideImg{}
.indexLayout .slideImg img {
    display: block;
    height: auto;
    float: left;
    width: auto;
    border: 0;
}
.rslides {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 100%;
    padding: 0;
    margin: 0;
}

.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
}

.rslides li:first-child {
    position: relative;
    display: block;
    float: left;
}

.rslides img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0;
}

.rslides{width:100%;position:absolute; height:620px;}
.rslides li{width:100%;height:100%;}
.callbacks_tabs{
    position:absolute;
    z-index:9;
    bottom: 110px;
    width:100%;
    text-align:center;
    height:15px;
    line-height:0;
}
.callbacks_tabs li{
    display:inline-block;
    margin:0 5px;
    line-height:15px;
    height:15px;
}
.callbacks_tabs li a{
    text-indent:-999px;
    width:15px;
    height:15px;
    background:rgba(255,255,255,1);
    font-size:0;
    display:inline-block;
    border-radius:50px;
    box-sizing:border-box;
    transition: all 1s ease;
}
.callbacks_tabs li.callbacks_here{}
.callbacks_tabs li.callbacks_here a{background:rgba(34,175,30,1);}

.navWrap{width:1150px;margin:0 auto 0; position: absolute; top:190px; left:50%;margin-left:-575px;z-index: 99;}
.callbacks_nav{width:34px; height:52px; text-indent:-9999px;}
.callbacks_nav.prev{background:url('../images/main/slide_prev.png')no-repeat;float:left;}
.callbacks_nav.next{background:url('../images/main/slide_next.png')no-repeat;float:right;}

@media all and (max-width:990px) {
    .rslides,
    .slideSection{height:520px;}


    .callbacks_tabs{bottom:80px;}
}

@media all and (max-width:768px) {
    .pc_visual{display: none !important;}
    .mobile_visual{display: block !important;}
    .rslides, .slideSection,
    .indexLayout .slide{height: 0;padding-bottom:69.4%;}
    .slideSection .slide{}
    .slideSection .slide .mobile_visual{position:absolute;}
    .callbacks_tabs{bottom:50px;}
    .callbacks_tabs li{
        line-height: 12px;
        height:12px;
    }
    .callbacks_tabs li a{
    width:12px;
    height: 12px;
    }
}
.indexLayout a.moreBtn{position: absolute;top:0;right:0;padding:11px 20px;width:120px;border:1px solid #999;display:inline-block;}
.indexLayout a.moreBtn img{width:18px;float: right;margin-top:5px;}

@media all and (max-width: 768px) {
    .indexLayout a.moreBtn{
        font-size: 14px;
        width: 85px;
        padding: 8px 10px 9px;
    }
    .indexLayout a.moreBtn img{width:14px;}
}
/*====================================
      [ 전체 패딩 값 ]
====================================*/
.indexLayout .section1{
    padding:150px 0 80px;
}
.indexLayout .section2{
    padding:80px 0;
}
.indexLayout .section3{
    padding:40px 0;
}
@media all and (max-width:768px){
    .indexLayout .section1{
        padding:85px 0 50px;
    }
    .indexLayout .section2{
        padding:50px 0;
    }
}
/*====================================
         [ 아젠다 퀵메뉴 ]
====================================*/
.ijsQuickMenu{position:relative;z-index: 9;max-width: 1200px;width:calc(100% - 80px); margin: 0 auto;}
.ijsQuickMenu ul{display: table;table-layout: fixed; width:100%;position: absolute;top: 50%;margin-top: -71.5px;box-shadow: 0px 6px 30px 0px rgba(0,0,0,0.1);}
.ijsQuickMenu ul li{display:table-cell;width:25%;background:#fff;border-right: 1px solid #ddd;}
.ijsQuickMenu ul li:last-child{border-right: 0}
.ijsQuickMenu ul li a{display:inline-block;text-align: center;width:100%;padding:30px 0;}
.ijsQuickMenu ul li img{width:46px;}
.ijsQuickMenu ul li div{font-size:17px; color:#333;font-weight:500;margin-top:20px;}
@media all and (max-width:769px){
    .ijsQuickMenu{width:calc(100% - 40px);}
    .ijsQuickMenu ul{margin-top: -42.5px;}
    .ijsQuickMenu ul li a{display:inline-block;text-align: center;width:100%;padding:15px 0;}
    .ijsQuickMenu ul li div{font-size:13px; color:#333;font-weight:500;margin-top:10px;}
    .ijsQuickMenu ul li img{width:32px;}
}
@media all and (max-width:321px){
    .ijsQuickMenu ul{margin-top:-35px;}
    .ijsQuickMenu ul li a{padding:15px 0;}
    .ijsQuickMenu ul li div{font-size:12px;}
    .ijsQuickMenu ul li img{width:28px;}
}

/*====================================
         [ 갤러리 ]
====================================*/
.section1{
    background-color:#fff;
}
.section1 .max_width{
    position: relative;
}
.section1 .thumb_wrap{width:100%;}
.section1 .thumb_wrap_inner{
    background-size:cover;
    background-repeat: no-repeat;
    padding-bottom: 66.5%;
}
.section1 .thumbnail.ratio2{padding-top:65.7%}
.hkplusGallery{
    display:none !important;
}
@media all and (max-width:990px) {

}
@media all and (max-width:768px) {
    .section1 .p_box{display: none;}
    .hkplusGallery{
        display:block !important;
    }
    .hkplusGallery .owl-dots{
        text-align: center;
        margin-top: 10px;
        line-height: 1;
    }
    .hkplusGallery .owl-dots .owl-dot{
        margin: 0 5px;
        line-height: 12px;
        height: 12px;
    }
    .hkplusGallery .owl-dots .owl-dot span{
        width: 12px;
        height: 12px;
        display: inline-block;
        background: rgba(0,0,0,0.15);
        border-radius: 50px;
        box-sizing: border-box;
        transition: all 1s ease;
    }
    .hkplusGallery .owl-dots .owl-dot.active span{
        background: rgba(34,175,30,1);
    }
    .section1{
        background-position:96% 0;
        background-size: 380px;
    }
    .section1 .col-4:last-child{
        padding-bottom:0;
    }

}
@media all and (max-width:414px) {
    .section1 .col-4{padding-bottom: 10px;}
    .section1 .col-4:last-child{padding-bottom: 0;}
}
/*====================================
         [ 아젠다 소식 ]
====================================*/
.section2{
    background-color:#f5f5f5;
    background:#f5f5f5 url('/ijshkplus/images/main/section2_bg.png')no-repeat;
    background-position:-4% -95%;
}
.section2 .sec_table{display:table; table-layout: fixed;width:100%;}
.section2 .sec_box{display:table-cell;width:25%;padding:0 10px;vertical-align: top;}
/* 공지사항 */
.section2 .box01{width:50%;padding:0;padding-right:20px;position: relative;}
.section2 .sec_box_wrap{display:table; table-layout: fixed;width:100%;}
.section2 .top_title{position: relative;width:calc(50% - 20px);}
.section2 .box01 ul{width:100%;margin:0;}
.section2 .box01 ul li{width:50%;padding-left:0;padding-right:10px;}
.section2 .box01 ul li:last-child{padding-left:10px;padding-right:0px;}
.section2 .box01 ul li a{ border:1px solid #ddd;background:#fff;display:inline-block;width:100%;padding:40px 30px;}
.section2 .box01 .subject{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 18px;
    font-weight: 600;
    margin-bottom:20px;
}
.section2 .box01 .content{
    font-size:15px;
    height: 100px;
    overflow: hidden;
    line-height:25px;
    color:#555;
}
.section2 .box01 .date{margin-top:35px;font-size:13px;color:#777;}

/* 단국대학교 일본연구소 HK+ 사업연구소 정보*/
.section2 .box02 .page-title{color:#fff; font-weight: 500; line-height: 30px;margin-bottom: 20px; padding-right: 0;}
.section2 .box02 {width:50%;display:table-cell;position: relative;background:url('/ijshkplus/images/main/section3_img1.png')no-repeat; color:#fff;padding:40px 30px;}
.section2 .box02 ul:first-of-type{display: inline-block;width: 100%;}
.section2 .box02 ul:first-of-type li{color:#fff; font-size:17px;font-weight: 200;float: left;position: relative;}
.section2 .box02 ul:first-of-type li:last-child:before{content:''; width:1px; height:14px; position:absolute;background:rgba(255,255,255,0.5);left:0;top:3px;}
.section2 .box02 ul:first-of-type li:last-child{margin-left:20px;padding-left:20px;}

.section2 .box02 ul:last-of-type{position: absolute;bottom:40px;}
.section2 .box02 ul:last-of-type li{float: left;}
.section2 .box02 ul:last-of-type li a{border:1px solid rgba(255,255,255,0.5); color:#fff; font-size:16px;font-weight: 400;padding:10px 25px 12px;display: inline-block;}
.section2 .box02 ul:last-of-type li:last-child{margin-left: 10px;}
@media all and (max-width:1200px){
    .section2 .box01 ul li a{padding:30px 20px;}
    .section2 .box02{padding:30px 20px;}
}
@media all and (max-width:990px){
    .section2{
        background-position:-20% 0%;
    }
    .section2 .sec_table{}
    .section2 .top_title{position: relative;width:100%;}
    .section2 .box01{display:inline-block;width:100%;padding-right: 0;}
    .section2 .box02{display:inline-block;width:100%;background-size: cover;margin-top:20px;padding:40px 20px;}
    .section2 .box02 .page-title{margin-bottom:0;display:inline-block;}
    .section2 .box02 ul:first-of-type{display: inline-block;width: 100%;margin-top:10px;}
    .section2 .box02 ul:last-of-type{position: relative;bottom:auto;margin-top: 30px;}
}
@media all and (max-width:768px){
    .section2{
        background:#f5f5f5;
    }
    .section2 .box01 ul li a{padding:20px 20px;}
    .section2 .box01 .subject{
        font-size: 17px;
        margin-bottom:15px;
    }
    .section2 .box01 .content{
        font-size:14px;
        height: 92px;
        line-height:23px;
    }
    .section2 .box01 .date{margin-top:25px;}
    .section2 .box02 ul:first-of-type li{font-size:14px;}
    .section2 .box02 ul:last-of-type li a{
        font-size:14px;
        padding:10px 15px 12px;
    }
    .section2 .box02 ul:first-of-type li:last-child{
        margin-left:10px;
        padding-left:10px;
    }
    .section2 .box02 ul:first-of-type li:last-child:before{
        height:12px;
    }
}
@media all and (max-width:460px){
    .section2 .box01 ul li{
        width:100%;padding:0;
    }
    .section2 .box01 ul li:last-child{
        padding:0;
        padding-top:15px;
    }
    .section2 .box02{
        padding:25px 20px 30px;
    }

}
@media all and (max-width:370px){
    .section2 .box02 ul:first-of-type li{
        width:100%;
    }
    .section2 .box02 ul:first-of-type li:last-child{
        margin-left:0;
        padding-left:0;
        margin-top:5px;
    }
    .section2 .box02 ul:first-of-type li:last-child:before{
        display: none;
    }


}

/*====================================
         [ 롤링 배너 ]
====================================*/
.section3{background:#fff;}
.section3 .item img{border:1px solid #ddd;}
.section3 .owl-carousel{
    padding:0 25px;
    position: relative;
}
.section3 .owl-nav{}
.section3 .owl-nav .owl-prev,
.section3 .owl-nav .owl-next{
    position: absolute;
    top: 50%;
    margin-top: -11px;
    height: 22px;
}
.section3 .owl-nav .owl-prev{
    left: 0;
}
.section3 .owl-nav .owl-prev span{
    font-size: 0;
    background: url('/ijshkplus/images/common/slide_arrow_left.svg')no-repeat;
    width: 12px;
    height: 22px;
    background-size: 12px 22px;
    display: inline-block;
    vertical-align: top;
}
.section3 .owl-nav .owl-next{right: 0}
.section3 .owl-nav .owl-next span{
    font-size: 0;
    background: url('/ijshkplus/images/common/slide_arrow_right.svg')no-repeat;
    width: 12px;
    height: 22px;
    background-size: 12px 22px;
    display: inline-block;
    vertical-align: top;
}








/*====================================
         [ 영문 메인 ]
====================================*/
.enIndexLayout .ijsQuickMenu ul li a{
    padding:0;
}
.enIndexLayout .ijsQuickMenu ul li img{
    width: 100%;
}

@media all and (max-width: 1200px){
    .enIndexLayout .ijsQuickMenu ul{
    margin-top: -6%;
    }
}
@media all and (max-width: 769px){
    .enIndexLayout .ijsQuickMenu ul{
        margin-top: -12%;
    }
    .enIndexLayout .ijsQuickMenu ul li {
        padding:0 5px;
    }
}


.enIndexLayout .section3{
    padding-top: 120px;
}
@media all and (max-width: 1200px){
    .enIndexLayout .slideSection,
    .enIndexLayout .rslides{
        height: 520px;
    }
    .enIndexLayout .section3{
        padding-top: 10%;
    }
}
@media all and (max-width: 990px){
    .enIndexLayout .slideSection,
    .enIndexLayout .rslides{
        height: 420px;
    }
    .enIndexLayout .section3{
        padding-top: 10%;
    }
}
@media all and (max-width: 840px){
    .enIndexLayout .slideSection,
    .enIndexLayout .rslides{
        height: 380px;
    }
}
@media all and (max-width: 768px){
    .enIndexLayout .slideSection, .enIndexLayout .rslides{
        height: 0;
    }
    .callbacks_tabs{
        bottom: 18%;
    }
    .enIndexLayout .section3{
        padding-top: 17%;
    }
}


.ijs_select_menu{
    position: absolute;
    right: 0;
    top: 0;
}
.ijs_select_menu select{
    font-size: 13px;
}
@media all and (max-width: 1200px){
    .ijs_select_menu{
        right: 40px;
    }
}
@media all and (max-width: 1024px){
    #footer .ft_bottom .logo img{
        margin:0 auto;
    }
    .ijs_select_menu{
        position: static;
        right: auto;
        margin-top: 20px;
        text-align: center;
    }
}
@media all and (max-width: 768px){
    .ijs_select_menu select{
        font-size: 12px;
    }
}
