/*!

__/\\\\\\\\\\\\\\\_______/\\\\\_________/\\\\\\\\\______/\\\________/\\\______/\\\\\\\\\____
 _\/\\\///////////______/\\\///\\\_____/\\\///////\\\___\/\\\_____/\\\//_____/\\\///////\\\__
  _\/\\\_______________/\\\/__\///\\\__\/\\\_____\/\\\___\/\\\__/\\\//_______/\\\______\//\\\_
   _\/\\\\\\\\\\\______/\\\______\//\\\_\/\\\\\\\\\\\/____\/\\\\\\//\\\______\//\\\_____/\\\\\_
    _\/\\\///////______\/\\\_______\/\\\_\/\\\//////\\\____\/\\\//_\//\\\______\///\\\\\\\\/\\\_
     _\/\\\_____________\//\\\______/\\\__\/\\\____\//\\\___\/\\\____\//\\\_______\////////\/\\\_
      _\/\\\______________\///\\\__/\\\____\/\\\_____\//\\\__\/\\\_____\//\\\____/\\________/\\\__
       _\/\\\________________\///\\\\\/_____\/\\\______\//\\\_\/\\\______\//\\\__\//\\\\\\\\\\\/___
        _\///___________________\/////_______\///________\///__\///________\///____\///////////_____

*/

/*
-----------------------------------------------------------------------
갤러리 형식의 배너
-----------------------------------------------------------------------
*/

#photo-banner .banner-list {
}
#photo-banner .banner-list {
    display: flex;
    flex-wrap: wrap;
}
#photo-banner .banner-list li {
    width: 100%;
}
#photo-banner .banner-list li.none {
    width: 100%;
    text-align: center;
}
#photo-banner .banner-list .photo {
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    width: 100%;
    height: auto;
}
#photo-banner .banner-list .photo img {
    max-width: 100%;
    width: auto;
    height: auto;
}
#photo-banner .banner-list li:hover .photo img,
#photo-banner .banner-list li:focus .photo img {
}
#photo-banner .banner-list .desc {
    margin-top: 15px;
}
#photo-banner .banner-list .desc .title span {
    font-size: 1rem;
    color: var(--color-dark);
    font-weight: 500;
    min-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
#photo-banner .divider {
    position: relative;
    height: 0.0625rem  /* 1/16 */;
    background: #ddd;
    margin: 3.125rem  /* 50/16 */ 0;
}
#photo-banner .divider::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 0.75rem  /* 12/16 */;
    height: 0.75rem  /* 12/16 */;
    border-radius: 50%;
    background: #2b7bb9;
    box-shadow: 0 0 0 4px rgba(43, 123, 185, 0.08);
    border: 0.125rem  /* 2/16 */ solid white;
    box-sizing: border-box;
}