@charset "utf-8";

/* Mobile */
.main_container{position:relative;box-sizing:border-box; background: #13002d;}

/*공통_전체*/  
.section{min-height:400px; position:relative; text-align:center; height:75vh;}
.section>div{overflow:hidden;background-size:cover;width:100%;height:100%;background-repeat:no-repeat;background-position:top center;display:flex;flex-direction:column;justify-content:center;align-items:center;}
.section h3{opacity:0;transition:all .4s ease;transform:translateY(-20%);color:#fff;line-height:1.5;font-size:1.8rem;z-index:1; font-weight: 100; font-size: 30px;}
.section h3 strong{color:#fff568; font-weight: 100;}
.section.on h3{opacity:1;transform:translateY(0);}

/* 퀵링크 */
.q_link{display: none;}


/*메인비주얼*/
.section.con1{min-height: 800px; height: auto;}
.section .m_visual{min-height: 800px;background-position: bottom center;}
.section .m_visual .tit{position: absolute; top: 140px;}
.section .m_visual .tit p{font-family:'GmarketSans';color: #fff;font-size: 1.4rem;line-height: 1.2em;font-weight: 100;}
.section .m_visual .tit p.img img{width: 320px;}
.section .m_visual .tit p.date{margin: 10px 0;font-size: 1.6rem;}
.section .m_visual .tit p.date strong{color: #ffef41; font-weight: 600;}
.section .m_visual .tit p.date span{font-weight: 600;}
.section .m_visual .tit p.place{font-weight: 400;}
.section .m_visual .tit p.place span{font-size: 1.25rem;}
.section .m_visual .ico_box{position: absolute; bottom: 0; width: 100%;}
.section .m_visual .ico_box ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.section .m_visual .ico_box ul li{width: 50%;}
.section .m_visual .ico_box ul li a{display: block; padding: 26px 0; height: 145px; background: rgba(0, 0, 0, 0.9); color: #fff;}
.section .m_visual .ico_box ul li a::before{content: ''; display: block; width: 70px; height: 50px; margin: 0 auto 26px; background: url('/images/15_night/main/m_ico.png') no-repeat;}
.section .m_visual .ico_box ul li.l1 a::before{background-position: 50% -32px;}
.section .m_visual .ico_box ul li.l2 a::before{background-position: 50% -149px;}
.section .m_visual .ico_box ul li.l3 a::before{background-position: 50% -259px;}
.section .m_visual .ico_box ul li.l4 a::before{background-position: 50% -374px;}

/* 문화유 야행 */
.yahang .y_list{display:flex;justify-content:center;align-items:center; padding-top: 40px;}
.yahang .y_list div{transition:all 0.3s;transform:scale(0.8);}
.yahang .y_list div:hover img{transform:scale(1.05);transition:.8s;}
.yahang .y_list div a{display:block;}
.yahang .y_list div img{width:100%;}
.yahang .y_list div.on{filter:drop-shadow(0px 3px 25px rgba(0, 0, 0, 0.15));transform:scale(1);border-radius:0 20px 0 20px;box-shadow:10px 10px 0 #df601a;overflow:hidden;margin: -10px 0 0 -10px;}
.yahang .btn button {width:52px;height:52px;overflow:hidden;background:url("/images/02_tour/main/m_icon.png") no-repeat;font-size:0;position:absolute;top:50%;transform:translate(0, -50%);left:auto;}
.yahang .btn button.prev {background-position:0 0;left: calc(32% - 52px);}
.yahang .btn button.next {background-position:0 -67px;right:calc(32% - 52px);}


/* Tablet */
@media all and (min-width:768px) {
/*공통_전체*/   
.section{ height:100vh;}
.section h3{font-size:3rem;}

/*메인비주얼*/
.section.con1{min-height: 400px; height: 100vh;}
.section .m_visual{min-height: auto;}
.section .m_visual .tit{top: 110px;}
.section .m_visual .tit p{font-size:1.8rem;}
.section .m_visual .tit p.img img{width:450px;}
.section .m_visual .tit p.date{font-size:2rem;}
.section .m_visual .tit br{display: none;}
.section .m_visual .ico_box ul li{width: calc(25% - 2px);}
.section .m_visual .ico_box ul li a{height: 160px; padding: 30px 0; font-size: 18px; background: rgba(0, 0, 0, 0.8);}

/* 문화유 야행 */
.yahang .y_wrap{position: relative;}
.yahang .y_list div{max-width:335px;}
.yahang .btn button.prev{left:calc(32% - 37px);}
.yahang .btn button.next{right:calc(32% - 37px);}

}

/* Desktop */
@media all and (min-width:1023px) {
.section h3{font-size:60px;}

/* 메인비주얼 */
.section .m_visual{background-position: center top;}
.section .m_visual .ico_box{width: 960px; margin: 0 auto; }
.section .m_visual .tit p{font-size: 2rem;line-height: 2.4rem;}
.section .m_visual .tit p.date{font-size: 2.5rem;line-height: 2.9rem;margin-bottom: 6px;}
.section .m_visual .tit p.place span{font-size:1.7rem;}


/* 문화유산 야행 */
.section .yahang{background-position: center;}
.yahang .y_list{max-width:1400px;gap:100px;}
}

/* Desktop */
@media all and (min-width:1440px) {

.section .m_visual .tit{display:flex;align-items:center;gap: 30px;top: 20%;}
.section .m_visual .tit div{text-align:left;}

}
@media all and (min-width:1600px) {
.section .m_visual .tit p.img img{width: 100%;}
}
/*레이아웃 수정*/
header{z-index: 1;}
.m_logo a{width: 300px;background: url("/upload_data/user_file/15_night/main/logo.png") no-repeat 0 0 / 300px;}
.gnb .lang{display: none;}
.gnb .mb:before{display: none;}
.gnb li a{line-height:1.2;}
.gnb .sitemap{position:relative; width:37px;height:25px;overflow:hidden;background:url("/images/02_tour/common/gnb.png") no-repeat 10px 0;font-size:0;padding:0;}
header.fixed .gnb .sitemap{background-position:10px -31px}

.foot .f_i{color:#fff;border:solid 1px rgba(255,255,255,.25);margin-top:30px;}
.f_i ul{display:block}
.f_i > ul > li{width:100%;padding:25px;}
.f_i > ul > li:first-child{border-bottom:solid 1px rgba(255,255,255,.1);}
.f_i li strong{font-size:17px;font-weight:500;}
.f_i li ul{color:#e1e1e1;font-weight:100;font-size:.9rem;}
.f_i li ul li{position:relative;line-height:1.5;}
.f_i li ul li:before{display:inline-block;content:'-';color:#c2c2c2}
.f_i li ul li a{color:#fff200;padding:0;display:inline-block;}
.f_i li ul li a:after{display:inline-block;content:'';width:18px;height:18px;background:url("/images/03_citytour/common/footer.png")no-repeat;vertical-align:middle;margin-left:5px;}
.f_i li ul li a.call:after{background-position:0 0;}
.f_i li ul li a.copy:after{background-position:0 -30px;}
.foot p.copy{font-size: 11px;}

.call{margin: 40px 0; text-align: center;}
.call i{display: block; font-style: normal; color: #fff; font-size: 14px;}
.call strong{display: block; color: #eae160; font-size: 24px; font-weight: 400;}
.organ{text-align: center;}
.organ strong{display: block; margin: 10px 0;}
.organ strong em{font-style: normal; vertical-align: middle;}
.organ strong img{vertical-align: middle;}

@media all and (min-width:768px) {
.m_logo a{background-size:auto; padding-top: 40px;}
header.fixed .m_logo a{background-position:0 -43px;}
    
footer{padding-top:35px;}
footer:before{display:none;}
.foot .f_i{padding:0 !important;}
.f_i > ul{display:flex;justify-content:space-around;}
.f_i > ul > li{width:50%;padding:25px 30px;}

.call{position: absolute; top: 16px; right: 0; margin: 0;}
.call i{display: inline-block; vertical-align: middle;}
.call strong{display: inline-block; vertical-align: middle;}
.organ{position: absolute; bottom: 0; right: 0;}
.organ strong{display: inline-block; margin: 0;vertical-align: middle;}
}

/* Desktop */
@media (min-width: 1440px) {
.m_logo{width: auto;}   
.gnb li a{font-size:14px;padding-top:12px;}
.head,
.head nav .menu{display:block;}
.head{padding: 0 380px 0 300px;position:static;width: 1400px;}
.head.on nav{position:inherit;height:auto;background:none;top:0;}
.head nav .menu{width:auto;padding:0;}
header.fixed:after{position:absolute;top:0;width:100%;z-index:-1;right:0;left:0;}
header.fixed .menu>ul>li>a{color:#2a2a2a;text-shadow:none;}
header.fixed .gnb{padding:0}
header.fixed .g_sitelist>a{color:#2a2a2a;}
header{display:flex;justify-content:space-between;flex-wrap:wrap;height:auto;}
.g_sitelist>a{font-size:14px;padding-top: 12px;}
.menu>ul>li{flex:auto;width:auto;position:static;margin:0;}
.menu>ul>li:hover>a,
.menu>ul>li:focus>a,
.menu>ul>li:active>a{color:#fff;}
.menu>ul>li>a{color:#fff;font-weight:300;font-size:18px;border:none;margin:0;padding:35px 0 10px 0;text-shadow:1px 1px 8px rgba(0,0,0,.5);margin-bottom:20px;text-align:center;}
.menu>ul>li>a:before, 
.menu>ul>li.on>a:before{background:#f15a40;height:3px;bottom:-18px;}
.menu div>ul>li>a:before{display:none;}
.menu .depth_box li:hover a{border:none;background:#f15a40; color:#fff}
.menu .depth_box ul > li > a{padding:13px 36px;margin:0;border:solid 1px #e7e7e7;}
.menu .depth_box{width:100%;left:0;right:0;min-width:1400px;top:85px;position:absolute;background:#fff url('/images/03_citytour/common/menu_bg.png')no-repeat left bottom;border-top:solid 1px rgba(0,0,0,.1);}
.menu .depth_boxcon{margin:0 auto;width:1400px;text-align:center;padding:40px 0;}
.menu .depth_boxcon li{display:inline-block;margin:0 3px;}
.new_win{background:url('/images/02_tour/common/btn_new2.png') no-repeat;}
.head nav div button{display:none;}
footer{padding:45px 0 70px 0;}
.foot .f_i{position:absolute;right:0;top:0;width:579px;margin:0;}
.foot p.copy{font-size: 14px;}
.organ strong{margin-left: 50px;}

/* 퀵링크 */
.q_link{display: block; position: fixed; top: 40%; right: 0; z-index: 1;}
.q_link .popup>a{display: block; height: 90px; padding-top: 20px; background: #c5dfff; color: #394c72; text-align: center;}
.q_link .popup>a::before{content: ''; display: block; width: 25px; height: 30px; margin: 0 auto 6px; background: url('/images/15_night/main/popup_ico.png') no-repeat center top; }
.q_link .popup>a>span{display: none;}
.q_link .popup .popup_wrap{display: none; position: fixed; top: 10%; left: 0; right: 0; width: 80%; margin: 0 auto; z-index: 0; text-align: center;}
.q_link .popup .popup_wrap.on{display: block;}
.q_link .popup .popup_wrap::before{content: ''; position: fixed; top: 0;bottom: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.8); z-index: -1;}
.q_link .popup .popup_wrap h2{margin-bottom: 40px; color: #fff; font-size: 40px;}
.q_link .popup .popup_wrap h2 span{color: #ffef41;}
.q_link .popup .popup_wrap .img{height: 600px; overflow-y: auto;}
.q_link .popup .popup_wrap img{display: inline-block; width: 400px; height: 400px; margin: 0 10px 10px; border-radius: 20px;}
.q_link .popup .popup_wrap .close{display: inline-block; width: 40px; height: 40px; background: url('/images/15_night/main/close.png') no-repeat; font-size: 0;}
.q_link .sns{padding: 20px 0 10px; background: #394c72; text-align: center;}
.q_link .sns h2{margin-bottom: 10px; font-size: 14px; font-weight: 400; color: #c5dfff;}
.q_link .sns li a{display: block; width: 32px; height: 32px; margin: 0 auto 10px; background: url('/images/15_night/main/m_sns.png') no-repeat; font-size: 0;}
.q_link .sns li.youtube a{background-position: 50% -22px;}
.q_link .sns li.insta a{background-position: 50% -78px;}
.q_link .top_lnk a{display: block; padding: 12px 26px; height: 40px; color: #c5dfff; background: #1e293d; font-size: 14px;}
.q_link .top_lnk a::after{content: ''; display: inline-block; width: 10px; height: 8px; margin-left: 6px; background: url('/images/15_night/main/top.png') no-repeat;}
}

/* Desktop */
@media all and (min-width:1440px) {
header{/* position:fixed; */height:85px;} 
}