.blog-main-row{
    background-color:#eee;
}
    .blog-slider.owl-carousel .owl-stage {
        display:flex;
        /*padding:0 var(--w-con1);*/
}
         .blog-slider .owl-item{
    flex: 1 0 auto;
}
.blog-slider-row{
  margin:30px 0;
}
.blog-slider .slider-item{
  position:relative;
  display:flex;
  background-color:var(--w100);
  height:100%;
}
.blog-slider .slider-item .img-col{
flex:1 0 0;
aspect-ratio:3/2;
position:relative;
}
.blog-slider .slider-item .img-col img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  top:0;
  left:0;
}
.blog-slider .slider-item .txt-col{
    flex:1 0 0;
}
.blog-slider .slider-item .txt-col .txt-con{
    padding:30px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    height:100%;
}
.blog-slider .slider-item .txt-col .txt-con .head-con{
    display:inline-flex;
    flex-direction:column;
    align-items:flex-start;
    margin-bottom:30px;
}
.blog-slider .slider-item .txt-col .txt-con .head-con .cat{
    color:var(--w50);
    font-size:12px;
    display:flex;
    align-items:center;
}
.blog-slider .slider-item .txt-col .txt-con .head-con .cat:before{
    content:'';
    display:inline-block;
    width:10px;
    height:10px;
        background-color:var(--w80);
        margin-left:5px;
}
.blog-slider .slider-item .txt-col .txt-con .head-con .head{
       color:var(--b100);
    font-size:24px;
    font-weight:600;
    margin:0;
    margin-top:10px;
}
.blog-slider .slider-item .txt-col .txt-con .btm-con .desc{
    font-size:14px;
    font-weight:300;
    margin:0;
    margin-bottom:15px;
        overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
}
.blog-slider .owl-dots {
    width: 100%;
    display: flex;
    padding: 15px 0;
}
    .blog-slider .owl-dots .owl-dot {
        height: 5px;
        background-color: var(--b100);
        flex-grow: 1;
        opacity: 0.3;
        margin: 0 10px;
        transition: all 0.3s;
    }
    .blog-slider .owl-dots .owl-dot:first-of-type {
       margin-right:0;
    }
    .blog-slider .owl-dots .owl-dot:last-of-type {
       margin-left:0;
    }
        .blog-slider .owl-dots .owl-dot.active {
            opacity: 1;
            flex-grow: 2;
        }
        .blog-row{
            display:flex;
            margin-top:30px;
            margin-bottom:90px;
            align-items:flex-start
        }
.blog-row.blog-post-row {
     margin-bottom:0;
        }
        .blog-row .blog-main-col{
            flex-grow:1;
             margin-left:30px;
        }
.blog-row .blog-side-col{
            flex-grow:1;
             min-width:280px;
             max-width:280px;
        }
.blog-row.blog-post-row .blog-side-col{
     min-width:320px;
             max-width:320px;
        }
.post-list-head{
    margin-bottom:20px;
}
.post-list-head .head{
font-size:20px;
margin:0;
font-weight:500;
}
.post-list-head .head1{
font-size:24px;
margin:0;
font-weight:500;
    color:var(--b100);
}
.back-con{
display:inline-flex;
   align-items:center;
    font-size:14px;
    color:var(--b100);
    margin-bottom:15px;
}                 
.back-con .icon{
 font-size:24px;
 margin-left:5px;
}                   
      .post-grid-con{
        display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 30px;
    width: 100%;
   margin-bottom:45px;
        }
          .post-grid-con .post-item{
        background-color:var(--w100);
        display:flex;
        flex-direction:column;
        position:relative;
        }
    .post-grid-con .post-item .cat{
 color:var(--w50);
    font-size:11px;
    display:flex;
    align-items:center;
    margin-bottom:5px;
}
    .post-grid-con .post-item .cat:before{
    content:'';
    display:inline-block;
    width:10px;
    height:10px;
        background-color:var(--w80);
        margin-left:5px;
}
   .post-grid-con .post-item .img-con{
        width:100%;
        aspect-ratio:3/2;
        position:relative;
        z-index:3
        }
     .post-grid-con .post-item .img-con img{
        width:100%;
        height:100%;
        object-fit:cover;
        position:absolute;
        top:0;
        right:0;
        }
         .post-grid-con .post-item .txt-con{
     padding:15px;
        flex-grow:1;
     display:flex;
     flex-direction:column;
        }
           .post-grid-con .post-item .txt-con .head{
      font-size:16px;
      font-weight:500;
      margin:0;
      margin-bottom:15px;
      color:var(--b100);
      flex-grow:1;
        }
            .post-grid-con .post-item .txt-con .desc{
      font-size:13px;
      font-weight:300;
      margin:0;
           color:var(--b50);
             overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
        }
      .post-list-con{
          display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  width: 100%;
        }
          .post-list-con .post-item{
        background-color:var(--w100);
        display:flex;
        }
   .post-list-con .post-item .img-con{
        width:70px;
        min-width:70px;
        aspect-ratio:2/2;
        position:relative;
        z-index:3
        }
     .post-list-con .post-item .img-con img{
        width:100%;
        height:100%;
        object-fit:cover
        }
         .post-list-con .post-item .txt-con{
     padding:10px;
     flex-grow:1;
     display:flex;
     align-items:center;
        }
           .post-list-con .post-item .txt-con .head{
      font-size:14px;
      font-weight:500;
      margin:0;
      color:var(--b100)
        }
  .blog-search-row{
      position:relative;
      margin-bottom:21px;
  }
  .blog-search-row input{
    width:100%;
    background-color:var(--w100);
    border:1px solid var(--w50);
    border-radius:50px;
    padding:5px 10px;
    font-size:14px;
    font-weight:300;
    padding-left:30px;
    outline:0;
    transition:all 0.3s;
    border:1px solid var(--b50);
    color:var(--b100);
  }
  .blog-search-row .icon{
    font-size:24px;
    position:absolute;
    left:10px;
    top:50%;
    margin-top:-12px;
        color:var(--b100);
  }
           .post-cat-con{
        background-color:var(--c2);
        padding:30px;
      width:100%;
        }
        .post-cat-con .ttl{
      font-size:14px;
      font-weight:400;
      margin-bottom:30px;
        }
            .post-cat-con .cat-list{
      list-style:none;
      margin:0;
      padding:0;
        }
                      .post-cat-con .cat-list li{
      margin-bottom:15px;
        }
                  .post-cat-con .cat-list li a{
    font-weight:500;
    font-size:16px;
    white-space:nowrap;
    display:inline-flex;
    align-items:center;
    color:var(--b70)
        }
                  .post-cat-con .cat-list li a:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: var(--b50);
    margin-left: 10px;
}
                  .post-cat-con .cat-list li a:hover{
    color:var(--b100)
        }
                .post-cat-con .cat-list li a span{
    font-weight:300;
    font-size:12px;
    margin-right:10px
        }
.blog-btm-row{
    margin-bottom:90px;
}
.blog-btm-row .head{
  font-size:24px;
  margin:0;
  margin-bottom:20px;
  font-weight:500;
}
.blog-btm-row .desc{
font-size: 16px;
    font-weight: 300;
    column-count: 2;
    column-gap: 30px;
    column-rule: 1px solid var(--w50);
}
.post-paging {
}
.post-paging ul {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
}
.post-paging ul li{
 margin-left:15px;
}
.post-paging ul li a{
 display:flex;
 align-items:center;
 justify-content:center;
 width:40px;
 height:40px;
 background-color:var(--w100);
 color:var(--c1);
 font-size:16px;
 font-weight:500;
 padding-top:3px;
 transition:all 0.3s;
}
.post-paging ul li a:hover {
 background-color:var(--c2);
    }
.post-paging ul li.active a{
 background-color:var(--c1);
 color:var(--w100);
}
.post-row{
    margin-bottom:5px;
    background-color:var(--w100)
}
.post-row .post-top-img{
  aspect-ratio:5/3;
}
.post-row .post-top-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.post-row .post-main-con{
 padding:0 45px;
}
.post-row .post-head-con{
 margin:30px 0;
}
.post-row .post-head-con .head{
 font-size:28px;
 font-weight:600;
 color:var(--b100);
 margin:0;
 padding-bottom:15px;
 border-bottom:1px solid var(--w80);
}
.post-row .post-head-con .detail-con{
    display:flex;
    margin-top:15px;
     padding-bottom:15px;
    border-bottom:1px solid var(--w80);
        }
.post-row .post-head-con .detail-con .d-item{
    display:flex;
    align-items:flex-end;
    margin-left:20px;
    color:var(--w50)
        }
.post-row .post-head-con .detail-con .d-item .icon{
   font-size:18px;
   margin-left:3px;
        }
.post-row .post-head-con .detail-con .d-item .txt{
   font-size:12px;
        }
.post-row .post-body{
  font-size:15px;
  font-weight:300;
}
.post-row .post-body h1,
.post-row .post-body h2,
.post-row .post-body h3,
.post-row .post-body h4{
  font-size:20px;
  font-weight:500;
  margin:10px 0;
  color:var(--b100)
}
.post-row .post-body p{
}
.post-row .post-body-row figcaption{
    margin:5px 0;
    font-size:12px;
    text-align:center;
}
.post-row .post-body img{
    width:100%;
}
.post-row .post-tags-con{
  display:flex;
  border-top:1px solid var(--w50);
  margin-top:45px;
padding:30px 0;
}
.post-row .post-tags-con .ttl{
 font-size:14px;
 color:var(--w50);
}
.post-row .post-tags-con .tag-con{
 display:flex;
}
.post-row .post-tags-con .tag-con .tag-item{
 margin:0 15px 5px 0;
 background-color:var(--b60);
 padding:3px 10px;
 font-size:12px;
 border-radius:50px;
 color:var(--w100);transition:all 0.3s;
}
.post-row .post-tags-con .tag-con .tag-item:hover{
 background-color:var(--c1);
}
.post-share-row{
    background-color:var(--c3);
    padding:30px;
    color:var(--w100);
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.post-share-row .share-ttl{
  font-size:14px;
  font-weight:300
}
.post-share-row .jssocials-share-link {
   color:var(--w100);
    margin-right: 15px;
    margin-top: 0;
}
.post-share-row .jssocials-share-link:hover {
   color:var(--b100);
}
.post-share-row .jssocials-share-logo {
  font-size:24px;
}
.post-comments-head{
    margin-bottom:30px
}
.post-comments-head .head{
   font-size:24px;
   font-weight:500;
   margin:0;
}
.comments-row{
    display:flex;
    flex-direction:row-reverse;
}
.comments-row .comments-col{
   flex:5 0 0;
   margin-left:30px;
}
.comments-row .side-col{
       flex:3 0 0;
   min-width:460px;
  max-width:540px;
}
.comments-row .comment-item{
    margin-bottom:20px;
}
.comments-row .comment-item .comment-body{
    background-color:var(--w100);
    padding:15px;
}
.comments-row .comment-item .comment-reply{
    background-color:var(--w80);
     padding:15px;
}
.comments-row .comment-item .c-head{
display:flex;
align-items:center;
margin-bottom:10px;
justify-content:space-between;
}
.comments-row .comment-item .c-head .name-con{
   flex-grow:1;
   display:flex;
   align-items:center;
}
.comments-row .comment-item .c-head .name-con .name{
   font-weight:500;
   color:var(--b100);
   font-size:16px;
   margin-left:10px;
}
.comments-row .comment-item .comment-reply .c-head .name-con .name{
   font-size:14px;
}
.comments-row .comment-item .c-txt{
   font-size:14px;
   font-weight:300;
   line-height:24px;
}
.comments-row .comment-item .comment-reply .c-txt{
   font-size:14px;
   line-height:24px;
}
.comments-row .comment-item .c-date{
   font-size:12px;
   font-weight:300;
margin-top:10px;
color:var(--w50)
}
.comments-row .btn-row .btn-con{
 width:100%;
 max-width:240px;
}
.comments-row .btn-row .btn-con .button{
 width:100%;
}
.comments-row .c-add-row {
    background-color: var(--w100);
    padding: 20px;
    margin-bottom: 30px;
}
.comments-row .c-add-row .ttl{
   margin:20px 0;
}
.comments-row .c-add-row .ttl .icon{
   font-size:48px;
   margin-bottom:15px;
   display:inline-block;
}
.comments-row .c-add-row .head{
   font-size:20px;
   margin:0;
}
.comments-row .c-add-row .btn{
width:100%;
    max-width: 240px;
margin:20px 0;
}
.comments-row .c-add-row .btn .button{
width:100%;
}

@media(max-width:1199px) {
    .blog-slider .slider-item .txt-col .txt-con .btm-con .desc {
        -webkit-line-clamp: 4;
        line-clamp: 4;
    }
    .post-grid-con {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media(max-width:991px) {
    .blog-slider .slider-item .txt-col .txt-con .btm-con .desc {
        -webkit-line-clamp: 3;
        line-clamp: 3;
    }
    .blog-slider .slider-item .txt-col .txt-con .head-con .head {
        font-size: 20px;
    }
    .blog-row {
        flex-direction: column;
    }
        .blog-row .blog-main-col {
            margin-left: 0;
        }
        .blog-row.blog-post-row .blog-side-col {
            display: none;
        }
    .post-grid-con {
        grid-template-columns: repeat(3, 1fr);
    }
    .comments-row .side-col {
        min-width: 320px;
    }
}
@media(max-width:767px) {
    .blog-slider-row {
        margin: 15px 0;
    }

    .blog-slider .slider-item {
        flex-direction: column;
    }

        .blog-slider .slider-item .img-col {
            flex: initial;
        }

            .blog-slider .slider-item .img-col img {
            }

        .blog-slider .slider-item .txt-col .txt-con {
            padding: 15px;
            justify-content:flex-start;
        }

            .blog-slider .slider-item .txt-col .txt-con .head-con {
                margin-bottom: 15px;
            }

                .blog-slider .slider-item .txt-col .txt-con .head-con .cat {
                    font-size: 9px;
                }

                .blog-slider .slider-item .txt-col .txt-con .head-con .cat:before {
    width: 7px;
    height: 7px;
}
                .blog-slider .slider-item .txt-col .txt-con .head-con .head {
                    font-size: 17px;
                    margin-top: 10px;
                }

            .blog-slider .slider-item .txt-col .txt-con .btm-con .desc {
                font-size: 12px;
                margin-bottom: 10px;
                -webkit-line-clamp: 4;
                line-clamp: 4;
            }

    .blog-slider .owl-dots {
        padding: 10px 0;
    }

        .blog-slider .owl-dots .owl-dot {
            margin: 0 7px;
        }

            .blog-slider .owl-dots .owl-dot:first-of-type {
                margin-right: 0;
            }

            .blog-slider .owl-dots .owl-dot:last-of-type {
                margin-left: 0;
            }

    .blog-row {
        margin-top: 15px;
        margin-bottom: 45px;
    }

        .blog-row .blog-side-col {
            min-width: 100%;
            max-width: 100%;
        }

        .blog-row.blog-post-row .blog-side-col {
            min-width: 100%;
            max-width: 100%;
        }

    .post-list-head {
        margin-bottom: 10px;
    }

        .post-list-head .head {
            font-size: 18px;
        }

    .post-grid-con {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-column-gap: 10px;
        grid-row-gap: 15px;
        margin-bottom: 15px;
    }

        .post-grid-con .post-item {
            flex-direction: row;
        }

            .post-grid-con .post-item .cat {
                font-size: 9px;
            }
               .post-grid-con .post-item .cat:before {
    width: 7px;
    height: 7px;
}
 
            .post-grid-con .post-item .img-con {
                min-width: 150px;
                max-width: 150px;
            }

            .post-grid-con .post-item .txt-con {
                padding: 10px;
                flex-grow: 1;
            }

                .post-grid-con .post-item .txt-con .head {
                    font-size: 14px;
                    margin-bottom: 10px;
                }

                .post-grid-con .post-item .txt-con .detail-con .d-item {
                    margin-left: 10px;
                }

                    .post-grid-con .post-item .txt-con .detail-con .d-item .icon {
                        font-size: 14px;
                        margin-left: 2px;
                    }

                    .post-grid-con .post-item .txt-con .detail-con .d-item .txt {
                        font-size: 8px;
                    }
                    .post-grid-con .post-item .txt-con .desc{
                         font-size: 12px;
                         -webkit-line-clamp: 4;
                             line-clamp: 4;
                    }

    .blog-search-row {
        margin-bottom: 30px;
    }

        .blog-search-row input {
            padding: 5px 10px;
            font-size: 14px;
            font-weight: 300;
            padding-left: 30px;
        }

    .post-cat-con {
        padding: 15px;
    }

        .post-cat-con .ttl {
            font-size: 12px;
            margin-bottom: 15px;
        }

        .post-cat-con .cat-list li {
            margin-bottom: 10px;
        }

            .post-cat-con .cat-list li a {
                font-size: 14px;
            }

                .post-cat-con .cat-list li a span {
                    font-size: 10px;
                }

    .blog-btm-row {
        margin-bottom: 60px;
    }

        .blog-btm-row .head {
            font-size: 20px;
            margin-bottom: 10px;
        }

        .blog-btm-row .desc {
            font-size: 12px;
            column-count: 1;
            column-gap: 0;
        }

    .post-paging {
        margin-bottom: 30px;
    }

        .post-paging ul li {
            margin-left: 10px;
        }

            .post-paging ul li a {
                width: 30px;
                height: 30px;
                font-size: 12px;
                padding-top: 2px;
            }

    .post-row {
    }

        .post-row .post-top-img {
            aspect-ratio: 3/2;
        }

        .post-row .post-main-con {
            padding: 0 10px;
        }

        .post-row .post-head-con {
            margin: 20px 0;
        }

            .post-row .post-head-con .head {
                font-size: 20px;
            }

            .post-row .post-head-con .detail-con {
                margin-top: 10px;
            }

                .post-row .post-head-con .detail-con .d-item {
                    margin-left: 15px;
                }

                    .post-row .post-head-con .detail-con .d-item .icon {
                        font-size: 14px;
                    }

                    .post-row .post-head-con .detail-con .d-item .txt {
                        font-size: 8px;
                    }

        .post-row .post-body {
            font-size: 14px;
        }

            .post-row .post-body h1,
            .post-row .post-body h2,
            .post-row .post-body h3,
            .post-row .post-body h4 {
                font-size: 18px;
                margin: 10px 0;
            }

        .post-row .post-body-row figcaption {
            font-size: 8px;
        }

        .post-row .post-tags-con {
            flex-direction: column;
            margin-top: 20px;
            padding: 15px 0;
        }

            .post-row .post-tags-con .ttl {
                font-size: 10px;
            }

            .post-row .post-tags-con .tag-con {
            }

                .post-row .post-tags-con .tag-con .tag-item {
                    margin: 10px 0 0 10px;
                    padding: 3px 10px;
                    font-size: 9px;
                }

    .post-share-row {
        flex-direction: column;
        text-align: center;
        padding: 20px 15px;
        align-items: center;
    }

        .post-share-row .share-ttl {
            font-size: 10px;
            margin-bottom: 15px;
        }

    .post-comments-head {
        margin-bottom: 15px;
    }

        .post-comments-head .head {
            font-size: 18px;
        }

    .comments-row {
        flex-direction: column;
    }

        .comments-row .comments-col {
            min-width: 100%;
            margin-left: 0;
        }

        .comments-row .side-col {
            flex: 3 0 0;
            min-width: 100%;
            max-width: initial;
        }

        .comments-row .comment-item {
            margin-bottom: 10px;
        }

            .comments-row .comment-item .comment-body {
                padding: 10px;
            }

            .comments-row .comment-item .comment-reply {
                padding: 10px;
            }

            .comments-row .comment-item .c-head {
                margin-bottom: 10px;
                justify-content: space-between;
            }

                .comments-row .comment-item .c-head .name-con .name {
                    font-size: 14px;
                    margin-left: 7px;
                }

            .comments-row .comment-item .comment-reply .c-head .name-con .name {
                font-size: 12px;
            }


            .comments-row .comment-item .c-txt {
                font-size: 12px;
                line-height: 22px;
            }

            .comments-row .comment-item .comment-reply .c-txt {
                font-size: 10px;
                line-height: 20px;
            }

            .comments-row .comment-item .c-date {
                font-size: 8px;
                margin-top: 10px;
            }

        .comments-row .btn-row .btn-con {
            max-width: 180px;
        }

        .comments-row .c-add-row {
            padding: 10px;
            margin-bottom: 15px;
        }

            .comments-row .c-add-row .ttl {
                margin: 20px 0;
            }

                .comments-row .c-add-row .ttl .icon {
                    font-size: 40px;
                    margin-bottom: 10px;
                }

            .comments-row .c-add-row .head {
                font-size: 16px;
            }

            .comments-row .c-add-row .btn {
                max-width: 180px;
                margin: 15px 0;
            }
}