@charset "UTF-8";

*:focus {outline:0;}
body,html {font-family: sans-serif;scroll-behavior: smooth}
i {margin: 0px 5px 0px 0px;}
.container_postbtn .btn_menu_toolbar.following .ico_check_type1 { margin-top: 16px}
article,aside,canvas,details,figcaption,figure,footer,header,main,menu,nav,section,summary { display: block}
body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,select,table,td,textarea,th,ul {margin: 0; padding: 0 }
body,button,input,select,table,textarea { color: #444 }
button,input { border: 0; border-radius: 0}
img { border: 0 }
ol,ul { list-style: none }
address,em { font-style: normal }
a { cursor:pointer; color: #666; font-weight: 400; text-decoration: none!important; }
blockquote { padding: 5px 20px !important; margin: 10px 0 20px !important; color: #999; font-size: .9em; border-left: 4px solid #e1e4e5 }
blockquote footer { display: block;   font-size: .85em; line-height: 1.42857143; color: #b3b3b3 }
blockquote footer:before { content: '\2014 \00A0' }
.blind {position: absolute;overflow: hidden;clip: rect(0 0 0 0);margin: -1px;width: 1px;height: 1px}
.sr-only {position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;overflow: hidden;clip: rect(0,0,0,0);border: 0}
.index_wrap {position: relative;background-color: #fff;font-size: 12px;line-height: 14px;color: #242424;letter-spacing: -.2px;overflow: hidden;}
.list_content .thumbnail_post {float: left;height: 150px;width: 150px;margin: 4px 30px 4px 0}
.list_content .thumbnail_post img {box-shadow: 0 0 3px rgba(0,0,0,.3);border: 5px solid #fff}
.thumnail img {width: 120px;height: 120px;box-shadow: 0px 0px 3px gray;}

.post_category {
   margin-bottom: 5px;
   color: #3180ca;
}
.list_detail_wrap .post_title {
   margin-bottom: 5px;
   display: block;
   white-space: nowrap;
   text-overflow: ellipsis;
   max-width: 728px;
   overflow:hidden;
   color: #333;
   font-weight: 600;
   line-height: 140%;
   font-size: 17px;
}

.list_detail_wrap .post_text {
   line-height: 20px;
   font-size: 13px;
   max-height: 40px;
   overflow: hidden;
   margin-bottom: 5px;
}

.list_detail_wrap {
   margin-top: 5px;
   font-size: 12px;
   font-weight: 500;
   color: #8c8c8c;
   /* display: block; */
   overflow: hidden;
   text-decoration: none;
}

.list_detail_wrap .post_category > a {
   color: #4f9ee3
}

.list_detail_wrap .post_line_bar {
   display: inline-block;
   width: 1px;
   height: 9px;
   margin: 0 5px;
   background: #ccc
}

.list_content {
   position: relative;
   overflow: hidden;
}

.list_content:hover .post_title {
   color: #3ea2ff;
   transition: .3s;
   text-decoration: underline;
}


.list_content:hover .thumnail img {
   -webkit-transition-duration: .3s;
   transition-duration: .3s;
   -webkit-transform: scale(1.05);
   -ms-transform: scale(1.05);
   transform: scale(1.05);
}


#paging {
   margin: 0 auto;
   margin-top: 20px;
   text-align: center;
   font-size: 15px;
   margin-bottom: 20px;
   position: relative;
   z-index: 0;
}

#paging .pagination li {
   display: inline-block
}

#paging .pagination li a {
   position: relative;
   display: block;
   padding: .5rem .75rem;
   margin-left: -7px;
   line-height: 1.25;
   color: #999;
   cursor: pointer;
   background-color: #fff;
   border: 1px solid #dee2e6
}

#paging .pagination li a:hover {
   z-index: 2;
   color: #0056b3;
   text-decoration: none;
   border-color: #ccc
}

#paging .pagination li .selected {
   color: #3ea2ff;
   font-weight: 700
}

#paging .prevpage {
   width: inherit!important
}

#paging .nextpage {
   width: inherit!important
}





.module-tag li a {
   display: inline-block;
   overflow: hidden;
   max-width: 210px;
   height: 24px;
   padding: 0 4px;
   margin: 0px 1px;
   line-height: 24px;
   color: #3e93dd;
   text-decoration: none;
   vertical-align: top;
   white-space: nowrap;
   text-overflow: ellipsis;
}

.module-tag li a:hover {
   background: #3ea2ff;
   border-color: #3ea2ff;
   color: #fff!important;
   transition: .5s
}

.module-title .fa-hashtag {
   margin-right: 10px
}

.module-category .sub_category_list li {
   
   display: block;
}

.module-category .sub_category_list li a {
   color: #666!important;
   -webkit-transition: color .3s;
   -moz-transition: color .3s;
   -ms-transition: color .3s;
   -o-transition: color .3s;
   transition: color .3s
}

.module-category .sub_category_list li:hover a {
   color: #fe7433!important
}

.module-category .sub_category_list li:first-child {
   margin-top: 5px
}


.module-category .sub_category_list li:last-child {
   border: 0
}

.module-category .link_tit {
   font-weight: bold;
   font-size: 15px;
}

.module-notice .all-view:before {
   content: "\f11e";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   margin-right: 10px;
   color: #3ea2ff
}


#sidebar .module {
   background: #fff;
   margin-bottom: 10px;
   border: 1px solid #dae1e6;
   border-radius: 3px;
}

#sidebar .module-content {
   padding: 15px;
}

#sidebar .module-tag .module-content {
   padding-top: 0px;
}

#sidebar .side_ads {
   margin: 15px 0px;
      text-align:center;
}

#sidebar .module .module-title {
   font-weight: 700;
   font-size: 13px!important;
   letter-spacing: -0.3px;
   line-height: 10px;
   padding: 15px;
   background: #f7f9fa;
   border-bottom: 1px solid #dae1e6;
}

.module-notice .all-view {
   font-size: 15px;
   font-weight: 400;
   margin-bottom: 13px;
   color: #666;
}

.module-notice .all-view a {
   font-weight: 700
}

.module-notice .notice-list:before {
   content: "\2022";
   color: #dedede;
   content: "-";
   font-weight: 900;
   font-family: "Font Awesome 5 Free";
   position: absolute;
   left: -15px;
   color: #666
}

.module-notice .notice-list {
   text-indent: 15px;
   position: relative;
   font-size: 13px;
   line-height: 24px;
}

.module-notice li {
   font-size: 13px
}
.module-category .tt_category {
   position: relative;
}
.module-category .c_cnt {
   border-radius: 5px;
   font-size: 12px;
   color: #5885ce;
   float: right;
   text-indent: 0px;
   padding: 0px 6px;
   line-height: normal;
   margin-top: 5px;
   background: #f9f9f9;
}

.module-category .sub_category_list li:before {
   content: "-";
   font-weight: 900;
   position: absolute;
   left:10px;
   color: #666;
   font-family: "Font Awesome 5 Free";
}

.module-category .category_list>li {
   position: relative;
   font-size: 15px;
   line-height: 30px;
   padding: 5px 0;
   border-bottom: 1px solid #efefef;
}
.module-category .category_list>li:last-child {
   border-bottom:none;
}
.module-category .category_list>li a {
   display: block;

   -webkit-transition: color .3s;
   -moz-transition: color .3s;
   -ms-transition: color .3s;
   -o-transition: color .3s;
   transition: color .3s;
}

.module-category .category_list li ul a {
   margin-left: 0;
   padding-left: 24px;

}

.module-category .category_list li:hover a {
   color: #1573ef
}


.module-category .sub_category_list>li {
   line-height: 28px;
   font-size: 14px;
   letter-spacing: -1px;
}


.module-recents {
   margin: 0
}

.module-recents .module-content {
   margin-top: 0
}

.module-recents .tab-content .c_cnt {
   display: none
}

.module-recents .module-content {
   padding: 0px !important;
}

.module-recents .tab-content {
   position: relative;
   overflow: hidden;
   padding: 15px;
}

.module-recents #recent-tab {
   display: flex;
   display: -webkit-box;
   display: -ms-flexbox;
}

.module-tag ul {
   margin-top: 15px;
   margin-bottom: 10px
}

.module-tag ul li {
   font-size: 12px;
   display: inline-block;
   border-radius: 20px;
   margin: -2px 0px;
   line-height: 22px
}

.module-tag {
   display: flex;
   flex-direction: column
}

.module-tag ul li:hover {
   /* border-color: #3ea2ff; */
}

.module-tag .btn-more {
   flex: none;
   clear: both;
   font-size: 11px;
   align-self: flex-end;
   padding: 2px 6px;
   background: #fbfbfb;
   color: #c1c1c1;
   border-radius: 3px;
   font-family: "doutm";
   margin: 5px;
}

.module-tag .btn-more:hover {
   background:#5eacf5;
}
.ad-module {
   text-align: center;
   margin-left: -2px;
   margin-bottom: 5px
}

.module-recents .nav-recent li {
   width: 50%;
   text-align: center;
}

.module-recents .nav-recent li a {
   display: block;
   line-height: 45px;
   font-size: 13px;
   font-weight: 700;
   background: #f7f9fa;
   border-bottom: 1px solid #dae1e6;
}
.module-recents .nav-recent .active .btn-rpost {
   background: #fff;
   border-right: 1px solid #dae1e6;
   border-bottom: none;
}


.module-recents .nav-recent .active .btn-rcomment {
   background: #fff;
   border-left: 1px solid #dae1e6;
   border-bottom: none;
}
.module-recents .nav-recent>.active>a,.module-recents .nav-recent>.active>a:focus,.module-recents .nav-recent>.active>a:hover {
   color: #3ea2ff;
   cursor: default;
}

.module-recents .tab-content>.tab-pane {
   display: none
}

.module-recents .tab-content>.active {
   display: block;
}

.module-recents .tab-content ul li {
   font-size: 15px;
   line-height: 1.79em;
   position: relative;
   text-indent: 5px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.module-recents .tab-content ul li:hover a {
   color: #3ea2ff
}

.module-recents .tab-content ul li:before {
   content: "\f304";
   font-weight: 900;
   font-family: "Font Awesome 5 Free";
   position: absolute;
   left: -20px;
   top: 1px;
   font-size: 5px;
   color: #999
}

#wrap {
   width: 100%;
   position: relative;
   padding-top: 30px;
   min-height: 100vh;
}

#wrap #container {
   width: 1070px;

.blog-fixed-buttons {
    position: fixed;
    display: flex;
    flex-direction: column;
    z-index: 999;
    border-radius: 10px;
    overflow: hidden;
    background-image: linear-gradient(45deg, #00A86B, #8A2BE2, #00A86B, #8A2BE2);
    background-size: 300% 300%;
    animation: gradientAnimation 10s ease infinite;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    /* PC 버전 기본 스타일 */
    bottom: 1.5em; /* 텍스트 한 줄 정도의 간격 */
    left: 50%;
    transform: translateX(-50%);
}
.blog-fixed-buttons .blog-button {
    width: 200px;
    padding: 15px 0;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 16px;
    color: white;
    background: transparent;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
.blog-fixed-buttons:hover {
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}
.blog-fixed-buttons .blog-button:active {
    background: rgba(255, 255, 255, 0.2);
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 모바일 화면 */
@media screen and (max-width: 768px) {
    .blog-fixed-buttons {
        bottom: 1.5em; /* 텍스트 한 줄 정도의 간격 유지 */
        right: 10px;
        left: auto;
        transform: none;
    }
    .blog-fixed-buttons .blog-button {
        width: 160px;
        font-size: 14px;
        padding: 12px 0;
    }
}

/* 매우 작은 모바일 화면 */
@media screen and (max-width: 320px) {
    .blog-fixed-buttons {
        bottom: 1em; /* 간격을 약간 줄임 */
        right: 5px;
    }
    .blog-fixed-buttons .blog-button {
        width: 140px;
        font-size: 12px;
        padding: 10px 0;
    }
}