@charset "utf-8";

/*font*/

@font-face {}

* {
    margin: 0 auto;
    padding: 0;
    text-decoration: none;
    list-style: none;
}

a {
    color: inherit;
}

html {
    font-size: 62.5%;
    line-height: 62.5%;
}

header {
    display: none;
}

.pc_header {
    display: none;
}

.inner_wrap {
    width: 100%;
    min-height: 200px;
    display: block;
    position: relative;
}

.m_header {
    background-image: url(../images/greetings_header.jpeg);
    background-position: center center;
    background-size: cover;
    padding: 10% 0;
    width: 100%;
}

.text {
    position: absolute;
    top: 50%;
    margin-top: 2rem;
    width: 100%;
}

.text h1 {
    text-align: center;
    color: #eee;
    font-family: "NanumSquare", sans-serif;
    font-size: 1.6rem;
    line-height: 2.3rem;
}

.text h1:after {
    content: "";
    display: block;
    width: 80%;
    border-bottom: 1px solid #e5e5e5;
    text-align: center;
    margin: 0 auto;
    padding-top: 1%;
}

.wrapper {
    width: 100%;
    height: auto;
    background-color: #444;
    text-align: center;
}

.tab {
    width: 100%;
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;

}

/* Float the list items side by side */

.tab li {
    float: left;
    display: table;
    width: 100%;
    height: auto;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.tab li:last-child {
    border-bottom: none;
}

/* Style the links inside the list items */

.tab li a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    color: gainsboro;
    font-size: 1.1rem;
    line-height: 1.4rem;
    font-family: "Noto Sans KR", sans-serif;
    transition: all 0.3s;
    padding: 1%;
}

.tab li a:hover {
    color: #fff;
    transition: 0.2s;
    border-bottom: 1px solid gold;
}

.title {
    font-family: "Noto Sans KR", "NanumSquare", sans-serif;
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: column;
    padding-bottom: 20px;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
    color: black;
}

.bar {
    margin: 0px 0 15px 0;
    text-align: center;
    width: 55px;
    background: #dda300;
    height: 7px;
}

.box {
    display: inline-block;
    text-align: center;
    width: 100%;
    margin: 20px 0;
}

#text_wrap1 {
    font-family: "NanumSquare";
 width: 95%;
    margin: 0 auto;
    padding: 2% 5%;
    border: 3px solid #ddd;
}

#text_wrap2 {
    width: 95%;
    margin: 0 auto;
    padding: 2% 5%;
    font-family: "NanumSquare";
    border: 3px solid #ddd;
}

.text1 h1 {
    font-size: 1.4rem;
    line-height: 1.6rem;
    color: darkcyan;
    font-weight: 500;
}

.text1:after {
    content: "";
    display: block;
    border-bottom: 1px solid #ddd;
    padding: 1%;
}

.text2 {
    font-family: 'IropkeBatang';
    text-align: left;
    width: 90%;
    margin: 0 auto;
    padding: 1% 0;
}

.text2 p {
    color: gray;
    font-size: 1.2rem;
    line-height: 1.6rem;
}

.text3 {
    text-align: left;
    width: 90%;
    margin: 0 auto;
    margin-top: 1%;
}

.text3 p {
    font-size: 1.2rem;
    color: black;
    padding: 0.5% 0;
    line-height: 1.5rem;
}

.text4 {
    display: block;
    text-align: left;
    width: 90%;
    margin: 0 auto;
    padding: 2% 0;
}

.text4 p {
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.6rem;
}

.text4 img {
    float: right;
    width: 50%;
}

.text5 {
    font-size: 1.25rem;
    line-height: 1.5rem;
    text-align: left;
    width: 90%;
    margin: 0 auto;
    padding: 2%;
}

.left {
    display: block;
}


.org {
    color: coral;
}

.gb {
    color: cadetblue;
    font-weight: 600;
}

.table {
    padding-top: 2rem;
}

.table_h {
    width: 30%;
    display: inline-block;
    margin-bottom: 0.5rem;
    border-right: gold solid 5px;
    float: left;
    font-family: IropkeBatang;
    text-align: left;
    font-size: 1.2rem;
}

.info {
    width: 100%;
    margin: 0 auto;
    font-size: .85rem;
    border-collapse: collapse;
    border-bottom: 3px solid cadetblue;
    border-top: 3px solid cadetblue;
}

.info td {
    padding: 2.5px;
    line-height: 1.5rem;
    vertical-align: middle;
}

.info tr {
    border-bottom: 1px solid #eee;
}

.info td:nth-child(2n+1) {
    color: cadetblue;
    width: auto;
}

.info td:nth-child(2n) {
    text-align: left;
}

.info-e {
    width: 100%;
}

.info-e td:nth-child(2n+1) {
    background-color: lightgray;
    color: white;
    text-align: center;
}

.moto {
    width: 95%;
    margin: 1rem 0;
    text-align: left;
    display: flex;
}

.num {
    display: inline-block;
    margin-right: 0.5rem;
}

.num p {
    padding: 0.5rem;
    background-color: cornflowerblue;
    box-shadow: .2rem .2rem .1rem 0 rgba(0, 100, 200, .3);
    color: white;
    font-size: 1.6rem;
}

.txt {
    width: 80%;
    font-size: 1.2rem;
    line-height: 1.5rem;
}

.image {
    margin: 0 auto;
    width: 100%;
    padding-top: 2%;
}

.image img {
    max-width: 100%;
}

.block {
    display: inline-block;
}

.world_map {
    padding: 2rem 0;
    line-height: 3rem;
    
}

.world_map h2 {
    font-size: 2rem;
    font-weight: bold;
    color: goldenrod;
}

.world_map_img {
    width: 80%;
    margin-left: 124px;
   
    
}

.world_map_img img {
    width: 80%;
    max-width: 100%;
}

.map_nav {
    max-width: 90%;
    line-height: 3rem;
    margin: 0 auto;
}

.map_nav li {
    width: 48%;
    display: inline-block;
    font-size: 1rem;
    margin: 0.5%;
}

.map_nav li:nth-child(2n) {
    margin: 0;
}

.map_nav a {
    width: 100%;
    background-color: #eee;
    display: inline-block;
}

.map_nav a:hover {
    background-color: rgba(0,0,0,0.5);
    color: white;
    transition: all 0.3s;
}

.map_title {
    line-height: 3rem;
    border-left: 1rem solid gold;
    text-align: left;
}

.map_title h2 {
    padding-left: 2rem;
    font-size: 1.8rem;
    margin-top: 2rem; 
}

.map {
    border-bottom: 1px dotted lightgray;
    line-height: 5rem;
}
.map iframe {
    width: 100%;
    height: 60vh;
}

@media screen and (min-width:960px) {
    .pc_header {
        display: block;
        background-image: url(../images/greetings_header.jpeg);
        background-position: center;
        background-size: cover;
        background-attachment: fixed;
        width: 100%;
    }

    .m_header {
        display: none;
    }

    .inner_wrap {
        min-height: 400px;
    }

    .text {
        margin-top: -2rem;
    }

    .text h1 {
        margin-top: 3rem;
        font-size: 3rem;
        line-height: 3.3rem;
    }

    .text h1:after {
        width: 60%;
        border-bottom: 1px solid #e5e5e5;
    }

    .wrapper {
        height: 50px;
    }

    .tab {
        width: 65%;
    }

    /* Float the list items side by side */
    .tab li {
        width: 20%;
        height: 50px;
        border-right: 1px solid rgba(255, 255, 255, 0.2);
    }

    .tab li:first-child {
        border-left: 1px solid rgba(255, 255, 255, 0.2);
    }

    /* Style the links inside the list items */
    .tab li a {
        font-size: 1.4rem;
        line-height: 1.8rem;
    }

    .tab li a:hover {}

    .title {
        padding-bottom: 1.5%;
        font-size: 2.8rem;
    }


    .bar {
        margin: 38px 0 15px 0;
    }


    .box {
        margin: 0 0 20px 0;
    }



    #text_wrap1 {
        width: 75%;
    }

    #text_wrap2 {
        width: 75%;
    }


    .text1 h1 {
        font-size: 2.1rem;
        line-height: 2.4rem;
    }

    .text2 {}

    .text2 p {
        font-size: 1.6rem;
        line-height: 1.8rem;
    }

    .text3 {}

    .text3 p {
        font-size: 1.6rem;
        color: black;
        padding: 0.5% 0;
        line-height: 1.8rem;
    }

    .text4 {}

    .text4 p {
        font-size: 1.6rem;
        line-height: 2rem;
    }

    .text4 img {}

    .text5 {
        font-size: 1.6rem;
    }

    .left {}

    .org {}

    .gb {}

    .table {
        padding-top: 3rem;
    }

    .table_h {
        width: 14%;
        margin-left: 3rem;
        font-size: 1.8rem;
    }

    .info {
        width: 70%;
        font-size: 1.6rem;
        line-height: 1.75rem;
    }

    .info td {
        padding: 0 1rem;
        line-height: 2rem;
    }

    .moto {}

    .num {
        font-size: 2.4rem;
    }

    .txt {
        font-size: 1.6rem;
    }

    .map_nav li {
        width: 24%;
        display: inline-block;
        font-size: 1.6rem;
        border-right: 1px solid white;
        margin: 0;
    }

    .map_nav li:nth-last-child(1) {
        border: 0px;
    }
    .map iframe {
        width: 80%;
    }
}