/*######################## wrap ################################*/
    #opus_wrap{width: 100%;position: relative;margin: 0 auto;overflow: hidden;}

/*######################## header ################################*/
    .header{width: 100%;max-width: 1920px;margin: 0 auto;position: relative;}
    .header .header__inner{text-align: center;height: 100px;padding: 0 80px;display: flex;line-height: 100px;}
    .header h1{max-width: 200px;flex-shrink: 0;padding: 0 20px;}
    .header h1 a{display: block;width: 100%;height: 100%;}
    .header h1 img{width: 100%;padding-top: 30px;}
    .header .main__nav{width: 100%;}
    .header .main__nav ul{display: flex;font-weight: 700;padding-left: 30px;}
    .header .main__nav ul li{margin:0 20px;}
    .header .main__nav ul li:last-child{margin-right: 40px;}
    .header .sub__nav{width: 100%;display: flex;}
    .header .sub__nav li:first-child::before{content: "";border-left: 1px solid #ccc;padding-right: 40px;}
    .header .sub__nav li{margin-right: 30px;}
    .header .sub__nav a{color: #666;}
    .header .menu__interface{flex-shrink: 0;display: flex;padding-right: 20px;position: relative;}
    .header .menu__interface .clammer__btn{
        display: block;
        border-radius: 999px;
        width: 100px;
        height: 35px;
        text-align: center;
        line-height: 35px;
        color: #fff;
        font-weight: 600;
        font-size: 12px;
        background-color: #6d8ecd;
        cursor: pointer;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
    .header .menu__interface a, .header .menu__interface span{margin-right: 15px;}
    .header .menu__interface p{cursor: pointer;}
    .header .menu__interface img{padding-top: 30px;}
    .line{display: none;width: 100vw;}

    .bb__line .line{display: block;border-bottom: 1px solid #ccc;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
    .tt__line .line{display: block;border-top: 3px solid #000;position: absolute;top: 0;left: 50%;transform: translateX(-50%);}

    .full__menu{width: 100vw;height: 100vh;position: fixed;left: 0;top: 0;z-index: 99;display: none;}
    .full__menu .full__back{
        display: none;
        width: 100%;
        height: 100%;
        backdrop-filter: blur(16px);
        background-color: rgba(0, 0, 0, 0.7);
    }
    .full__menu .full__inner{
        width: 490px;
        height: 100%;
        padding: 0 100px;
        position: absolute;
        right: -690px;
        top: 0;
        background-color: #8171B9;
    }
    .full__close{position: absolute;right: 50px;top: 50px;cursor: pointer;}
    .full__main__cate{padding-top: 220px;}
    .full__main__cate li{margin-bottom: 35px;}
    .full__main__cate li a{color: #fff;font-size: 30px;font-weight: 800;}
    .full__sub__cate{padding-top: 90px;}
    .full__sub__cate > li{margin-bottom: 35px;display: flex;}
    .full__sub__cate > li h3{width: 210px;}
    .full__sub__cate > li h3 a{color: #40385d;font-size: 30px;font-weight: 800;}
    .full__sub__cate ol{display: flex;gap: 20px;line-height: 36px;}
    .full__sub__cate ol li a{color: #40385d;font-size: 16px;font-weight: 600;}

    .clammer__area{
        display: none;
        width: 500px;
        height: 300px;
        background-color: #fff;
        border-radius: 20px;
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 9;
        box-shadow: 5px 5px 15px #000;
    }
    .clammer__area ul{
        display: flex;
        width: 100%;
        height: 100%;
        justify-content: center;
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    .clammer__area ul li a, .clammer__area ul li button{
        display: inline-block;
        width: 200px;
        height: 50px;
        line-height: 50px;
        border: 1px solid #000;
        border-radius: 999px;
        background-color: #fff;
        cursor: pointer;
    }

/*#####################  container  ############################  */
    .container{width: 100%;max-width: 1920px;margin: 0 auto;}

/*######################## footer ################################*/
    .footer{text-align: center;padding: 50px 0;max-width: 1920px;margin: 0 auto;position: relative;}
    .footer .footer__inner{width: 100%;max-width: 1360px;margin: 0 auto;position: relative;}
    .footer .footer__inner .footer__logo{width: 200px;}
    .footer .footer__inner .footer__logo img{width: 100%;}
    .footer .footer__inner .footer__info{text-align: left;padding-top: 30px;color: #666;font-size: 14px;line-height: 1.5em;}
    .footer .footer__inner address{font-style: normal;}
    .footer .footer__inner .copyright{text-align: left;font-size: 12px;font-weight: 600;color: #000;padding-top: 20px;}
    .footer .footer__inner .footer__sns{display: flex;position: absolute;right: 0;bottom: 0;}
    .footer .footer__inner .footer__sns li{margin-left: 10px;}
    
/* ############## 메인 page css ############################# */
    .main__visual{width: 100%;max-width: 1760px;max-height: 600px;margin: 0 auto;overflow: hidden;}
    .opus__wrapper{width: 100%;max-width: 1360px;margin: 0 auto;padding-top: 60px;padding-bottom: 130px;}
    .board__with__banner{width: 100%;display: flex;justify-content: space-between;}
    .board__with__banner .board__with__pic{
        display: flex;
        width: 950px;
        border-top: 3px solid #000;
        border-bottom: 1px solid #ccc;
        margin-bottom: 50px;
    }
    .board__with__banner .board__with__pic > div{width: calc(50% - 1px);margin: 40px 0;}
    .board__with__banner .board__with__pic > div:first-child{border-right: 1px solid #ccc;}
    .board__with__banner .board__with__pic h3{display: flex;justify-content: space-between;padding:0 40px 25px;}
    .board__with__banner .board__with__pic h3 span{font-size: 18px;font-weight: 700;}
    .board__with__banner .board__with__pic h3 a{color: #6d8ecd;font-size: 14px;font-weight: 600;}
    .board__with__banner .board__with__pic .board__pic__list{display: block;padding:0 40px;position: relative;}
    .board__with__banner .board__with__pic .board__lists__title{display: block;padding-right: 40px;padding-top: 20px;}
    .board__with__banner .board__with__pic .board__lists__title b{
        font-size: 20px;
        font-weight: 400;
        padding-right: 20px;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .board__with__banner .board__with__pic h4 span{width: 24px;flex-shrink: 0;}
    .board__pic{
        display: block;
        width: 395px;
        height: 220px;
        max-width: 395px;
        max-height: 220px;
        overflow: hidden;
        background-color: #f3f3f3;
        position: relative;
    }
    .board__pic img{width: 100%;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
    .board__with__banner .board__with__pic .board__content{
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        font-size: 14px;
        color: #666;
        padding-top: 10px;
        height: 77.5px;
        line-height: 1.5em;
    }
    .board__with__banner .board__with__pic .board__desc{
        display: flex;
        justify-content: space-between;
        font-size: 14px;
        line-height: 30px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .board__with__banner .board__with__pic .board__writer{color: #666;}
    .board__with__banner .board__with__pic .board__writer span{font-weight: 600;}
    .board__with__banner .board__with__pic .board__writer span b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
        outline: 1px solid #ccc;
        position: relative;
    }
    .board__with__banner .board__with__pic .board__writer span b img{
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .board__with__banner .board__with__pic .board__writer > b{font-weight: 400;margin-left: 10px;}
    .board__with__banner .board__with__pic .board__action{display: flex;}
    .board__with__banner .board__with__pic .board__action > span{margin-left: 20px;display: flex;justify-content: right;}
    
    .board__with__banner .board__with__pic .board__action span b{width: auto;font-weight: 400;}
    .board__with__banner .board__with__pic .board__action img{vertical-align: middle;margin-right: 5px;}
    .board__with__banner .banner__first, .board__with__banner .banner__second{
        width: 350px;
        height: 540px;
        overflow: hidden;
    }
    
    .board__type__only{padding-top: 20px;}
    .board__type__only .board__basic{display: flex;justify-content: space-between;padding-bottom: 50px;flex-wrap: wrap;}
    .board__type__only .board__basic > div{width: 650px;margin-bottom: 50px;}
    .board__type__only .board__basic h3{display: flex;justify-content: space-between;padding-bottom: 20px;}
    .board__type__only .board__basic h3 span{font-size: 18px;font-weight: 700;}
    .board__type__only .board__basic h3 a{color: #6d8ecd;font-size: 14px;font-weight: 600;}
    .board__type__only .board__basic ul{border-top: 1px solid #000;}
    .board__type__only .board__basic ul li{height: 70px;padding: 20px;border-bottom: 1px solid #ccc;}
    .board__type__only .board__basic h4{display: flex;justify-content: space-between;padding-bottom: 10px;}
    .board__type__only .board__basic h4 a{
        text-align: left;
        font-size: 20px;
        font-weight: 400;
        padding-right: 50px;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .board__type__only .board__basic h4 span{width: 24px;flex-shrink: 0;}
    .board__type__only .board__basic .board__desc{display: flex;justify-content: space-between;font-size: 14px;line-height: 30px;}
    .board__type__only .board__basic .board__writer{color: #666;}
    .board__type__only .board__basic .board__writer span{font-weight: 600;}
    .board__type__only .board__basic .board__writer span b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
        outline: 1px solid #ccc;
        position: relative;
    }
    .board__type__only .board__basic .board__writer span b img{
        height: 100%;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .board__type__only .board__basic .board__writer > b{font-weight: 400;margin-left: 10px;}
    .board__type__only .board__basic .board__action > span{margin-left: 10px;}
    .board__type__only .board__basic .board__action img{vertical-align: middle;margin-right: 5px;}

    .board__new .act__mark, .board__hot .act__mark,
    .board__classic .act__mark, .board__contemporary .act__mark{
        position: absolute;
        right: 40px;
        top: 240px;
    }

/* ########## 게시판 list css ######################## */
    .board__wrapper{
        max-width: 1360px;
        padding: 80px 0 200px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
    }
    .board__wrapper .board__inner{width: 100%;max-width: 950px;}
    .banner__area{
        width: 100%;
        max-width: 350px;
        padding-top: 70px;
    }
    .board__wrapper .board__banner__top, .board__wrapper .board__banner__bottom{
        width: 350px;
        height: 540px;
        overflow: hidden;
        margin-bottom: 50px;
    }
    .board__title{
        font-size: 36px;
        font-weight: 300;
        height: 45px;
        padding-bottom: 25px;
        text-align: left;
        display: flex;
        justify-content: space-between;
    }
    .board__title select{
        width: 120px;
        height: 40px;
        padding:0 20px;
        border: 1px solid #ccc;
        outline: none;
        border-radius: 6px;
        color: #666;
        -webkit-appearance: none;  /* 크롬 화살표 없애기 */
        -moz-appearance: none; /* 파이어폭스 화살표 없애기 */
        appearance: none;  /* 화살표 없애기 */
        background: url("../images/ico/icon_arrow_down.svg") no-repeat 85% 50%;
        vertical-align: middle;
        margin-right: 1px;
    }
    .board__list{
        list-style: none;
        padding: 0;
        border-top: 1px solid #000;
    }
    .board__list__item{
        padding: 22px 20px;
        border-bottom: 1px solid #ddd;
        position: relative;
    }
    .board__list__item > a{
        width: 100%;
        height: 100%;
        text-align: left;
        display: flex;
        gap: 20px;
    }
    .board__list__item > a .list__thumbnail{
        display: block;
        width: 178px;
        height: 128px;
        max-width: 178px;
        max-height: 128px;
        overflow: hidden;
        flex-shrink: 0;
        background-color: #f3f3f3;
        position: relative;
    }
    .board__list__item a .list__thumbnail img{width: 100%;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
    .list__desc{width: calc(100% - 215px);}
    .list__desc .list__title{
        display: block;
        padding-right: 50px;
        font-size: 20px;
        padding-bottom: 10px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .list__desc .list_content{
        display: block;
        font-size: 14px;
        color: #666;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        height: 40px;
        line-height: 1.5em;
        margin-bottom: 20px;
    }
    .list__desc .board__list__writer{
        font-weight: 600;
        color: #666;
        font-size: 14px;
    }
    .list__desc .board__list__writer b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
        outline: 1px solid #ccc;
        position: relative;
    }
    .list__desc .board__list__writer b img{
        height: 100%;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .list__desc .board__list__date{font-size: 14px;color: #666;margin-left: 10px;}
    .list__actions img{vertical-align: middle;margin-right: 10px;}
    .list__mark{position: absolute;right: 10px;top: 22px;cursor: pointer;}
    .list__like{position: absolute;right: 90px;bottom: 25px;}
    .list__reply{position: absolute;right: 20px;bottom: 25px;}

    .board__bottom{width: 100%;position: relative;margin-top: 25px;}
    .board__toolbar{
        position: absolute;
        right: 0;
        top: 0;
    }
    .board__toolbar a{
        display: inline-block;
        width: 140px;
        height: 60px;
        line-height: 60px;
        text-align: center;
        border-radius: 10px;
        background-color: #8171B9;
        color: #fff;
    }
    .search__form__div{width: 100%;height: 60px;padding-top: 50px;position: relative;}
    .search__form__div form{position: relative;text-align: center;}
    .search__form__div input{
        width: 350px;
        height: 58px;
        border: 1px solid #ccc;
        border-radius: 10px 0 0 10px;
        text-indent: 20px;
        font-size: 16px;
        outline: none;
        vertical-align: middle;
        margin-left: 100px;
    }
    .search__form__div button{
        width: 100px;
        height: 60px;
        border: none;
        background-color: #777;
        color: #fff;
        border-radius: 0 10px 10px 0;
        font-size: 16px;
        cursor: pointer;
        vertical-align: middle;
        margin-left: -5px;
    }
    /* paging */
    .paging__area{display: flex;justify-content: center;gap: 35px;padding: 20px 150px;}
    .paging__area ul{display: flex;justify-content: center;gap: 30px;}
    .paging__area ul li a{font-size: 18px;font-weight: 600;color: #ccc;}
    .paging__area ul li.active a{color: #638FD2;font-weight: 700;}
    .paging__area .move__area{width: 50px;display: flex;justify-content: space-between;}
    .paging__area .move__area img{vertical-align: middle;}

/* ########## 게시판 view css ######################## */
    .board__view{
        list-style: none;
        padding: 0;
        border-top: 1px solid #000;
    }
    .view__header{
        border-bottom: 1px solid #ccc;
        padding: 30px 20px;
    }
    .view__header .view__title{
        padding-right: 50px;
        font-size: 30px;
        font-weight: 600;
        line-height: 1.5em;
        word-break: keep-all;
    }
    .view__header .view__action{flex-shrink: 0; vertical-align: middle;}
    .view__header__desc{display: flex;justify-content: space-between;}
    .view__header .board__title{padding-bottom: 15px;height: auto;}
    .board__info .board__list__writer{
        font-weight: 600;
        color: #666;
        font-size: 14px;
    }
    .board__info .board__list__writer b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
        outline: 1px solid #ccc;
        position: relative;
    }
    .board__info .board__list__writer b img{
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .board__info .board__list__date{font-size: 14px;color: #666;margin-left: 10px;}
    .board__etc span{margin-left: 10px;font-size: 14px;}
    .board__etc img{vertical-align: middle;margin-right: 5px;}
    .board__view .board__content{padding: 40px 20px 100px;}
    .board__view .board__content .file__section{padding-bottom: 20px;}
    .board__view .board__content .view__content{font-size: 16px;color: #666;line-height: 1.5em;}
    .post__video { margin: 16px 0; }
    .post__video iframe { border-radius: 8px; }
    .board__view .board__comments{
        padding: 30px;
        background-color: #f2f3f5;
        border-radius: 10px;
        position: relative;
    }
    .board__view .board__comments .view__comment__form{position: relative;}
    .board__view .board__comments .view__comment__form textarea{
        width: calc(100% - 120px);
        height: 120px;
        border: none;
        border-radius: 8px;
        background-color: #fff;
        padding: 20px 100px 20px 20px;
        resize: none;
        outline: none;
    }
    .board__view .board__comments .view__comment__form button{
        width: 72px;
        height: 34px;
        background-color: #638fd2;
        color: #fff;
        font-size: 12px;
        font-weight: 600;
        text-align: center;
        line-height: 34px;
        border-radius: 999px;
        position: absolute;
        right: 20px;
        bottom: 20px;
        border: none;
        cursor: pointer;
    }
    .board__view .board__comments .comment__list{display: none;}
    .board__view .board__comments .comment__list .comment__item{
        border-bottom: 1px solid #ccc;
        padding: 30px 0;
    }
    .board__view .board__comments .comment__list .comment__item strong{
        font-weight: 600;
        color: #666;
        font-size: 14px;
    }
    .board__view .board__comments .comment__list .comment__item strong b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
    }
    .board__view .board__comments .comment__list .comment__item strong b img{width: 100%;}
    .board__view .board__comments .comment__list .comment__item span{font-size: 14px;color: #666;margin-left: 10px;}
    .board__view .board__comments .comment__list .comment__item .comment__delete{
        font-size: 12px;
        cursor: pointer;
        color: #fff !important;
        background-color: #d26393;
        border-radius: 999px;
        padding: 3px 10px;
    }
    .board__view .board__comments .comment__list .comment__item div{
        padding-top: 20px;
        max-height: 130px;
        padding-bottom: 20px;
        font-size: 14px;
        color: #666;
        line-height: 1.5em;
        position: relative;
        transition: all 0.5s ease;
        overflow: hidden;
    }
    .board__view .board__comments .comment__list .comment__item div.expanded{
        max-height: none;
        transition: all 0.5s ease;
    }
    .comment__more{
        display: block;
        text-align: right;
        margin-top: 5px;
        color: #555;
        cursor: pointer;
        font-size: 0.9rem;
        padding: 10px 10px 0 0 !important;
        font-weight: 700;
        color: #ff8787 !important;
    }
    .board__view .board__comments .reply__more{
        display: inline-block;
        font-size: 12px;
        font-weight: 600;
        text-align: center;
        width: 100px;
        height: 34px;
        line-height: 34px;
        border: 1px solid #000;
        border-radius: 999px;
        position: absolute;
        left: 50%;
        bottom: 50px;
        transform: translateX(-50%);
        cursor: pointer;
    }
    .board__view .board__comments .reply__more img{vertical-align: middle;margin-left: 5px;}
    .board__view .board__footer{padding: 30px 0 100px;display: flex;justify-content: space-between;}
    .board__view .board__footer form{display: inline-block;}
    .board__view .board__footer a, .board__view .board__footer button{
        display: inline-block;
        width: 140px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        text-align: center;
        font-weight: 600;
        border-radius: 10px;
        border: none;
        cursor: pointer;
    }
    .board__view .board__comments .comment__list li:nth-child(n+4){display: none;}
    .share__btn{cursor: pointer;}
    
/* ########## 게시판 write & edit css ######################## */
    .write__form{border-top: 1px solid #111;padding: 25px 20px;}
    .write__form .form__group label{display: block;font-size: 14px;font-weight: 600;padding-bottom: 10px;}
    .write__form .form__group input[type="text"]{
        width: calc(100% - 40px);
        height: 50px;
        line-height: 50px;
        padding: 0 20px;
        border-radius: 8px;
        border: 1px solid #ccc;
        font-size: 14px;
        outline: none;
    }
    .write__form .form__group textarea{
        width: calc(100% - 40px);
        height: 400px;
        line-height: 1.5em;
        padding: 20px;
        border-radius: 8px;
        border: 1px solid #ccc;
        outline: none;
        resize: none;
        font-size: 14px;
    }
    .origin__files ul li label{display: inline !important;margin-left: 20px;cursor: pointer;color: #d26393;}
    .origin__files ul li label input{vertical-align: middle;margin-right: 5px;}
    .write__inner .board__footer{margin-top: 25px;padding: 30px 0 100px;border-top: 1px solid #ccc;display: flex;justify-content: space-between;}
    .write__inner .board__footer a, .write__inner .board__footer button{
        display: inline-block;
        width: 140px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        text-align: center;
        font-weight: 600;
        border-radius: 10px;
        outline: none;
        border: none;
        cursor: pointer;
    }

/* ########### new & hot topic 게시물 css ################# */
    .board__nh .board__list{border: none;display: flex;justify-content: left;flex-wrap: wrap;gap: 17.5px;}
    .board__nh .board__list li{width: 305px;padding: 0;border: none;margin-bottom: 32.5px;}
    .board__nh .board__list li a{display: block;width: 100%;height: auto;}
    .board__nh .board__list li a .list__thumbnail{
        display: block;
        width: 100%;
        max-width: 100%;
        max-height: 192px;
        height: 192px;
        overflow: hidden;
    }
    .board__nh .board__list__writer{
        font-weight: 600;
        color: #666;
        font-size: 14px;
    }
    .board__nh .board__list__writer b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
    }
    .board__nh .board__list__writer b img{width: 100%;}
    .board__nh .board__list__date{font-size: 14px;color: #666;margin-left: 10px;}
    .no__img{width: auto !important;}
    .nh__cate{
        margin-top: 20px;
        margin-bottom: 10px;
        padding: 5px 10px;
        border: 1px solid #8171b9;
        border-radius: 999px;
        color: #8171b9;
        display: inline-block;
        font-size: 12px;
        font-weight: 600;
    }
    .nh__title{
        display: block;
        font-size: 20px;
        font-weight: 400;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding-bottom: 20px;
    }


/* ########### 로그인 css ################ */
    .login__wrapper{padding-bottom: 200px;}
    .login__header{padding-top: 120px;}
    .login__header .login__logo{margin: 0 auto;text-align: center;padding-bottom: 45px;}
    .login__header .login__title{text-align: center;}
    .login__header .login__title h3{font-size: 36px;font-weight: 300;padding-bottom: 20px;}
    .login__header .login__title p{font-size: 20px;color: #666;line-height: 1.5em;}
    .login__form{width: 100%;max-width: 520px;margin: 0 auto;padding-top: 80px;}
    .login__form .login__form__group{position: relative;}
    .login__form .login__form__group label{display: block;font-size: 14px;font-weight: 600;padding-bottom: 10px;}
    .login__form .login__form__group input{
        width: calc(100% - 40px);
        padding: 0 20px;
        height: 50px;
        line-height: 50px;
        margin-bottom: 25px;
        border: 1px solid #ccc;
        border-radius: 8px;
        outline: none;
        font-size: 14px;
    }
    .login__form .login__form__group input[readonly]{
        background-color: #f2f3f5;
        font-weight: 700;
        color: #999;
    }
    .login__form .login__form__group input::placeholder{
        font-size: 14px;
        color: #aaa;
    }

    .login__form .btn__primary{
        width: 100%;
        height: 60px;
        line-height: 60px;
        border-radius: 10px;
        background-color: #8171b9;
        color: #fff;
        font-size: 16px;
        font-weight: 400;
        border: none;
        margin-top: 20px;
        cursor: pointer;
    }
    .login__form .login__other{font-size: 14px;display: flex;justify-content: space-between;}
    .login__form .login__other input{vertical-align: middle;width: 18px;height: 18px;margin-right: 5px;border: 1px solid #ccc;accent-color: #8171b9;}
    .login__link{text-align: center;font-size: 14px;margin-top: 15px;font-weight: 500;}
    .login__link a{color: #d26393;margin-left: 5px;text-decoration: underline;}

/* ########### 회원가입 css ################ */
    .register__wrapper{padding-bottom: 200px;}
    .resister__header{padding-top: 120px;}
    .resister__header .register__logo{margin: 0 auto;text-align: center;padding-bottom: 45px;}
    .resister__header .register__title{text-align: center;}
    .resister__header .register__title h3{font-size: 36px;font-weight: 300;padding-bottom: 20px;}
    .resister__header .register__title p{font-size: 20px;color: #666;line-height: 1.5em;}
    .register__form{width: 100%;max-width: 520px;margin: 0 auto;padding-top: 80px;}
    .register__form .register__form__group{position: relative;}
    .register__form .register__form__group label{display: block;font-size: 14px;font-weight: 600;padding-bottom: 10px;}
    .register__form .register__form__group input{
        width: calc(100% - 40px);
        padding: 0 20px;
        height: 50px;
        line-height: 50px;
        margin-bottom: 25px;
        border: 1px solid #ccc;
        border-radius: 8px;
        outline: none;
        font-size: 14px;
    }
    .register__form .register__form__group input::placeholder{
        font-size: 14px;
        color: #aaa;
    }
    .register__form .register__form__group span{font-size: 14px;color: #666;position: absolute;right: 0;top: 0;}
    .register__form ul li{
        height: 50px;
        line-height: 50px;
        margin-bottom: 10px;
        padding:0 20px;
        border: 1px solid #ccc;
        border-radius: 8px;
        position: relative;
    }
    .register__form ul li input{vertical-align: middle;border: 1px solid #ccc;accent-color: #8171b9;margin-right: 5px;width: 18px;height: 18px;}
    .register__form ul li span{font-size: 14px;letter-spacing: -1px;}
    .register__form ul li b{color: #d26393;margin-right: 5px;font-weight: 600;}
    .register__form ul li a{position: absolute;right: 20px;top: 0;}
    .register__form ul li a img{transform: rotateZ(-90deg);vertical-align: middle;}
    .register__form .btn__primary{
        width: 100%;
        height: 60px;
        line-height: 60px;
        border-radius: 10px;
        background-color: #8171b9;
        color: #fff;
        font-size: 16px;
        font-weight: 400;
        border: none;
        margin-top: 20px;
        cursor: pointer;
    }
    .register__link{text-align: center;font-size: 14px;margin-top: 15px;font-weight: 500;}
    .register__link a{color: #d26393;margin-left: 5px;text-decoration: underline;}
    .sns__login{
        max-width: 520px;
        width: 100%;
        height: 160px;
        background-color: #f2f3f5;
        border-radius: 10px;
        margin: 50px auto 0;
        text-align: center;
    }
    .sns__login p{font-size: 14px;color: #666;padding:35px 0 15px;}
    .sns__login ul{display: flex;justify-content: center;gap: 15px;}
    .sns__login ul li{border-radius: 999px;overflow: hidden;}
    .register__btns{
        display: flex;
        justify-content: center;
        padding: 80px 0 200px;
        gap: 10px;
    }
    .register__btns li{
        width: 255px;
        height: 60px;
        border-radius: 10px;
        overflow: hidden;
    }
    .register__btns li a{
        display: block;
        width: 100%;
        height: 100%;
        line-height: 60px;
        text-align: center;
        color: #fff;
        font-weight: 600;
    }
    .register__btns .btn__primary{background-color: #8171b9;}

/* ############# ID / PASSWORD 찾기 ###################*/
    .find__tab{width: 100%;max-width: 520px;margin: 0 auto;padding-top: 60px;display: flex;}
    .find__tab li{width: 50%;text-align: center;}
    .find__tab li a{
        display: block;
        width: 100%;
        height: 61px;
        line-height: 60px;
        font-size: 18px;
        color: #666;
        border-bottom: 1px solid #ddd;
    }
    .find__tab li.tab__sct a{height: 60px;color: #8171b9;border-bottom: 2px solid #8171b9;}
    .find__form{width: 100%;max-width: 520px;margin: 0 auto;padding-top: 40px;padding-bottom: 200px;}
    .find__what{width: 100%;padding-bottom: 30px;}
    .find__what li{display: flex;padding: 25px;background-color: #f2f3f5;border-radius: 10px;margin-bottom: 10px;}
    .find__what li input{accent-color: #8171b9;width: 15px;height: 15px;flex-shrink: 0;margin-top: 2px;margin-right: 10px;}
    .find__what li label{cursor: pointer;}
    .find__what li label b{display: inline-block;width: 100%;font-size: 15px;font-weight: 600;padding-bottom: 5px;}
    .find__what li label span{font-size: 13px;color: #666;}
    .find__form{width: 100%;max-width: 520px;margin: 0 auto;padding-top: 80px;}
    .find__form .find__form__group{position: relative;}
    .find__form .find__form__group label{display: block;font-size: 14px;font-weight: 600;padding-bottom: 10px;}
    .find__form .find__form__group input{
        width: calc(100% - 40px);
        padding: 0 20px;
        height: 50px;
        line-height: 50px;
        margin-bottom: 25px;
        border: 1px solid #ccc;
        border-radius: 8px;
        outline: none;
        font-size: 14px;
    }
    .find__form .find__form__group input::placeholder{
        font-size: 14px;
        color: #aaa;
    }
    .last__form__group{padding-bottom: 15px;border-bottom: 1px solid #ccc;}
    .btn__find{
        margin-top: 30px;
        background-color: #333;
        width: 100%;
        height: 60px;
        border-radius: 10px;
        overflow: hidden;
        line-height: 60px;
        text-align: center;
        color: #fff;
        font-weight: 600;
        font-size: 16px;
        border: none;
        cursor: pointer;
    }

/* ########### ID 찾기 결과 css ########################## */
    .find__id__result{
        width: 440px;
        margin: 60px auto 30px;
        text-align: center;
        background-color: #F2F3F5;
        border-radius: 10px;
        padding: 50px 40px;
    }
    .find__id__result span{font-size: 14px;font-weight: 600;color: #666;}
    .find__id__result div{
        width: 100%;
        margin-top: 30px;
        padding: 25px 0;
        background-color: #fff;
        border-radius: 10px;
        font-size: 20px;
        font-weight: 600;
        color: #8171B9;
    }
    .result__btns{display: flex;justify-content: center;gap: 10px;padding-bottom: 200px;}
    .result__btns a{
        display: block;
        width: 255px;
        height: 60px;
        line-height: 60px;
        border-radius: 10px;
        margin-top: 0 !important;
        font-weight: 600;
        color: #fff;
        text-align: center;
    }
    .result__btns .btn__primary{background-color: #8171B9;}
    .result__btns .btn__find{background-color: #333;}


/* ########### 비밀번호 변경 css ########################## */
    .change__form{padding-bottom: 200px;}
    .change__form .btn__primary{margin-top: 40px !important;}


/* ############## 공통 css ################# */
    .act__heart{cursor: pointer;}
    .act__mark{cursor: pointer;}
    .margin_t25{margin-top: 25px;}
    .board__view .like__count{margin-left: 0 !important;}
    .btn__list{background-color: #333;}
    .btn__edit{background-color: #638fd2;}
    .btn__delete{background-color: #d26393;}
    .btn__submit{background-color: #8171b9;}
    .important__color{color: #ff3636 !important;}
    .alert__error{font-size: 20px;padding: 20px;color: #f00;text-align: center;}
    .alert__message{
        font-size: 20px;
        padding: 20px 50px;
        color: #fff;
        background-color: #bb3c3c;
        text-align: center;
        width: fit-content;
        margin: 50px auto 0;
    }

/* ################### 검색 페이지 ############################ */
    .search__container{width: 100%;min-height: 700px;}
    .search__inner{
        width: 100%;
        height: 100%;
        min-height: 700px;
        text-align: center;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
    .search__inner h2{font-size: 36px;font-weight: 300;padding-bottom: 40px;}
    .search__inner .search__form{width: 100%;}
    .search__inner .search__form form{display: inline-block;position: relative;}
    .search__inner .search__form form input{
        width: 570px;
        height: 60px;
        line-height: 60px;
        padding-right: 80px;
        text-indent: 20px;
        border: 2px solid #8171B9;
        border-radius: 8px;
        font-size: 16px;
        outline: none;
    }
    .search__inner .search__form form input::placeholder{color: #aaa;}
    .search__inner .search__form form button{
        position: absolute;
        right: 15px;
        top: 17px;
        background: none;
        border: none;
        outline: none;
        cursor: pointer;
    }
    .search__inner ul{margin-top: 20px;display: flex;gap: 5px;width: 650px;flex-wrap: wrap;}
    .search__inner ul li{
        font-size: 12px;
        font-weight: 600;
        background-color: #f2f3f5;
        color: #111;
        padding: 6px 12px;
        border-radius: 999px;
        cursor: pointer;
    }
    .search__inner ul li img{margin-left: 5px;display: none;}
    .search__inner ul li.search__sct{background-color: #8171B9;color: #fff;}
    .search__inner ul li.search__sct img{display: inline;}

/* ########### 검색결과 페이지 ##################### */
    .search__result__inner{min-height: 350px;}
    .search__result__lists{width: 650px;margin: 0 auto;padding-bottom: 200px;}
    .search__result__lists .search__result__group{padding-bottom: 50px;}
    .search__result__lists h3{display: flex;justify-content: space-between;padding-bottom: 20px;}
    .search__result__lists h3 span{font-size: 18px;font-weight: 700;}
    .search__result__lists h3 a{color: #6d8ecd;font-size: 14px;font-weight: 600; padding-right:0 !important;}
    .search__result__lists ul{border-top: 1px solid #000;}
    .search__result__lists ul li{height: 70px;padding: 20px;border-bottom: 1px solid #ccc;}
    .search__result__lists h4{display: flex;justify-content: space-between;padding-bottom: 10px;}
    .search__result__lists a{
        text-align: left;
        font-size: 20px;
        font-weight: 400;
        padding-right: 50px;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .search__result__lists h4 span{width: 24px;flex-shrink: 0;}
    .search__result__lists .board__desc{display: flex;justify-content: space-between;font-size: 14px;line-height: 30px;}
    .search__result__lists .board__writer{color: #666;}
    .search__result__lists .board__writer span{font-weight: 600;}
    .search__result__lists .board__writer span b{
        vertical-align: middle;
        margin-right: 10px;
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 999px;
        overflow: hidden;
        outline: 1px solid #ccc;
        position: relative;
    }
    .search__result__lists .board__writer span b img{
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .search__result__lists .board__writer > b{font-weight: 400;margin-left: 10px;}
    .search__result__lists .board__action > span{margin-left: 10px;}
    .search__result__lists .board__action img{vertical-align: middle;margin-right: 5px;}


/* ############ 이용약관 / 개인정보처리방침 ###################### */
    .policy__wrap{padding-top: 120px;max-width: 520px;margin: 0 auto;padding-bottom: 120px;}
    .policy__wrap .register__logo{text-align: center;}
    .policy__tab{width: 100%;display: flex;gap: 10px;justify-content: space-between;padding-top: 30px;}
    .policy__tab li{width: 50%;height: 40px;line-height: 40px;background-color: #e1e1e1;text-align: center;border-radius: 5px;}
    .policy__tab li a{display: block;width: 100%;height: 100%;font-weight: 600;}
    .policy__tab li.policy__tab__sct{background-color: #638FD2;}
    .policy__tab li.policy__tab__sct a{color: #fff;}
    .policy__inner{margin-top: 50px;padding: 30px;border: 1px solid #aaa;word-break: keep-all;border-radius: 5px;}

    /* #################### 프로필 사진 페이지 ######################### */
    .prifile__wrap{text-align: center;padding-top: 150px;padding-bottom: 300px;}
    .prifile__wrap h2{padding-bottom: 50px;font-size: 30px;}
    .prifile__wrap .profile__box input{width: 300px;display: block;margin: 50px auto;}
    .prifile__wrap .profile__box button{
        width: 200px;
        height: 60px;
        font-size: 16px;
        border: none;
        background-color: #638fd2;
        color: #fff;
        cursor: pointer;
        box-shadow: 2px 2px 2px #ccc;
    }
    .prifile__wrap .profile__box .delete__btn{
        background-color: #d26393;
    }

@media (max-width: 1920px) {
    .full__main__cate{padding-top: 150px;}
    .full__close img{width: 50px;height: 50px;}
    .full__main__cate li a{font-size: 24px;}
    .full__sub__cate > li h3 a{font-size: 24px;}
    .full__sub__cate {padding-top: 50px;}
}























