.bg_spin{ position: fixed; left: 50%; top: 50%; z-index: 0; transform: translate(-50%,0) rotate(0); margin-left: 800px; width: 380px; display: none}

@media (max-width: 2000px){
	.bg_spin{ left: auto; right: -15vw; margin-left: 50%; width: 45vw; max-width: 380px}
}
@media (max-width: 1200px){
	.bg_spin{ right: -20vw;}
}
@media (max-width: 800px){
	.bg_spin{ right: -25vw;}
}

.main_sec{ padding: 80px 0; z-index: 2; position: relative;}
.main .sec_tit{ font-size: 3.5rem; color: #131313; font-family: "NotoSans_b", "Malgun Gothic", sans-serif; display: flex; flex-wrap: wrap; align-items: center}
.main .sec_tit .more{ margin-left: 45px; position: relative; top: -0.1em}
.main_sec .sec_tit{ margin-bottom: 50px}
.main_sec .slick-disabled{ opacity: 0.5}
.main_sec .slick-prev,
.main_sec .slick-next{ width: 70px; height: 70px; position: absolute; top: -118px; cursor: pointer;}
.main_sec .slick-prev{ right: 69px; background: #fff url("/img/main/arrow_big.png") no-repeat center; transform: rotate(-180deg)}
.main_sec .slick-next{ right: 0; background: #fff url("/img/main/arrow_big.png") no-repeat center}
@media (max-width: 800px){
    .main .sec_tit .more{ margin-left: 15px}
    .main .sec_tit{ margin-bottom: 110px}
    .main_sec .slick-prev,
    .main_sec .slick-next{ top: -90px}
}
/* visual wrap start */
.visual_wrap{ position: relative; z-index: 3}
.visual_wrap .visual_slide_item{ width: 100%; height: calc(100vh - 145px); min-height: 800px; background-position: center; background-repeat: no-repeat; background-size: cover}

.visual_control_bg{
    width: 110px;
    height: 50px;
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
    border-radius: 0 25px 25px 0;
    margin-left: 55px;
}
.visual_wrap .visual_slide_list .slick-dots{
    width: 110px;
    height: 50px;
    color: #fff;
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
    margin-left: -55px;
    background: rgba(0, 0, 0, 0.65);
    border-radius: 25px 0 0 25px;

}
.visual_wrap .visual_slide_list .slick-dots li{
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.125rem;
    opacity: 0
}
.visual_wrap .visual_slide_list .slick-dots li.slick-active{
    opacity: 1
}
.visual_wrap .visual_slide_list .slick-dots .count{
    margin-right: 10px
}
.visual_wrap .visual_slide_list .slick-dots .total{
    color: #999;
    margin-left: 10px
}
.visual_wrap .aro1_prev,
.visual_wrap .aro1_next{
    width: 10px;
    height: 50px;
    overflow: hidden;
    color: transparent;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 40px;
    cursor: pointer;
}
.visual_wrap .aro1_prev{ margin-left: 25px; background: url("/img/common_renew/arrow_calendar_prev.png") no-repeat center / auto 13px}
.visual_wrap .aro1_next{ margin-left: 75px; background: url("/img/common_renew/arrow_calendar_next.png") no-repeat center / auto 13px}
.visual_slide_controls{
    width: 20px;
    height: 50px;
    overflow: hidden;
    color: transparent;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 40px;
    margin-left: 50px
}
.visual_slide_controls button{ cursor: pointer; height: 100%}
.visual_slide_controls .pause{ background: url("/img/main/ic_visual_stop_w.png") no-repeat center;}
.visual_slide_controls .play{ display: none; background: url("/img/main/ic_visual_start_w.png") no-repeat center;}

.visual_txt_wrap{ width: 100%; height: auto; position: absolute; left: 0; top: 0; z-index: 9990; background: #fff; box-shadow: 1px 1px 10px rgba(0,0,0,0.6)}
.visual_txt_con{ display: none}
.visual_txt_wrap .inner{ height: 100%; padding: 0; position: relative}
.visual_txt_wrap .sec_tit{ margin-bottom: 40px; padding-right: 0}

.main_info_trigger{width: 50px;height: 40px;border-radius: 0 0 15px 15px;background: #fff url("/img/common_renew/arrow_trigger_down.png") no-repeat center;position: absolute;left: 15px;bottom: -40px;box-shadow: 3px 3px 3px rgba(0,0,0,0.2)}

.main_info_item{ font-size: 1.063rem; margin-bottom: 25px; max-width: 1100px; position: relative}
.main_info_item:last-child{ margin-bottom: 0}
.main_info_item.paju{ padding-top: 25px; border-top: solid 1px #dfdfdf}
.main_info_item .slash{ margin: 0 10px}
.main_info_item .list_tit{ font-size: 1.250rem; display: inline-block; width: 75px}
.main_info_item .fee{ width: 125px; height: 35px; line-height: 35px; border-radius: 20px; text-align: center; border: solid 1px #131313;  display: inline-block; margin-right: 25px}
.main_info_item .go_to_page{ display: inline-block; width: 33px; height: 33px; background: url("/img/common_renew/ic_go_to_page.png") no-repeat center; margin-left: 15px}
.main_info_item a{ position: relative}

.en .main_info_item .list_tit{ width: 105px}
.en .main_info_item .fee{ width: 180px}
.en .main_info_item .list_txt,
.en .main_info_item a { width: 100%}

.visual_txt_wrap.active .visual_txt_con{ display: block;}
.visual_txt_wrap.active .inner{ padding: 30px 15px;}
.visual_txt_wrap.active .main_info_trigger{ background: #fff url("/img/common_renew/arrow_trigger_up.png") no-repeat center}

@media (min-width: 1024px){
    .main_info_item a:focus .fee,
    .main_info_item a:hover .fee{ background: #15576e; color: #fff; border: none}
    .main_info_item a:focus .go_to_page,
    .main_info_item a:hover .go_to_page{ background: url("/img/common_renew/ic_go_to_page_active.png") no-repeat center;}
}
@media (max-width: 1024px){
    .visual_wrap .visual_slide_item{ height: calc(100vh - 80px); min-height: 480px;}
    .visual_txt_wrap .spin_txt{ right: -150px; display: none}

    .main_info_item .list_tit,
    .main_info_item .list_txt{ width: 100%}
    .main_info_item .slash{ display: none}

    .main_info_item .list_tit{ margin-bottom: 50px}
    .main_info_item .fee{ position: absolute; left: 0; top: -42px}
    .main_info_item .go_to_page{ position: absolute; left: 120px; top: -41px}

    .en .main_info_item .go_to_page{ left: 175px}
}
/* visual wrap end */

/* museum info start*/
.museum_info_wrap{ font-size: 1.250rem; padding: 20px; box-shadow: 1px 1px 7px rgba(0,0,0,0.17)}
.museum_info_wrap .left,
.museum_info_wrap .right{ width: 180px}
.museum_info_wrap .info{ width: calc(100% - 360px); color: #333}

.museum_info_wrap .left img{ margin-right: 15px}
.museum_info_wrap .right .btn{ font-size: 1.188rem; width: 100%; height: 50px; line-height: 50px; border: solid 1px #333; color: #333; text-align: center}
.museum_info_wrap .right .btn img{ margin-left: 10px; position: relative; top: -2px}
@media (max-width: 800px){
    .museum_info_wrap .left,
    .museum_info_wrap .right,
    .museum_info_wrap .info{ width: 100%; margin: 5px 0}
}
/* museum info end*/


.contents_wrap{ width: 100%; height: auto; clear: both}
.main .contents_wrap .contents{ padding: 80px 0; z-index: 2; position: relative; overflow: hidden;}
.contents_wrap .slide_wrap img{ width: 100%}

@media (max-width: 800px){
    .contents_wrap .contents{ padding: 4rem 15px}
}
/*contents01 start*/
/*.contents01 .tit_wrap{ width: 25%}*/
/*.contents01 .con_tit{ width: 100%; font-size: 3.250rem; margin-bottom: 40px;}*/
/*.contents01 .slide_wrap{ width: 75%}*/
/*.contents01 .slide_wrap .slick-list{ width: calc(100% + 60px); margin-left: -30px}*/
/*.contents01 .slide_wrap .slide_item{ padding: 0 30px}*/
/*.contents01 .slide_wrap .img_wrap{ border: solid 1px #dfdfdf; margin-bottom: 25px}*/
/*.contents01 .slide_wrap .date{ letter-spacing: -1px; font-size: 1.125rem; margin-bottom: 5px}*/
/*.contents01 .slide_wrap .tit{ font-size: 1.250rem; height: 3em; line-height: +1.5em; margin-bottom: 5px; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient:vertical; display: -webkit-box; position: relative; -webkit-line-clamp:2}*/
/*.contents01 .slide_wrap .info{ font-size: 1.125rem; color: #666}*/
/*.contents01 .slick-prev,*/
/*.contents01 .slick-next{ width: 70px; height: 70px; cursor: pointer; border: solid 1px #666; position: absolute; left: -33.3333%; bottom: 0; background: url("/img/common/ic_arrow_s.png") no-repeat center}*/
/*.contents01 .slick-prev{ transform: rotate(-180deg)}*/
/*.contents01 .slick-next{ margin-left: 80px}*/
/*@media (max-width: 1024px){*/
/*    .contents01 .tit_wrap,*/
/*    .contents01 .slide_wrap{ width: 100%}*/
/*    .contents01 .tit_wrap{ display: flex; justify-content: space-between; margin-bottom: 30px}*/
/*    .contents01 .con_tit{ font-size: 3rem; margin: 0}*/

/*    .contents01 .slide_wrap{ padding-bottom: 65px}*/
/*    .contents01 .slide_wrap .slick-list{ width: 100%; margin-left: 0}*/
/*    .contents01 .slide_wrap .slide_item{ padding: 0 10px}*/

/*    .contents01 .slick-prev,*/
/*    .contents01 .slick-next{ width: 50px; height: 50px; left: auto; right: 0; bottom: -65px}*/
/*    .contents01 .slick-prev{ margin-right: 60px}*/
/*    .contents01 .slick-next{ margin-left: 0}*/
/*}*/
/*@media (max-width: 500px){*/
/*    .contents01 .slide_wrap .slick-list{ margin-left: -36%; overflow: visible}*/
/*}*/
.main_exhibition_slide .slick-track{ display: flex}
.main_exhibition_slide .slick-list{ margin: 0 -20px; padding-bottom: 2px; overflow: visible}
.main_exhibition_slide .main_exhibition_item{ margin: 0 20px;}
.main_exhibition_item > a{ width: 100%; height: 100%}
.main_exhibition_item .img_wrap{ width: 100%; margin-bottom: 30px; border: solid 1px #e0e0e0; position: relative; padding-bottom: 130%}
.main_exhibition_item .img_wrap img{ width: 100%; max-width: 100%; max-height: 100%; position: absolute; left: 0; top: 0}
.main_exhibition_item .img_wrap .state{ width: auto; height: 40px; line-height: 40px; padding: 0 20px; position: absolute; left: 20px; top: 20px; z-index: 2; color: #131313; font-size: 1.250rem; font-family: "NotoSans_mb", "Malgun Gothic", sans-serif}
.main_exhibition_item .img_wrap .state.present{ background: rgba(205,225,232,0.9)}
.main_exhibition_item .img_wrap .state.last{ background: rgba(224,224,224,0.9)}
.main_exhibition_item .tit{ font-size: 1.375rem; height: 3em; color: #131313; font-family: "NotoSans_b", "Malgun Gothic", sans-serif; margin-bottom: 15px}
.main_exhibition_item .txt{ font-size: 1.125rem}
.main_exhibition_item .date{ margin-bottom: 5px}

@media (max-width: 1024px){
    .main_exhibition_slide .slick-list{ margin: 0 -5px}
    .main_exhibition_slide .main_exhibition_item{ margin: 0 5px}
    .main_exhibition_item .img_wrap{ margin-bottom: 15px}
    .main_exhibition_item .img_wrap .state{ left: 10px; top: 10px; height: 30px; line-height: 30px; font-size: 0.813rem; padding: 0 12px}
    .main_exhibition_item .tit{ font-size: 1.250rem; margin-bottom: 10px}
    .main_exhibition_item .txt{ font-size: 1rem}
    .main_exhibition_item .date{ margin-bottom: 0}
}
/*contents01 end*/

/*contents02 start*/
.contents02{ background: url("/site/english/images/main/bg_sec02.jpg") no-repeat center / cover; color: #fff; position: relative;}
.contents02 .inner{ z-index: 2}
.contents02.tab01:before,
.contents02:before{ content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url("/img/lang/main/img_exhibition_room01_bg.jpg?20240508") no-repeat center / cover; transition: background 0.5s; z-index: 1}
.contents02.tab02:before{ background: url("/img/lang/main/img_exhibition_room02_bg.jpg") no-repeat center / cover; transition: background 0.5s}
.contents02.tab03:before{ background: url("/img/lang/main/img_exhibition_room03_bg.jpg") no-repeat center / cover; transition: background 0.5s}
.contents02 .tab_menu{ display: flex; position: absolute; left: 0; top: 0; z-index: 2}
.contents02 .tab_link{ width: 175px; max-width: 33.3333%; height: 80px; line-height: +1.3; font-size: 1.5rem; opacity: 0.4; text-align: center}
.contents02 .tab_link.current{ opacity: 1; border-bottom: solid 5px #fff}
.contents02 .txt_wrap{ width: 40%; height: 100%; padding-right: 35px; padding-bottom: 30px; position: absolute; left: 0; top: 0; z-index: 1; display: flex; flex-wrap: wrap; align-content: flex-end}
.contents02 .txt_wrap .tit{ font-size: 2.625rem; margin-bottom: 40px}
.contents02 .txt_wrap .txt{ font-size: 1.250rem; margin-bottom: 30px}
.contents02 .txt_wrap .more{ font-size: 1.125rem}
.contents02 .txt_wrap .more img{ margin-left: 15px}
.contents02 .slide_wrap{ width: 140%; padding: 0 40%; z-index: 2}
.contents02 .slide_wrap .slide_item{ position: relative}
.contents02 .slide_wrap .slide_item:before{ content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.7); position: absolute; left: 0; top: 0}
.contents02 .slide_wrap .slide_item.slick-active:before{ display: none}
.contents02 .slick-list{ width: 200%; padding-right: 100%}
.contents02 .slick-prev,
.contents02 .slick-next{ width: 105px; height: 105px; cursor: pointer; border: solid 1px #fff; position: absolute; top: 50%; background: url("/img/common_renew/ic_arrow_w.png") no-repeat center; z-index: 999}
.contents02 .slick-prev{ transform: rotate(-180deg) translate(0, -50%); left: -160px; margin-top: -105px; margin-left: -66.666%}
.contents02 .slick-next{ right: -160px; transform: translate(0, -50%);}
@media (max-width: 1420px){
    .contents02 .tab_menu{ position: relative; width: 100%; justify-content: center; margin-bottom: 30px}
    .contents02 .txt_wrap{ padding-left: 15px}

    .contents02 .slick-prev{ left: 15px; top: 60px}
    .contents02 .slick-next{ right: auto; left: 125px; margin-left: -66.666%; top: 60px}
}
@media (max-width: 1024px){

    .contents02 .slick-prev,
    .contents02 .slick-next{ width: 50px; height: 50px; background-size: auto 60%; margin-left: 0; top: 50%; background-color: rgba(0,0,0,0.5)}
    .contents02 .slick-prev{ left: -5px; margin-top: -50px;}
    .contents02 .slick-next{ left: auto; right: -5px}

    .contents02 .txt_wrap{ padding-right: 15px; padding-bottom: 15px}
    .contents02 .txt_wrap .tit{ font-size: 2.250rem}
}
@media (max-width: 800px){
    .contents02 .tab_link{ font-size: 1.125rem; height: 60px}

    .contents02 .txt_wrap,
    .contents02 .slide_wrap{ width: 100%; padding: 0}
    .contents02 .slick-list{ width: 100%; padding-right: 0}

    .contents02 .txt_wrap{ position: relative; margin-bottom: 20px}
    .contents02 .txt_wrap .txt{ font-size: 1.125rem}
    .contents02 .txt_wrap .more{ font-size: 1rem}
}
/*contents02 end*/

/*contents03 start*/
.contents03 .left,
.contents03 .right{ width: 47%}
.main .bd_wrap{ position: relative;}
.main .bd_wrap .bd_tit{ font-size: 1.875rem; font-weight: bold; padding-bottom: 25px; border-bottom: solid 1px #000}
.main .bd_wrap .more{ position: absolute; right: 0; top: 0; height: 60px; padding-top: 8px}
.main .bd_list{ font-size: 1.125rem}
.main .bd_list .bd_item{ display: flex; flex-wrap: wrap; justify-content: space-between; padding: 20px 25px; border-bottom: solid 1px #dfdfdf;background: #fff}
.main .bd_list .bd_item:last-child{ border-bottom-color: #aeaeae}
.main .bd_list .tit{ width: calc(100% - 100px); color: #444}
.main .bd_list .tit a{ max-width: 100%; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient:vertical; display: -webkit-box; position: relative; -webkit-line-clamp:1}
.main .bd_list .tit a:hover{ text-decoration: underline; text-underline-position: under}
.main .bd_list .date{ color: #666; width: 100px; text-align: right}

.contents03 .right .bd_con{ width: 100%; height: 320px; margin-top: 20px; background: url("/site/english/images/main/img_map.jpg") no-repeat center / cover;}
@media (max-width: 1025px){
    .contents03 .left,
    .contents03 .right{ width: 100%}
    .contents03 .right{ margin-top: 50px}

    .contents03 .right .bd_con{ height: 45vw}
}
@media (max-width: 500px){
    .main .bd_list{ font-size: 1rem}
    .main .bd_list .bd_item{ padding: 15px}
}
/*contents03 end*/