/* 역사 수업 가이드 */

/* common */
#fp-nav,
.fp-watermark {display: none;}

/* common */
.historyLessonGuide {min-width: 1024px; text-align: center;}
.section {margin-top:0;}
.section0 .inner::after,
.section1 .fp-overflow .imgWrap::after,
.section2 .fp-overflow::after,
.historyLessonSub:not(.history5) .section-body::after,
.history4 .contWrap1::after {content:''; position: absolute; z-index: 1000; left: 50%; bottom: 0; width: 38px; height: 70px; margin-left: -12px; background: url(/resources/images/themeplace/historyLessonGuide/ico_scroll_b.png) no-repeat 0 0 / 100% auto; animation:bounce 1s infinite alternate backwards;}
.section0 .inner::after,
.section1 .fp-overflow .imgWrap::after {background-image: url(/resources/images/themeplace/historyLessonGuide/ico_scroll_b_w.png);}
.history4 .contWrap1::after {bottom: 86px;}

@keyframes bounce {
    0%{transform:translateY(-20px);}
    100%{transform:translateY(-5px);}
}

.section:last-child:after,
.section:nth-last-child(2):after{display:none;}
.section .fp-overflow > h2{position:absolute;left:50%;top:11.11vh;transform:translateX(-50%);height:13.89vh;}
.section .fp-overflow > h2 img{height:100%;}
.section .imgWrap{min-width: 1024px; max-width: 1920px; height:100vh; margin:0 auto;}
.section .imgWrap img{height:100%;}
.section.fp-auto-height .imgWrap{position:relative; height: auto;}
.swiper-button-prev, 
.swiper-button-next {width: 64px; height: 64px; margin-top: -32px;}
.swiper-button-prev::after, 
.swiper-button-next::after {content: ''; width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50% 0; background-size: 100% auto;}
.swiper-button-prev::after {background-image: url(/resources/images/themeplace/historyLessonGuide/btn_prev.png);}
.swiper-button-next::after {background-image: url(/resources/images/themeplace/historyLessonGuide/btn_next.png);}
.swiper-button-prev:disabled,
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next:disabled,
.swiper-button-next.swiper-button-disabled {opacity: 1;}
.swiper-button-prev:disabled::after,
.swiper-button-prev.swiper-button-disabled::after,
.swiper-button-next:disabled::after,
.swiper-button-next.swiper-button-disabled::after {background-position-y: 100%;}
.swiper-button-prev {left: 0;}
.swiper-button-next {right: 0;}
.btnOpenWin {position: relative; display: block; height: 100%; margin: 0 auto;}
.btnOpenWin::before {content: ''; position: absolute; left: 50%; top: 50%; width: 178px; height: 168px; transform: translate(-50%, -50%); background: url(/resources/images/themeplace/historyLessonGuide/ico_click_arrow.png) no-repeat 50% / 100%;}
/* .btnTop {position: fixed; z-index: 100; right: 1.25vw; bottom: 1.25vw; width: 92px; height: 92px; background: url(/resources/images/themeplace/historyLessonGuide/btn_top.png) no-repeat 50%; opacity: 0; transition: 0.3s;}
body:not(.fp-viewing-0) .btnTop {opacity: 1;} */

/* wing */
.wing {position: fixed; z-index: 20; top: 29.707vh; right: 0; width: 342px; /* width: 34.872vh; */ transition-property: right; transition-delay: 0.5s;}
.wing .link_list li + li {margin: 0.923vh 0 0;}
.wing .link_list li a {display: block; width: 100%; height: 83px; /* height: 8.513vh; */ background-repeat: no-repeat; background-position: 50%; background-size: 100%;}
.wing .link_list li:nth-child(1) a {background-image: url(/resources/images/themeplace/historyLessonGuide/wing_link_01.png);}
.wing .link_list li:nth-child(2) a {background-image: url(/resources/images/themeplace/historyLessonGuide/wing_link_02.png);}

/* header */
header {position: absolute; z-index: 100; top: 38px; left: 50%; display: flex; justify-content: end; align-items: center; width: 100%; max-width: 1306px; height: 39px; transform: translateX(-50%);}
header .logo-visang {margin-right: auto;}
header .logo-vivasam img {margin-right: 25px;}
header .logo-vivasam a {display: inline-block; height: 16px;}
header .member-join,
header .main-login-box span,
header .main-login-box a,
header .main-login-box button { color: #fff; font-family: 'Pretendard'; font-size: 16px; font-weight: 600;}
header .member-join::after {content: ''; display: inline-block; width: 1px; height: 12px; margin: 0 10px; vertical-align: -1px; background: #999;}
header .main-login-box span {margin: 0 10px 0 0;}

/* section */
.section0 .inner {overflow: hidden; position: relative; padding: 0 0 117px; background: #06cb95 url(/resources/images/themeplace/historyLessonGuide/intro_bg.png) no-repeat 50% 100% / 2560px auto;}
.section0 .section-top {position: relative; height: 100vh; max-height: 1030px; padding: 5.728vh 0 0; background-image: url(/resources/images/themeplace/historyLessonGuide/intro_bg_bottom.png), url(/resources/images/themeplace/historyLessonGuide/intro_bg_top.jpg); background-repeat: repeat-x; background-position: 50% 100%, 50% 0; background-size: 2560px auto;}
.section0 .section-top .imgWrap {height: 70.146vh; max-height: 70%;}
.section0 .objectsStar {position: absolute; left: 50%; top: 0; width: 248.544vh; height: 100%; transform: translateX(-50%); }
.section0 .objectsStar span {position: absolute; transform: translate(50%, -50%); opacity: 0; background-repeat: no-repeat; background-position: 50%; animation: fallStar 2s linear 0.2s infinite;}
.section0 .objectsStar .obj-01 {left: 13.398vh; top: 52.913vh; width: 12.718vh; height: 12.718vh; background-image: url(/resources/images/themeplace/historyLessonGuide/star_01.png); animation-delay: 1.5s;} 
.section0 .objectsStar .obj-02 {left: 53.398vh; top: 33.204vh; width: 15.146vh; height: 15.146vh; background-image: url(/resources/images/themeplace/historyLessonGuide/star_02.png); animation-delay: 1s;} 
.section0 .objectsStar .obj-03 {right: 17.767vh; top: 0; width: 23.301vh; height: 23.301vh; background-image: url(/resources/images/themeplace/historyLessonGuide/star_03.png); animation-delay: 2s;} 

@keyframes fallStar {
    0%, 100% {
        transform: translate(50%,-50%);
        opacity: 0;
    }

    40%, 80% {
        transform: translate(-50%, 50%);
        opacity: 1;
    }

    90% {
        transform: translate(-50%, 50%);
        opacity: 0;
    }
}
.section0 .objects {position: absolute; left: 50%; top: 0; width: 2560px; height: 89.3vh; max-height: 923px; transform: translateX(-50%); }
.section0 .objects span {position: absolute; transform-origin: 50%; transform: scale(80%); opacity: 0; background-repeat: no-repeat; background-position: 50%; animation: popScale 1s ease-in-out 0s forwards 1;}
.section0 .objects .obj-01 {left: 372px; bottom: 19px; width: 456px; height: 243px; background-image: url(/resources/images/themeplace/historyLessonGuide/obj_01.png); animation-delay: 1s;} 
.section0 .objects .obj-02 {left: 894px; bottom: 13px; width: 158px; height: 182px; background-image: url(/resources/images/themeplace/historyLessonGuide/obj_02.png); animation-delay: 0.7s;} 
.section0 .objects .obj-03 {right: 873px; bottom: 27px; width: 146px; height: 185px; background-image: url(/resources/images/themeplace/historyLessonGuide/obj_03.png); animation-delay: 1.1s;} 
.section0 .objects .obj-04 {right: 412px; bottom: 1px; width: 252px; height: 470px; background-image: url(/resources/images/themeplace/historyLessonGuide/obj_04.png); animation-delay: 1.4s;} 

@keyframes popScale {
    0% {
        transform: scale(80%) ;
        opacity: 0;
    }
    40% {
        transform: scale(110%);
        opacity: 1;
    }
    100% {
        transform: scale(100%);
        opacity: 1;
    }
}

.section0 .rolling-txt {position: relative; width: 1284px; padding: 190px 190px 0; margin: 0 auto; background: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_tit.png) no-repeat 50% 0;}
.section0 .rolling-txt::after {content: ''; position: absolute; right: 0; bottom: -117px; width: 306px; height: 365px; background: url(/resources/images/themeplace/historyLessonGuide/img_main_obj_01.png) no-repeat 50% 0;}
.section0 .rolling-txt .swiper {overflow: hidden; width: 908px; height: calc( 85px * 4 + 97px ); margin: 0 auto; background: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_bg.png) no-repeat 50% 170px;}
.section0 .rolling-txt .swiper-slide {width: 100%; height: 97px; background-repeat: no-repeat; background-position: 50% 0; opacity: 0.6;}
.section0 .rolling-txt .swiper-slide.slide1 {background-image: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_01.png);}
.section0 .rolling-txt .swiper-slide.slide2 {background-image: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_02.png);}
.section0 .rolling-txt .swiper-slide.slide3 {background-image: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_03.png);}
.section0 .rolling-txt .swiper-slide.slide4 {background-image: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_04.png);}
.section0 .rolling-txt .swiper-slide.slide5 {background-image: url(/resources/images/themeplace/historyLessonGuide/rolling_txt_05.png);}
.section0 .rolling-txt .swiper-slide.swiper-slide-active {background-position-y: 100%;}
.section0 .rolling-txt .swiper-slide.swiper-slide-active {height: 97px; opacity: 1;}

.section1 {background: #d0e4fc url(/resources/images/themeplace/historyLessonGuide/bg_section_01.jpg) no-repeat 50% 100% / cover;}
.section1 .fp-overflow > h2 {position: static; margin-top: 7.590vh; height: 14.154vh; transform: none;}
.section1 .swiperWrap {position: relative; width: 111.795vh; padding: 25.641vh 0 0; margin: 0 auto;}
.section1 .swiper {overflow: hidden; width: 102.564vh; height: 36.192vh; padding: 0 0 6px; margin: 0 auto;}
.section1 .swiper img {overflow: hidden; height: 100%; border-radius: 30px; box-shadow: 0 6px 4px 0 rgba(144, 189, 248, 1);}
.section1 .swiper-button-prev, 
.section1 .swiper-button-next {top: 46.282vh; width: 6.564vh; height: 6.564vh; margin-top: calc(-6.564vh / 2);}
.section1 .swiper-pagination {top: 4.833vh; bottom: auto; display: flex; gap: 6.872vh; justify-content: center;}
.section1 .swiper-pagination-bullet {top: 0; bottom: auto; width: 16.410vh; height: 16.410vh; margin: 0 !important; background-color: transparent; background-repeat: no-repeat; background-position: 50% 0; background-size: 100%; opacity: 1; }
.section1 .swiper-pagination-bullet:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/cont01_tab01.png);}
.section1 .swiper-pagination-bullet:nth-child(2) {background-image: url(/resources/images/themeplace/historyLessonGuide/cont01_tab02.png);}
.section1 .swiper-pagination-bullet:nth-child(3) {background-image: url(/resources/images/themeplace/historyLessonGuide/cont01_tab03.png);}
.section1 .swiper-pagination-bullet:nth-child(4) {background-image: url(/resources/images/themeplace/historyLessonGuide/cont01_tab04.png);}
.section1 .swiper-pagination-bullet-active:nth-child(1),
.section1 .swiper-pagination-bullet-active:nth-child(2),
.section1 .swiper-pagination-bullet-active:nth-child(3),
.section1 .swiper-pagination-bullet-active:nth-child(4) {background-position-y: 100%;}
.section1 .imgWrap {box-sizing: content-box; height: 6.154vh; padding: 2.256vh 0 12.897vh;}

.section2 {position: relative; height: 100vh; text-align: center; background: #fcf6d0;}
.section2 .fp-overflow > h2 {position: absolute; left: 50%; top: 6.018vh; height: 22.867vh; transform: translateX(-50%);}
.section2 .imgWrap {padding: 36.761vh 0 12.363vh;}

/* historyLessonSub */
.historyLessonSub {overflow-y: auto; position: relative; text-align: center; background: #dffbff;}
.historyLessonSub .imgWrap img {height: auto;}
.historyLessonSub .inner {overflow-x: hidden; height: 100%;}
.historyLessonSub .tabs_wrap {background: #0c0050;}
.historyLessonSub .tabs_inner {display: flex; justify-content: space-between; align-items: center; width: 1246px; margin: 0 auto;}
.historyLessonSub .btn_link_main {width: 302px; height: 95px; background: url(/resources/images/themeplace/historyLessonGuide/logo_history.png) no-repeat 50% 0;}
.historyLessonSub .tabs {display: flex; width: 900px;}
.historyLessonSub .tabs li {flex-shrink: 1; width: 224px; height: 144px; border-right: 1px solid #019ff1;}
.historyLessonSub .tabs a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 0 7px; font-size: 28px; line-height: 1.2; color: #a8cbf4; font-weight: 700; letter-spacing: -0.5px;}
.historyLessonSub .tabs a.is-active {color: #87ffde;}

.historyLessonSub .section-top {overflow: hidden; position: relative; min-width: 1246px; height: 743px; background: url(/resources/images/themeplace/historyLessonGuide/bg_section_sub_top_right.png) repeat-x 0 0;}
.historyLessonSub .section-top::before,
.historyLessonSub .section-top::after {content: ''; position: absolute; top: 0; height: 100%; background: url(/resources/images/themeplace/historyLessonGuide/bg_section_sub_top_left.png) repeat-x 0 0;}
.historyLessonSub .section-top::before {left: 0; width: 50%;}
.historyLessonSub .section-top::after {left: 50%; width: 2560px; margin-left: calc(-2560px / 2); background: url(/resources/images/themeplace/historyLessonGuide/bg_section_sub_top.png) no-repeat 50% 0;}
.historyLessonSub .section-top .imgTitle {position: relative; z-index: 2; width: 1280px; height: 626px; padding: 153px 0 0 35px; margin: 0 auto; text-align: left; background-repeat: no-repeat; background-position: right 67px bottom 0; }
.historyLessonSub .section-top .imgTitle .img_bubble {position: absolute; right: 0; top: 55px; transform-origin: center center; animation: showingBubble 1.5s ease 0.5s 1 normal backwards, movingBubble 1.5s ease 1.8s 1 normal forwards;}
.historyLessonSub .section-top .imgTitle .img_bubble img {vertical-align: middle;}

@keyframes showingBubble {
    0% {animation-timing-function: ease-out; transform: scale(0); }
    10% {animation-timing-function: ease-in; transform: scale(0.91);}
    17% {animation-timing-function: ease-out; transform: scale(0.98);}
    33% {animation-timing-function: ease-in; transform: scale(0.87);}
    45% {animation-timing-function: ease-out; transform: scale(1);}
}
@keyframes movingBubble {
    0%,
    100% {transform: translateX(0%);transform-origin: 50% 50%;}
    15% {transform: translateX(-30px) rotate(-6deg);}
    30% {transform: translateX(15px) rotate(6deg);}
    45% {transform: translateX(-15px) rotate(-3.6deg);}
    60% {transform: translateX(9px) rotate(2.4deg);}
    75% {transform: translateX(-6px) rotate(-1.2deg);}
}

.history1 .section-top .imgTitle {background-image: url(/resources/images/themeplace/historyLessonGuide/s01_top_img.png);}
.history2 .section-top .imgTitle {background-image: url(/resources/images/themeplace/historyLessonGuide/s02_top_img.png);}
.history3 .section-top .imgTitle {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_top_img.png);}
.history4 .section-top .imgTitle {background-image: url(/resources/images/themeplace/historyLessonGuide/s04_top_img.png);}
.history5 .section-top .imgTitle {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_top_img.png);}
/* .historyLessonSub .section-top::after {content: ''; position: absolute; left: 50%; bottom: -54px; width: 100px; height: 108px; margin-left: -50px; background: url(/resources/images/themeplace/historyLessonGuide/ico_arrow_down.png) no-repeat 50% 0;} */

.historyLessonSub .section-body {min-width: 1246px; padding: 50px 0 155px;}
.historyLessonSub .section-body .imgTitle {margin: 0 0 60px;}
.historyLessonSub .section-body .imgDesc {margin: 0 0 35px;}
.historyLessonSub .contWrap .imgCont {text-align: center;}
.historyLessonSub .btnWrap {display: flex; gap: 18px; justify-content: center; padding: 95px 0 0;}
.historyLessonSub .btnWrap a {width: 461px; height: 97px; background-repeat: no-repeat; background-position: 50% 0; background-size: 100% auto;}
/* .historyLessonSub .btnWrap a:hover  {background-position-y: 100%;} */

.history1 .swiper {overflow: hidden; position: relative; width: 1102px; padding: 0 33px; margin: 0 auto;}
.history1 .swiper img {max-width: 100%;}
.history1 .btnWrap a {width: 380px;}
.history1 .btnWrap a:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/s01_btn_01_off.png);}
.history1 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s01_btn_01_on.png);}
.history1 .btnWrap a:nth-child(2) {background-image: url(/resources/images/themeplace/historyLessonGuide/s01_btn_02_off.png);}
.history1 .btnWrap a:nth-child(2):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s01_btn_02_on.png);}

.history2 .videoWrap {display: flex; gap: 30px; justify-content: center;}
.history2 .videoWrap .videoItem {overflow: hidden; flex: 0 0 auto; position: relative; width: 524px; height: 300px; will-change: transform; transform: translateZ(0); border-radius: 25px;}
.history2 .videoWrap .thumb {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.history2 .videoWrap .btnVideoPlay {position: absolute; z-index: 10; left: 0; top: 0; width: 100%; height: 100%;}
.history2 .videoWrap video {position: absolute; left: 50%; top: 50%; /* width: 102%; height: 102%; */width: 526px; height: 302px; object-fit: cover; transform: translate(-50%, -50%) translateZ(0); opacity: 0; backface-visibility: hidden;}
.history2 .videoWrap .is-playing .thumb,
.history2 .videoWrap .is-playing .btnVideoPlay {display: none;}
.history2 .videoWrap .is-playing video {opacity: 1;}
.history2 .btnWrap a:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/s02_btn_01_off.png);}
.history2 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s02_btn_01_on.png);}

.history3 .btnWrap a:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_01_off.png);}
.history3 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_01_on.png);}
.history3 .btnWrap a:nth-child(2) {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_02_off.png);}
.history3 .btnWrap a:nth-child(2):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_02_on.png);}
.history3 .btnWrap a:nth-child(3) {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_03_off.png);}
.history3 .btnWrap a:nth-child(3):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s03_btn_03_on.png);}

.history4 .contWrap .imgDesc {margin-bottom: 48px;}
.history4 .contWrap .btnOpenWin {width: 1003px;}
.history4 .btnWrap + .contWrap {margin: 154px 0 0;}
.history4 .contWrap1 {position: relative; padding-bottom: 204px;}
.history4 .contWrap1 .swiper {overflow: hidden; position: relative; width: 1200px; padding: 0 90px; margin: 0 auto;}
.history4 .contWrap1 .btnWrap {padding-top: 88px;}
.history4 .contWrap1 .btnWrap a {background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_01_off.png);}
.history4 .contWrap1 .btnWrap a:hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_01_on.png);}
.history4 .contWrap2 {padding: 104px 0 160px; margin-bottom: -155px; background: #c2f1f8;}
.history4 .history_card {position: relative; display: flex; gap: 23px; justify-content: center; width: 100%; height: 411px;}
.history4 .history_card_video {position: relative; flex-shrink: 0; width: 500px; background: url(/resources/images/themeplace/historyLessonGuide/s04_cont_0301.png) no-repeat 50% 0;}
.history4 .history_card_video .videoWrap {overflow: hidden; position: absolute; left: 0; top: 0; width: 100%; height: 100%;/* height: 282px; */ background: black; border-radius: 25px; opacity: 0;}
.history4 .history_card_video .videoWrap video {width: 100%; height: 100%;}
.history4 .history_card_video .videoWrap.is-playing {z-index: 10; opacity: 1;}
.history4 .history_card_buttons{display: flex; flex-direction: column; justify-content: space-between; width: 444px; background: url(/resources/images/themeplace/historyLessonGuide/s04_cont_0302_txt.png) no-repeat 50% 97%;}
.history4 .history_card_buttons .inner {overflow: visible;}
.history4 .history_card_buttons .btn_tab{position: relative; display: flex; gap: 10px; justify-content: start; align-items: center; width: 100%; height: 66px; padding: 7px 16px 6px; border-radius: 8px; color: #000; background-color: #eff2f8; border: solid 1px #8d9fc7;}
.history4 .history_card_buttons .btn_tab::after {content: ''; margin-left: auto; width: 46px; height: 46px; background: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_play.png) no-repeat 50% 0;}
.history4 .history_card_buttons .btn_tab .icon{width: 46px; height: 46px; background-repeat: no-repeat; background-position: 50%; background-size: 100%;}
.history4 .history_card_buttons .btn_tab:nth-child(1) .icon{background-image: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_01.png);}
.history4 .history_card_buttons .btn_tab:nth-child(2) .icon{background-image: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_02.png);}
.history4 .history_card_buttons .btn_tab:nth-child(3) .icon{background-image: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_03.png);}
.history4 .history_card_buttons .btn_tab:nth-child(4) .icon{background-image: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_04.png);}
.history4 .history_card_buttons .btn_tab:nth-child(5) .icon{background-image: url(/resources/images/themeplace/historyLessonGuide/icon_history_card_05.png);}
.history4 .history_card_buttons .btn_tab .text{font-size: 18px; font-weight: 500; letter-spacing: -0.05em;}
.history4 .history_card_buttons .btn_tab:hover,
.history4 .history_card_buttons .btn_tab.on{color: #fff; background-color: #507fe8; border-color: #0d3080;}
.history4 .history_card_buttons .btn_tab:hover {z-index: 5;}
.history4 .history_card_buttons .btn_tab:hover::before {content: ''; position: absolute; right: -45px; bottom: -36px; width: 89px; height: 73px; background: url(/resources/images/themeplace/historyLessonGuide/img_pointer.png) no-repeat 50% 0; pointer-events: none;}
.history4 .history_card_buttons .btn_tab + .btn_tab {margin-top: 8px;}
/*.history4  .history_card .btn_play{position: absolute; z-index: 3; top: 50%; left: 50%; width: 60px; height: 59px; transform: translate(-50%, -50%); background: url(/resources/images/themeplace/keywordHistory/icon-play-button.png) no-repeat 0 0/cover;} */
.history4 .contWrap2 .btnWrap a:nth-child(1) {width: 542px; background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_02_off.png);}
.history4 .contWrap2 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_02_on.png);}
.history4 .contWrap2 .btnWrap a:nth-child(2) {width: 507px; background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_03_off.png);}
.history4 .contWrap2 .btnWrap a:nth-child(2):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s04_btn_03_on.png);}

.history5 .contWrap {width: 1200px; margin: 0 auto;}
.history5 .contWrap .btnOpenWin {width: 914px;}
.history5 .contTab {display: flex; }
.history5 .contTab li {width: 50%;}
.history5 .contTab button {width: 100%; height: 84px; font-size: 28px; color: rgba(255,255,255,0.6); font-weight: 500; background: #05679e; border-radius: 20px 20px 0 0; }
.history5 .contTab button.is-active {color: #fff; background: #019cf2;}
.history5 .tabpanel {display: none; position: relative; height: 943px; padding: 40px 45px 55px;  background: #fff; border: 4px solid #019cf2; border-radius: 0 0 30px 30px;}
.history5 .tabpanel.is-active {display: block;}
.history5 .tabpanel1 .imgCont {margin: 48px 0 0; }
.history5 .tabpanel1 .btnWrap {padding: 54px 0 0;}
.history5 .tabpanel1 .btnWrap a:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_01_off.png);}
.history5 .tabpanel1 .btnWrap a:nth-child(2) {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_02_off.png);}
.history5 .tabpanel1 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_01_on.png);}
.history5 .tabpanel1 .btnWrap a:nth-child(2):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_02_on.png);}
.history5 .tabpanel2 .swiper {overflow: hidden; position: relative; width: 994px; margin: 0 auto; text-align: center;}
.history5 .tabpanel2 .btnWrap a:nth-child(1) {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_03_off.png);}
.history5 .tabpanel2 .btnWrap a:nth-child(1):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_03_on.png);}
.history5 .tabpanel2 .btnWrap a:nth-child(2) {width: 490px; background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_04_off.png);}
.history5 .tabpanel2 .btnWrap a:nth-child(2):hover {background-image: url(/resources/images/themeplace/historyLessonGuide/s05_btn_04_on.png);}
.history5 .videoWrap {overflow: hidden; position: relative; width: 816px; height: 505px; margin: 0 auto; border-radius: 25px;}
.history5 .videoWrap .videoItem {display: flex; justify-content: center; align-items: center; height: 100%;}
.history5 .videoWrap .thumb {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.history5 .videoWrap .btnVideoPlay {position: absolute; z-index: 10; left: 0; top: 0; width: 100%; height: 100%;}
.history5 .videoWrap video {width: 100%; height: 100%; opacity: 0;}
.history5 .videoWrap .is-playing .thumb,
.history5 .videoWrap .is-playing .btnVideoPlay {display: none;}
.history5 .videoWrap .is-playing {background: #000;}
.history5 .videoWrap .is-playing video {opacity: 1;}