:root{--blue:#1da2c1;--header-h:100px}header .logo_box{cursor:pointer;position:absolute;top:20px;left:20px}header .logo_box img{width:120px}#wrap header{width:100%;height:var(--header-h);z-index:11;background:url(/build/assets/menu_bg1-BmYtSAV1.png) repeat-x;align-items:center;display:flex;position:fixed;top:0;left:0;right:auto}#wrap header nav{width:100%;height:100%}#wrap header nav ul{flex-direction:row;justify-content:center;align-items:center;width:100%;height:100%;display:flex}#wrap header nav ul li{margin:40px 20px 0;padding-left:15px;position:relative}#wrap header nav ul li a{color:#fff;font-size:16px;font-weight:600;line-height:30px}#wrap header nav ul li:after{content:"";background:#fff;border-radius:50%;width:5px;height:5px;display:block;position:absolute;top:13px;left:0}#wrap header nav ul li:hover a,#wrap header nav ul li.on a{color:var(--blue)}#wrap header nav ul li:hover:after,#wrap header nav ul li.on:after{background:var(--blue)}#container{width:100%;max-width:1200px;height:100%;margin:0 auto;position:relative}#container .content{width:33%;height:calc(100vh - var(--header-h) - 15px);transition:all .5s;position:absolute}#container .content.this .conbox{max-width:1100px;margin:0 auto}#container .content.this{width:100%;overflow-y:auto;left:0!important}#container .content.prev{width:100%;left:-100%!important}#container .content.next{width:100%;left:100%!important}#container .content.this:before,#container .content.this:after,#container .content.this .conbox:before,#container .content.prev:before,#container .content.prev:after,#container .content.prev .conbox:before,#container .content.next:before,#container .content.next:after,#container .content.next .conbox:before{opacity:0;transition:all .6s .3s}#container .content.this .conbox:before{transform:translate(300px)}#container .content.this:after{transform:translate(-300px)}#container #menu1{background:url(/build/assets/content_bg1-CT7UV5YP.png);left:0}#container #menu2{background:url(/build/assets/content_bg2--nt5gnZ2.png);left:33%}#container #menu3{background:url(/build/assets/content_bg3-lnCjaQ_l.png);left:66%}#container .content:before,#container .content:after{content:"";display:block;position:absolute}#container .content:before{z-index:4;background:#000;width:1px;height:100%;top:0;left:0}#container .content:after{color:var(--blue);font-size:25px;font-weight:700;top:180px;left:30px}#container #menu1:after{content:"본당\a 소개";white-space:pre}#container #menu2:after{content:"본당\a 연혁";white-space:pre}#container #menu3:after{content:"역대\a 신부님";white-space:pre}#container .content h2{opacity:0}#container .content.this h2{color:#000;opacity:1;background:#fff;height:auto;padding:30px 0 20px 50px;font-size:28px;font-weight:400;transition:all .6s 1.2s;position:relative}#container .content.this h2:after{content:"";background:var(--blue);width:100%;height:8px;position:absolute;bottom:0;left:0}#container .content .conbox .content_wrap{opacity:0}#container .content.this .conbox .content_wrap{opacity:1;padding:30px 50px 50px;transition:all 1.7s .8s}#container .content{transition:all .8s;top:-100%}#container .content:nth-of-type(2){transition-delay:.3s}#container .content:nth-of-type(3){transition-delay:.6s}#container .content:nth-of-type(4){transition-delay:.8s}#container.start .content{top:100px}.pargrph_tit{color:#fff;margin-bottom:50px;font-size:24px;position:relative}.pargrph_tit:after{content:"";background:var(--blue);width:30px;height:8px;display:block;position:absolute;bottom:-10px;left:0}.text_box{position:relative}.text_box h4{color:#d6d4d4;font-size:40px;font-weight:700}.text_box p{color:#ababab;margin-bottom:50px;line-height:20px}.text_box:nth-child(odd){text-align:left}.text_box:nth-child(2n){text-align:right}footer{color:#7e7e7e;z-index:12;text-align:center;width:100%;padding:20px;font-size:11px;position:relative;bottom:auto;right:auto}footer address{padding:0 0 15px}footer>a{width:16px;height:16px;transition:all .4s;display:block;position:absolute;top:20px}footer>a.instar{background:url(/build/assets/social_b_instar-CWmQCW73.png) no-repeat;right:20px}footer>a.instar:hover{background:url(/build/assets/social_b_instar_hover-DKINCBTq.png) no-repeat}html{height:100%}body{color:#737373;background:url(/build/assets/content_bg4-BuzJ2Z5h.png);height:100%;min-height:100%;font-family:Noto Sans Korean,Malgun Gothic,맑은고딕,돋움,dotum,sans-serif;font-size:16px;line-height:1.5}#wrap{width:100%;height:100%}#wrap>h1{font-size:0}