@charset "utf-8";

/* 웹폰트 호출 */
@import url("https://hangeul.pstatic.net/hangeul_static/css/nanum-square.css");

/* 초기화 */
*{margin: 0; padding: 0;}
ul{list-style: none;}
a{text-decoration: none; color: inherit;}
i, span, a{display: inline-block;}

/* 공통스타일 */
.blind{position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden;}
.clear::after{content: ""; display: block; clear: both;}

.visual_btn{width: 160px; height: 50px; border: 1px solid #4e4e4e;
    font-size: 20px; line-height: 50px; text-align: center;
    margin-top: 100px;}
.visual_btn:hover{background: #c0cb3b; border: 1px solid #c0cb3b;}

.section1_btn{width: 160px; height: 50px; border: 1px solid #fff;
    font-size: 18px; line-height: 50px; text-align: center;
    margin-top: 80px; 
    position: absolute; left: 30px; top: 400px;}
.section1_btn:hover{background: #c0cb3b; border: 1px solid #c0cb3b;}

.section3_btn{width: 140px; height: 45px; border: 1px solid #fff;
    font-size: 18px; line-height: 45px; text-align: center;
    margin-top: 30px;
    position: absolute; left: 150px; top: 220px;}

/* 상속 */
body{
    font-size: 20px; color: #4e4e4e;
    font-family: 'NanumSquare', sans-serif; font-weight: 400;
    line-height: 1.5;
}
h1, h2, h3, h4, h5, h6{
    color: #373737; font-weight: 900;
    font-family: 'NanumSquareExtraBold';
    line-height: 1;
}

/* 레이아웃 */
.inner{width: 1360px; margin: 0 auto;}

/* header 레이아웃 */
#header{position: relative; display: block; z-index: 999;}
#header .header_area{height: 190px; 
    display: flex; /* justify-content: center; */ align-items: center;}
#header .logo_area{margin-right: 50px;}
/* #header .logo_area{position: absolute; left: 0; top: 50%; transform: translateY(-50%);} */
#header .nav .gnb{display: flex;}
#header .nav .gnb>li{padding: 0 10px; margin-top: 10px; position: relative;}
#header .nav .gnb>li>a{line-height: 190px; padding: 0 50px;
    color: #373737; font-weight: 700;}
#header .nav .gnb>li:hover>a{color: #c0cb3b;}

#header .nav .bg{background: #c0cb3b; width: 100%; height: 220px;
    position: absolute; left: 0; top: 190px;
    display: none;}
#header .nav .lnb{position: absolute; left: 50%; top: 190px; transform: translateX(-50%);
    text-align: center; font-size: 16px; line-height: 2.5; width: 100%; padding-top: 25px;
    display: none;}
#header .nav:hover .lnb, #header .nav:hover .bg{display: block;}


/* visual 레이아웃 */
/* visual_1 */
.visual_1{
    height: 1000px;
    background: url(../images/visual_1_event.jpg) no-repeat; 
}
.visual_1 .inner{position: relative;}
.visual_1 .visual_text{width: 400px;
    position: absolute; left: 0; top: 260px;}
.visual_1 .visual_text p:nth-of-type(1){font-size: 32px; font-weight: 700; color: #373737;}
.visual_1 .visual_text h2{font-size: 50px;}
.visual_1 .visual_text p:nth-of-type(2){line-height: 1.6;
    margin-top: 50px;}
.visual_1 .visual_text span{color: #fff; width: 295px; height: 30px;
    background: #cf4a6b; line-height: 30px;}

/* visual_2 */
.visual_2{
    height: 1000px;
    background: url(../images/visual_2_ticket.jpg) no-repeat; 
}
.visual_2 .inner{position: relative;}
.visual_2 .visual_text{width: 480px;
    position: absolute; left: 0; top: 260px;}
.visual_2 .visual_text p:nth-of-type(1){font-size: 32px; font-weight: 700; color: #373737;}
.visual_2 .visual_text h2{font-size: 50px;}
.visual_2 .visual_text p:nth-of-type(2){width: 360px;
    line-height: 1.6; margin-top: 50px;}
.visual_2 .visual_text p:nth-of-type(2) span{display: block;}

/* visual_3 */
.visual_3{
    height: 1000px;
    background: url(../images/visual_3_restaurant.jpg) no-repeat; 
}
.visual_3 .inner{position: relative;}
.visual_3 .visual_text{width: 525px;
    position: absolute; left: 0; top: 260px;}
.visual_3 .visual_text p:nth-of-type(1){font-size: 32px; font-weight: 700; color: #373737;}
.visual_3 .visual_text h2{font-size: 50px;}
.visual_3 .visual_text p:nth-of-type(2){line-height: 1.6; margin-top: 50px;}
.visual_3 .visual_text p:nth-of-type(2) span{display: block;}

/* contents */
/* contents_section1 & section3에 display: flex; 적용 */
#contents .section{margin-top: 150px;}
#contents .event, #contents .info_area{
    display: flex; justify-content: space-between;
}
/* 텍스트때문에 이미지 밀리는 거 막기위해 section3 이미지(li)에 width값 적용 */
#contents .info_area li{width: 440px;}

/* contents_section1 */
#contents .event li{position: relative;}
#contents .event li .text{
    position: absolute; left: 33px; top: 195px;
    color: #fff;
    width: 420px;}
#contents .event li .text h3{font-size: 34px; font-weight: 900;
    color: #fff; line-height: 1.3;}
#contents .event li .text p{font-size: 20px; font-weight: 400;
    padding-top: 30px;}
#contents .event li:nth-child(1) .text p{width: 260px;}
#contents .event li:nth-child(2) .text p{width: 400px;}
#contents .event .section1_btn a{color: #fff;}
#contents .event .section1_btn:hover a{color: #373737; font-weight: 600;}


/* contents_section2 */
.sec2{position: relative;}
.sec2 .logo{position: absolute; left: 33px; top: 30px;}
.sec2 .text{position: absolute; left: 33px; top: 85px;}
.sec2 .text p:nth-of-type(1){font-size: 22px; color: #fff;}
.sec2 .text h3>span{font-size: 55px; color: #c0cb3b;}
.sec2 .text h3{font-size: 50px; color: #fff;}
.sec2 .text p:nth-of-type(2){width: 550px; margin-top: 50px;
    color: #fff;}
.sec2 .text p:nth-of-type(2) span{display: block;}

.sec2 .time_area{position: absolute; left: 1140px; top: 40px;
    width: 180px;
    display: flex; justify-content: space-between;}
.sec2 .time_area p{color: #fff; font-size: 18px;}

/* contents_section3 */
.info_area .before{position: relative;}
.info_area .before .text{width: 330px; 
    text-align: center; color: #fff;
    position: absolute; left: 50px; top: 130px;}
.info_area .before .text h3{color: #fff; font-size: 30px;}
.info_area .before .text p{padding-top: 25px;}
.info_area .before:nth-of-type(1)>.text p{padding: 25px 25px 0;}
.info_area li:nth-of-type(3) .text p>span{display: block;}

.info_area img, .info_area a{display: block;} /* 밖으로 빠져나가는 영역 안 보이게 하기 위해 */
.info_area .color{position: relative; overflow: hidden;}
.info_area .mask{
    position: absolute; left: 0; top: 0;
    width: 100%; height: 100%;
    text-align: center;
    background:  rgba(110, 116, 30, 0.95); transition: all 0.5s; opacity: 0;
}
.info_area li:nth-of-type(1) .mask .mask_text{margin-top: 160px;
    padding: 0 45px;}
.info_area li:nth-of-type(2) .mask .mask_text{margin-top: 135px;
    padding: 0 100px;}
.info_area li:nth-of-type(3) .mask .mask_text{margin-top: 170px;}
.info_area .mask p{font-size: 18px;}
.info_area .mask .large{font-size: 24px; font-weight: 900;}
.info_area .mask:hover, .info_area a:hover{color: #fff; opacity: 1;}

/* footer */
#footer{background: rgba(78, 78, 78, 0.3);
    margin-top: 150px; padding: 50px 0 150px;}

.footer_top{display: flex;}
.footer_top li{font-size: 18px; padding: 0 15px;
    position: relative;}
.footer_top li:first-child{padding-left: 0;}
.footer_top li::after{content: ""; width: 1px; height: 17px;
    background: #4e4e4e; display: inline-block;
    position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.footer_top li:last-child::after{display: none;}
.footer_top li strong{font-weight: 400; color: red;}

.footer_bottom{margin-top: 20px;}
.footer_bottom li{font-size: 16px;}

.swiper-pagination-bullet.swiper-pagination-bullet-active{background: rgb(110, 116, 30);}

/* Sub */
.line_change{display: block;}
.sub_visual{background: url(../images/Sub_visual.jpg);
    position: relative; height: 500px;}
.sub_visual .sub_visual_text{position: absolute; left: 50%; top: 200px; transform: translateX(-50%);
    font-size: 40px;
    text-shadow: 2px 2px rgba(78, 78, 78, 0.45);}

#contents .sub_menu{border-bottom: 1px solid #c5c5c5;}
#contents .sub_menu .sub_menu_text{display: flex;}
#contents .sub_menu .sub_menu_text a{width: calc(100%/3); display: block; 
    font-size: 20px; color: #373737; text-align: center; line-height: 55px;
    border: 1px solid #c5c5c5;}

#contents .sub_menu .sub_menu_text .active{background: #c0cb3b; color: #fff;}

.sub_sec{padding: 100px 0;}
.sub_sec .title_area{display: flex; justify-content: space-between; align-items: center;}
.sub_sec .title_area h3{font-size: 26px;}
.sub_sec .title_area p{font-size: 14px; color: #373737;}

.sub_sec .sub_intro_area .sub_intro{padding-top: 100px; display: flex;}
.sub_sec .sub_intro_area .intro1 .text{padding-left: 110px;}
.sub_sec .sub_intro_area .intro1 .text h4{font-size: 30px;}
.sub_sec .sub_intro_area .intro1 .text, .sub_sec .sub_intro_area .intro2 .text{font-size: 24px; line-height: 1.5; word-break: keep-all;
    padding-top: 20px;
    width: 645px;}
.sub_sec .sub_intro_area .intro1 .text p{padding-top: 10px;}
.sub_sec .sub_intro_area .intro2 .text p{padding-top: 50px;}


.sec2_info{display: flex; justify-content: space-between;}
.sec2_info .img{background: url(../images/Sub_content3_hover.png);
    width: 545px; height: 1250px;}

.sec2_info .sec2_info_text{position: relative; right: 0; top: 180px;}
.sec2_info .sec2_info_text .info_box{width: 800px;
    background: rgba(192, 203, 60, 0.3); transition: background 0.3s;
    display: flex;
    margin-bottom: 25px; padding: 10px 0;
    line-height: 2;
    position: absolute; right: 0;}
.sec2_info .sec2_info_text:hover .info_box:hover{background: rgba(192, 203, 60, 0.6);}
.sec2_info .sec2_info_text .info_box7{position: absolute; top: -5px;}
.sec2_info .sec2_info_text .info_box5{position: absolute; top: 95px;}
.sec2_info .sec2_info_text .info_box4{position: absolute; top: 220px;}
.sec2_info .sec2_info_text .info_box3{position: absolute; top: 365px;}
.sec2_info .sec2_info_text .info_box2{position: absolute; top: 510px;}
.sec2_info .sec2_info_text .info_box1{position: absolute; top: 635px;}
.sec2_info .sec2_info_text .info_box0{position: absolute; top: 860px;}

.sec2_info .sec2_info_text .floor{width: 150px; text-align: center;}
.sec2_info .sec2_info_text .left{width: 350px;}
.sec2_info .sec2_info_text .floor p, .sec2_info .sec2_info_text .bold{font-size: 20px; font-weight: 700;}
.sec2_info .sec2_info_text .floor p{padding: 0 20px 0 25px;}
.sec2_info .sec2_info_text .bold{padding-right: 10px;}
.sec2_info .sec2_info_text .right p, .sec2_info .sec2_info_text .left p{font-size: 16px;}

/* sub2 */
.row_flex{display: flex; justify-content: space-between;}
.row1{padding-top: 100px;}
.row2{padding-top: 50px;}
.gallery_text a{display:block; text-align: center;}