@charset "UTF-8";

#header .header_wrap { background-color: rgba(255, 255, 255, 1); position:fixed; left: 0; top: 0; z-index: 14; width: 100%; text-align: center; transition: top 0.3s; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }

.section_title          { max-width: 100%; width: 100%; background-color: #eef7ff; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title1_1          { max-width: 100%; width: 100%; background-color: #fffbf2; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title1_2          { max-width: 100%; width: 100%; background-color: #f8fae4; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title1_3          { max-width: 100%; width: 100%; background-color: #f8f6e7; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title2_1          { max-width: 100%; width: 100%; background-color: #edecec; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title2_2          { max-width: 100%; width: 100%; background-color: #eef7ff; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.section_title2_3          { max-width: 100%; width: 100%; background-color: #e6f4f1; margin-top: 214px; box-sizing: border-box; padding: 0 28px; margin-left: auto; margin-right: auto;}
.title_inner            { max-width: 1216px; width: 100%; margin: 0 auto; position: relative;}

.title_name             { display: flex; position: absolute; top: -18px; left: 0;}
.section_title1_1 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #c0b69a; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title1_1 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #c0b69a; color: #c0b69a; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title1_2 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #c0b69a; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title1_2 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #c0b69a; color: #c0b69a; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title1_3 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #c0b69a; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title1_3 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #c0b69a; color: #c0b69a; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}

.section_title2_1 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #37a0cc; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title2_1 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #37a0cc; color: #37a0cc; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title2_2 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #37a0cc; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title2_2 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #37a0cc; color: #37a0cc; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title2_3 > .title_inner > .title_name > .name1  { width: 150px; height: 36px; border-radius: 50px; background-color: #37a0cc; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.section_title2_3 > .title_inner > .title_name > .name2  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #37a0cc; color: #37a0cc; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}

.title                  { padding-top: 75px;}
.title h2               { font-size: 40px; font-weight: bold; line-height: 1.5;}
.title .line            { width: 100%; background-color: #ccc; height: 1px; margin: 40px 0;}
.title p                { font-size: 20px; padding-bottom: 60px;}
.title p small          { color: #686868;}
.title p sup , .title p small sup      { vertical-align: text-top;}

/* 박물관은지금 */
.center_txt_1_3             { text-align: center; font-weight: bold; margin-bottom: 20px;}

/* 소장품이야기 */
.box_1_3_1               {max-width: 860px; width: auto; background-color: #f8f6e6; padding: 30px; font-style: italic; text-align: center; font-size: 20px; margin: 50px auto; font-weight: 200;}
.box_1_3_2               {max-width: 860px; width: auto; background-color: #f8f6e6; padding: 30px; font-style: italic; font-weight: 200; font-size: 20px; margin: 50px auto;}

/* 반갑습니다 */
.center_txt             { font-size: 30px; text-align: center; font-weight:bold; color: #666; text-decoration-line: underline; text-underline-offset: 8px;}
.txt_title2_1   p       { font-size: 26px; font-weight: bold;}
.author                 { font-size: 18px; color: #666; text-align: right;}

/* 참여행사1,2 */
.section_title_cham1          { max-width: 100%; width: 100%; background-color: #eef7ff; margin-top: 214px; box-sizing: border-box; background: url(/webzine/202602/img/sub/sub_3_1_head_img.png) no-repeat; background-size: cover; background-position: center; height: 375px; padding: 0 28px;}
.title_inner_cham1            { max-width: 1216px; width: 100%; margin: 0 auto; position: relative;}

.title_name_cham1             { display: flex; position: absolute; top: -18px; left: 0;}
.name1_cham1                  { width: 150px; height: 36px; border-radius: 50px; background-color: #649c59; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.name2_cham1                  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #649c59; color: #649c59; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}

.title_cham1                  { padding: 126px 28px 0;}
.title_cham1 h2               { font-size: 36px; font-weight: bold; line-height: 1.5;}
.cham01                       { max-width: 700px; max-height: 125px; width: auto; height: auto; margin: 0 auto; border: 7px solid #649c59; border-radius: 70px; text-align: center; font-size: 50px; font-weight: bold; line-height: 2.2;}

.section_title_cham2          { max-width: 100%; width: 100%; background-color: #eef7ff; margin-top: 214px; box-sizing: border-box; background: url(/webzine/202602/img/sub/sub_3_2_head_img.png) no-repeat; background-size: cover; background-position: center; height: 375px; padding: 0 28px;}
.title_inner_cham2            { max-width: 1216px; width: 100%; margin: 0 auto; position: relative;}

.title_name_cham2             { display: flex; position: absolute; top: -18px; left: 0;}
.name1_cham2                  { width: 150px; height: 36px; border-radius: 50px; background-color: #649c59; color: #fff; text-align: center; font-size: 20px; font-weight: 400; line-height: 1.8;}
.name2_cham2                  { width: 148px; height: 34px; border-radius: 50px; border: 1px solid #649c59; color: #649c59; background-color: #fff; text-align: center;  font-size: 20px; font-weight: 400; line-height: 1.8;}

.title_cham2                  { padding: 126px 28px 0;}
.title_cham2 h2               { font-size: 36px; font-weight: bold; line-height: 1.5;}
.cham02                       { max-width: 700px; max-height: 125px; width: auto; height: auto; margin: 0 auto; border: 7px solid #b19622; border-radius: 70px; text-align: center; font-size: 50px; font-weight: bold; line-height: 2.2;}

.txt_cham01                     { text-align: center;}
.txt_cham01 p                   { font-size: 16px;}

.notice                         { max-width: 506px; margin: 0 auto; width: auto; margin-bottom: 20px;}
.notice ul li                   { font-size: 20px;}

/* 참여행사1,2 끝*/

.section_txt            { max-width: 1216px; width: 100%; margin: 0 auto; margin-top: 60px; box-sizing: border-box; padding: 0 28px;}
.txt_title              { border-bottom: 1px solid #ccc; padding-bottom: 20px;}
.txt_title p            { font-size: 26px; font-weight: bold;}

.txt_box                { padding-top: 40px;}
.img_box                { text-align: center; margin: 0 auto;}
.img_inner              { display: flex; justify-content: center; gap: 26px;}

.img_box_2_and_1        { text-align: center; display: flex; justify-content: center; gap: 26px;}

.img_single             { text-align: center; margin: 0 auto;}
.caption                { font-size: 16px; font-weight: 400; color: #565656; margin-top: 15px;}

.mt80                   { margin-top: 80px;}
.mt40                   { margin-top: 40px;}
.mt20                   { margin-top: 20px;}
.mb80                   { margin-bottom: 80px;}
.mb60                   { margin-bottom: 60px;}
.mb50                   { margin-bottom: 50px;}
.mb40                   { margin-bottom: 40px;}
.mb20                   { margin-bottom: 20px;}
.wd80                   { width: 80%;}
.wd60                   { width: 60%;}
.wd50                   { width: 50%;}
.wd_img                 { width: 80%;}

.txt                    { font-size: 22px;}

.moreNews                   { max-width: 100%; width: 100%; background-color: #fffdf7; border-top: 1px solid #ccc; box-sizing: border-box; padding: 0 28px;}
.moreNews_inner             { max-width: 1216px; width: 100%; margin: 0 auto;}
.moreNews_inner h2          { font-size: 30px; font-weight: bold; padding: 60px 0 40px;}
.moreNews_list              { display: flex; gap: 98px; justify-content: center; padding-bottom: 60px;}
.moreNews_list a            { max-width: 230px; width: 100%;}
.moreNews_list a li p:first-child       { font-size: 16px; font-weight: 600;  border-bottom: 1px solid #000; padding-bottom: 10px; background: url(/webzine/202602/img/common/moreNews.png) no-repeat; background-position: right 10px; transition: all 0.5s;}
.moreNews_list a li p:last-child        { font-size: 16px; font-weight: 400;}
.moreNews_list a:hover li p:first-child { color: #37a0cc; transition: all 0.5s;}
.moreNews_list a:hover li p:last-child  { color: #37a0cc; transition: all 0.5s;}

.footer                      { max-width: 100%; width: auto; border-top: 1px solid #ccc; padding: 0 28px;}
.footer_inner               { max-width: 1216px; width: 100%; margin: 60px auto; padding-bottom: 40px;}

.sns_group                  { width: 220px;}
.sns                        { width: auto; float: left;}

.footer_link                { display: flex; margin-left: 6px; float: left;}
.link_1                     { display: flex; align-items: center; justify-content: space-evenly; background-color: black; color: #fff; width: 150px; height: 38px; border-radius: 20px; font-size: 16px;}
.link_2                     { display: flex; align-items: center; justify-content: space-evenly; background-color: #fff; color: #000; width: 148px; height: 36px; border-radius: 20px; border: 1px solid #000; cursor: pointer; margin-left: 10px; font-size: 16px;}

address                     { float: right;}
address p                   { font-size: 14px; font-weight: 300;}
address p:last-child        { letter-spacing: -0.04em;}

/* 셀렉트 전체 래퍼 */
.issue-select {
    position: relative;
    width: auto;
    display: inline-block;
    margin-left: 10px;
}

/* "웹진 지난호 보기" 버튼 */
.issue-select-btn {
    font-weight: 400;
    font-size: 16px;
    padding-left: 20px;
    border: 1px solid #000;
    border-radius: 30px;
    background-color: #fff;
    cursor: pointer;
    position: relative;
    width: 130px;
    height: 38px;
    display: flex;
    align-items: center;
}

/* 셀렉트 아이콘 */
.issue-select-btn::after {
    content: '';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: rotate(-180deg) translateY(50%);
    width: 24px;
    height: 24px;
    background-image: url(/webzine/202602/img/common/icon_arrow_down.svg);
    background-repeat: no-repeat;
    background-size: 24px 24px;
    transition: transform 0.25s ease;
}

/* 리스트 */
.issue-select-list {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    z-index: 20;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 30px;
    background-color: #fff;
    padding: 10px 0;
    overflow: overlay;
    box-shadow: 0 6px 18px rgba(0,0,0,0.1);
    max-height: 175px;
}

/* 리스트 보이기 */
.issue-select.open .issue-select-list {
    display: block;
}

/* 리스트 내 항목 */
.issue-select-list li {
    padding: 12px 32px;
}
.issue-select-list li a {
    font-size: 1.125rem;
    font-weight: 400;
    color: #222;
    display: block;
    text-align: center;
}
.issue-select-list li:hover {
    background-color: #f5f5f5;
}

/* 아이콘 회전 */
.issue-select.open .issue-select-btn::after {
    transform: translateY(-50%) rotate(0deg);
}




@media (max-width: 960px) {
    .pc     { display: none !important;}
    .mob    { display: block !important;}

    /* 슬라이드 이미지 */
.imgBox { width: 100% ; height: auto; position: relative; isolation: isolate; background-color: #fff; --bar-h: 36px; box-sizing: border-box;}

/* slick 레이어 안정화 */
.imgBox .slick-list{ overflow: hidden; position: relative; z-index: 1;}
.imgBox .slick-track{ position: relative; z-index: 1;}
.imgBox .slick-slide{ position: relative; z-index: 1;}
/* 초기화 전: 숨김(레이아웃은 유지해서 덜 흔들림) */
.imgBox.jsMainSlick{ opacity: 0; visibility: hidden;}
/* 초기화 후: 노출 */
.imgBox.jsMainSlick.is-ready{ opacity: 1; visibility: visible; transition: opacity .15s ease;}

.imgBox .imgSlide{  display: flex; flex-direction: column;}
.imgBox .imgSlide > div{ aspect-ratio: 746 / 430;}
.imgBox .imgSlide img{ width: 100%; height: 100%; object-fit: contain; display: block; margin: 0 auto;}
/*.imgBox .imgSlide > span{ font-size: 16px;  margin-top: 14px; height: var(--bar-h); line-height: var(--bar-h); display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 190px; box-sizing: border-box;}*/

.imgBox .captionBar{ height: var(--bar-h); display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-direction: column;}
.imgBox .captionText{ flex: 1; min-width: 0; font-size: 16px; line-height: 1.2; white-space: nowrap; overflow: clip; text-overflow: ellipsis; text-align: center;}

/* 컨트롤 */
.imgBox .img_btn{ position: static !important; 
    transform: none !important; right: 0; bottom: 0; transform: translateY(0);   margin: 0; width: 160px; height: var(--bar-h); z-index: 10; border-radius: 50px; background-color: #c3c3c3; color: #fff; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 4px 16px; box-sizing: border-box; pointer-events: auto;}

/* pager*/
.imgBox .img_btn .pager{ display: flex; align-items: center; gap: 8px;}
/* 버튼 reset */
.imgBox .img_btn button{ background: transparent; border: 0; color: inherit; padding: 0; cursor: pointer; line-height: 1;}
/* prev/next */
.imgBox .img_btn .btn_prev,
.imgBox .img_btn .btn_next{ font-size: 20px;}/* 숫자 */
.imgBox .img_btn .count{ margin: 0; display: flex; align-items: center; gap: 4px; font-size: 20px; line-height: 1;}
.imgBox .img_btn .count .total{ opacity: .9;}
/* stick(재생/멈춤) */
.imgBox .img_btn .stick{ width: 24px; height: 22px; display: flex; align-items: center; justify-content: center; gap: 8px; /* || 간격 */}
/* || 막대 */
.imgBox .img_btn .stick span{ display: block; width: 4px; height: 22px; background-color: #fff;}
/* ▶ 상태 */
.imgBox .img_btn .stick.is-paused span{ display:none; }
.imgBox .img_btn .stick.is-paused::before{ content:""; display:block; width:0; height:0; border-top:8px solid transparent; border-bottom:8px solid transparent; border-left:14px solid #fff; margin-left:4px;}
/* 1개면 비활성 */
.imgBox .img_btn.is-single{ opacity: .35; pointer-events: none;}

    .section_title                          { margin-top: 143px;}
    .section_title, .section_txt, .moreNews, .footer         { padding: 0 28px;}
    .section_title1_1, .section_title1_2, .section_title1_3, .section_title2_1, .section_title2_2, .section_title2_3 { padding: 0 28px; margin-top: 143px;}
    .title                                  { padding-top: 40px;}
    .title h2                               { font-size: 22px;}
    .title p                                { font-size: 16px;}

    .txt_box                                {padding-top: 30px;}

    .txt_title p                            { font-size: 20px;}

    .img_box_2_and_1                        { display: block;}
    .img_box_2_and_1 div:last-child         { margin-top: 20px;}

    .title_name             { top: -12px;}
    .title_name_cham1       { top: -12px;}

    .section_title1_1 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title1_1 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}
    .section_title1_2 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title1_2 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}
    .section_title1_3 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title1_3 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}

    .section_title2_1 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title2_1 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}
    .section_title2_2 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title2_2 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}
    .section_title2_3 > .title_inner > .title_name > .name1         { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title2_3 > .title_inner > .title_name > .name2         { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}

    .section_title_cham1 > .title_inner_cham1 > .title_name_cham1 > .name1_cham1    { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title_cham1 > .title_inner_cham1 > .title_name_cham1 > .name2_cham1    { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}
    .section_title_cham2 > .title_inner_cham2 > .title_name_cham2 > .name1_cham2    { width: 96px; height: 26px; font-size: 13px; line-height: 2;}
    .section_title_cham2 > .title_inner_cham2 > .title_name_cham2 > .name2_cham2    { width: 94px; height: 24px; font-size: 13px; line-height: 1.9;}

    .section_title_cham1    { background: url(/webzine/202602/img/sub/sub_3_1_head_img_m.png) no-repeat; background-position: center;}
    .section_title_cham2    { background: url(/webzine/202602/img/sub/sub_3_2_head_img_m.png) no-repeat; background-position: center;}

    /* 소장품이야기 */
    .center_txt_1_3                         { font-size: 18px;}

    /* 소장품이야기 */
    .box_1_3_1                              { font-size: 16px; max-width: 234px;}
    .box_1_3_2                              { font-size: 16px; max-width: 234px;}

    /* 참여하기1,2*/
    .txt_title2_1   p                       { font-size: 22px;}
    .center_txt                             { font-size: 26px;}

    .section_title_cham1                    { margin-top: 143px; height: 170px; padding: 0 26px;}
    .cham01                                 { font-size: 26px; border: 3px solid #649c59; max-width: 340px;}
    .title_cham1                            { padding: 60px 28px 0;}

    .section_title_cham2                    { margin-top: 143px; height: 170px; padding: 0 26px;}
    .cham02                                 { font-size: 26px; border: 3px solid #b19622; max-width: 340px;}
    .title_cham2                            { padding: 60px 28px 0;}

    .notice ul li                           { font-size: 16px;}
    .txt_cham01                             { font-size: 18px;}
    .txt_cham01 p                           { font-size: 14px;}

    .img_inner                              { display: block;}
    .img_inner div                          { margin-bottom: 20px;}
    .img_inner div:last-child               { margin-bottom: 10px;}

    .caption                                { font-size: 15px; margin-top: 10px;}

    .txt                                    { font-size: 18px;}
    .mb50                                   { margin-bottom: 30px;}
    .mt80                                   { margin-top: 50px;}

    .moreNews_list                          { gap: 36px; flex-wrap: wrap;}
    .moreNews_list a                        { max-width: 196px;}

    .sns a                                  { margin-right: 0;}
    .footer_inner                           { position: relative; padding-bottom: 100px; margin: 127px auto 60px;}
    
    .wd55                                   { max-width: 55% !important;}
    .wd70                                   { width: 70% !important;}
    .wd80                                   { width: 100% !important;}
    .wd60                                   { width: 100% !important;}
    .wd50                                   { width: 100% !important;}
    .wd_img                                 { width: 70%;}

}

@media (max-width:920px) {
    .footer_link                            { display: block; margin-left: 0; float: right; position: absolute; top: -47px; right: 0;}
    .issue-select                           { margin-left: 0; margin-top: 10px;}
    address                                 { float: left; margin-left: 20px;}
}

@media (max-width:584px) {
    address             { margin-top: 20px; margin-left: 0px;}
}

@media (max-width:480px) {
    .moreNews_list      { display: grid; grid-template-columns: repeat(2, 160px);}

    .txt_cham01 p       { font-size: 12px;}
    .txt_cham02 p       { font-size: 12px;}
    .notice ul li       { font-size: 13px;}

    .sns a img          { width: 18%;}
    address p           { font-size: 13px;}
    .link_1             { width: 146px; height: 36px; font-size: 14px;}
    .issue-select-btn   { width: 126px; height: 34px; font-size: 14px;}

    .imgBox .captionBar { flex-direction: column;}
    .imgBox .img_btn { width: 36%; padding: 4px 8px;}
    .imgBox .img_btn .btn_next{ font-size: 14px;}
    .imgBox .img_btn .count     { font-size: 14px;}
    .imgBox .img_btn .pager     { gap: 4px;}
    .cham01, .cham02    {font-size: 22px;}

    .section_title_cham1    { background: url(/webzine/202602/img/sub/sub_3_1_head_img_m2.png) no-repeat; background-position: center;}
    .section_title_cham2    { background: url(/webzine/202602/img/sub/sub_3_2_head_img_m2.png) no-repeat; background-position: center;}
}

@media (max-width: 370px){
    address p   {font-size: 12px;}
    .moreNews_list  {grid-template-columns: repeat(2, 138px);}
}