﻿@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) {
    /****************************************
    01. common style
    ****************************************/

    /****************************************
    01. hidden contents
    ****************************************/
    .banner-notice,
    .utility-area,
    .gnb-area,
    .gnb,
    .top-btn-area {
        display: none !important;
    }

    /*******************************************************************
       common style
    ******************************************************************* */
    .main-col {
        padding: 50px 0;
    }
    .main-col h3 {
        margin: 0 0 40px;
        font-size: 28px;
    }
    .main-col h3 a {
        font-size: 28px;
    }
    .main-col h3 a:hover {
        font-size: 28px;
    }

    /* *******************************************************************
        col1 : 메인 배너
    ******************************************************************* */
    .col1 .bx-wrapper .bx-pager, .col1 .bx-wrapper .bx-controls-auto {
        bottom: 10px;
        /*display: none;*/
    }
    .col1 {
        /*height: 300px;*/
        height: auto;
        padding: 0;
    }
    .col1 ul li {
        position: relative;
        width: 100%;
        /*height: 300px;*/
        height: auto;
    }
    .col1 ul li .inner {
        width: 100%;
        height: auto;
    }
    .col1 .controls-arrow {
        display: none !important;
    }
    .col1 ul li.type0 {
        background: #f6fdff url(/images/banner_main/main_banner_default_v2_mobile.jpg) 96% 50% no-repeat;
        background-size: cover;
    }
    .col1 ul li.type0 .inner {
        height: 200px;
        padding: 0;
        text-align: left;
    }

    /*******************************************************************
        국내학술발표대회
    ******************************************************************* */
    .conf-banner.domestic {
        background-size: cover !important;
    }
    .conf-banner.domestic.v1 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v1.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v2 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v2.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v3 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v3.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v4 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v4.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v5 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v5.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v6 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v6.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic.v7 {
        background: #e9f3fc url(/images/banner_main/2025s/bg_main_banner_conf2025s_v7.jpg) center 50% no-repeat;
    }
    .conf-banner.domestic .inner {
        padding: 0;
    }
    .conf-banner.domestic .inner .con-area {
        /*height: 300px;*/
        height: auto;
        padding: 20px;
        background-color: rgba(0,0,0,0.15);
    }
    .conf-banner.domestic .inner .con-area .title {
        margin: 0 0 20px;
        padding: 20px 0 0;
        font-size: 30px;
        text-shadow: 1px 1px 1px rgba(0,0,0,0.75);
    }
    .conf-banner.domestic .inner .con-area .title-eng {
        margin: 0 0 30px;
        font-size: 20px;
        font-weight: 300;
        letter-spacing: 0px;
    }
    .conf-banner.domestic .inner .con-area .more-info {
        width: 280px;
        margin: 0 auto 20px;
    }
    .conf-banner.domestic .inner .con-area .date {
        margin: 0 0 10px;
    }
    .conf-banner.domestic .inner .con-area .date .label-date {
        display: block;
        margin: 0 0 5px;
        padding: 3px 8px;
        font-size: 12px;
    }
    .conf-banner.domestic .inner .con-area .date .text {
        font-size: 15px;
    }
    .conf-banner.domestic .inner .con-area .place {
        margin: 0 0 20px;
    }
    .conf-banner.domestic .inner .con-area .place .label-place {
        display: block;
        margin: 0 0 5px;
        padding: 3px 8px;
        font-size: 12px;
    }
    .conf-banner.domestic .inner .con-area .place .text {
        font-size: 15px;
    }
    .conf-banner.domestic .inner .con-area a.btn-go {
        margin: 5px;
        padding: 10px 15px;
        font-size: 15px;
    }
    .conf-banner.domestic .inner .con-area a.btn-go.zoom {
        width: 238px;
    }

    /* *******************************************************************
        col2 : 게시판 등 주요 컨텐츠
    ******************************************************************* */
    .col2 {
        padding: 0;
        background: #f4f6fa;
    }

    /* KMS Introduction */
    .col2 .main-introduce {
        float: none;
        width: 100%;
        height: auto;
        margin-right: 0;
        padding: 30px 20px;
        border: 0;
        border-radius: 0;
    }
    .col2 .main-introduce p {
        word-break: break-all;
    }

    /* 게시판 */
    .col2 .main-board {
        float: none;
        width: 100%;
        height: auto;
        margin-right: 0;
        padding: 30px 20px;
        border: 0;
        border-radius: 0;
    }
    .main-board .tab-area {
        margin: 0;
        padding: 0;
        border: 0;
    }
    .main-board .tab-area li {
        float: none;
        width: auto;
        margin: 0;
    }
    .main-board .tab-area li:after {
        margin: -2px 7px 0 7px;
        font-size: 12px;
    }
    .main-board .tab-area li > a {
        font-size: 15px;
    }
    .main-board .more {
        display: none;
        right: 20px;
        top: 24px;
        font-size: 26px;
    }
    .main-board .board-con {
        padding-top: 30px;
    }
    .main-board .board-con ul > li {
        margin: 0 0 12px;
    }
    .main-board .board-con ul > li p.title{
        float: none;
    }
    .main-board .board-con ul > li p.title.empty {
        padding-top: 3px;
        font-size: 14px;
    }
    .main-board .board-con ul > li p.title a {
        width: 100%;
        font-size: 14px;
    }
    .main-board .board-con ul > li p.title a b {
        max-width: 100%;
    }
    .main-board .board-con ul > li p.date {
        display: none;
    }
    .main-board .board-con ul > li p.date.top {
        padding-top: 4px;
    }

    /* 저널 영문, 국문 */
    .col2 .main-box {
        float: none;
        width: 100%;
        height: auto;
        margin: 0 auto;
        padding: 25px 40px 10px;
        text-align: center;
        border-radius: 0;
    }
    .col2 .main-box.journal-eng {
        margin-right: 0;
        background: #88b43e url(/images/main/main_journal_eng_bg_mobile.png) center bottom no-repeat;
    }
    .col2 .main-box.journal-ko {
        background: #447976 url(/images/main/main_journal_ko_bg_mobile.png) center bottom no-repeat;
    }
    .col2 .main-box h3 {
        margin: 0 0 15px;
        text-align: center;
        font-size: 20px;
    }
    .col2 .main-box p.thm {
        display: inline-block;
        vertical-align: top;
        margin-right: 30px;
    }
    .col2 .main-box ul {
        position: static;
        display: inline-block;
        vertical-align: top;
        padding-top: 20px;
    }
    .col2 .main-box ul li {
        margin: 0 0 15px;
    }

    /* quick-menu */
    .col2 .quick-menu {
        display: none;
    }

    /* *******************************************************************
        col3 : 게시판
    ******************************************************************* */
    .col3 {
        padding: 20px;
        background: #f4f6fa;
    }

    /* 학회안내, 회비결제, 학술발표회, 특별사업 */
    .col3 .main-box {
        float: none;
        width: 100%;
        height: auto;
        margin: 0 0 10px;
        padding: 30px;
        border-radius: 5px;
    }
    .col3 .main-box.introduce {
        margin-right: 0;
        background: #93a4ab url(/images/main/main_quick_bg01.png) left top repeat-x;
    }
    .col3 .main-box.conference {
        margin-right: 0;
        background: #4787a9 url(/images/main/main_quick_bg02.png) left top repeat-x;
    }
    .col3 .main-box.business {
        margin-right: 0;
        background: #5b5d9b url(/images/main/main_quick_bg03.png) left top repeat-x;
    }
    .col3 .main-box.fee {
        background: #212e50 url(/images/main/main_quick_bg04.png) left top repeat-x;
    }
    .col3 .main-box h3 {
        margin: 0 0 20px;
        text-align: center;
        font-size: 21px;
    }
    .col3 .main-box span.divline {
        display: block;
        margin: 0 auto 20px;
    }
    .col3 .main-box:hover span.divline {
        width: 24px;
    }

    /* *******************************************************************
        col4 : 주요일정 -> /main_schedule/styles/main_schedule.css
    ******************************************************************* */
    .col4.main-col {
        padding: 40px 20px;
    }

    /* *******************************************************************
        col5 : 관련기관 배너
    ******************************************************************* */
    #container .rotation-banner-area .innerwrap {
        padding: 30px 20px;
    }
    .rotation-banner-area .innerwrap .bx-wrapper {
        margin: 0;
    }
    .rotation-banner-area .innerwrap ul li {
        float: left;
        width: 204px;
        height: 60px;
        margin: 0 20px 0 0;
        padding: 0;
        list-style: none;
    }
    .rotation-banner-area .innerwrap ul li:last-child {
        margin: 0;
    }
    .rotation-banner-area .innerwrap ul li a {
        display: block;
        position: relative;
        width: 204px;
        height: 60px;
        background-color: #eee;
    }
    .rotation-banner-area .innerwrap ul li a img {
        max-width: 100%;
        width: 204px;
    }
    .rotation-banner-area .bx-wrapper .bx-viewport {
        background-color: transparent;
    }
    .rotation-banner-area .bx-wrapper img {
        border: 0;
    }

}

/* phone ~ 420px */
@media screen and (max-width:420px) {
    /****************************************
    01. main style
    ****************************************/

    .main-board .board-con ul > li p.title a b {
        max-width: 280px;
    }
}

/* phone ~ 380px */
@media screen and (max-width:420px) {
    /****************************************
    01. main style
    ****************************************/

    .main-board .board-con ul > li p.title a b {
        max-width: 240px;
    }
}

@media print {

}
