@charset "utf-8";

/* content 페이지 공통 컬러 */
.cont_red {color: #A45B3C;}

/* icon_listA안에 txt-check쓸 경우 */
.bodo_icon_list > ul > li p.txt-check {color: #dc132c;}

/* 공통 */
.color-ORANGE {color:#D47B46;}
.color-YELLOW {color:#DFA150;}
.color-RED {color:#A45B3C;}
/* 공통 End */

/* sub01_01 박물관개관사 */
.s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__img {height:240px;}
.s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__img img {width:61%; height:100%;}
.s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__title{right:0; bottom:0;}
.s0101 .greeting-a .inner p {margin-bottom:30px;}
.s0101 div.text-center {padding:30px 0; font-size:20px; font-weight: 600;}
.s0101 div.text-center strong {display:block;}
.s0101 .imgbox2 {padding: 0px 0px 30px 0px;}
@media (max-width: 1023px){
    .s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__img img{left:35%;width:auto;}
}
@media (max-width: 767px){ 
    .s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__img {display:block;}
    .s0101 .greeting-a .inner .ui-greeting__box .ui-greeting__img img {top: auto; left: auto; width: 100%; transform: none;} 
}
@media (max-width: 500px){
    .s0101 div.text-center strong {font-size:18px;}
}
/* sub01_01 박물관개관사 End */

/* sub01_02 연혁 */
.timeline-f .timeline__body.s0102 {background: url(/images/sjnmuseum/sub01/sub01_02_img01.png)no-repeat 95% 50px;}
.timeline-f .timeline__body.s0102_02 {background: url(/images/sjnmuseum/sub01/sub01_02_img02.png)no-repeat 95% 50px;}
@media only screen and (max-width: 767px){
    .timeline-f .timeline__body.s0102, .timeline-f .timeline__body.s0102_02 {background:none;}
}
/* sub01_02 연혁 End */ 

/* sub01_05 관람안내 */
.s0105 .ui-topbox + p {margin:50px 0;}
/* sub01_05 관람안내 End */

/* sub01_07 석장리박물관 오시는길 */
.s0107 .direct-e__type .ui-row-list .item .mapinfo > div{padding:20px 20px 20px 220px;}
.s0107 .direct-e__type .ui-row-list .item .mapinfo > div strong em{display:block; font-size:14px; font-weight:600; color:#1d3770;}
.s0107 .direct-e__type .ui-row-list .item .mapinfo.s0107_02 > div {min-height: 85px;}
@media (max-width: 767px){
   .s0107 .direct-e__type .ui-row-list .item .mapinfo > div {padding:20px;}
}
/* sub01_07 석장리박물관 오시는길 End */

/* sub02_01 박물관전시안내 */
.s0201 > div.text-center img {width:100%;}
.s0201 .s0201_02 {position: relative;}
.s0201 .s0201_02 .btn {position: absolute; right:0; bottom:0; background:#cd3613; border-color: #cd3613;}
.s0201 .s0201_02 .btn-primary.focus, .s0201 .s0201_02 .btn-primary:focus, .s0201 .s0201_02 .btn-primary:hover {background-color: #fff; border-color: #48546d; color: #48546d;}
.s0201 .photo_wrap.typeC{display:none; margin-top:30px;}
.s0201 .photo_wrap.typeC .thumb2 ul li {width:100%; border:none; margin:0; padding-bottom:30px;}
.s0201 .photo_wrap.typeC .info_box2{padding: 30px;}
.s0201 .photo_wrap.typeC .info_box2 a.btn {float:right;}
.s0201 .photo_wrap.typeC .info_box2 strong {position:static; padding:7px 0; max-width:220px;}
.s0201 .photo_wrap.typeC .info_box2 p {margin:20px 0 0 0;}

.s0201 .map_place{padding:5% 0;border-bottom: 1px dashed #ddd;}
.s0201 .map_place .sub_tit{border:1px solid #ddd;display: table;margin:0 auto 30px;}
.s0201 .map_place .sub_tit span{display: table-cell;vertical-align: middle;padding:10px 25px; text-align: center;}
.s0201 .map_place ul:after{content:"";display: block;clear:both;visibility: hidden;}
.s0201 .map_place ul {margin-top:20px;}
.s0201 .map_place ul li {position: relative;float: left;width:16.6%;min-height: 31px;margin-bottom: 10px;padding-left: 45px;font-size: 15px;}
.s0201 .map_place ul li a{display: inline-block;}
.s0201 .map_place ul li span {display: inline-block;position: absolute;left: 0;top: -2px;width: 30px;height: 31px;margin-right: 15px;background: #cd3613;border-radius: 50%;font-size: 14px;color: #fff;text-align: center;line-height: 31px;font-weight:600;}
.s0201 .map_place ul li em {display:block;}
@media (max-width: 767px){
    .s0201 .photo_wrap.typeC .info_box2 {padding:20px;}
    .s0201 .map_place ul li {width:33.33%;}
}
@media (max-width: 640px){
    .s0201 .photo_wrap.typeC .info_box2 a.btn {display: block; float:none; margin: 0 0 10px 0;}
}
@media (max-width: 460px){
    .s0201 .map_place ul li {width:100%;} 
    .s0201 .map_place ul li em {display:inline;}
    .s0201 .s0201_02 .btn {position: relative; width:100%; text-align: left;}
}
/* sub02_01 박물관전시안내 ENd */

/* sub02_02 전시관안내, sub03_01_03 신생대 제4기 화석  */
.s0202 .photo_wrap.typeC .imgbox2 {padding-top: 0;}
@media(max-width: 768px) {
    .s0202 .photo_wrap.typeC .imgbox2 {padding: 0 0 20px;}
    .s0202 .photo_wrap.typeC .imgbox2 img {width: 100%; display: block;}
}
/* sub02_02 전시관안내, sub03_01_03 신생대 제4기 화석 End */

/* sub02_03_01 전시안내 */
.s020301 .conbox {width:100%; height:450px; margin:0 0 30px 0;}
.s020301 .left, .s020301 .right {float:left; width:50%; height:100%;} 
.s020301 .left img {height:100%;}
.s020301 .conbox .pic_btn {margin-bottom:10px;}
.s020301 .right ul {min-height: 450px; display: inline-block; padding: 60px 35px;; width: 100%; background: #f4f3f2;}
.s020301 .right ul li {line-height:2;} 
.s020301 .right ul li span {display:inline-block; width: 24px; height: 24px; margin-right: 13px; background: #000F29; border-radius: 50%; font-weight: bold; font-size: 14px; text-align: center; color: #fff; line-height: 24px; vertical-align: middle;}
.s020301 strong {font-size:20px;}
@media (max-width:767px){
    .s020301 .left img {width:100%;}
    .s020301 .conbox {height: 100%;}
    .s020301 .left, .s020301 .right {float:none; width:100%;} 
}
/* sub02_03_01 전시안내 End */

/* sub02_05_01 선사공원 */
.s020501 .photo_wrap .info_box2{overflow: hidden;}
.s020501 .photo_wrap.typeC .imgbox2 {padding-top: 0;}
.s020501 .photo_wrap .info_box2 strong em {font-size: 10px; vertical-align: middle; margin: 0 5px; margin-top: -4px; display: inline-block; color: #c4c4c4;}
.s020501 .photo_wrap .info_box2 .btn_box {text-align: right; margin-top: 20px;}
@media (max-width:768px) {
    .s020501 .photo_wrap.typeC .imgbox2 {padding: 0 0 20px;}
    .s020501 .photo_wrap.typeC .imgbox2 img {width: 100%; display: block;}
    .s020501 .photo_wrap .info_box2 .btn_box {text-align: center;}
}
/* sub02_05_01 선사공원 End */

/* sub03_01_02 시생대의 생물상 */
.s030102 .ui-photo-item {margin:10px 0 20px 0;}
.s030102 .ui-photo-item .figure {display:inline-block; width:35%; padding:0;}
.s030102 .ui-photo-item .figure .pic_btn a {font-size:15px;}
.s030102 .ui-photo-item .figcaption {display:inline-block; width: 65%; padding:0 0 0 2%;}
@media (max-width:767px){
    .s030102 .ui-photo-item .figure {width:100%;}
    .s030102 .ui-photo-item .figcaption {width: 100%; padding:0;}
}
/* sub03_01_02 시생대의 생물상 End */

/* sub03_03_02 구석기시대사람들의 생활상 */
.s030302 .imgbox2 img {width: 100%;}
.s030302 .photo_wrap2.typeD .thumb2 ul li {width:calc(33.33% - 20px);}
.s030302 .photo_wrap2.typeD .thumb2 ul li span {border: none; background: none;}
.s030302 .photo_wrap2.typeD .thumb2 ul li span img {width: 100%; display: block;}
@media(max-width:767px){
    .s030302 .imgbox2 {padding: 0;}
    .s030302 .photo_wrap2.typeD .thumb2 ul li {width: 100%;}
    .s030302 .photo_wrap2.typeD .thumb2 ul li span img {width: 50%; margin: 0 auto;}
    .s030102 .ui-photo-item .figure>img {width: auto;}
    .s030102 .ui-photo-item .figure {text-align: center;}
}
@media(max-width: 420px) {
    .s030302 .photo_wrap2.typeD .thumb2 ul li span img {width: 100%; padding: 10px;}
}
/* sub03_03_02 구석기시대사람들의 생활상 End*/

/* sub03_05_01 구석기 유적의 발굴 */
.s030102 .ui-photo-right .figcaption {padding: 0 2% 0 0;} 
@media (max-width:767px){
    .s030102 .ui-photo-right .figcaption {padding:0;} 
}
/* sub03_05_01 구석기 유적의 발굴 End */

/* sub03_02_01 인류의탄생 */
.s030201 .txt_wrap {margin-top: 10px;}
.s030201 .txt_wrap > div::after {display: block; content: ""; clear: both;}
.s030201 .txt_wrap > div .img_l {float: left; padding: 30px 18px 30px 0;} 
.s030201 .txt_wrap > div .img_l .pic_btn a {width: 90%;}
.s030201 .txt_wrap > div .txt_r {width: 98%; padding: 0;}
@media(max-width: 768px) {
    .s030201 .imgbox2 {padding: 20px 0 0;}
    .s030201 .imgbox2 img {width: 100%;}
}
@media(max-width:420px){
    .s030201 .txt_wrap {margin-top: 30px;}
    .s030201 .txt_wrap > div .img_l {float: none; width: 100%; display: block; padding: 5px;}
    .s030201 .txt_wrap > div .img_l img {width: 100%;}
    .s030201 .txt_wrap > div .img_l .pic_btn a {width: 100%;} 
    .s030201 .txt_wrap > div .txt_r {width: 100%;}
}
/* sub03_02_01 인류의탄생 End */

/* sub03_05_01, sub03_05_02 구석기 유적의 발굴, 신석기 유적의 발굴 */
.s030501 .txt_wrap {margin-top: 10px;}
.s030501 .txt_wrap > div {position: relative; padding: 0; margin: 0; width: 100%;}
.s030501 .txt_wrap > div::after {display: block; content: ""; clear: both;}
.s030501 .txt_wrap > div .img_l {float: left; padding: 0 18px 13px 0; display: inline;}
.s030501 .txt_wrap > div .txt_r {width: 98%; padding: 0;}

.s030501 .txt_wrap > div .img_r {float: right; padding: 0 10px 13px 18px; display: inline;}
.s030501 .txt_wrap > div .txt_l {width: 98%; padding: 0;}

@media(max-width: 420px){
    .s030501 .txt_wrap {margin-top: 30px;}
    .s030501 .txt_wrap > div .img_l {float: none; width: 100%; display: block; padding: 5px;}
    .s030501 .txt_wrap > div .img_l img {width: 100%;}
    .s030501 .txt_wrap > div .txt_r {width: 100%;}
} 
/* sub03_05_01, sub03_05_02 구석기 유적의 발굴, 신석기 유적의 발굴 End */


/* sub05_01_01 상설체험안내 */
.s050101 table .btn {width:100%; margin-bottom:5px; text-align: left;}
/* sub05_01_01 상설체험안내 End */



/* sub01_09 비전과 목표 */
.s0109 .ui-topbox.type2 .inner {background: #fff url(/images/sjnmuseum/sub01/s0109_titimg.png)no-repeat 95% 50%;}
.s0109 .ui-topbox.type2 .inner .color_yellow {color:#dfa150;}
.s0109 .ui-topbox.type2 .inner .color_brown {color:#a45b3c;}
@media (max-width:767px){
    .s0109 .ui-topbox.type2 .inner {background-position: 50% 90px;}
    .s0109 .ui-topbox.type2 .inner .txtwrap p {padding-top: 140px;}
}
/* sub01_09 비전과 목표 End */


/* sub02_06_01, sub02_06_02 온라인 전시 레이아웃 변경 */
.s0206 .vr_wrap {display: flex;}

/* sub050105 학교대상 프로그램 */
/* btn-wrap */
.btn-wrap.prog-btn{display: flex;flex-wrap: wrap;justify-content: space-between;}
.btn-wrap.prog-btn .btn{margin: 2.5px 5px 2.5px 0;}

@media(max-width: 430px){
    .btn-wrap.prog-btn {flex-direction: column;align-items: center;}
    .btn-wrap.prog-btn .btn{margin: 2.5px 0;}
    .btn-wrap.prog-btn .btn-left{display: flex;flex-direction: column;align-items: center;}
    .btn-wrap.prog-btn .btn-left , .btn-right{width: 100%;}
    .btn-wrap.prog-btn .btn-left > .btn, .btn-wrap .btn-right > .btn{width: 100%;}
}

.notice_box{background: url(/images/sjnmuseum/sub05/noticeBox_bg.png) no-repeat center / cover;margin-top: 30px;}
.notice_box .inner{padding: 60px 70px;}
.notice_box .inner .title{display: flex;align-items: center;color: #FFF;font-size: 28px;font-weight: 700;letter-spacing: -0.56px;padding-bottom: 20px;border-bottom: 1px dashed #fff;}
.notice_box .inner .title em{display: flex;justify-content: center;align-items: center;margin-left: 10px;background: #FFF;color: #956A49;font-size: 20px;font-weight: 700;letter-spacing: -0.4px;padding: 5px 10px;height: 34px;}
.notice_box .notice_list{margin-top: 20px;}
.notice_box .notice_list li{position: relative;color: #FFF;padding-left: 110px;font-size: 16px;}
.notice_box .notice_list li + li{margin-top: 5px;}
.notice_box .notice_list li span{padding-left: 25px;position: absolute;left: 0;top: 0;color: #FFF;font-size: 16px;font-weight: 700;letter-spacing: -0.32px;}
.notice_box .notice_list li em{position: absolute;content: '';left: 0;width: 22px;height: 22px;}
.notice_box .notice_list li em.ico01{top: 5px;background: url("data:image/svg+xml,%3Csvg width='19' height='22' viewBox='0 0 19 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.9286 5.50977H2.07141V14.4755H14.9286V5.50977Z' stroke='white' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M14.9286 2.38892H2.07141V5.52244H14.9286V2.38892Z' fill='white' stroke='white' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M5.31433 3.19579V1.58398' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3Cpath d='M11.6854 3.19579V1.58398' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3Cpath d='M6.36822 9.96442L7.59583 11.192L10.2746 8.51335' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3C/svg%3E%0A") no-repeat center / auto;}
.notice_box .notice_list li em.ico02{top: 2px;background: url("data:image/svg+xml,%3Csvg width='17' height='16' viewBox='0 0 17 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.5 0.172852C9.58854 0.172852 10.6152 0.383138 11.5801 0.803711C12.5449 1.21191 13.3861 1.77474 14.1035 2.49219C14.821 3.20964 15.3838 4.05078 15.792 5.01562C16.2126 5.9681 16.4229 6.98861 16.4229 8.07715C16.4229 9.17806 16.2126 10.2109 15.792 11.1758C15.3838 12.1283 14.821 12.9632 14.1035 13.6807C13.3861 14.3981 12.5449 14.9671 11.5801 15.3877C10.6152 15.7959 9.58854 16 8.5 16C7.41146 16 6.38477 15.7959 5.41992 15.3877C4.45508 14.9671 3.61393 14.3981 2.89648 13.6807C2.17904 12.9632 1.61003 12.1283 1.18945 11.1758C0.78125 10.2109 0.577148 9.17806 0.577148 8.07715C0.577148 6.98861 0.78125 5.9681 1.18945 5.01562C1.61003 4.05078 2.17904 3.20964 2.89648 2.49219C3.61393 1.77474 4.45508 1.21191 5.41992 0.803711C6.38477 0.383138 7.41146 0.172852 8.5 0.172852ZM9.29785 6.51855V6.5H6.92285V7.29785H7.70215V12.0479H9.29785V6.51855ZM8.5 5.70215C8.72266 5.70215 8.9082 5.62793 9.05664 5.47949C9.21745 5.31868 9.29785 5.13314 9.29785 4.92285C9.29785 4.7002 9.21745 4.51465 9.05664 4.36621C8.9082 4.2054 8.72266 4.125 8.5 4.125C8.27734 4.125 8.08561 4.2054 7.9248 4.36621C7.77637 4.51465 7.70215 4.7002 7.70215 4.92285C7.70215 5.13314 7.77637 5.31868 7.9248 5.47949C8.08561 5.62793 8.27734 5.70215 8.5 5.70215Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat center / auto;}

@media(max-width: 767px){
    .notice_box .inner{padding: 60px 40px;}
    .notice_box .notice_list li{padding-left: 95px;}
    .notice_box .notice_list li{position: relative;color: #FFF;padding-left: 110px;font-size: 15px;}
}
@media(max-width: 500px){
    .notice_box .inner{padding: 60px 20px;}
}
@media(max-width: 450px){
    .notice_box .inner{padding: 40px 20px;}
    .notice_box .inner .title{font-size: 26px;}
    .notice_box .notice_list li{padding-left: 0;}
    .notice_box .notice_list li span{position: relative;display: block;}
}
/* sub050105 학교대상 프로그램 End */