@charset "utf-8";

/******************** main_visual ********************/
/* main_visual */
#main_visual {
    position:relative;
    height:980px;
    background:url("../image/main/visual01.jpg") center top no-repeat; 
    background-size: cover;
}
/* main_text */
.main_text {
    position:absolute;
    top:210px;
    left:50%;
    transform: translate(-50%, 0);
    width:max-content;
    z-index:100;
    display: flex;
    flex-direction: column;
    text-align: center;
}
.main_text p {
    color:#fff;
    font-size:32px;
    text-shadow: 5px 5px 5px rgba(0,0,0,0.3);
}
.main_text p:first-child {
    font-size: 68px;
    letter-spacing: -2.5px;
    line-height: 1;
    font-family: 'PyeongChangPeace-Light';
}
.main_text span.line {
    width:40px;
    height:2px;
    margin: 30px auto;
    background-color: #fff;
}
.main_text p span.date {
    margin-left: 0;
    font-size: 24px;
}
.main_text p strong {
    font-family: 'PyeongChang-Bold';
}
.main_text p span {
    margin-left: 10px;
    font-size: 28px;
}

/** 가로 1920px **/
@media screen and (max-width:1920px) {
    #main_visual .swiper-slide  {
        width:auto;
        height:auto;
    }
} 


/******************** main_contents ********************/
/***** main_layout *****/
#main_contents {position:relative; z-index:200; width:100%; min-width:1280px; background:#f7f7f7; text-align:center;}

.main-sect {
    position:relative;
    padding:110px 0;
}
.main-sect.bg01 {
    background: #02040f url(../image/main/national_heritage_bg.jpg) center top no-repeat;
    background-size: cover;
}
.main-sect.bg02 {
    background: #02040f url(../image/main/stamp_bg.jpg) center top no-repeat;
    background-size: cover;
}
.main-sect.bg {
    background-color: #f1f4f7;
}
.main-sect .tit {
    position: relative;
    margin-bottom:60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap:40px;
}
.main-sect .tit h2 {
    display: flex;
    gap:20px;
    justify-content: center;
    align-items: center;
    font-size:48px;
    color:#000;
    line-height: 1;
}
.main-sect .tit p {
    text-align: center;
}
.main-sect .more {
    display:flex;
    align-items: center;
    overflow:hidden;
    color:#1d1d1d;
    font-size: 0;
}
.main-sect .more i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    font-size: 17px;
    border:1px solid #000;
    border-radius: 100%;
    color: #000;
}

.main-sect .more02 {
    display: flex;
    gap: 100px;
    justify-content: center;    
    align-items: center;
    overflow: hidden;
    width: fit-content;
    padding:16px 20px;
    color: #000000;
    border:1px solid #343434;
    border-radius: 8px;
    transition: 0.3s;
}
.main-sect .more02:hover {
    background-color: #3c68be;
    border-color: #3c68be;
    color:#fff;
    transition: 0.3s;
}


.main_national_heritage .tit h2, .main_stamp .tit h2 {
    color: #fff;
}
/***** 국가유산정보 *****/
.main_national_heritage {
    position: relative;
    background-size: cover;
    color: #fff;
}
.main_national_heritage ul {
    display: flex;
    gap:60px;
}
.main_national_heritage ul li {
    flex:1;
    overflow: hidden;
}
.main_national_heritage ul li a {
    display: block;
    position: relative;
}
.main_national_heritage ul li:first-child {
    margin-top:135px;
}
.main_national_heritage ul li:last-child {
    margin-top:220px;
}
.main_national_heritage ul li .pic {
    overflow: hidden;
    position: relative;
    height:380px;
    margin-bottom:30px;
    background-color: #fff;
    border-radius: 24px;
    line-height: 0;
    display: flex;
    justify-content: center;
    border:4px solid #02040f;
    transition: 0.3s;

}
.main_national_heritage ul li .pic:hover {
    border-color: #fff;
    transition: 0.3s;

}
.main_national_heritage ul li .pic img {
    height:100%;
}
.main_national_heritage ul li:nth-child(3) .pic {
    background-color: #000;
}
.main_national_heritage ul li:nth-child(3) .pic img {
    width:100%;
    height:fit-content;
}

.main_national_heritage ul li .pic img {
    height:100%;
    transition: 0.3s;
}
.main_national_heritage ul li .pic:hover img {
    opacity: 0.75;
    transition: 0.3s;
}

.main_national_heritage ul li h3 {
    padding:0 20px;
    font-size: 24px;
}
.main_national_heritage ul li p {
    margin-top:10px;
    padding:0 20px;
    text-align: justify;
    color:#ccc;
}
/***** 게시판영역 *****/
.main_board {
    position:relative;
    display:flex;
    flex-direction: column;
    gap:90px;
}
/* 공지사항 */
.main_notice {
    position: relative;
}
.main_notice .tit h2 {
    letter-spacing: 0;
}
.main_notice .board_list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap:32px;
}
.main_notice .board_list li {
    background-color: #f6f6f6;
    border-radius: 24px;
    transition: 0.3s;
}
.main_notice .board_list li a {
    display: block;
    padding:40px 30px;
}
.main_notice .board_list li span {
    display: block;
}
.main_notice .board_list li .date {
    padding-bottom:10px;
    font-size: 15px;
    letter-spacing: 0;
}
.main_notice .board_list li .subject {
    padding-bottom:30px;
    font-size: 23px;
    font-weight: 600;
    color:#000;
}
.main_notice .board_list li .comment {
    font-size: 16px;
    text-align: justify;
}
.main_notice .board_list li:hover {
    background-color: #fff;
    box-shadow: 10px 10px 20px rgba(0,0,0,0.15);
    transition: 0.3s;
}
.main_notice .board_list li:hover .subject {
    color:#3c68be;
    transition: 0.3s;
}
.main_notice .board_list li:hover .date, .main_notice .board_list li:hover .comment {
    color:#000;
    transition: 0.3s;
}


/***** 홍보영상-행사소개 *****/
.main_video {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.main_video .tit {
    align-items: flex-start;
    gap:30px;
}
.main_video .tit p {
    color: #000;
    line-height: 1;
}
.main_video .tit p span {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width:62px;
    height:1px;
    margin-left:10px;
    background-color: #353a3f;
}
.main_video .tit p span::after{
    content: '';
    position: absolute;
    right: -14px;
    top: -3px;
    width:6px;
    height:6px;
    border-radius: 100%;
    margin-left:8px;
    background-color: #6e8cc4;
}
.main_video p span {
    display: block;
}
.video_frame {
    width:640px;
    flex-shrink: 0;
    overflow: hidden;
    height: 424px;
    background-color: #081223;
    border-radius: 24px;
    box-shadow: 15px 15px 40px rgba(8, 18, 35, 0.4);
    line-height: 0;
}



/***** 전시작품소개 *****/
.main_exhibition {
    
}
.main_exhibition .tit {
    z-index: 2;
}
.main_exhibition ul {
    z-index: 2;
    position: relative;
    padding-top:80px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap:24px;
}
.main_exhibition ul li {
    overflow: hidden;
    position: relative;
    
    border-radius: 24px;
}
.main_exhibition ul li a {
    height:410px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #667bad;
}


.main_exhibition ul li img {
    height:100%;
    transition: 0.3s;
}
.main_exhibition ul li p {
    position: absolute;
    left:40px;
    top:40px;
    font-family: 'PyeongChang-Bold';
    font-size: 24px;
    color:#fff;
}
.main_exhibition ul li a:hover img {
    opacity: 0.1;
    transition: 0.3s;
}
.main_exhibition_bg {
    position: absolute;
    z-index: 1;
    top: 283px;
    right: 0;
    width: 75%;
    height: 65%;
    background: #f5f6f8;
}
/***** 스탬프 투어 *****/
.main_stamp {
    color: #fff;
}
.main_stamp .tit p {
    font-size: 19px;
}
.stamp_txt {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 70px;
}
.stamp_txt > li {
    width: 304px;
    height: auto;
    padding: 21px 0;
    border-radius: 50px;
    font-family: 'PyeongChang-Bold';
    font-size: 25px;
    display: flex;
    justify-content: center;
    text-align: center;
}
.stamp_txt > li:nth-child(n+2) {
    margin-left: -50px;
}
.stamp_txt > li:nth-child(1) {
    background: #fff;
    color:#216dca;
}
.stamp_txt > li:nth-child(2) {
    background: rgba(107, 119, 231, 0.83);
    /* mix-blend-mode: multiply; */
}
.stamp_list {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 10px 25px;
    width:80%;
    margin: 0 auto;
}
.stamp_list img {
    width:100%;
}
.stamp_list li:nth-child(4) img, .stamp_list li:nth-child(6) img, .stamp_list li:nth-child(11) img, .stamp_list li:nth-child(12) img, .stamp_list li:nth-child(15) img, .stamp_list li:nth-child(16) img {
    mix-blend-mode: luminosity;

}
/***** 관련배너 *****/
.main_banner {
    padding:40px 0;
}
.main_banner ul {
    display: flex;
    justify-content: center;
    gap:120px;
}
.main_banner ul li {
    line-height: 0;
}