@charset "utf-8";

/* mixin */
@import "../mixin/ui-mixin";

/* ******************** component ******************** */

/* input */
@import "../component/input-style";

/* 컨텐츠 공용 타이틀 */
@import "../component/title-style";

/* input */
@import "../component/check-style";

/* input */
@import "../component/board";

/* ******************** main ******************** */

/* top banner / user area */
@import "./_banner-user";

/* quick button area */
@import "./_quick-button";

/* 띠배너 area */
@import "./_strip-banner";

/* calendar area */
@import "./_calendar";

/* 사업공지, 입찰게시판 */
@import "./_board-list";

/* 사업공지, 입찰게시판 */
@import "./_education-list";

/* 공용장비 리스트 */
@import "./_equ-list";

/* slick slide */
@import "./_slick";

/* FULL banner */
@import "./_full-banner";

/* 기술현황 */
@import "./_tech-market";

/* 기술현황 */
@import "./_sanhak-news";

/* 언론보도, 뉴스레터 */
@import "./_media";

/* 산단 패밀리 사이트 (협업) */
@import "./_family-site";

/* 보유 기술 소개 */
@import "./_good-tech";

.sec-width {
    width: 1380px;
    max-width: 100%;
    padding: 0 15px;
}

/* main section */
.body-container {
    > .section {
        margin: 70px auto;
    }
}

/* more button */
.com-title {
    .tit {
        padding-left: 0 !important;
        font-family: "paperlogy";
        font-size: 2.6rem;
        font-weight: 800;
        &:before {
            display: none !important;
        }
    }
    .more-btn {
        position: absolute;
        bottom: 5px;
        right: 0;
        font-size: 1.2rem;
        font-weight: 900;
        color: #777;
        cursor: pointer;
        img {
            display: inline-block;
            width: 20px;
            height: 20px;
        }
        .more-txt {
            display: inline-block;
        }
        &:hover {
            .more-txt {
                text-decoration: underline;
            }
        }
    }
}

/* navigate button */
.navigate-arrow {
    button {
        position: relative;
        top: -5px;
        float: left;
        width: 35px;
        height: 25px;
        background: #eceeef;
        border: 1px solid var(--line-color);
        img {
            width: 16px;
            height: 16px;
            opacity: 0.6;
        }
        &.prev {
            border-radius: 30px 0 0 30px;
            border-right: 0;
            img {
                transform: rotate(180deg);
            }
        }
        &.next {
            border-radius: 0 30px 30px 0;
        }
        &:hover {
            background: #e5e6e7;
            img {
                opacity: 1;
            }
        }
    }
}

@media (max-width: 1200px) {
    .com-title {
        margin-bottom: 15px;
        .tit {
            font-size: 2.2rem;
        }
        .more-btn {
            img {
                width: 18px;
                height: 18px;
            }
        }
    }
    .body-container {
        > .section {
            margin: 50px auto;
        }
    }
}

@media (max-width: 550px) {
    .com-title {
        margin-bottom: 10px;
        .tit {
            font-size: 1.8rem;
        }
        .more-btn {
            img {
                width: 16px;
                height: 16px;
            }
        }
    }
}
