@charset "utf-8";

#inc01{overflow:hidden;padding:200px 0;background:url('./img/bg.jpg') no-repeat top}
#inc01 h2 b{color:var(--brand-color)}
#inc01 .col-2{display:flex;justify-content:center;gap:20px;margin-bottom:80px}
#inc01 .quick_mu{display:flex;justify-content:center;gap:20px}
#inc01 .quick_mu li a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:160px;height:160px;border:1px solid #e1e1e1;border-radius:var(--radius);background:#fff;transition:all .3s}
#inc01 .quick_mu li h4{font-size:17px;font-weight:600;color:var(--primary);font-family:var(--main-font)}
#inc01 .quick_mu li a img{transition:all .3s}
#inc01 .quick_mu li a:hover{transform:translateY(-10px)}
#inc01 .quick_mu li a:hover img{filter:invert(61%) sepia(27%) saturate(417%) hue-rotate(299deg) brightness(89%) contrast(94%)}

#inc01 .cont{display:grid;grid-template-columns:repeat(2,1fr);gap:100px 50px}

#inc01 .cont .sermon{position:relative;display:flex;align-items:center;justify-content:flex-end;padding:50px;border-radius:var(--radius);color:#fff;overflow:hidden}
#inc01 .cont .sermon::before{position:absolute;z-index:-1;content:'';top:0;left:0;width:100%;height:100%;background:var(--brand-color) url('./img/sermon_bg.png') no-repeat}
#inc01 .cont .sermon .s_tit{display:flex;align-items:center;gap:10px}
#inc01 .cont .sermon .s_tit p{font-size:20px;font-weight:700}
#inc01 .cont .sermon .s_tit span{font-size:14px;opacity:.3}
#inc01 .cont .sermon .slo{margin:10px 0;font-size:35px;font-weight:700;font-family:var(--main-font)}
#inc01 .cont .sermon .metadata{font-size:16px;font-weight:700}
#inc01 .cont .sermon a{margin-top:20px}

#inc01 .cont .time{padding:50px;border-radius:var(--radius);color:#fff;background:var(--primary) url('./img/time_bg.png');background-size:cover}
#inc01 .cont .time .wrap{display:grid;grid-template-columns:repeat(2,1fr)}
#inc01 .cont .time .bs span{width:80px}
#inc01 .cont .time .next span{width:110px}
#inc01 .cont .time .wrap span{display:inline-block;font-weight:700}
#inc01 .cont .time .wrap p{display:inline-block;opacity:.7}
#inc01 .cont .time>div+div{margin-top:30px}
#inc01 .cont .time>div>p{display:inline-block;margin-bottom:8px;padding:2px 15px;border-radius:50px;border:1px solid #fff;font-size:16px;font-weight:700}

#inc01 .cont .lt_area{overflow:hidden;border:1px solid #e1e1e1;border-radius:var(--radius)}
#inc01 .cont .lt_area li a{display:block;padding:20px;font-size:16px;font-weight:600;color:var(--primary);transition:all .3s}
#inc01 .cont .lt_area li a:before{display:inline-block;content:'';width:4px;height:4px;margin-right:6px;border-radius:50px;vertical-align:3px;background:var(--brand-color)}
#inc01 .cont .lt_area li a:hover{color:var(--brand-color);background:#f2f2f2}
#inc01 .cont .lt_area li+li{border-top:1px dashed #e1e1e1}
#inc01 .cont .lt_area li .new{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:3px;font-size:8px;color:#fff;vertical-align:2px;background:var(--brand-color)}

#inc01 .cont .gall{overflow:hidden}
#inc01 .cont .gall_slide a{text-align:center}
#inc01 .cont .gall_slide a:hover .img div{transform:scale(1.1)}
#inc01 .cont .gall_slide .img{overflow:hidden;border-radius:var(--radius);font-size:0}
#inc01 .cont .gall_slide .img div{display:inline-block;width:100%;height:280px;background-size:cover;background-position:center;transition:all .3s}
#inc01 .cont .gall_slide img{width:100%}
#inc01 .cont .gall_slide .tab{font-size:14px;font-weight:700;color:var(--brand-color)}
#inc01 .cont .gall_slide .txt{margin-top:10px}
#inc01 .cont .gall_slide .txt p{font-size:16px;font-weight:700;color:var(--primary)}

/* 반응형 [s] */
@media(max-width:1400px){
#inc01{padding:120px 15px}
#inc01 .cont{grid-template-columns:1.3fr 2fr;gap:80px 20px}
#inc01 .quick_mu li a{width:150px;height:150px}
#inc01 .quick_mu li a img{width:34px;aspect-ratio:1}
#inc01 .quick_mu li h4{font-size:16px}
#inc01 .cont .sermon{padding:36px}
#inc01 .cont .sermon::before{background-position:-70px center}
#inc01 .cont .sermon .item{text-align:right}
#inc01 .cont .sermon .s_tit{flex-direction:column-reverse;align-items:flex-end;gap:0px}
#inc01 .cont .sermon .s_tit p{font-size:17px}
#inc01 .cont .sermon .s_tit span{font-size:13px}
#inc01 .cont .sermon .slo{margin:6px 0;font-size:26px}
#inc01 .cont .time{padding:36px}
#inc01 .cont .notice, #inc01 .cont .gall{grid-column-start:1;grid-column-end:3}
#inc01 .cont .gall_slide .img div{height:215px}
}
@media(max-width:1200px){
#inc01 .cont{grid-template-columns:repeat(1,1fr);gap:20px}
#inc01 .cont .sermon{justify-content:flex-start}
#inc01 .cont .sermon::before{transform:scaleX(-1);background-size:contain;background-position:unset;pointer-events:none}
#inc01 .cont .sermon .item{text-align:left}
#inc01 .cont .sermon .s_tit{flex-direction:row;align-items:center;gap:10px}
#inc01 .cont .sermon a{margin-top:14px}
#inc01 .col-2{margin-bottom:60px}
#inc01 .cont .notice, #inc01 .cont .gall{grid-column-start:unset;grid-column-end:unset}
#inc01 .cont .time, #inc01 .cont .notice{margin-bottom:40px}
}
@media (max-width:1024px){
#inc01{padding:80px 15px}
#inc01 .quick_mu{gap:14px}
#inc01 .quick_mu li a{width:130px;height:130px}
#inc01 .quick_mu li a img{width:30px}
#inc01 .quick_mu li h4{font-size:15px}
#inc01 .cont{gap:14px}
#inc01 .cont .sermon{padding:30px}
#inc01 .cont .sermon .slo{margin:4px 0;font-size:24px}
#inc01 .cont .time{padding:30px}
#inc01 .cont .lt_area li a{padding:18px;font-size:15px}
#inc01 .col-2{gap:14px}
#inc01 .cont .time, #inc01 .cont .notice{margin-bottom:calc(60px - 14px)}
#inc01 .cont .gall_slide .txt p{font-size:15px}
}
@media (max-width:768px){
#inc01{padding:50px 15px}
#inc01 .cont .time .wrap li{display:flex;flex-direction:column}
#inc01 .quick_mu li a{width:115px;height:115px}
#inc01 .quick_mu li a:hover{transform:translateY(-5px)}
#inc01 .quick_mu li a img{width:25px}
#inc01 .quick_mu li h4{font-size:15px}
#inc01 .cont .sermon .s_tit p{font-size:15px}
#inc01 .cont .sermon .slo{font-size:22px}
#inc01 .cont .sermon .metadata{font-size:15px}
#inc01 .cont .time>div+div{margin-top:24px}
#inc01 .cont .time>div>p{font-size:15px}
#inc01 .cont .time .wrap ul{display:flex;flex-direction:column;gap:4px}
#inc01 .cont .time .wrap li{font-size:14px}
#inc01 .col-2{flex-direction:column;align-items:center;gap:14px;margin-bottom:50px}
#inc01 .cont .lt_area li a{display:flex;align-items:center;padding:14px}
#inc01 .cont .lt_area li a span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
}
@media (max-width:480px){
#inc01 .quick_mu li h4{font-size:14px}
#inc01 .quick_mu li a{width:105px;height:105px}
#inc01 .cont .time .wrap{grid-template-columns:repeat(1,1fr)}
#inc01 .cont .time > * {display:flex;flex-direction:column;align-items:center;text-align:center}
#inc01 .cont .time .wrap ul{gap:6px}
#inc01 .cont .time .wrap li{flex-direction:row;justify-content:center;gap:10px}
#inc01 .cont .time .wrap span{width:auto}
#inc01 .cont .sermon{padding:26px}
#inc01 .cont .sermon::before{background-position:-54px center}
#inc01 .cont .sermon .s_tit p{font-size:14px}
#inc01 .cont .sermon .slo{font-size:20px}
#inc01 .cont .sermon .metadata{font-size:14px}
#inc01 .cont .sermon a{margin-top:10px}
#inc01 .cont .time{padding:26px}
#inc01 .cont .time>div>p{margin-bottom:10px;font-size:14px}
#inc01 .cont .time>div+div{margin-top:18px}
#inc01 .col-2{margin-bottom:50px}
#inc01 .cont .lt_area li a{font-size:14px}
#inc01 .cont .notice .cm_btn, #inc01 .cont .gall .cm_btn{display:none}
}
@media (max-width:390px){
#inc01 .quick_mu{flex-direction:column;width:100%}
#inc01 .quick_mu li a{width:100%;height:90px}
#inc01 .quick_mu{gap:10px}
#inc01 .col-2{gap:10px}
#inc01 .cont .sermon{background-color:var(--brand-color)}
#inc01 .cont .sermon::before{display:none}
}
/* 반응형 [e] */
