/* ==================================================================================
    Media query
================================================================================== */
@media only screen
and (max-width: 768px) {

    /* ==================================================================================
        메인배너 - main-banner
    ================================================================================== */
    /*carousel-caption*/
    .competition-caption {
        text-align: center;
    }
    .competition-caption .competition-title .small {
        margin: 0 0 10px;
        font-size: 15px;
    }
    .competition-caption .competition-title .small br {
        display: block;
    }
    .competition-caption .competition-title {
        padding: 100px 0 20px;
        letter-spacing: -2px;
        font-size: 28px;
    }
    .competition-caption .competition-sub-title p.date {
        margin: 0 0 10px;
        font-size: 18px;
    }
    .competition-caption .competition-sub-title p.date small {
        font-size: 13px;
    }
    .competition-caption .competition-sub-title p.place {
        line-height: 1.5;
        font-size: 18px;
    }
    .competition-caption .competition-sub-title br {
        display: block;
    }

    /* main-banner */
    .main-spot-area {
        position: relative;
        margin: 0 auto;
        border-bottom: 1px solid #002e66;
        background-color: #fff;
    }
    .main-spot-area .inner-wrap.bg-main {
        min-height: auto;
        background: url(/images/bg/bg_main_mobile.png) right bottom no-repeat;
        background-size: 280px;
    }

    /* countdown */
    .countdown-area,
    .eng .countdown-area {
        width: auto;
        margin: 20px 20px 0;
        padding: 20px 0 10px;
        text-align: center;
    }
    .countdown-area .info {
        display: block;
        margin-right: 0;
        text-align: center;
    }
    .countdown-area h3 {
        margin: 0 0 5px;
        font-size: 21px;
    }
    .countdown-area .date {
        margin: 0 0 10px;
        font-size: 15px;
    }
    .countdown-area #countdown {
        display: block;
        margin-left: 0;
    }
    .countdown-area #countdown p {
        display: inline-block;
        margin: 0 5px 0 0;
    }
    .countdown-area #countdown p b {
        display: block;
        width: 46px;
        height: 54px;
        line-height: 50px;
        font-size: 24px;
    }

    /* 퀵버튼 */
    #quick {
        /*margin-top: 40px;*/
        margin-top: 60px;
        padding: 0 0 50px;
    }
    #quick .quick-buttons {
        text-align: center;
    }
    #quick .quick-buttons li {
        margin: 0 20px;
    }
    #quick .quick-buttons li a {
        display: block;
    }
    #quick .quick-buttons li a span.circle {
        width: 100px;
        height: 100px;
        line-height: 100px;
    }
    #quick .quick-buttons li.submission span.circle b {
        margin-top: 15px;
    }
    #quick .quick-buttons li.exhibition span.circle b {
        margin-top: 19px;
    }
    #quick .quick-buttons li a span.title {
        font-size: 15px;
        font-weight: 500;
    }

    /* ==================================================================================
        컨텐츠 - 공통
    ================================================================================== */

    /* ==================================================================================
        main-poster-area
    ================================================================================== */
    .main-poster-area {
        padding: 90px 0 0;
        border-bottom: 1px solid #eee;
    }
    .main-poster-area img {
        display: block;
        max-width: 100%;
    }

    /* ==================================================================================
        main-work-list
    ================================================================================== */
    .main-work-area {

    }
    .main-work-area .alert {
        margin-left: 20px;
        margin-right: 20px;
    }
    .main-work-area .inner-wrap {
        padding-top: 0px;
    }
    .main-work-area .article {
        padding: 60px 0 60px;
        /*padding: 100px 0 60px;*/
        border-bottom: 1px solid #eee;
    }
    .main-work-area .article h3 {
        margin: 0 0 30px;
        font-size: 28px;
    }
    .main-work-area .article .title-border {
        width: 32px;
        margin: 0 auto 50px;
    }

    /* 검색 영역 */
    .search-area {
        margin: 0 0 50px;
        padding: 0 20px;
    }
    .search-area ul {

    }
    .search-area ul li {
        float: left;
        width: 50%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .eng .search-area ul li {
        float: left;
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    /*.search-area ul li:nth-child(1) {*/
    /*    width: 100%;*/
    /*}*/
    .search-area ul li:nth-child(1) {
        padding-right: 5px;
    }
    .search-area ul li:nth-child(2) {
        padding-left: 5px;
    }
    .eng .search-area ul li:nth-child(1) {
        padding-right: 0;
    }
    .eng .search-area ul li:nth-child(2) {
        padding-left: 0;
    }
    .search-area ul li.select-box-area {
        width: 50%;
        margin: 5px 0 0;
        padding: 0 0 10px;
    }
    .search-area ul li.select-box-area:nth-child(2n) {
        padding-left: 10px;
    }
    .search-area ul li.select-box-area:nth-child(2n+1) {
        padding-right: 10px;
    }
    .search-area .major {
        height: 42px;
        padding: 0 5px;
        letter-spacing: -0.25px;
        font-size: 13px;
    }
    .search-area select {
        width: 100%;
        padding: 7px 5px;
        font-size: 15px;
    }
    .search-area select option {
        padding: 5px;
        font-size: 15px;
    }
    .search-area .search-bar {
        width: 100%;
    }
    .search-area .search-bar input[type=text] {
        width: 100%;
        height: 42px;
        padding: 0 56px 0 10px;
        font-size: 15px;
    }
    .search-area .search-bar input[type=text]::placeholder {
        font-size: 15px;
    }

    /* 작품 리스트 */
    .main-work-area ul.main-work-list {

    }
    .main-work-area .subject-info {
        margin: 0 0 60px;
        padding: 0 20px;
    }
    .main-work-area .subject-info p {
        font-size: 15px;
        word-break: break-all;
    }
    .main-work-area .subject-info p.active {
        display: block;
    }
    .main-work-area ul.main-work-list > li:nth-child(2n+1) {
        width: 50%;
        margin: 0 auto 30px;
        padding: 0 10px 0 20px;
    }
    .main-work-area ul.main-work-list > li:nth-child(2n) {
        width: 50%;
        margin: 0 auto 30px;
        padding: 0 20px 0 10px;
    }
    /*.main-work-area ul.main-work-list > li:nth-child(1),*/
    /*.main-work-area ul.main-work-list > li:nth-child(2),*/
    /*.main-work-area ul.main-work-list > li:nth-child(3),*/
    /*.main-work-area ul.main-work-list > li:nth-child(4),*/
    /*.main-work-area ul.main-work-list > li:nth-child(5) {*/
    /*    display: block;*/
    /*}*/
    .main-work-area ul.main-work-list > li:nth-child(5n) {
        margin-right: auto;
    }
    .main-work-area ul.main-work-list > li > a {
        display: block;
        max-width: 100%;
        margin: 0 auto;
    }
    .main-work-area ul.main-work-list > li > a .thm {
        display: block;
        max-width: 100%;
        height: 120px;
        overflow: hidden;
        margin: 0 0 15px;
    }
    .main-work-area ul.main-work-list > li > a .thm img {
        width: 100%;
        min-height: 120px;
        transition: all 0.45s;
    }
    .main-work-area ul.main-work-list > li > a:hover .thm img {
        transform: scale(1.35,1.35)
    }

    .main-work-area ul.main-work-list > li > a span {
        display: block;
    }

    /* 더보기 */
    .main-work-area .btn-area > a {
        padding: 15px 20px;
    }
    .main-work-area .btn-area > a i {
        margin: 0 8px 0 0;
        font-size: 18px;
    }
    .main-work-area .btn-area > a b {
        font-size: 18px;
    }

    /* 모시는 글 */
    .main-contents {
        padding: 10px 20px 50px;
    }
    .main-contents.greetings-area {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .main-contents .article {
        padding: 60px 0;
        border-bottom: 1px solid #eee;
    }
    .main-contents.greetings-area .article {
        padding: 80px 0 !important;
        border-bottom: 1px solid #eee !important;
    }
    .main-contents .article:last-child {
        padding: 60px 0 40px;
    }
    .main-contents .article h3 {
        margin: 0 0 30px;
        font-size: 28px;
    }
    .main-contents .article .title-border {
        width: 32px;
        margin: 0 auto 50px;
    }
    .main-contents .article .inner-section {
        padding: 25px;
    }
    .main-contents .article p {
        font-size: 15px;
        line-height: 1.5;
        word-break: break-all;
    }
    .main-contents .article.small p {
        font-size: 15px;
    }
    .main-contents .article.small.introduce p {
        font-size: 14px;
    }
    .main-contents .article p.chairman {
        margin: 30px 0 0;
    }

    /* ==================================================================================
        layer popup
    ================================================================================== */

    /* contents */
    .layer-popup-area {
        width: 100%;
    }
    .layer-popup-area .cont {
        padding: 0;
        line-height: 1.3;
        font-size: 14px;
    }

    /* .cont-area */
    .layer-popup-area .conts-area {
        float: none;
        width: 100%;
    }
    .layer-popup-area .conts-area h1 {
        padding: 20px;
    }
    .layer-popup-area .conts-area h1 b {
        font-size: 15px;
    }
    .layer-popup-area.eng .conts-area h1 b {
        font-size: 14px;
    }
    .layer-popup-area .conts-area h1 strong {
        font-size: 24px;
    }
    .layer-popup-area.eng .conts-area h1 strong {
        font-size: 19px;
    }
    .layer-popup-area .conts-area .conts-info ul li {
        font-size: 13px;
    }
    .layer-popup-area .conts-area .conts-info .tb-layer-pop td {
        padding: 5px;
        letter-spacing: -0.25px;
        font-size: 13px;
    }
    .layer-popup-area .conts-area .conts-info p.thm img {
        max-width: 100%;
    }

    /* .bg-conts-area */
    .layer-popup-area .bg-conts-area,
    .layer-popup-area.eng .bg-conts-area {
        float: none;
        width: 100%;
        height: auto;
    }
    .layer-popup-area .bg-conts-area .address {
        position: static;
        padding: 45px 20px;
        letter-spacing: -0.45px;
        text-align: center;
        font-size: 15px;
        font-weight: bold;
        color: #333;
        background-color: rgba(255,255,255,0.65);
    }

    /* popup1 */
    .layer-popup-area.pop1 {
        top: -550px;
        left: 0;
        width: 100%;
        margin-left: 0;
        z-index: 1;
    }
    .layer-popup-area.eng.pop1 {
        top: -600px;
    }
    .layer-popup-area.pop1 .close {
        width: 100%;
    }

    /* popup2 */
    .layer-popup-area.pop2 {
        top: -400px;
        left: 0;
        width: 100%;
        margin-left: 0;
        z-index: 2;
    }
    .layer-popup-area.eng.pop2 {
        top: -450px;
    }
    .layer-popup-area.pop2 .close {
        width: 100%;
    }

    /* popup2 */
    .layer-popup-area.pop3 {
        top: -550px;
        left: 0;
        width: 100%;
        margin-left: 0;
        z-index: 2;
    }
    .layer-popup-area.eng.pop3 {
        top: -550px;
    }
    .layer-popup-area.pop3 .close {
        width: 100%;
    }

}

@media only screen
and (max-width: 400px) {
    .conts-box.notice ul li .title {
        width: 100%;
    }
    .conts-box.notice ul li .date {
        display: none;
    }
}


/*
##Device = Tablets, Ipads (landscape)
##Screen = B/w 768px to 1024px
##Device = 태블릿, 아이패드(가로)
##Screen = 768px에서 1024px 사이
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

    .innerwrap{
        width: 100%;
        padding: 0 50px;
    }

    /* ==================================================================================
        메인배너 - main-banner
    ================================================================================== */
    /*carousel-caption*/
    .competition-caption .competition-title {
        padding: 20px 0 40px;
        font-size: 72px;
    }
    .competition-caption .competition-title .small {
        margin: 0 0 10px;
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.date {
        margin: 0 0 10px;
        font-size: 36px;
    }
    .competition-caption .competition-sub-title p.date small {
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.place {
        font-size: 24px;
    }
    .competition-caption .competition-info {
        font-size: 19px;
    }

    /* main-banner */
    .main-spot-area .inner-wrap.bg-main {
        background: url(/images/bg/bg_main.png) 630px bottom no-repeat;
        background-size: 350px;
    }

    /* ==================================================================================
        main-work-list
    ================================================================================== */

    /* 검색 영역 */
    .search-area ul li {
        width: 25%;
        margin: 0;
        padding: 0 10px;
    }
    .search-area .search-bar {
        position: relative;
        width: 25%;
    }
    .search-area .major {
        font-size: 13px;
    }
    .search-area select {
        font-size: 13px;
    }
    .search-area .search-bar input[type=text] {
        padding-right: 16px;
        font-size: 13px;
    }
    .search-area .search-bar input[type=text]::placeholder {
        font-size: 13px;
    }

    /* 작품 리스트 */
    .main-work-area ul.main-work-list > li {
        width: 25%;
        margin: 0 0 80px 0;
        padding: 0 10px;
    }
    .main-work-area ul.main-work-list > li:nth-child(4n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li:nth-child(5n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li > a {
        width: 100%;
    }
    .main-work-area ul.main-work-list > li > a .thm {
        width: 100%;
        height: 120px;
    }
    .main-work-area ul.main-work-list > li > a .thm img {
        width: 100%;
        min-height: 120px;
    }

}

/* ----------- iPad Pro 10.5" ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 834px)
and (max-device-width: 1112px)
and (-webkit-min-device-pixel-ratio: 2) {

    .innerwrap{
        width: 100%;
        padding: 0 50px;
    }

    /* ==================================================================================
        메인배너 - main-banner
    ================================================================================== */
    /*carousel-caption*/
    .competition-caption .competition-title {
        padding: 20px 0 40px;
        font-size: 72px;
    }
    .competition-caption .competition-title .small {
        margin: 0 0 10px;
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.date {
        margin: 0 0 10px;
        font-size: 36px;
    }
    .competition-caption .competition-sub-title p.date small {
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.place {
        font-size: 24px;
    }
    .competition-caption .competition-info {
        font-size: 19px;
    }

    /* main-banner */
    .main-spot-area .inner-wrap.bg-main {
        background: url(/images/bg/bg_main.png) 630px bottom no-repeat;
        background-size: 350px;
    }

    /* ==================================================================================
        main-work-list
    ================================================================================== */

    /* 검색 영역 */
    .search-area ul li {
        width: 25%;
        margin: 0;
        padding: 0 10px;
    }
    .search-area .search-bar {
        position: relative;
        width: 25%;
    }
    .search-area .major {
        font-size: 13px;
    }
    .search-area select {
        font-size: 13px;
    }
    .search-area .search-bar input[type=text] {
        padding-right: 16px;
        font-size: 13px;
    }
    .search-area .search-bar input[type=text]::placeholder {
        font-size: 13px;
    }

    /* 작품 리스트 */
    .main-work-area ul.main-work-list > li {
        width: 25%;
        margin: 0 0 80px 0;
        padding: 0 10px;
    }
    .main-work-area ul.main-work-list > li:nth-child(4n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li:nth-child(5n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li > a {
        width: 100%;
    }
    .main-work-area ul.main-work-list > li > a .thm {
        width: 100%;
        height: 120px;
    }
    .main-work-area ul.main-work-list > li > a .thm img {
        width: 100%;
        min-height: 120px;
    }

}

/* ----------- iPad Pro 12.9" ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 1024px)
and (max-device-width: 1366px)
and (-webkit-min-device-pixel-ratio: 2) {

    .innerwrap{
        width: 100%;
        padding: 0 50px;
    }

    /* ==================================================================================
        메인배너 - main-banner
    ================================================================================== */
    /*carousel-caption*/
    .competition-caption .competition-title {
        padding: 20px 0 40px;
        font-size: 72px;
    }
    .competition-caption .competition-title .small {
        margin: 0 0 10px;
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.date {
        margin: 0 0 10px;
        font-size: 36px;
    }
    .competition-caption .competition-sub-title p.date small {
        font-size: 21px;
    }
    .competition-caption .competition-sub-title p.place {
        font-size: 24px;
    }
    .competition-caption .competition-info {
        font-size: 19px;
    }

    /* main-banner */
    .main-spot-area .inner-wrap.bg-main {
        background: url(/images/bg/bg_main.png) 630px bottom no-repeat;
        background-size: 350px;
    }

    /* ==================================================================================
        main-work-list
    ================================================================================== */

    /* 검색 영역 */
    .search-area ul li {
        width: 25%;
        margin: 0;
        padding: 0 10px;
    }
    .search-area .search-bar {
        position: relative;
        width: 25%;
    }
    .search-area .major {
        font-size: 13px;
    }
    .search-area select {
        font-size: 13px;
    }
    .search-area .search-bar input[type=text] {
        padding-right: 16px;
        font-size: 13px;
    }
    .search-area .search-bar input[type=text]::placeholder {
        font-size: 13px;
    }

    /* 작품 리스트 */
    .main-work-area ul.main-work-list > li {
        width: 25%;
        margin: 0 0 80px 0;
        padding: 0 10px;
    }
    .main-work-area ul.main-work-list > li:nth-child(4n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li:nth-child(5n) {
        margin-right: 0;
    }
    .main-work-area ul.main-work-list > li > a {
        width: 100%;
    }
    .main-work-area ul.main-work-list > li > a .thm {
        width: 100%;
        height: 120px;
    }
    .main-work-area ul.main-work-list > li > a .thm img {
        width: 100%;
        min-height: 120px;
    }

}
