/*body{background: #e7e7e7; min-width: 320px;}*/
/*header{background: #45474e; box-shadow: 0px 1px 5px rgba(0,0,0,0.4); position: fixed; width: 100%; z-index: 9999;}
header h1{padding:25px; line-height: 22px; text-align: center; font-size: 21px; color: #fff; letter-spacing: 1px; font-weight: 400;}
header img{height: 20px; display: inline-block; padding-right: 8px;}*/
.angle{position: absolute; top: 400px; width: 100%;}
.angle p{width: 22.5px; height: 37.5px; background: url(/main/mobile/img/angle.png) no-repeat; background-size: 45px; cursor: pointer}
.angle .angleLeft{background-position: 0 0; position: absolute; left: 120px;}
.angle .angleRight{background-position: -22.5px 0; position: absolute; right: 120px;}
/*.content{padding-top: 72px;}*/
.content section.top{width: 100%; padding: 90px 50px; box-sizing:border-box;}
.content section.top.vision{background-color: #bedee4}
.content section.top.bible{background-color: #e4d7cd}/*우리말성경컬러*/
.content section.top.every{background-color: #c9e1dd}/*생삶정식컬러*/
.content section.top.lite{background-color: #cadae8}/*생삶라이트컬러*/
.content section .appGroup ul{width:66%; margin: 0 auto;}
.content section .appGroup ul li{float: left; width: 21%; margin: 0 2%}
.content section .appGroup ul li img{display: block; width: 100%; max-width: 100px; cursor:pointer; position: relative; top: 0; left: 0; z-index:0; transition:0.2s all; border-radius: 23px; margin: 0 auto;}
.content section .appGroup ul li img:hover,
.content section .appGroup ul li img:focus,
.content section .appGroup ul li img.on{transform: scaleX(1.02) scaleY(1.02); box-shadow: 0px 5px 5px rgba(0,0,0,0.2);}

.content section h2{position: relative; left: 0; top: 0; color: #4a718c; font-size: 30px; text-align: center; font-weight: 400; margin-top: 90px; animation: t_ani 0.8s linear; transform-origin:0 2px;}

@keyframes t_ani{
    0%{opacity:0;}
    100%{opacity:1;}
}

.content section h2 span{letter-spacing: -1.5px;}
.content section h2 strong{color: #2b475d; font-size: 64px; display:block; font-weight: 500; letter-spacing: -3px;}
.content section.bible h2{color: #7d5946}/*우리말성경컬러*/
.content section.bible h2 strong{color: #4a3a2e; letter-spacing: -5px; font-size: 65px;}/*우리말성경컬러*/
.content section.every h2{color: #2f8b8f}/*생삶정식*/
.content section.every h2 strong{color: #4b4c4c}/*생삶정식*/
.content section.lite h2{color: #386889}/*생삶라이트*/
.content section.lite h2 strong{color: #4b4c4c}/*생삶라이트*/
.content section .title{width: 66%;margin:0 auto; font-size: 24px; padding-top: 66px; font-weight: 400; line-height: 1.6em; text-align: center; color:#2f2f2f; letter-spacing: -.5px;}
.content section .title ul{text-align: left;}
.content section .title ul li{text-indent: -17px; margin-left: 17px; margin-bottom: 10px; font-size: 18px; font-weight: 400; color: #555;}
.content section .title ul li:before{content:''; display: inline-block; width: 7px; height: 7px; background: #999; border-radius: 50%; vertical-align: middle; margin-right:10px;}
.content section .snsGroup{padding-top: 100px;}
.content section .snsGroup ul{width: 50%; margin: 0 auto;}
.content section .snsGroup ul li{float: left; width: 22%; margin: 1.5%;}
.content section .snsGroup ul li img{width: 100%; max-width: 93px; cursor:pointer; position: relative; top: 0; left: 0; z-index:0; transition:0.2s all; border-radius: 50%;}
.content section .snsGroup ul li img:hover,
.content section .snsGroup ul li img:focus{transform: scaleX(1.02) scaleY(1.02); box-shadow: 0px 5px 5px rgba(0,0,0,0.2);}
.content section .appImg{padding: 90px 20px; box-sizing:border-box;}
.content section .appImg img{display: block; margin:0 auto; width: auto; max-width: 100%;}

/*footer영역*/
.footer{padding: 50px 0 100px; box-sizing:border-box; background:#777777;}
.footer .left img{cursor: pointer; width: 155px;}
.footer ul{margin:20px 0;}
.footer ul li{float: left; color: #fff; cursor: pointer; font-size: 13px; font-weight: 400}
.footer .text{font-size: 12px; color: #aaa; line-height: 1.8em; word-break:keep-all;}
.footer .text a{color: #aaa; font-size: 12px;}
.footer .right{text-align: right; font-size: 12px; color: #aaa; line-height: 2.2em;}
.footer select{padding: 8px 30px 8px 15px; background:url(/biblecollege/img/footer-select.png) 100% 50% no-repeat; background-color:#e8e8e8; margin-left: 5px; color: #656565; margin-top: 20px; border:1px solid #ddd;}
.footer{margin-top: 200px;}

/*everyday 개편*/
.ev .w100{width: 100%; max-width: 1030px; margin: 0 auto; box-sizing: border-box; padding: 0 20px; position: relative;}
.ev .top{position: fixed; width:100%; z-index: 0; height: 1040px; overflow: hidden;}
.ev .top .top-bg{width: 110%; margin-left: -5%; margin-top: -10px;  height: 1080px; background-repeat: no-repeat; background-size: 1920px; filter: blur(10px); background-position: 50% 0; position: absolute; top: 0; left: 0; z-index: -1;}
.ev .top .top-bg:after{content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.25); display: block; position: absolute; top: 0; left: 0;}
.ev .top .logo{width: 335px; height: 90px; background: url(/main/mobile/img/everyday/icons.svg) 0 0 no-repeat; text-indent: -9999em; display: block; margin-top: 200px; background-size: 335px;}
.ev .top .h1-title{font-size: 36px; color: #fff; font-weight: 500; letter-spacing: -1px; margin-top: 15px;}
.ev .top .h1-sub{font-size: 28px; color: #fff; font-weight: 500; letter-spacing: -1px; margin-top: 40px;}
.ev .top .h1-sub .prom_txt{font-size:20px;border:1px solid #fff; padding:8px 20px; border-radius: 40px;margin-top:20px;display:inline-block;}
.ev .top .before{position: absolute; top: 20px; left: 20px; width: 260px;}
.ev .top .before img{width: 100%;}




.ev .btn-area{margin-top: 100px;}
.ev .btn-area button{width: 217px; height: 64px; background: url(/main/mobile/img/everyday/icons.svg) -4px -301.5px no-repeat; text-indent: -9999em; margin-right: 5px;}
.ev  .btn-area button.google{background-position: -4px -378.5px;}
.ev .view{width: 400px; height: 766px; display: inline-block; border-radius: 25px; background: url(/main/mobile/img/everyday/view01.png) 0 0 no-repeat; background-size: 100%; box-shadow: 30px 30px 30px rgba(0,0,0,0.16); background-color: #fff;}

.ev .scroll{width: 400px; height: 766px; overflow-y: scroll; overflow-x: hidden; border-radius: 25px; box-shadow: 30px 30px 30px rgba(0,0,0,0.16); background-color: #fff; -ms-overflow-style: none; display: inline-block; }
.ev .scroll::-webkit-scrollbar{display:none;}

.ev .ani .view,
.ev .ani.sec3 .right,
.ev .ani .scroll{animation: view 1s; position: relative; bottom: 0;}

@keyframes view{
    0%{opacity:0; bottom: -50px}
    100%{opacity:1; bottom: 0;}
}

.ev .view.view1{margin-top: 130px; border-radius: 50px; animation: view 0.8s; position: relative; bottom: 0;}
.ev .view.view2{background-image: url(/main/mobile/img/everyday/view02.png); height: 6073px; box-shadow: none;}
.ev .view.view3{background-image: url(/main/mobile/img/everyday/view03.gif);}
.ev .view.view4{background-image: url(/main/mobile/img/everyday/view04.png);}
.ev .view.view5{background-image: url(/main/mobile/img/everyday/view05.png);}
.ev .view.view6{background-image: url(/main/mobile/img/everyday/view06.png); height: 2231px; box-shadow: none;}
.ev .view.view7{background-image: url(/main/mobile/img/everyday/view07.png);}
.ev .view.view8{background-image: url(/main/mobile/img/everyday/view08.gif);}
.ev .view.view9{background-image: url(/main/mobile/img/everyday/view09.png);}
.ev .view.view10{background-image: url(/main/mobile/img/everyday/view10.png);}
.ev .view.view11{background-image: url(/main/mobile/img/everyday/view11.png);}
.ev .view.view12{background-image: url(/main/mobile/img/everyday/view12.png);}
.ev .view.view13{background-image: url(/main/mobile/img/everyday/view13.png);}
.ev .view.view14{background-image: url(/main/mobile/img/everyday/view14.gif);}
.ev .view.view15{background-image: url(/main/mobile/img/membershipImg.png);}

.ev .go-free{width: 150px; height: 144px; background: url(/main/mobile/img/everyday/icons.svg) -6px -142px no-repeat; display: block; position: fixed; bottom: -3px; right: 0; text-indent: -9999em; z-index: 100; animation: free 3s;}
@keyframes free{
    0%{right: -150px}
    40%{right: 20px}
    70%{right: -20px}
    100%{right: -0px;}
}
.ev .mid{width: 107%; background: url(/main/mobile/img/everyday/bg.svg) 50% 0 no-repeat; background-color: #f6f6f6; background-size: 5750px; position: relative; top: 1040px; z-index: 1; margin-bottom: 1000px;}
.ev .mid .left{text-align: left;}
.ev .mid .right{text-align: right;}
.ev .mid .i-tab{width: 110px; height: 110px; background: url(/main/mobile/img/everyday/icons.svg) 0px -449px no-repeat; display: inline-block; }
.ev .mid .i-tab.tab2{background-position: 0px -559px;}
.ev .mid .i-tab.tab3{background-position: 0px -669px;}
.ev .mid .i-tab.tab4{background-position: 0px -779px;}
.ev .mid .i-tab.tab5{background-position: 0px -889px;}
.ev .mid .i-tab.tab6{background-position: 0px -999px;}
.ev .mid h2{font-size: 56px; font-weight: 700; color: #444; letter-spacing: -1.5px; line-height: 1.2em; margin-bottom: 20px; margin-top: 10px;}
.ev .mid .h2-sub{font-size: 28px; font-weight: 500; color: #444; letter-spacing: -1.5px; line-height: 1.34em;}
.ev .mid .section{padding-top: 150px; padding-bottom: 180px;}
.ev .mid .section .mid-title{margin-top: 200px;}

.ev .mid .text{width: 495px; height: 40px; background: url(/main/mobile/img/everyday/icons.svg) 0 -1713px no-repeat; display: block;}
.ev .mid .text.t2{background-position: 0 -1753px}
.ev .mid .text.t3{background-position: 0 -1793px}
.ev .mid .text.t4{background-position: 0 -1833px}
.ev .mid .text.t5{background-position: 0 -1873px}
.ev .mid .text.t6{background-position: 0 -1913px}
.ev .mid .text.t7{background-position: 0 -1953px}
.ev .mid .text.t8{background-position: 0 -1993px}
.ev .mid .text.t9{background-position: 0 -2033px}
.ev .mid .text.t10{background-position: 0 -2073px}
.ev .mid .text.t11{background-position: 0 -2113px}
.ev .mid .text.t12{background-position: 0 -2153px}
.ev .mid .text.t13{background-position: 0 -2193px}
.ev .mid .text.t14{background-position: 0 -2233px}
.ev .mid .text.t15{background-position: 0 -2273px}
.ev .mid .text.t16{background-position: 0 -2313px}


/*섹션별 개별화*/
.ev .mid .section.sec1 .mid-title{margin-top: 160px;}
.ev .mid .section.sec1 .right{text-align: center;}
.ev .mid .section.sec1 .text{display: inline-block; margin-bottom: 20px;}

.ev .mid .section.sec2 .mid-title{margin-top: 160px;}
.ev .mid .section.sec2 .left{position: relative;}
.ev .mid .section.sec2 .text.t2{position: absolute; left: 370px; top: 55px;}
.ev .mid .section.sec2 .text.t3{position: absolute; left: 370px; bottom: 190px;}

.ev .mid .section.sec3 .right{position: relative;}
.ev .mid .section.sec3 .right .view4{position: absolute; top: 0; right: 180px;}
.ev .mid .section.sec3 .right .view5{position: absolute; top: 300px; right: 0;}

.ev .mid .section.sec4{padding-top: 550px;}
.ev .mid .section.sec4 .left{text-align: center; position: relative;}
.ev .mid .section.sec4 .text.t4{margin-bottom: 30px;}
.ev .mid .section.sec4 .text.t5{position: absolute; bottom: 200px; left: 385px;}
.ev .mid .section.sec4 .text.t6{margin-top: 30px;}

.ev .mid .section.sec5 .left.mid-title{margin-top: 70px; margin-bottom: 170px; text-align: left}
.ev .mid .section.sec5 .left,
.ev .mid .section.sec5 .right{text-align: center;}
.ev .mid .section.sec5 .text{width: 412px; margin-bottom: 240px; margin-top: 30px;}
.ev .mid .section.sec5 .qt-wrap{clear: both; position: relative; text-align: right; height: 800px; width: 100%;}
.ev .mid .section.sec5 .qt-wrap .qtcard{width: 400px; border-radius: 25px; display: inline-block; position: absolute; right: 0; box-shadow: 30px 30px 30px rgba(0,0,0,0.15); top: -50px; right: 0; transition: 1s all ease-in-out;}

/*.ev .mid .section.sec5 .qt-wrap .qtcard.ani{animation: card 1s; transition: 0.2s all}

@keyframes card{
    0%{top: 0px; right: 0;}
}*/

.ev .mid .section.sec5 .qt-wrap.on .qtcard.no1{top: -50px; right: 0;}
.ev .mid .section.sec5 .qt-wrap.on .qtcard.no2{top: 70px; right: 150px;}
.ev .mid .section.sec5 .qt-wrap.on .qtcard.no3{top: 190px; right: 300px;}
.ev .mid .section.sec5 .qt-wrap.on .qtcard.no4{top: 310px; right: 450px;}
.ev .mid .section.sec5 .qt-wrap.on .qtcard.no5{top: 430px; right: 590px;}
.ev .mid .section.sec5 .text.t11{position: absolute; top: 965px; left: 0;}

.ev .mid .section.sec6 .mid-title{text-align: right; margin-bottom: 80px; margin-top: 100px;}
.ev .mid .section.sec6 .left-wrap{position: relative;}
.ev .mid .section.sec6 .left-wrap .text.t12{position: absolute; top: 104px; left: 400px;}
.ev .mid .section.sec6 .left-wrap .text.t13{position: absolute; top: 280px; left: 400px;}
.ev .mid .section.sec6 .left-wrap .text.t14{position: absolute; top: 460px; left: 400px;}
.ev .mid .section.sec6 .left-wrap .text.t16{position: absolute; top: 460px; left: 400px;}
.ev .mid .section.sec6 .right-wrap{text-align: right; position: relative;} 
.ev .mid .section.sec6 .right-wrap .text.t15{position: absolute; top: 300px; right: 400px;}
.ev .bottom{position: relative; z-index: 101; background: #00293B; text-align: center; width: 107%;}
.ev .bottom>img{margin-top: 120px; margin-bottom: 30px; animation: img 2s infinite; display: block; margin-left: auto; margin-right: auto;}



.ev .bottom h2{font-size: 50px; color: #fff; font-weight: 500; letter-spacing: -1.5px; line-height: 1.24em;}
.ev .bottom .h2-sub{font-size: 22px; color: #fff; font-weight: 300; letter-spacing: -1px; line-height: 1.3em; margin-top: 30px;}
.ev .bottom .date{font-size: 30px; color: #fff; font-weight: 500; letter-spacing: -1px; line-height: 1.3em; margin-top: 20px;}
.ev .bottom .btn-area{margin-top: 50px; padding-bottom: 180px;}
.ev .bottom .btn-area button.apple{background-position: -4px -1565.5px;}
.ev .bottom .btn-area button.google{background-position: -4px -1642.5px;}
.ev .bottom .event{width: 1000px; margin: 100px auto; text-align: left;}
.ev .bottom .event-no{font-size: 22px; color: #fff; border: 1px solid #fff; border-radius: 20px; margin: 0 auto 20px; width: auto; display:inline-block; height: 40px; line-height: 40px; padding: 0 20px;}
.ev .bottom .event img{width: 450px;}
.ev .bottom .event .line{width: fit-content; font-size: 22px; color: #fff; border-bottom: 5px solid rgba(255,196,0,0.7); margin-top: 10px;}
.ev .bottom .event .event-no{margin: 30px 0 20px 0;}

/* 이벤트 말풍선 */
.ev .event_txt1{z-index:100; background: url(../img/price_bubble.png) no-repeat; background-size: 245px; padding:17px 0 8px 22px;margin-top:20px;}
.ev .event_txt2{z-index:100; background: url(../img/price_bubble.png) no-repeat; background-size: 245px; padding:17px 0 8px 12px;margin-top:20px;}
.ev .event_txt1 a,.ev .event_txt2 a{color:#444;font-size: 18px;}


@media screen and (max-width:1020px){
/*    header h1{padding:18px; line-height: 18px; font-size: 18px; color: #fff;}
    header img{height: 17px; padding-right: 8px;}*/
    .angle .angleLeft{left: 20px;}
    .angle .angleRight{right: 20px;}
    .content section.bible h2 strong{font-size: 60px;}
    .content section .title{width: 80%;}
    .content section .appGroup ul{width: 80%}
    .content section .snsGroup ul{width: 60%}
    .footer{padding: 50px 20px 100px;}
}


@media screen and (max-width:768px){
    .angle{top: 280px;}
    .content section.top{padding: 50px 20px; box-sizing:border-box;}
    .content section .appGroup ul{width: 100%}
    .content section .snsGroup{padding-top: 50px;}
    .content section .snsGroup ul{width: 80%}
    .content section h2{font-size: 21px; margin-top: 50px; padding: 0 0px; word-break:keep-all;}
    .content section h2 strong{font-size: 43px;}
    .content section.bible h2 strong{font-size: 43px;}
    .content section .title{width:96%; font-size: 17px; padding-top: 45px; box-sizing:border-box;}
    .content section .appImg{padding: 50px 20px;}
    .content section .appGroup ul li img{border-radius: 17px}

    /* .ev .mid{background-color: red;} */

}