@charset "utf-8";

#sub{width: 100%;height: 100vh;position: relative;overflow: hidden;}
#sub .sub_bg_wrap{width: 100%;height: 100%;position: absolute;left: 0;top: 0;right: 0;bottom: 0;z-index: 1;overflow: hidden;}
#sub .sub_bg_wrap .bg_box{width: 100%;height: 100%;}
#sub .sub_bg_wrap .bg_box img{width: 100%;height: 100%; object-fit: cover;object-position: center right;}

#sub .landing_sect{width:100%;height: 100%;position: relative;z-index: 100;}
#sub .landing_sect .sect_inner{width: 100%;max-width: 1564px;height: 100%;margin: 0 auto;padding: 100px 32px 32px 32px;display: flex;align-items: center;justify-content: center;flex-wrap: nowrap;box-sizing: border-box;}

#sub .landing_sect .cnt_wrap{display: flex;align-items: stretch;flex-wrap: nowrap;column-gap: 48px;width: 100%;height: 100%;max-height: 824px;}
#sub .landing_sect .cnt_wrap .cnt_box{}
#sub .landing_sect .cnt_wrap .cnt_box .box_inner{width: 100%;height: 100%;}

#sub .landing_sect .cnt_wrap .left_box{flex: 1 1 480px;max-width: 480px;padding: 140px 8px;aspect-ratio: 25 / 43;background-color: #fff;border-radius: 36px;box-shadow: 7px 10px 12px 0 rgba(0, 0, 0, 0.25);overflow: hidden;}
#sub .landing_sect .cnt_wrap .left_box.landing_01{background-color: #004B25;}
#sub .landing_sect .cnt_wrap .left_box.landing_02{background-color: #E5EDF8;}

#sub .landing_sect .cnt_wrap .landing_box img{width:100%;}

#sub .landing_sect .cnt_wrap .right_box{flex: 1 1 972px;max-width: 972px;}
#sub .landing_sect .cnt_wrap .left_box .box_inner{display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 48px;}
#sub .landing_sect .cnt_wrap .left_box .tit_img_box{width: 50%;max-width: 240px;margin: 0 auto;}
#sub .landing_sect .cnt_wrap .left_box .tit_img_box img{width: 100%;}

#sub .landing_sect .cnt_wrap .left_box .icon_img_box{width: 100%;}
#sub .landing_sect .cnt_wrap .left_box .icon_img_box img{width: 100%;}

#sub .cnt_tab_wrap{width: 100%;height: 100%;}
#sub .cnt_tab_wrap .tab_list_box{width: 100%;padding-bottom: 20px;}
#sub .cnt_tab_wrap .tab_list{display: flex;align-items: center;flex-wrap: nowrap;column-gap: 20px;}
#sub .cnt_tab_wrap .tab_item{}
#sub .cnt_tab_wrap .tab_item .tab_btns{display: inline-flex;align-items: center;justify-content: center;width: 200px;padding: 24px 0;background-color: #fff;border-radius: 24px;box-shadow: 7px 10px 12px 0 rgba(0, 0, 0, 0.25);overflow: hidden;transition: background-color .3s;}
#sub .cnt_tab_wrap .tab_item .tab_btns.active{background-color: #004B25;}
#sub .cnt_tab_wrap .tab_item .tab_btns .btns_name{display: inline-block;font-size: 24px;font-weight: 500;line-height: 32px;color: #000;white-space: nowrap;}
#sub .cnt_tab_wrap .tab_item .tab_btns.active .btns_name{color: #fff;}

#sub .cnt_tab_wrap .tab_cnt_box{width: 100%;height: 100%;max-height: calc(100% - (80px + 32px));margin-top: 10px;padding: 24px 24px 0;background-color: #fff;border-radius: 36px;box-shadow: 7px 10px 12px 0 rgba(0, 0, 0, 0.25);}
#sub .cnt_tab_wrap .tab_cnt_box::-webkit-scrollbar{}

#sub .cnt_tab_wrap .tab_cnt{width: 100%;height: 100%;max-height: 100%;padding: 10px;overflow: hidden;overflow-y: auto;opacity: 0;display: none;transition: opacity .3s;}
#sub .cnt_tab_wrap .tab_cnt.active{opacity: 1;}
#sub .cnt_tab_wrap .cnt_list{}
#sub .cnt_tab_wrap .cnt_item{}
/* #sub .cnt_tab_wrap .cnt_item + .cnt_item{margin-top: 48px;} */
#sub .cnt_tab_wrap .cnt_item .item_hd{}
#sub .cnt_tab_wrap .cnt_item .cate_name_box{}
#sub .cnt_tab_wrap .cnt_item .cate_name{font-size: 24px;font-weight: 500;line-height: 32px;color: #000;}

#sub .cnt_tab_wrap .cnt_item .item_bd{}
#sub .cnt_tab_wrap .cnt_item .cnt_view_list{display: flex;align-items: center;flex-wrap: wrap;column-gap: 20px;row-gap: 20px;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item{}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns{display: inline-flex;align-items: center;justify-content: center;column-gap: 8px;padding: 10px 24px;background-color: #fff;border: 1px solid #001F4D;border-radius: 48px;transition: background-color .3s;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.active{background-color: #004B25;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns .icon_box{display: inline-block;width: 24px;height: 24px;background-size: 100%;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns .view_txt{font-size: 16px;font-weight: 700;line-height: 20px;color: #000;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.active .view_txt{color: #fff;}


#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns:hover{background-color: #001F4D;}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns:hover  .view_txt{color: #fff;}

#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.video_icon .icon_box{background-image:url('/resources/img/common/video_normal.svg')}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.video_icon:hover .icon_box{background-image:url('/resources/img/common/video_active.svg')}

#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.ebook_icon .icon_box{background-image:url('/resources/img/common/eye_2_line.svg')}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.ebook_icon:hover .icon_box{background-image:url('/resources/img/common/eye_2_line.svg')}

#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.download_icon .icon_box{background-image:url('/resources/img/common/download_3_line.svg')}
#sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns.download_icon:hover .icon_box{background-image:url('/resources/img/common/download_3_line.svg')}


#sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns .icon_box{display: inline-block;width: 24px;height: 24px;background-size: 100%;background-repeat: no-repeat;}
#sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns.ebook_icon .icon_box{background-image:url('/resources/img/common/eye_2_line.svg')}
#sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns.ebook_icon:hover .icon_box{background-image:url('/resources/img/common/eye_2_line.svg')}

#sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns.download_icon .icon_box{background-image:url('/resources/img/common/download_3_line.svg')}
#sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns.download_icon:hover .icon_box{background-image:url('/resources/img/common/download_3_line.svg')}


.cnt_list_box .root_list{list-style:none;margin:0;padding:0}
.cnt_list_box .root_item{width:100%;display:flex;align-items:center;gap:32px;padding:20px 0;border-top:1px solid #ddd}
.cnt_list_box .cnt_item:first-child .root_item{border-top:none}
.cnt_list_box .root_badge{min-width:120px;height:65px;background:#dff0d1;font-weight:700;font-size:22px;border-radius:66px 46px 46px 0;display:flex;align-items:center;justify-content:center}
.cnt_list_box .root_content{display:flex;flex-direction:column;gap:12px}
.cnt_list_box .root_title{font-size:22px;font-weight:700;color:#111}
.cnt_list_box .root_actions{display:flex;align-items:center;gap:16px;font-size:18px}
.cnt_list_box .action_link{display:inline-flex;align-items:center;gap:8px;color:#000;text-decoration:none;font-weight:500}
.cnt_list_box .action_link:hover{text-decoration:underline}
.cnt_list_box .divider{color:#999}
.cnt_list_box .icon{display:inline-block;width:20px;height:20px}

.landing_01 .cnt_list_box .root_badge{background:#dff0d1;color:#7a3e00;}
.landing_02 .cnt_list_box .root_badge{background:#274572;color:#fff;}

@media (max-width: 1500px){
    #sub .landing_sect .cnt_wrap{column-gap: 32px;}   

    #sub .landing_sect .cnt_wrap .left_box{border-radius: 24px;}
    
    #sub .cnt_tab_wrap .tab_item .tab_btns{padding: 20px;border-radius: 20px;}
    #sub .cnt_tab_wrap .tab_cnt_box{max-height: calc(100% - (72px + 32px));padding: 16px 16px 0;border-radius: 24px;}
    #sub .cnt_tab_wrap .tab_cnt{padding: 16px 16px 24px;}
}

@media (max-width: 1240px){
    #sub .landing_sect .sect_inner{display: block;padding: 32px;}
    #sub .landing_sect .cnt_wrap{display: block;height: 100%;max-height: calc(100% - (60px + 32px));margin-top: calc(60px + 32px);}
    #sub .landing_sect .cnt_wrap .left_box{max-width: 100%;padding: 16px;aspect-ratio: unset;}
    #sub .landing_sect .cnt_wrap .left_box .box_inner{flex-direction: row-reverse;}
    #sub .landing_sect .cnt_wrap .left_box .tit_img_box{width: 100%;max-width: 180px;margin: 0;}
    #sub .landing_sect .cnt_wrap .left_box .icon_img_box{width: auto;height: 120px;}
    #sub .landing_sect .cnt_wrap .left_box .icon_img_box img{width: auto;height: 100%;}

    #sub .landing_sect .cnt_wrap .right_box{max-width: 100%;height: calc(100% - (152px + 24px));margin-top: 24px;}
    #sub .cnt_tab_wrap .tab_list{column-gap: 24px;}
    #sub .cnt_tab_wrap .tab_item{flex: 1;}
    #sub .cnt_tab_wrap .tab_item .tab_btns{width: 100%;}
    #sub .cnt_tab_wrap .tab_cnt_box{margin-top: 24px;max-height: calc(100% - (72px + 24px));}
    /* #sub .landing_sect .cnt_wrap .cnt_box{display:none} */
    #sub .landing_sect .cnt_wrap .landing_box{display:none}

}

@media (max-width: 1080px){
    #sub .landing_sect .sect_inner{padding: 24px;}
    #sub .cnt_tab_wrap .tab_item .tab_btns{padding: 16px;}
    #sub .cnt_tab_wrap .tab_item .tab_btns .btns_name{font-size: 20px;line-height: 28px;}
    
    #sub .cnt_tab_wrap .tab_cnt_box{max-height: calc(100% - (60px + 24px));}
    #sub .cnt_tab_wrap .cnt_item .cate_name{font-size: 20px;line-height: 28px;}
    #sub .cnt_tab_wrap .cnt_item .item_bd{margin-top: 16px;padding-left: 16px;}
    #sub .cnt_tab_wrap .cnt_item + .cnt_item{margin-top: 32px;}
}
@media (max-width: 768px){
    #sub .landing_sect .cnt_wrap .left_box .box_inner{column-gap: 32px;}
    #sub .landing_sect .cnt_wrap .landing_box{display:none}
    /* .cnt_list_box .root_item{gap:12px;flex-direction: column;align-items: flex-start;} */
    .cnt_list_box .root_item{gap:12px;padding: 20px 0 10px 0;}
    .cnt_list_box .root_badge{font-size:14px;min-width: 70px;height: 40px;}
    .cnt_list_box .root_actions{font-size: 14px;gap: 10px;}
    .cnt_list_box .root_content{gap:6px}
    .cnt_list_box .root_title{font-size: 18px}
    .cnt_list_box .action_link{gap:4px}
    #sub .cnt_tab_wrap .cnt_item .root_item .cnt_view_btns .icon_box{width:18px;height:18px}
    .cnt_list_box .cnt_item:first-child .root_item{padding: 10px 0;}
}

@media (max-width: 600px){
    #sub .landing_sect .sect_inner{padding: 16px}
    #sub .landing_sect .cnt_wrap{max-height: calc(100% - (40px + 24px));margin-top: calc(40px + 24px);}

    #sub .landing_sect .cnt_wrap .left_box{padding: 8px;border-radius: 16px;}
    #sub .landing_sect .cnt_wrap .left_box .box_inner{column-gap: 16px;}
    #sub .landing_sect .cnt_wrap .left_box .icon_img_box{height: 80px;}
    #sub .landing_sect .cnt_wrap .left_box .tit_img_box{max-width: 120px;}

    #sub .landing_sect .cnt_wrap .right_box{height: calc(100% - (96px + 16px));margin-top: 16px;}
    #sub .cnt_tab_wrap .tab_list{column-gap: 16px;}
    #sub .cnt_tab_wrap .tab_item .tab_btns{border-radius: 16px;}
    #sub .cnt_tab_wrap .tab_item .tab_btns .btns_name{font-size: 16px;line-height: 20px;}

    #sub .cnt_tab_wrap .tab_cnt_box{max-height: calc(100% - (52px + 16px));margin-top: 16px;padding: 8px 8px 0;border-radius: 16px;}
    #sub .cnt_tab_wrap .tab_cnt{padding: 8px 8px 16px;}
    
    #sub .cnt_tab_wrap .cnt_item .cate_name{font-size: 16px;line-height: 20px;}
    #sub .cnt_tab_wrap .cnt_item .item_bd{margin-top: 8px;padding-left: 0px;}
    #sub .cnt_tab_wrap .cnt_item + .cnt_item{margin-top: 14px;}
    #sub .cnt_tab_wrap .cnt_item .cnt_view_list{column-gap: 8px;row-gap: 8px;}

    #sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns{padding: 8px;}

    #sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns .icon_box{width: 24px;height: 24px;column-gap: 4px;}
    #sub .cnt_tab_wrap .cnt_item .cnt_view_item .cnt_view_btns .view_txt{font-size: 14px;line-height: 18px;}
}