/* YouTube PC/mobile reference; shared family shell and stored body remain intact. */
.fy-list,.fy-detail{--u:calc(100vw / 1920);color:#1a1a1a;font:300 calc(20 * var(--u))/1.4 Roboto,Pretendard,sans-serif}
.fy-list *,.fy-detail *{box-sizing:border-box}
.fy-list h2,.fy-detail h2,.fy-detail p{margin:0}
.fy-list{width:calc(1400 * var(--u));margin:calc(80 * var(--u)) auto 0;padding-bottom:calc(80 * var(--u))}
.fy-search{position:relative;display:flex;width:calc(780 * var(--u));height:calc(60 * var(--u));margin:0 auto calc(80 * var(--u));border:0}
.fy-search:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 .7px #1a1a1a;pointer-events:none}
.fy-select:before{content:'';position:absolute;right:0;top:0;bottom:0;width:.7px;background:#1a1a1a;z-index:1;pointer-events:none}
.fy-select{position:relative;width:calc(180 * var(--u));border-right:0}
.fy-select:after{content:'';position:absolute;right:calc(20 * var(--u));top:45%;width:calc(8 * var(--u));height:calc(8 * var(--u));border-right:1px solid #9d9a94;border-bottom:1px solid #9d9a94;transform:rotate(45deg);pointer-events:none}
.fy-select select{width:100%;height:100%;border:0;padding:0 calc(15 * var(--u));font:inherit;background:white;appearance:none}
.fy-keyword{flex:1;display:flex;min-width:0}
.fy-keyword input{width:100%;min-width:0;border:0;padding:0 calc(30 * var(--u));font:inherit;color:#1a1a1a;background:#fff}
.fy-keyword input::placeholder{color:#9d9a94;opacity:1}
.fy-keyword button{border:0;background:none;padding:0 calc(30 * var(--u));display:flex;align-items:center;cursor:pointer}
.fy-keyword svg{width:calc(20 * var(--u));height:calc(20 * var(--u));fill:none;stroke:#e97f1d;stroke-width:1.5}
.fy-neighbors{margin-top:calc(100 * var(--u));border-top:0;box-shadow:inset 0 .5px #9d9a94}
.fy-neighbors>div{display:grid;grid-template-columns:calc(154 * var(--u)) minmax(0,1fr);align-items:center;height:calc(74 * var(--u));border-bottom:0;box-shadow:inset 0 -.5px #9d9a94;padding:0 calc(10 * var(--u))}
.fy-neighbors b{display:flex;align-items:center;gap:calc(15 * var(--u));font:600 calc(24 * var(--u))/1.4 Roboto,Pretendard,sans-serif}
.fy-neighbors svg{flex:none;width:calc(12 * var(--u));height:calc(6 * var(--u));fill:none;stroke:#1a1a1a;stroke-width:1}.fy-neighbors svg.next{transform:rotate(180deg)}
.fy-neighbors a,.fy-neighbors span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#1a1a1a;font:300 calc(20 * var(--u))/1.4 Roboto,Pretendard,sans-serif}
.fy-detail a.fy-list-button{display:flex;align-items:center;justify-content:center;width:calc(165 * var(--u));height:calc(41 * var(--u));gap:calc(25 * var(--u));border:1px solid #1a1a1a;border-radius:100px;margin-top:calc(40 * var(--u));font:400 calc(18 * var(--u))/calc(21 * var(--u)) Roboto,Pretendard,sans-serif;color:#1a1a1a;background:transparent}
.fy-list-button svg{flex:none;width:calc(17 * var(--u));height:calc(10 * var(--u));fill:none;stroke:currentColor;stroke-width:1.5}
.fy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,calc(445 * var(--u))));justify-content:space-between;gap:calc(60 * var(--u)) 0}
.fy-card>a{display:flex;flex-direction:column;gap:calc(25 * var(--u));color:inherit;text-decoration:none}
.fy-thumbnail,.fy-player{display:block;position:relative;overflow:hidden;background:#fff}
.fy-thumbnail{width:100%;height:calc(248.68 * var(--u));border:0;border-radius:calc(8.72549 * var(--u))}
.fy-thumbnail:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 .7px #9d9a94;border-radius:inherit;pointer-events:none}
.fy-thumbnail img,.fy-player img{display:block;width:100%;height:100%;object-fit:contain;filter:none}
.fy-thumbnail i,.fy-player i{position:absolute;left:50%;top:50%;width:calc(55.84 * var(--u));height:calc(34.9 * var(--u));background:center/100% 100% no-repeat url('/common/renewal/assets/family-youtube/play.svg');transform:translate(-50%,-50%)}
.fy-card-copy{min-height:calc(146.73 * var(--u));padding:calc(4.36275 * var(--u)) 0}
.fy-card-meta{display:flex;align-items:center;gap:calc(13.09 * var(--u));height:calc(48 * var(--u))}
.fy-card-meta b{display:flex;align-items:center;justify-content:center;height:100%;padding:0 calc(13.2932 * var(--u));background:#e97f1d;border-radius:calc(5.81104 * var(--u));color:#fff;font-size:calc(20 * var(--u));font-weight:600;line-height:1.4;white-space:nowrap}
.fy-card-meta time{color:#9d9a94;font:400 calc(16 * var(--u))/1.45 Roboto,Pretendard,sans-serif}
.fy-card h2{display:-webkit-box;width:100%;height:calc(68 * var(--u));margin-top:calc(22 * var(--u));overflow:hidden;font:600 calc(24 * var(--u))/1.4 Roboto,Pretendard,sans-serif;word-break:keep-all;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.family-civil-page .fy-list .fy__pagination{margin-top:calc(80 * var(--u))!important}
.fy-list .fy__pagination a.is-active{background:#1c1309!important;border-color:#1c1309!important;color:#fff!important}
.fy-detail{width:calc(1600 * var(--u));margin:calc(100 * var(--u)) auto 0;padding-bottom:calc(80 * var(--u))}
.fy-overview{border-top:0;box-shadow:inset 0 2px #9d9a94;padding:calc(60 * var(--u)) calc(30 * var(--u)) calc(40 * var(--u))}
.fy-heading{padding:0 calc(5 * var(--u)) calc(25 * var(--u));border-bottom:0;box-shadow:inset 0 -.5px #94969d}
.fy-heading h2{display:block;width:100%;font:500 calc(38 * var(--u))/calc(45 * var(--u)) Roboto,Pretendard,sans-serif;text-align:left;overflow-wrap:anywhere;word-break:keep-all}
.fy-meta{display:flex;align-items:center;gap:calc(20 * var(--u));padding:0;margin:calc(30 * var(--u)) 0 0;list-style:none;color:#9d9a94;font:400 calc(15 * var(--u))/calc(18 * var(--u)) Roboto,Pretendard,sans-serif}
.fy-meta li{display:flex;align-items:center;gap:calc(10 * var(--u))}
.fy-meta li+li{position:relative;padding-left:calc(20 * var(--u))}.fy-meta li+li:before{content:'';position:absolute;left:0;top:50%;height:calc(12 * var(--u));border-left:.3px solid #9d9a94;transform:translateY(-50%)}
.fy-meta b{font-weight:600}
.fy-body{display:flex;flex-direction:column;gap:calc(60 * var(--u));margin-top:calc(60 * var(--u))}
.fy-player{width:calc(1280 * var(--u));height:calc(712 * var(--u));max-width:100%;cursor:pointer}
.fy-player i{width:calc(189.1 * var(--u));height:calc(122 * var(--u))}
.fy-player iframe{display:block;width:100%;height:100%;border:0}
.fy-copy{font:500 calc(38 * var(--u))/1.4 Roboto,Pretendard,sans-serif;overflow-wrap:anywhere}
.fy-copy p+p{margin-top:calc(20 * var(--u))}.fy-copy img,.fy-copy iframe{max-width:100%}.fy-copy img{height:auto}.fy-copy a{color:inherit;text-decoration:underline}
.fy-neighbors{margin-top:calc(100 * var(--u))}
.fy-attachment{color:inherit;text-decoration:underline}
.fy-search :is(input,select,button):focus-visible,.fy-card>a:focus-visible,.fy-player:focus-visible,.fy-list-button:focus-visible{outline:2px solid #e97f1d;outline-offset:3px}
@media(min-width:1025px){
 .family-civil-page.youtube_board:has(.fy-list,.fy-detail) .bk-subpage-breadcrumb.bk-civil-subpage-breadcrumb{height:calc(24 / 1920 * 100vw);margin:calc(40 / 1920 * 100vw) auto 0!important;font-size:calc(16 / 1920 * 100vw)}
 .family-civil-page.youtube_board:has(.fy-list,.fy-detail) .bk-subpage-breadcrumb>a,.family-civil-page.youtube_board:has(.fy-list,.fy-detail) .bk-subpage-breadcrumb__menu,.family-civil-page.youtube_board:has(.fy-list,.fy-detail) .bk-subpage-breadcrumb__menu button{height:calc(24 / 1920 * 100vw)}
 .family-civil-page.youtube_board:has(.fy-list,.fy-detail) .bk-subpage-breadcrumb__menu button{width:calc(153 / 1920 * 100vw);font-weight:500}
 .family-civil-page:has(.fy-list,.fy-detail) .bk-subpage-top{height:calc(101.33 / 1920 * 100vw)}
 .family-civil-page:has(.fy-list,.fy-detail) .bk-subpage-top__link{width:calc(40 / 1920 * 100vw);bottom:calc(40 / 1920 * 100vw)}
 .family-civil-page:has(.fy-detail) .bk-subpage-top{height:calc(141.33 / 1920 * 100vw)}
 body:has(.fy-list,.fy-detail) .bkpc-footer{margin-bottom:0}
}
@media(max-width:1024px){
 .fy-list,.fy-detail{--u:calc(100vw / 390)}
 .fy-list{width:calc(350 * var(--u));margin-top:calc(40 * var(--u));padding-bottom:calc(60 * var(--u))}
 .fy-search{width:100%;height:calc(40 * var(--u));margin-bottom:calc(40 * var(--u));border:0}
 .fy-search:after{box-shadow:inset 0 0 0 .3px #1a1a1a}
 .fy-select{display:none}.fy-keyword input{font-size:calc(14 * var(--u));font-weight:400;padding:0 calc(14.6154 * var(--u))}.fy-keyword button{padding:0 calc(14.6154 * var(--u))}.fy-keyword svg{width:calc(22.01 * var(--u));height:calc(22 * var(--u));stroke:#ab6309}
 .fy-grid{grid-template-columns:minmax(0,1fr);gap:calc(30 * var(--u))}
 .fy-card>a{gap:calc(15 * var(--u))}
 .fy-thumbnail{height:calc(195.59 * var(--u));border-width:0;border-radius:calc(6.86275 * var(--u))}
 .fy-thumbnail i,.fy-player i{width:calc(43.92 * var(--u));height:calc(27.45 * var(--u))}
 .fy-card-copy{min-height:calc(112.17 * var(--u));padding:calc(3.43137 * var(--u)) 0}
 .fy-card-meta{gap:calc(10.29 * var(--u));height:calc(32 * var(--u))}.fy-card-meta b{font-size:calc(16 * var(--u))}.fy-card-meta time{font-size:calc(12 * var(--u));line-height:1.25}
 .fy-card h2{height:calc(56 * var(--u));margin-top:calc(17.3 * var(--u));font-size:calc(20 * var(--u))}
 .family-civil-page .fy-list .fy__pagination{margin-top:calc(40 * var(--u))!important}
 .fy-detail{width:100%;margin-top:calc(35 * var(--u));padding-bottom:calc(50 * var(--u))}
 .fy-overview{border:0;box-shadow:inset 0 .5px #94969d,inset 0 -.5px #94969d;padding:0;margin:0 calc(20 * var(--u))}
 .fy-heading{padding:calc(20 * var(--u)) 0 calc(10 * var(--u))}
 .fy-heading h2{font-size:calc(20 * var(--u));line-height:1.4}
 .fy-meta{margin-top:calc(20 * var(--u));gap:calc(10 * var(--u));font-size:calc(12 * var(--u));line-height:calc(14 * var(--u))}.fy-meta li{gap:calc(3 * var(--u))}.fy-meta li+li{padding-left:calc(10 * var(--u))}.fy-meta .fy-author{display:none}.fy-meta li:nth-child(2){padding-left:0}.fy-meta li:nth-child(2):before{display:none}
 .fy-body{margin-top:calc(40 * var(--u));gap:calc(20 * var(--u));padding-bottom:calc(20 * var(--u))}
 .fy-player{width:100%;height:calc(195.59 * var(--u));border:0;border-radius:calc(6.86275 * var(--u))}
 .fy-thumbnail:after,.fy-player:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 .3px #9d9a94;border-radius:inherit;pointer-events:none}
 .fy-copy{font-size:calc(14 * var(--u));font-weight:400;line-height:calc(20 * var(--u))}
 .fy-neighbors{margin:calc(40 * var(--u)) calc(15 * var(--u)) 0}
 .fy-neighbors>div{grid-template-columns:calc(83 * var(--u)) minmax(0,1fr);height:calc(40 * var(--u));padding:0 calc(10 * var(--u))}
 .fy-neighbors b{font-size:calc(12 * var(--u));font-weight:500;gap:calc(8 * var(--u))}.fy-neighbors a,.fy-neighbors span{font-size:calc(14 * var(--u));font-weight:400;line-height:1.45}
 .fy-detail a.fy-list-button{width:calc(165 * var(--u));height:calc(41 * var(--u));margin:calc(40 * var(--u)) auto 0;font-size:calc(18 * var(--u))}
}