@charset 'utf-8';
/* 폰트 */
/* font-family: Noto Sans KR 노토산스 */
/* Noto Sans KR (korean) http://www.google.com/fonts/earlyaccess */

/* 공통 */
@media all and (max-width:767px){

    h2 {font-size:4em}
    h2 span{line-height: 65px}

    .header-top{width: 95%}
    .area{width: 100%}
    .visual_box{width: 100%}

    .title_band {margin: 25px 0 20px 0;padding:7px 15px;}
    
    .schedule p{padding:10px 0}
    .schedule p span {
        display: block;
        font-size: 1.3em;
        line-height: 30px;
    }
}
@media all and (min-width:768px) and (max-width:1279px){

    h2 {font-size:6em}
    h2 span{line-height: 100px}
    
    .header-top{width: 95%}
    .area{width: 90%}
    .visual_box{width: 95%}

    .title_band {margin: 60px 0 30px 0;padding:10px 15px}
    
    .schedule p span {
        font-weight: 800;
        font-size: 1.2em;
        line-height: 42px;
    }
    .schedule p span:first-child:after {
        content: "";
        border-right: 1px solid #393a3a;
        margin: 0 10px;
    }
}
@media all and (min-width:1280px){

    h2 {font-size:7em}
    h2 span{line-height: 115px}
    
    .header-top{width: 95%}
    .area{width: 1280px}
    .visual_box{width: 1280px}

    .title_band {margin: 60px 0 30px 0;padding:10px 15px}
    
    .schedule p span {
        font-weight: 800;
        font-size: 1.2em;
        line-height: 42px;
    }
    .schedule p span:first-child:after {
        content: "";
        border-right: 1px solid #393a3a;
        margin: 0 10px;
    }
}

body{color: #171717}

#container { width:100%; }
#container section { margin: 0 auto 40px auto; padding: 0 0 50px 0; }
button {
    width: 300px;
    margin: 20px auto 0 auto;
    display: block;
    padding: 15px 0;
    background: #003668;
    color: #fff;
    font-weight: 800;
    font-size: 1.2em;
    letter-spacing: -1px;
}
.area{margin: 0 auto}

/* 헤딩태그 */
h2 {color: #bdd526;text-align: center;font-family: "TmonMonsori"}
h2 span{display: block;font-weight: 900}
h3 {font-weight: 700;font-size: 1.7em; margin: 0 0 30px 0;text-align: center;font-family: "TmonMonsori";color: #393a3a}
h3:after {
    content:"";
    display:block;
    width:20px;
    margin:10px auto 10px auto;
    height:4px;
    border-bottom:4px solid #222;
}
h4 {font-size: 1.2em; font-weight: 800;}
h5 {line-height: 20px; font-weight: bold; font-size: 0.93em ; color: #393a3a}

#wrap{background: #fff}

/* header */
header{width: 100%;position: absolute;border-top:2px solid #ccc;z-index: 100}
header section { background: rgba(0,0,0,0.1); }
header section .header-top { margin: 0 auto; overflow: hidden }
.header-top ul{overflow: hidden;padding: 10px 0;display: inline-block}
.header-top ul li{float: left;margin: 0 10px 0 0;text-align: center}
.header-top ul li span { padding: 10px 0; font-size: 0.8em; color: #fff; }
.header-top .family-site{float: left}
.header-top .family-site li:first-child span { color: #bdd526; font-weight: 700; }
.header-top .previous-site{float: right}
.header-top .previous-site li.active span { color: #bdd526; font-weight: 700; }

/* nav */
nav h1{float: left}
nav .nav-box ul{overflow: hidden;float: right}
nav .nav-box .gnb ul li span{color: #fff;font-weight: 800;font-size: 1.1em}
nav .nav-box .gnb ul li span:hover { opacity: 0.7; transition: 0.8s }
nav .nav-box .gnb ul li:nth-child(1) span { border-bottom: 2px solid #bdd526 }

/* visual */
.visual {
    width:100%;
    background: #0b132f;
    background-size: cover;
    background-repeat: no-repeat;
    background-size: 1000px 35%, 1900px 60%;
    background-position: bottom,bottom;
}
.bg_visual { text-align: center; padding: 140px 0 220px 0; }
.visual_box {margin:0 auto}
.visual img {max-width: 100%}
.title_band {display:inline-block; font-size:22px; font-weight: 800; color: #fff}
.sub_text{margin-top: 10px; display:block; line-height: 1.5; font-size: 16px;color: #fff;font-weight: 700;font-size: 1.2em}

/*schedule*/
.schedule{margin: 10px 0 0 0}
.schedule p{border-top:2px solid #fff;border-bottom: 2px solid #fff;display: inline-block}
.schedule p span{font-weight: 800;color: #fff}

/*host*/
.host_box{background: rgba(255,255,255,0.4);border-radius:20px;width:70%;margin:30px auto 0 auto}
.host_box p{display: inline-block;margin: 0 30px}
.host_box p span{font-size: 1.2em;margin: 0 5px;line-height: 50px;color:#fff}
.host_box p span img{ margin:7px 0 0 0; }
.host_box p span:first-child {
    background: #e99787;
    border-radius: 2px;
    font-weight: 900;
    padding: 5px 20px;
    border-radius: 10px;
}
footer{background: #555;color: #fff}