.section-main{display:grid; grid-gap:var(--size-3);}
.section-main-above{margin:calc(var(--size-3) * -1) 0;}
.section-main-below{margin-top:calc(var(--size-3) * -1);}



.author-source{display:inline-grid;}
.author-list{display:flex; flex-wrap:wrap;}
.author-name{position:relative; margin-right:var(--size-2); margin-bottom:var(--size-1); font-weight:normal;}
.author-name:not(:last-child):after{content:","; display:inline-flex;}



.breadcrumb{display:flex; justify-content:center; align-items:center;}
.breadcrumb-link{position:relative; line-height:100%; text-transform:capitalize;}
.breadcrumb-link:not(:last-child){padding-right:var(--size-3); margin-right:var(--size-2);}
.breadcrumb-link:not(:last-child):after{content:'/'; display:block; position:absolute; bottom:2px; right:0;}
.breadcrumb-link .svgicon{width:auto; height:16px;}



.article-head{grid-gap:var(--size-2); margin-bottom:var(--size-3);}
.article-title, .article-date{text-align:center;}
.article-title{font-weight:bold; text-wrap:balance;}
.article-author{grid-template-columns:48px 1fr; margin:0 auto;}
.article-life{display:flex; flex-wrap:wrap; justify-content:center; margin-bottom:var(--size-4);}
.article-life-box{margin:0 var(--size-1); text-align:center; line-height:140%;}
.btn-more-event-container{margin-top: var(--size-3);}


.hero-frame{position:relative;}
.hero-frame:before{content:''; display:block; padding-top:56.25%; position:relative; z-index:1;}
.hero-frame img{position:absolute; top:0; left:0; width:100%; height:100%;}
.hero-info{position:relative; z-index:2000; padding:0 var(--size-3) var(--size-1); margin-top:-1px;}
.hero-info *{font-size:11px; line-height:140%;}
.hero-author{grid-template-columns:58px 1fr; margin-top:var(--size-1);}


.hero-frame-zoom{position:absolute; top:15px; right:15px; z-index:2000; width:55px; height:55px; font-size:24px;
  background-color:var(--color-text-4); color:var(--color-text-2); border-radius:50%; box-shadow:var(--shadow-neumorp); transition:all 0.25s;}
.hero-frame-link:hover{cursor: pointer;}
.hero-frame-link:hover .hero-frame-zoom, .image-content-link:hover .hero-frame-zoom{background-color:var(--color-text-3);}



.biduan-head{margin-bottom:var(--size-5);}
.biduan-head-cover{position:relative; z-index:1;}
.bhc-big{position:relative; z-index:2;}
.bhc-big:before{padding-top:50%;}
.bhc-small-list{position:absolute; z-index:1000; bottom:var(--size-3); right:var(--size-3); display:flex; width:100%; justify-content:flex-end;}
.bhc-small-box{border:2px solid; margin-left:var(--size-2);}
.bhc-small:before{padding-top:100%;}

.biduan-head-box{padding:var(--size-4) var(--size-3); display:grid; grid-gap:var(--size-3); align-items:center;}
.biduan-head-photo{position:relative; z-index:1000;}
.biduan-head-photo-frame{position:absolute; bottom:0; left:0; width:var(--thumb-size); height:var(--thumb-size);}
.biduan-head-name{font-size:18px; line-height:140%; font-weight:bold; text-transform:uppercase; margin-bottom:3px;}
.biduan-head-alias{margin-bottom:5px; min-height:18px;}
.biduan-head-label{display:flex; align-items:center;}
.biduan-head-label-button{padding:var(--size-1) var(--size-3); text-transform:uppercase; font-size:12px;}
.biduan-head-socmed{display:flex; align-items:center;}
.biduan-head-socmed-button{display:flex;}
.biduan-head-socmed-button .svgicon{width:auto; height:30px;}

.biduan-schedule-list{display:grid; grid-gap:var(--size-4); grid-template-columns:repeat(auto-fit, minmax(270px,1fr));}
.bsl-box{display:grid; grid-gap:var(--size-3); grid-template-columns:auto 1fr;}
.bsl-date{padding:var(--size-3) var(--size-4);}
.bsl-date *{text-align:center; font-weight:bold;}
.bsl-day{font-size:var(--size-4);}
.bsl-title{line-height:140%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.bsl-loc{display:grid; grid-template-columns:auto 1fr; grid-gap:var(--size-2); font-size:12px; margin-top:var(--size-1);}
.bsl-loc .svgicon{width:auto; height:11px; position:relative; top:2px;}
.bsl-loc-name{font-weight:normal;}

.embed-allsong{height:152px;}
.embed-allsong iframe, .embed-single-player iframe{position:absolute; top:0; left:0; width:100%; height:100%;}

.embed-single{--embed-height:152px; display:grid;}
.embed-single-head{padding:var(--size-3); position:relative;}
.embed-single-head .svgicon{position:absolute; bottom:0; right:0; width:auto; height:89px; opacity:0.34;}
.esh-title{font-weight:bold; font-size:20px; text-transform:uppercase;}
.embed-single-player{height:var(--embed-height);}

.biduan-picture-frame{width:144px; margin-bottom:var(--size-1);}
.biduan-picture-frame:before{padding-top:100%;}

/* cms embed image */
.flex_thumb{position:relative;}
.flex_thumb:before{content:''; display:block; padding-top:56.25%; position:relative; z-index:1000;}
.flex_thumb img{position:absolute; top:0; left:0; width:100%; height:100%;}
.ap-mainimage-info{position:relative; z-index:2000; padding:0 var(--size-3) var(--size-1); margin-top:-1px;}
.ap-mainimage-info *{font-size:11px; line-height:140%;}
/* cms embed image */

.detail-content{display:grid; grid-gap:var(--size-3); padding:var(--size-4); font-size:17px; line-height:150%;}
.detail-content > ul, .detail-content > ol{padding-left:20px;}
.detail-content > ul{list-style:square;}
.detail-content > ol{list-style:decimal;}
.detail-content > ul > li, .detail-content > ol > li{padding:2px 0;}
.detail-content h2, .detail-content h3, .detail-content h4{font-weight:bold; font-size:19px; line-height:150%;}
.embedsocmed-yt:before{padding-top:56.25%;}
.embedsocmed-yt iframe{position:absolute; z-index:2; top:0; left:0; width:100%; height:100%;}



.read-alternative{position:relative; padding-left:var(--size-4); font-size:14px; line-height:150%;}
.read-alternative:before{content:''; display:block; position:absolute; top:0; left:0; width:var(--size-1); height:100%;}
.read-alternative-link{display:block;}



.tag-related{display:flex; flex-wrap:wrap;}
.tag-related-link{margin-right:var(--size-2); margin-bottom:var(--size-2); display:flex; font-size:14px;}



.event-tab{display:grid; grid-auto-flow:column; grid-auto-columns:max-content; grid-gap:var(--size-4); margin-bottom:calc(var(--size-3) * -1) !important;}
.event-tab-link{padding:var(--size-2) 0; border-bottom:3px solid transparent; font-weight:bold;}

.event-detail{display:grid; grid-gap:var(--size-4);}
.event-detail-poster .event-frame{max-width:300px;}
.event-detail-title{font-weight:bold; text-transform:uppercase; font-size:18px; line-height:140%;}
.event-detail-catedate, .event-detail-reminder{display:flex; justify-content:space-between; align-items:center;}
.event-detail-reminder .svgicon{width:auto; height:var(--size-4); margin-left:var(--size-2);}
.event-detail-info{display:grid; grid-gap:var(--size-3); grid-template-columns:auto 1fr;}
.edi-icon .svgicon{width:16px; height:auto;}
.edi-label{font-weight:bold; margin-bottom:var(--size-1);}
.edi-detail{line-height:140%;}
.edi-detail-name{font-weight:bold; margin-bottom:3px;}
.edi-detail-maps{border-radius:var(--rounded-2); overflow:hidden; margin:var(--size-2) 0;}
.edi-detail-maps:before{padding-top:56.25%;}
.edi-detail-maps iframe{position:absolute; z-index:2; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.end-notif-box{display: flex; justify-content: space-between; align-items: center; border-radius: var(--rounded-2); padding: var(--size-2) var(--size-4); background: linear-gradient(91.35deg, #616061 0%, #D2D2D2 100%); }
.end-notif-box p{font-weight: 700; color: #FFF;}

.sticky-bottom-event{padding:var(--size-4); position:sticky; bottom:0; z-index:1000;}
.sticky-bottom-event .width-max{display:grid; grid-gap:var(--size-4); grid-template-columns:1fr auto; width:100%; max-width:var(--site-container); margin:0 auto;}
.sbe-title{font-weight:bold; margin-bottom:var(--size-1);}





@media screen and (min-width:0px) and (max-width:1023px){
  .article-head{margin-left:var(--size-4); margin-right:var(--size-4);}
  .article-title{font-size:20px; line-height:140%;}
  @media screen and (orientation:portrait){
    .article-life{display:grid;}
  }
  
  .end-notif-box{margin: 0 21px;}
  
  .biduan-head{--thumb-size:89px; margin-top:calc(var(--size-4) * -1);}
  .biduan-head-box{grid-template-columns:var(--thumb-size) 1fr;}
  .biduan-head-right{grid-column:1/3; display:flex; justify-content:space-between;}
  .bhc-small-box{width:var(--size-5); height:var(--size-5);}
  .biduan-head-socmed-button{margin-left:var(--size-2);}
}



@media screen and (min-width:1024px){
  .article-title{font-size:30px; line-height:120%;}
  .sbe-title{font-size:18px;}
  
  
  
  .biduan-head{--thumb-size:144px;}
  .biduan-head-box{grid-template-columns:var(--thumb-size) 1fr auto;}
  .biduan-head-label{justify-content:flex-end; margin-bottom:var(--size-3);}
  .bhc-small-box{width:var(--size-6); height:var(--size-6);}
  .biduan-head-socmed{justify-content:flex-end;}
  .biduan-head-socmed-button{margin-left:var(--size-2);}
  
  
  
  .embed-single{grid-template-columns:233px 1fr;}
}