﻿@charset "utf-8";

/* PC */
@media screen and (min-width: 1025px) {
    /****************************************
    01. common style
    ****************************************/
}

/* tablet */
@media (min-width: 768px) and (max-width: 1024px) {
    /****************************************
    01. common style
    ****************************************/
}

/* phone ~ 767px */
@media screen and (max-width: 767px) {

    /* *******************************************************************
        메인 배너 -> 상세 배너 스타일은 main_banner.css 참조
    ******************************************************************* */
    .main-banner-area {
        height: 400px;
    }

    /* 메인배너 배경 이미지 */
    .main-banner-area .main-slide-banner-area .bg-main-banner-default {

    }
    .main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg {

    }
    .main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg .inner-wrap {
        height: 400px;
    }
    .main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg .info {
        padding:145px 20px 20px;
        font-size: 14px;
    }
    .main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg .title strong {
        font-size: 32px;
        padding:0 20px;
    }

    /* bg1 */
    .main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg {
        background-size: cover;
        /*padding:0 20px;*/
    }

    /*메인 우측 미니 배너 없을 시 주석처리 */
    /*.main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg p.title {*/
    /*    display: none;*/
    /*}*/
    /*.main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg p.title strong {*/
    /*    display: none;*/
    /*}*/
    /*.main-banner-area .main-slide-banner-area .bg-main-banner-default .main-banner-bg p.info {*/
    /*    display: none;*/
    /*}*/


    /* 기본 배너 스타일 */
    #main-slide-banner {
        top: 0;
        width: 100%;
        height: 400px;
        padding: 0;
    }
    #main-slide-banner .banner-slide {
        width: 100%;
        height: 400px;
        border-radius: 0;
        background: rgba(0,0,0,1);
    }
    #main-slide-banner .banner-slide.default {
        background-color: rgba(255, 255, 255, 1);
    }
    #main-slide-banner .banner-slide p.title {
        display: block;
        margin: 20px 0 30px;
        line-height: 1.4;
        font-size: 27px;
        word-break: keep-all;
    }
    #main-slide-banner .banner-slide .banner-bottom-title {
        border-radius:0;
    }
    #main-slide-banner .banner-slide ul.list-content {
        margin: 0 0 30px;
    }
    #main-slide-banner .banner-slide ul.list-content > li {
        margin: 0 0 15px;
        line-height: 1.4;
        font-size: 17px;
    }
    #main-slide-banner .banner-slide .banner-bottom-title p {
        width:60%;
    }

    #main-slide-banner .banner-slide a.btn-go {
        bottom: 65px;
    }

    /* control-area */
    .main-banner-bg .control-area {
        bottom: 8px;
        left: 85%;
        width: 115px;
        margin-left: -75px;
    }

    /*!* ********************************************************************/
    /*    퀵버튼 영역 : 초기 퀵메뉴 스타일 */
    /******************************************************************** *!*/
    /*.main-quick-area {*/
    /*    margin: 0;*/
    /*    padding: 30px 20px 40px;*/
    /*}*/
    /*.main-quick-area .inner-wrap {*/
    /*    display: flex;*/
    /*    flex-direction: column-reverse;*/
    /*}*/
    /*!* quick-menu *!*/
    /*.main-quick-area ul {*/
    /*    float: none;*/
    /*    width: 100%;*/
    /*}*/
    /*.main-quick-area ul > li {*/
    /*    float: left;*/
    /*    width: 50%;*/
    /*    margin: 0 0 10px;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(4),*/
    /*.main-quick-area ul > li:nth-child(5),*/
    /*.main-quick-area ul > li:nth-child(6) {*/
    /*    margin-bottom: 10px;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(2n) {*/
    /*    padding-left: 5px;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(2n+1) {*/
    /*    padding-right: 5px;*/
    /*}*/
    /*.main-quick-area ul > li > a {*/
    /*    display: block;*/
    /*    width: 100%;*/
    /*    height: 80px;*/
    /*    padding: 20px 0 0 76px;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(1) > a {*/
    /*    background: #fff url(/images/main/quick_icon01.png) 15px 50% no-repeat;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(2) > a {*/
    /*    background: #fff url(/images/main/quick_icon02.png) 20px 50% no-repeat;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(3) > a {*/
    /*    background: #fff url(/images/main/quick_icon03.png) 22px 50% no-repeat;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(4) > a {*/
    /*    background: #fff url(/images/main/quick_icon04.png) 20px 50% no-repeat;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(5) > a {*/
    /*    background: #fff url(/images/main/quick_icon05.png) 20px 50% no-repeat;*/
    /*}*/
    /*.main-quick-area ul > li:nth-child(6) > a {*/
    /*    background: #fff url(/images/main/quick_icon07.png) 20px 50% no-repeat;*/
    /*}*/

    /*.main-quick-area ul > li > a > .title {*/
    /*    margin: 0 0 8px;*/
    /*    font-size: 15px;*/
    /*}*/

    /*!* thm-area *!*/
    /*.main-quick-area .thm-area {*/
    /*    float: none;*/
    /*    width: 100%;*/
    /*    height: 180px;*/
    /*    margin-bottom: 20px;*/
    /*    background: url(/images/main/bg_thm_area.png) right bottom no-repeat;*/
    /*    background-size: 64% auto;*/
    /*}*/
    /*.main-quick-area .thm-area > a {*/
    /*    display: block;*/
    /*    height: 180px;*/
    /*    padding-top: 15px;*/
    /*}*/
    /*.main-quick-area .thm-area > a > .title {*/
    /*    margin: 0 0 8px;*/
    /*    font-size: 24px;*/
    /*}*/
    /*.main-quick-area .thm-area > a > .sub-title {*/
    /*    margin: 0 0 25px;*/
    /*    font-size: 12px;*/
    /*}*/
    /*.main-quick-area .thm-area > a > .txt {*/
    /*    margin: 0 0 15px;*/
    /*    font-size: 16px;*/
    /*}*/

    /* *******************************************************************
        퀵버튼 영역
    ******************************************************************* */
    .main-quick-area {
        margin: 0;
        padding: 0 0 30px;
    }

    /* quick-menu */
    .main-quick-area .main-quick {
        margin: 0 0 30px;
    }
    .main-quick-area .main-quick ul {
        float: none;
        width: 100%;
    }
    .main-quick-area .main-quick ul > li {
        float: left;
        width: 33.3333%;
    }
    .main-quick-area .main-quick ul > li:after {
        display: none;
    }
    .main-quick-area .main-quick ul > li > a {
        height: auto;
        padding: 20px 0;
        border-right: 1px solid rgba(255,255,255,0.25);
        border-bottom: 1px solid rgba(255,255,255,0.25);
    }
    .main-quick-area .main-quick ul > li > a .feather {
        width: 36px;
        height: 36px;
    }
    .main-quick-area .main-quick ul > li > a > .title {
        margin: 10px 0 0;
        font-size: 17px;
    }

    /* membership-area */
    .main-quick-area .membership-area {
        float: none;
        width: 100%;
        padding: 0 20px;
    }
    .main-quick-area .membership-area ul {
        padding: 0;
    }
    .main-quick-area .membership-area ul li {
        margin: 0 0 10px;
    }
    .main-quick-area .membership-area ul li:last-child {
        margin: 0;
    }
    .main-quick-area .membership-area ul li a {
        height: 46px;
        padding: 0 20px;
        line-height: 46px;
        text-align: center;
        font-size: 16px;
    }

    /* *******************************************************************
        main-col1 : 논문집, 학회소식
    ******************************************************************* */
    .main-col1 {
        padding: 0;
    }

    /* 논문집 */
    .publication-area {
        position: relative;
        float: none;
        width: 100%;
        height: auto;
        margin: 0;
        padding: 60px 20px;
        text-align: center;
        border-bottom: 1px solid #eee;
        background: url("/images/main/bg_publication.png") 0 140px no-repeat;
        background-size: 150px;
    }
    .publication-area h3 {
        margin: 0 0 7px;
        font-size: 24px;
    }
    .publication-area h4 {
        margin: 0 0 40px;
        font-size: 14px;
    }
    .publication-area ul {
        margin: 0 0 40px;
        padding: 70px 0 0 160px;
    }
    .publication-area ul li {
        margin: 0 0 15px;
        text-align: left;
        font-size: 15px;
    }
    .publication-area a.btn-go {
        padding: 0 20px;
        font-size: 17px;
    }
    .publication-area .divline {
        display: none;
    }

    /* 학회소식 */
    .notice-area {
        float: none;
        width: 100%;
        height: auto;
        padding: 60px 20px;
        border-bottom: 1px solid #eee;
        background-color: #fefefe;
    }
    .notice-area h3 {
        margin: 0 0 20px;
        padding: 0 0 15px;
        font-size: 24px;
    }
    .notice-area .notice-contents > ul > li {
        margin: 0 0 17px;
    }
    .notice-area .notice-contents > ul > li:last-child {
        margin: 0;
    }
    .notice-area .notice-contents > ul > li > p.title {
        padding-right: 100px;
    }
    .notice-area .notice-contents > ul > li > p.title > a {
        padding: 0 24px 0 0;
        line-height: 17px;
        font-size: 15px;
    }
    .notice-area .notice-contents > ul > li > p.title > a > span.icon-new {
        width: 17px;
        height: 17px;
        line-height: 17px;
        font-size: 10px;
    }
    .notice-area .notice-contents > ul > li > p.date {
        font-size: 15px;
    }

    /* *******************************************************************
        main-col2 : 학술행사
    ******************************************************************* */
    .main-col2 {
        padding: 60px 0;
    }
    .main-col2 .bg-academic {
        position: absolute;
        right: 0;
        top: 360px;
        width: 96%;
        height: 300px;
        margin-left: 4%;
        border-radius: 82px 0 0 0;
        background-color: #FFF8DE;
    }
    .main-col2 .bg-area {
        display: none;
    }

    /* 학술행사 */
    .main-col2 .academic-events-area h3 {
        margin: 0 0 40px;
        padding: 0 20px;
        line-height: 1.3;
        font-size: 30px;
    }
    .main-col2 .academic-events-area .academic-events-slide {
        z-index: 2;
    }
    .main-col2 .academic-events-area .nav-area {
        float: none;
        width: 100%;
    }
    .main-col2 .academic-events-area .nav-area > ul {
        overflow: hidden;
        margin: 0 0 50px;
        padding: 0 20px;
    }
    .main-col2 .academic-events-area .nav-area > ul > li {
        float: left;
        display: block;
        width: 50%;
        margin: -1px -1px 0 0;
        padding: 0;
        border-bottom: 0;
    }
    .main-col2 .academic-events-area .nav-area > ul > li:nth-child(1),
    .main-col2 .academic-events-area .nav-area > ul > li:nth-child(2) {
        margin: 0 -1px 0 0;
    }
    .main-col2 .academic-events-area .nav-area > ul > li:last-child {
        border-bottom: 0;
    }
    .main-col2 .academic-events-area .nav-area > ul > li > a {
        display: block;
        padding: 10px;
        text-align: center;
        font-size: 17px;
        font-weight: 700;
        border: 1px solid #dfdfdf;
        background-color: #fff;
    }
    .main-col2 .academic-events-area .nav-area > ul > li.active::before {
        display: none;
    }
    .main-col2 .academic-events-area .nav-area > ul > li.active > a {
        padding: 10px;
        text-align: center;
        font-size: 17px;
        font-weight: 700;
        color: #fff;
        border-radius: 0;
        background-color: #106DBC;
        box-shadow: none;
    }

    .main-col2 .academic-events-area .slider {
        float: none;
        width: 100%;
        margin: 0 auto;
        padding: 0 20px;
    }
    .main-col2 .academic-events-area .slider > ul {
        overflow: hidden;
        width: 100%;
    }
    .main-col2 .academic-events-area .slider > .inner > ul > li {
        width: 100%;
        max-width: 100%;
        height: 300px;
        margin: 0;
        padding: 0;
    }
    .main-col2 .academic-events-area .slider > .inner > ul > li > .slide-inner > a {
        width: 100%;
        max-width: 100%;
        height: 300px;
        margin: 0 auto 20px;
        padding: 30px 20px;
    }
    .main-col2 .academic-events-area .slider > ul > li > .label-event {
        display: inline-block;
        height: 30px;
        margin: 0 0 30px;
        padding: 0 20px;
        line-height: 30px;
        text-align: center;
        font-size: 14px;
        color: #fff;
        border-radius: 30px;
        background-color: #FFC32A;
    }
    .main-col2 .academic-events-area .slider > ul > li > a > span.more {
        position: absolute;
        right: 20px;
        top: 23px;
        font-size: 17px;
        color: #333;
    }
    .main-col2 .academic-events-area .slider > ul > li > .title {
        line-height: 1.4;
        font-size: 20px;
    }
    .main-col2 .academic-events-area .slider > ul > li > .etc {
        position: absolute;
        left: 20px;
        bottom: 20px;
        width: 240px;
    }
    .main-col2 .academic-events-area .slider > ul > li > .etc > li {
        margin: 0 0 10px;
        font-size: 15px;
    }

    .main-col2 .academic-events-area .tab-list .control-area {
        right: 20px;
    }

    /* *******************************************************************
        main-col3 : 게시판, 자료실
    ******************************************************************* */
    .main-col3 {

    }

    /* 게시판 */
    .boards-area {
        float: none;
        width: 100%;
        margin: 0 0 60px;
        padding: 0 20px;
    }
    .boards-area h3 {
        margin: 0 0 30px;
        padding: 0 0 15px;
        font-size: 30px;
    }
    .boards-area .tab-wrap .more {
        position: absolute;
        right: 0px;
        top: 0px;
        font-size: 26px;
    }
    .boards-area .tab-area {
        margin: 0;
        padding: 0;
        border: 0;
    }
    .boards-area .tab-area li {
        float: none;
        margin: 0 20px 0 0;
        padding-bottom: 20px;
    }
    .boards-area .tab-area li > a {
        font-size: 17px;
    }
    .boards-area .tab-area li.active > a {
        font-size: 19px;
        font-weight: 600;
        color: #11cceb;
        border: 0;
    }
    .boards-area .board-con ul > li {
        position: relative;
        padding: 15px 10px;
        border-bottom: 1px solid #eee;
    }
    .boards-area .board-con ul > li:first-child {
        border-top: 1px solid #eee;
    }
    .boards-area .board-con ul > li span.highlight {

    }
    .boards-area .board-con ul > li p.title.empty {
        padding-top: 3px;
        font-size: 14px;
        font-weight: 300;
    }
    .boards-area .board-con ul > li p.title a {
        font-size: 15px;
    }
    .boards-area .board-con ul > li p.title a b {
        display: inline-block;
        max-width: 100%;
        vertical-align: middle;
        font-size: 15px;
    }
    .boards-area .board-con ul > li p.date {
        right: 0;
        top: 16px;
        font-weight: 300;
        font-size: 15px;
    }

    /* 자료실 */
    .gallery-area {
        float: none;
        width: 100%;
        padding: 0 20px;
    }
    .gallery-area h3 {
        margin: 0 0 30px;
        padding: 0 0 15px;
        font-size: 30px;
    }
    .gallery-area .gallery-slide {
        margin-top: -5px;
    }
    .gallery-area .gallery-slide a {
        width: 100%;
        height: 240px;
    }
    .gallery-area .gallery-slide a img {
        min-height: 240px;
    }

    /* control-area */
    .gallery-area .control-area {
        top: 15px;
        right: 20px;
        width: 100px;
    }

    /* .gallery-area shadow */
    .gallery-area .swiper-cube .swiper-cube-shadow:before {
        content: '';
        background: rgba(0,0,0,0.75);
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        filter: blur(50px);
    }

    /* *******************************************************************
        main-col4 : 후원사
    ******************************************************************* */
    .main-col4 {
        padding: 60px 0;
        background: #fafafa url(/images/main/bg_sponsors.png) right top no-repeat;
    }

    /* 후원사 */
    .main-col4 .sponsors-area h3 {
        margin: 0 0 40px;
        padding: 0 0 15px;
        text-align: center;
        font-size: 30px;
    }
    .main-col4 .sponsors-area > ul {
        margin: 0 20px;
        border-left: 1px solid #eee;
        border-top: 1px solid #eee;
    }
    .main-col4 .sponsors-area > ul > li {
        float: left;
        width: 50%;
        border-right: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }
    .main-col4 .sponsors-area > ul > li > a {
        height: 100px;
        line-height: 100px;
        padding: 0 20px;
    }

}

/* phone ~ 420px */
@media screen and (max-width:420px) {
    /****************************************
    01. main style
    ****************************************/

    /* *******************************************************************
        main-col1 : 논문집, 학회소식
    ******************************************************************* */
    .main-col1 {
        padding: 0;
    }

    /* 논문집 */
    .publication-area {
        margin: 0;
        padding: 60px 0;
        border-bottom: 1px solid #eee;
        background: url("/images/main/bg_publication.png") 0 140px no-repeat;
        background-size: 120px;
    }
    .publication-area ul {
        padding: 50px 0 0 140px;
    }
    .publication-area ul li {
        font-size: 13px;
    }

    /* 학회소식 */
    .notice-area {
        padding: 60px 20px;
    }

}

/* phone ~ 380px */
@media screen and (max-width:380px) {
    /****************************************
    01. main style
    ****************************************/

}

@media print {

}
