﻿/* ************************************************************************************ */
/************* Media Query *************/

@media(max-width:640px) {
    header {
        position:fixed;
        width:100%;
        height:65px; 
        opacity:0.97;
        background-color:#ffffff;
    
        z-index:3;
    }

    #wrapper {
        width:auto;
        height:auto;
        /*background-image:url(../IMG/bg/bg_striped_pattern2560x1440.png);*/
        background-image:url(../IMG/bg/bg_striped_pattern2.png);
        background-repeat:repeat;
        background-size:cover;
        background-attachment:fixed;
    }

    section {
        height:100%;
        width:100%;
        overflow:hidden;
    }

     #content1 {
        position:relative;
        width:100%;
        height:320px;
    }
    
    .TitleImgDiv {
        width:100%;
        height:320px;
        background-image:url(../IMG/mobile/photos/title_awards_s_pg4.png);
        background-repeat:no-repeat;
        background-size:cover;
    }

    .TitleMenuDiv {
        position:absolute;
        bottom:0;
        width:100%;
        height:45px;
        background-color:#010006;
        opacity:0.7;
    }

    .TitleMunuBar {
        height:45px;
        width:100%;
    }

    .TitleMenu {
        margin-top:10px;
        width:50%;
        height:33px;
        float:left;
        text-align:center;
        z-index:1;
    }

    .TitleMunuText {
        font-family:'Noto Sans CJK KR Regular';
        font-size:13px;
        color:#ffffff;
    }

    .TitleMenu:hover {
        border-bottom:2px solid #f97a5c;
        color:#f97a5c;
    }

    .TitleMenu:hover > .TitleMunuText {
        color:#f97a5c;
    }

    .w_img {
        display:none;
    }

    .m_img {
        display:block;
        margin:auto;
    }

    .contentTitleIcon {
        position:relative;
        top:35px;
        vertical-align:middle;
        text-align:center;
        width:100%;
    }

    .contentTitleText {
        position:relative;
        top:49px;
        width:100%;
        font-family:'Noto Sans CJK KR Regular';
        font-weight:bold;
        font-size:14px;
        color:#000000;
        text-align:center;
    }

    #content2 {
        width:100%;
        height:1450px;
    }

    #content2Div {
        position:relative;
        width:100%;
        height:1450px;
        background-color:#ffffff;
        margin:0 auto;
    }

    .prize_table {
        border-collapse:collapse;
        border-spacing:0;
        /*float:left;*/
        position:relative;
        top:80px;
        font-family:'Noto Sans CJK KR Regular';
        width:80%;
        margin:auto;
        /*left:27.3437%;*/
    }

    .prize_table td{font-size:12px; padding:10px 5px;overflow:hidden;word-break:normal;}
    .prize_table .tbl_year{text-align:right; }
    .prize_table .tbl_text{vertical-align:top; text-align:left; padding-left:7%; }

    #content3 {
        width:100%;
        height:700px;
    }

    #content3Div {
        position:relative;
        width:100%;
        height:700px;
        background-color:#e5e5ea;
        margin:0 auto;
    }

    .certi_table {
        border-collapse:collapse;
        border-spacing:0;
        /*float:left;*/
        position:relative;
        top:80px;
        font-family:'Noto Sans CJK KR Regular';
        width:80%;
        margin:auto;
        /*left:27.3437%;*/
    }

    .certi_table td{font-size:12px; padding:10px 5px;overflow:hidden;word-break:normal;}
    .certi_table .tbl_year{text-align:right; }
    .certi_table .tbl_text{vertical-align:top; text-align:left; padding-left:7%; }

    #content4 {
        width:100%;
        height:128px;
    }

    #btn_top {
        position:fixed;
        right:2%;
        bottom:148px;
    }
}

@media(min-width:640px) {
    header {
        position:fixed;
        width:100%;
        height:65px;
        opacity:0.97;
        background-color:#ffffff;

        z-index:3;
    }

    #wrapper {
        width:auto;
        height:auto;
        /*background-image:url(../IMG/bg/bg_striped_pattern2560x1440.png);*/
        background-image:url(../IMG/bg/bg_striped_pattern2.png);
        background-repeat:repeat;
        background-size:cover;
        background-attachment:fixed;
    
        overflow:hidden;
    }

    section {
        height:100%;
        width:100%;
        /*overflow:hidden;*/
    }

    .w_img {
        display:block;
        margin:auto;
    }

    .m_img {
        display:none;
    }

    #content1 {
        width:100%;
        height:720px;
    }

    .TitleImgDiv {
        width:100%;
        height:720px;
        background-image:url(../IMG/photos/title_awards_pg4.png);
        background-repeat:no-repeat;
        background-size:cover;
    }

    .TitleMenuDiv {
        position:absolute;
        top:624px;
        width:100%;
        height:96px;
        background-color:#010006;
        opacity:0.7;
    }

    .TitleMunuBar {
        height:100%;
        max-width:1280px;
        margin:0 auto;
    }

    .TitleMenu {
        margin-top:26px;
        width:50%;
        height:64px;
        float:left;
        text-align:center;
        z-index:1;
    }

    .TitleMunuText {
        font-family:'Noto Sans CJK KR Regular';
        font-size:23px;
        color:#ffffff;
    }

    .TitleMenu:hover {
        border-bottom:6px solid #f97a5c;
        color:#f97a5c;
    }

    .TitleMenu:hover > .TitleMunuText {
        color:#f97a5c;
    }

    .contentTitleIcon {
        position:relative;
        top:146px;
        /*left:50%;*/
        vertical-align:middle;
        text-align:center;
        width:100%;
    }

    .contentTitleText {
        position:relative;
        top:195px;
        width:100%;
        font-family:'Noto Sans CJK KR Regular';
        font-weight:bold;
        font-size:1.421rem;
        color:#000000;
        text-align:center;
    }

    /************* Section2 *************/

    #content2 {
        width:100%;
        height:1598px;
        /*background-image:url(../IMG/bg/bg_pg4_prizes.png);
        background-repeat:no-repeat;
        background-size:cover;*/
    }

    #content2Div {
        position:relative;
        max-width:1280px;
        height:1598px;
        /*background-image:url(../IMG/bg/bg_pg4_prizes@2x.png);
        background-repeat:round;
        background-size:contain;*/
        margin:0 auto;
    }

    .prize_table {
        border-collapse:collapse;
        border-spacing:0;
        /*float:left;*/
        position:relative;
        top:298px;
        font-family:'Noto Sans CJK KR Regular';
        width:60%;
        margin:auto;
        /*left:27.3437%;*/
    }

    .prize_table td{padding:10px 5px;overflow:hidden;word-break:normal;}
    .prize_table .tbl_year{text-align:right; }
    .prize_table .tbl_text{vertical-align:top; text-align:left; padding-left:7.7812%; }



    /************* Section3 *************/

    #content3 {
        width:100%;
        height:1000px;
    }

    #content3Div {
        position:relative;
        max-width:1280px;
        height:1000px;
        margin:0 auto;
    }

    .certi_table {
        border-collapse:collapse;
        border-spacing:0;
        /*float:left;*/
        position:relative;
        top:298px;
        font-family:'Noto Sans CJK KR Regular';
        width:60%;
        margin:auto;
        /*left:27.3437%;*/
    }

    .certi_table td{padding:10px 5px;overflow:hidden;word-break:normal;}
    .certi_table .tbl_year{text-align:right; }
    .certi_table .tbl_text{vertical-align:top; text-align:left; padding-left:7.7812%; }
}


@media (min-width:640px) and (max-width:1400px) {
    #content4 {
        width:100%;
        height:160px;
    }

    #btn_top {
        position:fixed;
        right:2%;
        bottom:180px;
    }
}

@media(min-width:1400px) {
    #content4 {
        width:100%;
        height:80px;
    }

    #btn_top {
        position:fixed;
        right:2%;
        bottom:100px;
    }
}

@media (min-width:640px) and (max-width:700px) {
    .prize_table td, .certi_table td{
        font-size:14px;
    }
}

@media(min-width:700px) and (max-width:820px) {
    .prize_table td, .certi_table td{
        font-size:15px;
    }
}

@media(min-width:820px) and (max-width:1280px) {
    .prize_table td, .certi_table td {
        font-size: 16px;
    }
}

@media(min-width:1280px) {
    .prize_table td, .certi_table td{
        font-size: 17px;
    }
}

/* ************************************************************************************ */

html, body {
    width:100%;
    height:100%; 
    margin:0px; 
    padding:0px; 
    font-size:16px;
}

img {
    border:0;
}



.prizeBg {
    position:absolute;
    width:327px;
    height:336px;
    top:980px;
    left:85%;
    /*top:864px;*/
}

.certificateBg {
    position:absolute;
    width:271px;
    height:150px;
    top:270px;
    right:85%;
}

#btn_top {
    display:none;
}