.nav{display:none}
.container-body{margin-left:0}
.row-basic{margin-top:25px}
.title-wrap{position:relative; overflow:visible}
.contents-main .row-basic:first-child{margin-top:15px}
.contents-all{margin-top:20px; overflow:hidden}
.contents-all .content-top-fit{margin-top:0; padding:0 15px}
.contents-all .content-top-fit .container{padding-right:0; padding-left:0}

/* video player */
.video-wrap{background-color:#000; line-height:0; position:relative; width:100%; padding-bottom:56.25%; margin:0 auto}
.video-wrap iframe{position:absolute; width:100%; height:100%; left:0}
.video-wrap.fp-wrap{padding-bottom:0}

/* audio player */
.audio-wrap{margin-top:15px}
.audio-wrap .audio-player .player{font-size:14px; padding:10px 0; display:none; -webkit-transform:translate3d(0px,0px,0px)}

/* page-title */
.title-wrap.row{flex-direction:column}
.page-title .hd-page{display:block; margin-top:0}
.page-title .hd-page:lang(km){padding-bottom:3px}
.page-title .state-view{vertical-align:8px; margin-right:5px}
/* .page-title .btn-group{display:inline-block} */

/* content-action */
.total-wrap{position:relative; display:inline-block}
.content-action{text-align:center; margin:0 auto; /*overflow:hidden*/ position:relative}
.content-action .action{max-width:90px; display:inline-block; font-size:12px; padding:5px 10px; text-align:center; vertical-align:top; cursor:pointer}
.content-action .action.member{cursor:inherit}
.content-action .action .txt{margin-top:6px; line-height:1.3}
.content-action .action::before{content:''; width:20px; height:20px; display:inline-block; background-repeat:no-repeat; background-size:100%}
.content-action .action.total::before{background-image:url(../images/ico_lang.svg); }
.content-action .action.emotion::before{background-image:url(../images/ico_emotion.svg)}
.content-action .action.watch::before{background-image:url(../images/ico_watch.svg)}
.content-action .action.later::before{background-image:url(../images/ico_later.svg)}
.content-action .action.share::before{background-image:url(../images/ico_share.svg)}
.content-action .action.member::before{background-image:url(../images/ico_member.svg)}

.youtube-wrap{padding:10px 0}
.btn-youtube{display:block; margin:0 auto; padding:10px; max-width:260px; background-color:#db0707; border-radius:6px; color:#fff; font-size:14px; text-align:center}
.btn-youtube::before{display:none}
/*.btn-youtube:hover{background-color:#e44040}*/
.btn-youtube em{color:#fbff8e}
@media(min-width:884px){
	
}
@media(min-width:672px){
	.content-action .action{max-width:110px}
}
@media(min-width:1098px){
	.btn-youtube{margin:0 0 0 auto}
}
/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
  /*.content-action .action.emotion::before{background:url(../images/ico_emotion@2x.png); background-size:100%}
  .content-action .action.watch::before{background:url(../images/ico_watch@2x.png); background-size:100%}
  .content-action .action.later::before{background:url(../images/ico_later@2x.png); background-size:100%}
  .content-action .action.share::before{background:url(../images/ico_share@2x.png); background-size:100%}
  .content-action .action.member::before{background:url(../images/ico_member@2x.png); background-size:100%}*/
}


/* 본문 */
.page-body:lang(km){padding-bottom:3px}
.page-body h2{display:block; font-size:18px; font-weight:600; margin-top:25px}
.page-body h3{display:block; font-size:17px; font-weight:600; margin-top:15px}
.page-body h4{display:block; font-size:1Rpx; font-weight:600; margin-top:8px}
.page-body a{color:#2a66dc}
.page-body a:hover{text-decoration:underline}
.page-body strong{display:inline-block; color:#2a66dc; font-weight:inherit}
.page-body em,
.page-body i{font-style:italic}
.page-body .point{color:#2a66dc}
.page-body .newtab:hover{color:#2a66dc}
.page-body .newtab::after{content:''; width:15px; height:18px; display:inline-block; vertical-align:middle; margin-left:3px; background-image:url(../images/ico_ch_link.png); background-size:100%; background-repeat:no-repeat}

.page-body > *:first-child{margin-top:0}
.page-body p,
.page-body strong{font-size:15px; line-height:1.7; margin-top:13px}
.page-body b{margin-top: 20px; display: inline-block; font-weight:600}
.page-body br{display:none}
.page-body ul{margin-top:20px; font-size:15px}
.page-body li{margin-top:3px}

.page-body blockquote{font-size:14px; line-height:1.7; margin-top:20px}
.page-body blockquote{border-left:2px solid #e0e0e0; padding-left:14px; color:#3773b9}
.page-body blockquote span,
.page-body blockquote small{color:#6B95C6; display:block; margin-top:10px}

.page-body blockquote.people{color:#5b5daf; border:0; padding:0}
.page-body blockquote.people span,
.page-body blockquote.people small{color:#909CCf; display:block; margin-top:6px}

.page-body .break-normal{word-break:normal}

@media(min-width:1098px){
  .page-body h2{font-size:19px;  line-height:1.5; margin-top:35px}
  .page-body h3{font-size:18px;  line-height:1.5; margin-top:25px}
  .page-body h4{font-size:17px;  line-height:1.5; margin-top:18px}
  .page-body br{display:block}
}

/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
	.page-body .newtab::after{background-image:url(../images/ico_ch_link@2x.png)}
}


/* content-info */
.content-info{font-size:14px}
/*.content-info > *:first-child{margin-top:0}*/
.content-info dl{margin-top:6px}
.content-info dt{font-weight:600; float:left; margin-right:10px}
.content-info .lang dt{margin-bottom:6px}
.content-info .lang dd{float:left; width:calc(100% - 70px)}
.content-info .lang::after{content:''; display:table; clear:both}
.content-action .total{position:relative}
.content-action .total .txt::after{content:''; width:8px; height:5px; display:inline-block; margin-left:4px; vertical-align:2px; background:url(../images/ico_lang_arrow.svg)no-repeat; background-size:100%}
.content-action .total.on .txt::after{content:''; -webkit-transform:rotate(180deg); transform:rotate(180deg)}
.content-lang{display:none; max-width:600px; margin:6px auto; -webkit-transform:translate3d(0px,0px,0px); padding:10px 15px; border-radius:8px; background-color:rgb(244, 246, 248)}
.content-lang > div{display:flex; flex-wrap:wrap}
.content-lang a{color:#333; font-size:13px; padding:2px 8px 2px 0}
.content-lang a.checked{order:-1; color:#456BFF}
.content-lang a:hover{color:#4E70F6}
.content-info .btn-group a:first-child{padding-left:0}
.content-info .btn-group a:last-child{padding-right:0}
@media(min-width:672px){
  .content-info .lang dd{width:calc(100% - 150px)}
}
@media(min-width:1098px){
	.content-lang{margin-left:auto; margin-right:0}
}


/* emotion */
.emotion{font-size:14px; overflow:hidden}
.emotion dt{font-weight:600; float:left; margin-right:10px}
.emotion .txt{font-size:11px; line-height:1.2; color:#666}
.emotion .state{font-size:14px; font-weight:600; margin-top:1px}
.emotion .emotion-action{text-align:center; max-width:400px; margin:0 auto}
.emotion .emotion-action a{width:20%; display:inline-block; float:left; text-align:center; padding-left:3px; padding-right:3px}
.emotion .emotion-action a::before{content:''; width:48px; height:48px; display:inline-block; background-repeat:no-repeat}
.emotion .emotion-action a.thank::before{background:url(../images/ico_emo_thank.png); background-size:100%}
.emotion .emotion-action a.impression::before{background:url(../images/ico_emo_impress.png); background-size:100%}
.emotion .emotion-action a.hope::before{background:url(../images/ico_emo_hope.png); background-size:100%}
.emotion .emotion-action a.repent::before{background:url(../images/ico_emo_repent.png); background-size:100%}
.emotion .emotion-action a.comfort::before{background:url(../images/ico_emo_comfort.png); background-size:100%}

/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
  .emotion .emotion-action a.thank::before{background:url(../images/ico_emo_thank@2x.png); background-size:100%}
  .emotion .emotion-action a.impression::before{background:url(../images/ico_emo_impress@2x.png); background-size:100%}
  .emotion .emotion-action a.hope::before{background:url(../images/ico_emo_hope@2x.png); background-size:100%}
  .emotion .emotion-action a.repent::before{background:url(../images/ico_emo_repent@2x.png); background-size:100%}
  .emotion .emotion-action a.comfort::before{background:url(../images/ico_emo_comfort@2x.png); background-size:100%}

}
@media(min-width:414px){
	.emotion .txt{font-size:12px; line-height:1.3}
	.emotion .emotion-action a{padding-left:5px; padding-right:5px}
	.emotion .emotion-action a::before{content:''; width:52px; height:52px}
}

/* 시청완료 버튼 on */
.content-action .watch.on .txt, .content-action .watch.on em,
.btn-watch.on, .btn-watch.on em{color:#4E70F6}
.btn-watch.on{border:1px solid #8AA1F8; background-color:#fff}
.content-action a.watch.on::before{background:url(../images/ico_watch_on.png); background-size:100%}
.btn-watch.on::before{content:''; width:14px; height:10px; display:inline-block; margin-right:5px; background:url('../images/ico_btn_watch_on.png')no-repeat; background-size:100%}

/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
.btn-watch.on::before{background:url('../images/ico_btn_watch_on@2x.png')no-repeat; background-size:100%}
.content-action a.watch.on::before{background:url(../images/ico_watch_on@2x.png); background-size:100%}
}

/* 나중에보기 버튼 on */
.content-action .later.on .txt{color:#4E70F6}
.content-action a.later.on::before{background:url(../images/ico_later_on.png); background-size:100%}

/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
.content-action a.later.on::before{background:url(../images/ico_later_on@2x.png); background-size:100%}
}

/* 관련영상 */
.aside{margin-top:35px}
.aside .contents-sort{padding-right:10px}
.container .video-list .later-context{top:25px; right:6px}
.video-list .thum-rect{height:70px}

@media(min-width:672px){
  .contents-main .row-basic:first-child{margin-top:25px}
}
@media(min-width:884px){
  .row-basic{margin-top:40px}
  .aside{margin-top:50px}
  .emotion .emotion-action{margin-left:0}
}
@media(min-width:1098px){
  .container-fluid.no-gutters{padding-left:15px; padding-right:15px}
  /* .contents-all{margin-top:65px} */
  .content-top-fit{margin-top:0}
  .aside{padding-left:10px; margin-top:0}
  .aside .video-list .info h3{font-size:14px}
  .title-wrap{margin-top:15px}
  .page-title{width:calc(100% - 500px); display:inline-block; padding-right:15px; vertical-align:top}
  .content-action{display:inline-block; margin:0; float:right}
  .page-body{max-width:700px}
  .contents-left{width:calc(100% - 350px); display:inline-block; float:left; margin-bottom:40px}
  .aside{width:350px; display:inline-block}
  .aside .list-group{margin-top:15px}
}
@media(min-width:1312px){
  /* .contents-all{margin-top:75px} */
  .contents-left{width:calc(100% - 400px)}
  .aside{width:400px}
  .video-list .thum{width:155px}
  .video-list .thum-rect{height:88px}
}

/* 요약설교 */
.waring{display:inline-block; padding:9px 15px 10px 38px; margin-bottom:30px; position:relative; background-color:#FFFDE1; border:1px solid #F2EAC5; border-radius:6px; font-size:14px; color:#A06E0F}
.waring::before{content:''; display:inline-block; width:16px; height:16px; background-image:url(../images/ico_waring.png); background-size:16px; background-position:center; background-repeat:no-repeat; position:absolute; top:12px; left:15px}
/*======= retina =======*/
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-resolution:1.5dppx), (-webkit-min-device-pixel-ratio:1.5), (min-resolution:144dpi){
	.waring::before{background-image:url(../images/ico_waring@2x.png)}
}


/* shorts */
.shorts .contents-all .content-top-fit{padding:0}
.shorts .contents-all .content-top-fit .container{padding:0 15px}
.shorts .svp-stage-youtube{padding-bottom:calc(100vh - 160px); top:0 !important}

@media(min-width:1098px){
	.shorts .contents-all .content-top-fit{padding:0 15px}
	.shorts .contents-all .content-top-fit .container{padding:0}
	.shorts .svp-stage-youtube{padding-bottom:calc(100vh - 200px)}
}

/* 240326 */
.svp-stage-youtube{left:0 !important; margin-left:auto; margin-right:auto}


/* tooltip */
.tooltip{width:200px; position:absolute; top:60px; left:50%; margin-left:-100px; z-index:10}
.tooltip > div{display:inline-block; padding:5px 8px; background-color:#000; color:#fff; font-size:12px; border-radius:5px; display:flex; align-items:center; width:fit-content; margin:0 auto}
.tooltip::before{content:""; position:absolute; bottom:100%; /* At the top of the tooltip */ left:50%; margin-left:-5px; border-width:5px; border-style:solid; border-color:transparent transparent black transparent}
.tooltip .btn-close{margin-left:3px; width:10px; height:10px; padding:0; background-image:url(../images/btn_tooltip_close.svg); background-size:100%; background-position:center; background-repeat:no-repeat; flex-shrink:0}