/* media-screen-768px */

@media screen and (max-width: 768px) {
  body {
    font-size: 14px
  }
  
  .footer {
    font-size: 13px;
  }
  
  .footer .ft_link a {
  }
  
  .footer .ft_info .ft_logo {
    display: none;
  }
  
  .footer .ft_info {
  }
  
  .footer .sns_link {
    float: none;
    /* margin: 15px 0 0; */
  }
  
  .footer .sns_link img {
    width: 22px;
  }
  
  .footer .sns_link a {
  }
  
  #sub {
    padding-top: 73px
  }
  
  /* main */
  .full_sec1 .main_visual .swiper-slide h2 {
    padding-top: 50%;
    font-size: 30px
  }
  
  .visual-pc {
    display: none;
  }
  
  .visual-m {
    display: block;
  }
  
  .full_sec1 .main_visual .swiper-slide {
    height: auto;
  }
  
  .sec_tit h2 {
    font-size: 30px
  }
  
  .sec_tit h3 {
    font-size: 18px
  }
  
  .sec_tit p:before {
    margin: 20px 0;
  }
  
  .full_sec2 .sec_ebook {
    max-width: 100%;
    margin: 30px 0 0;
  }
  
  .full_sec2 .sec_ebook ul li {
    padding: 30px;
  }
  
  .full_sec2 .sec_ebook ul li h3 {
    font-size: 22px
  }
  
  .full_sec2 .sec_ebook ul li p {
    font-size: 16px
  }
  
  .full_sec2 .sec_ebook ul li a {
    font-size: 14px;
    top: 30px
  }
  
  .full_sec2 .sec_ebook {
    width: 100%
  }
  
  .full_sec3 .sec_tabs {
    width: 100%;
  }
  
  .full_sec2 {
    padding: 70px 0
  }
  
  .full_sec3 {
    padding: 70px 0;
    background: #fff;
  }
  
  .full_sec3 .sec_tit {
    color: #333;
  }
  
  .full_sec3 .sec_tit p:before {
    background: #aaa;
  }
  
  .full_sec3 .sec_tit {
    float: none;
    margin-top: 0;
  }
  
  .full_sec3 .sec_tabs {
    margin: 30px 0 0;
  }
  
  .full_sec3 .sec_tabs .tab-menu li a.active {
    font-size: 16px
  }
  
  #fullpage .tabSwiper .swiper-slide {
  }
  
  #fullpage .tabSwiper .swiper-slide h3 {
  }
  
  #fullpage .tabSwiper .swiper-slide .date {
    bottom: 30px
  }
  
  #fullpage .tabSwiper .swiper-slide p {
    font-size: 14px
  }
  
  .full_sec3 .sec_tabs .tab {
    height: auto;
  }
  
  .full_sec4 .sec_atc {
    padding: 50px 0 20px;
  }
  
  .full_sec4 .sec_atc ul li {
    width: 100%;
    margin-bottom: 50px;
  }
  
  .full_sec4 .sec_atc ul li h3 {
    font-size: 24px;
    line-height: 40px;
    margin: 0 0 20px
  }
  
  .full_sec4 .sec_atc ul li img {
    float: left;
    margin-right: 10px;
    width: 40px;
  }
  
  .full_sec4 .sec_atc ul li a {
    padding: 10px 30px;
  }
  
  .full_sec4 .sec_search {
    margin: 30px auto
  }
  
  .full_sec4 .sch_input input {
    line-height: 30px;
    font-size: 16px;
  }
  
  .sec_atc .icon_box > li {
    width: 125px;
  }
  
  .sch_input {
    height: 56px;
    width: calc(100% - 70px);
  }
  
  .full_sec4 .sch_btn {
    width: 56px;
    height: 56px;
  }
  
  .fp-section.fp-table, .fp-slide.fp-table {
    min-height: auto
  }
  
  /* sub */
  .book_top {
    padding: 30px 0;
  }
  
  .book_top .bkt_cont .book_thum {
    max-width: 40%;
  }
  
  .book_top .bkt_cont .book_name {
    width: 100%;
    padding: 30px 0 10px;
  }
  
  .book_top .bkt_cont .book_name h1 {
    font-size: 20px
  }
  
  .book_top .bkt_cont .book_wish {
    width: 150px;
    margin: 20px 0 0;
    padding: 10px 15px;
    font-size: 12px;
  }
  
  .book_top .bkt_cont > .book_atc .oth_book {
    margin: 0 0 10px;
    width: 100%;
  }
  
  .book_top .bkt_cont > .book_atc .oth_book select {
    font-size: 13px;
  }
  
  .book_nav ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: start;
  }
  
  .book_nav ul li {
    flex: 0 0 auto;
    width: auto;
  }
  
  .book_nav ul li a {
    padding: 15px;
    font-size: 14px;
  }
  
  .book_content {
    padding: 30px 0;
  }
  
  .book_tabs {
    margin: 0 0 20px
  }
  
  .book_tabs li a {
    padding: 10px
  }
  
  .book_inner_tabs {
    height: 41px;
  }
  
  .book_inner_tabs li a {
    padding: 10px;
  }
  
  .book_popup .close {
    right: 0;
    top: -40px
  }
  
  .allsel_bar {
    padding: 10px;
    margin: 0 0 20px
  }
  
  .allsel_bar .bar_btn a {
    font-size: 12px;
    padding: 2px 10px;
  }
  
  .ck-box input[type=checkbox] {
    width: 20px;
    height: 20px;
  }
  
  .ck-box input[type=checkbox] + label:before {
    width: 18px;
    height: 18px;
  }
  
  .ck-box input[type=checkbox] + label {
    padding: 0 0 0 30px;
    line-height: 18px;
    font-size: 13px;
  }
  
  .ck-box input[type=checkbox]:checked + label:before {
    width: 18px;
    height: 18px;
  }
  
  .basic_list ul li {
    padding: 15px 0;
    font-size: 14px;
    padding-right: 100px;
    padding-left: 30px;
  }
  
  .basic_list ul li .ck-box {
    /* top: 15px; */
  }
  
  .basic_list .list_btn {
    /* top: 0; */
    right: 0;
  }
  
  .basic_list .list_btn a {
    width: 30px
  }
  
  .ic_detail {
    background-size: 20px;
  }
  
  .ic_download {
    background-size: 22px;
  }
  
  .ic_scrap {
    background-size: 20px;
  }
  
  .basic_list ul li.cl_2 {
    padding-left: 30px
  }
  
  .basic_list ul li.cl_2 .ck-box {
    left: 0;
  }
  
  .basic_list ul li.cl_3 {
    padding-left: 30px;
  }
  
  .basic_list ul li.cl_3 .ck-box {
    left: 0;
  }
  
  .media_list ul li {
    width: 100%;
    margin-right: 0;
    padding: 20px;
    font-size: 16px;
    color: #333;
  }
  
  .media_list ul li .media_bt p {
    font-size: 14px;
  }
  
  .media_list ul li .thum .list_btn,
  .media_list ul li .thum:after {
    opacity: 1;
  }
  
  .media_list ul li .thum .list_btn a {
    width: 40px;
    height: 40px;
  }
  
  .media_list ul li .media_bt {
    margin: 30px 0 0;
  }
  
  .media_list.image_list ul.contentData li {
    flex-direction: column;
    width: calc(100% / 2 - 10px);
  }
  
  .media_list.image_list ul.contentData li .thumb {
    width: 100%;
  }
  
  .media_list.image_list ul li.contentData .thumb {
    width: 100%;
  }
  
  .media_list.image_list ul li.contentData .functional_area {
    width: 100%;
  }
  
  .media_list.image_list ul li.contentData .thum {
    background-color: unset;
    background-size: unset;
    background-position: unset;
    border-radius: 4px;
    width: 100%;
    padding-bottom: unset;
    margin: unset;
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  
  .media_list.image_list ul li.contentData .thum:after {
    display: none;
  }
  
  .sub_top_visual {
    height: auto;
    padding: 40px 0;
  }
  
  .sub_visual_tit h1 {
    font-size: 54px;
    margin-bottom: 40px;
    line-height: normal;
  }
  
  .sub_visual_tit p {
    font-size: 16px
  }
  
  .sub_visual_tit .desc1 {
    font-size: 30px;
    margin-bottom: 40px;
    line-height: normal;
  }
  
  .sub_visual_tit .desc2 {
    width: 100%;
    font-size: 22px;
  }
  
  /* !* 플러스자료실 *! */
  .sub_top_visual.sub_visual_5 {
    background: url('../../images/sub/sub_visual_mo_5.png') no-repeat top right;
    background-color: #feacbb;
    height: 420px;
    padding: 0;
    align-items: normal;
  }
  
  /* !* 뮤직티랜드 *! */
  .sub_top_visual.sub_visual_6 {
    background: url('../../images/sub/sub_visual_mo_6.png') no-repeat bottom right;
    background-color: #3ccdff;
    height: 420px;
    padding: 0;
    align-items: normal;
  }
  
  .gallery_list {
    margin: 0;
  }
  
  .gallery_list ul li {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 10%;
  }
  
  .gallery_list ul li:nth-child(3n) {
    margin-right: 4%;
  }
  
  .gallery_list ul li:nth-child(2n) {
    margin-right: 0;
  }
  
  .gallery_list ul li h3 {
    font-size: 16px
  }
  
  .gallery_list ul li .img {
    margin-bottom: 10px;
  }
  
  .gallery_pop_wr {
    display: block;
    width: 100%;
    height: 100%;
  }
  
  .gallery_pop {
    overflow-y: auto;
  }
  
  .gallery_pop_wr > div {
    width: 100%;
  }
  
  .gallery_pop.active {
    display: block;
  }
  
  .gallery_pop .close {
    position: fixed;
    z-index: 2;
  }
  
  .gallery_pop_wr .info {
    padding: 30px 20px;
  }
  
  .gallery_pop_wr .info h2 {
    font-size: 24px;
  }
  
  .gallery_pop_wr .info .btn {
    margin: 20px 0 0;
  }
  
  .gv_top .gv_tit h3 {
    font-size: 20px;
    margin: 30px 0 20px;
  }
  
  .gv_top .gv_tit p {
    font-size: 14px;
  }
  
  .gv_top .gv_tit ul {
    margin: 20px 0;
    padding: 10px 0;
  }
  
  .gv_top .gv_tit ul li {
    font-size: 13px
  }
  
  .gv_top .gv_tit ul li b {
    width: 40px;
    margin-right: 7px;
  }
  
  .gv_top .gv_tit {
    width: 100%;
  }
  
  .gv_top .gv_tit a {
    width: 100%;
    padding: 10px;
  }
  
  .gv_content {
    margin: 50px 0 30px;
    padding: 0;
  }
  
  .gv_content > div {
    padding: 30px 0;
  }
  
  .gv_content h4 {
    font-size: 20px
  }
  
  .gv_youtube {
    margin: 20px 0;
  }
  
  .book_design {
    padding: 50px 0;
  }
  
  .cont_tit {
    font-size: 24px;
    margin: 0 0 20px
  }
  
  .tb_basic {
    font-size: 13px;
    margin: 0 0 30px
  }
  
  .tb_basic th {
    padding: 10px
  }
  
  .tb_basic td {
    padding: 10px
  }
  
  .tb_basic th.title {
    width: 100%;
  }
  
  .tb_basic .date {
    display: none;
  }
  
  .tb_basic .num {
    display: none;
  }
  
  .cont_ip ul {
    padding: 30px 0;
  }
  
  .cont_ip ul li p {
    margin: 0;
  }
  
  input[type=password], input[type=text] {
    line-height: 40px;
    margin: 5px 0;
  }
  
  .filebox .upload-name {
    height: 40px;
    line-height: 40px;
    font-size: 12px
  }
  
  .filebox label {
    bottom: 10px;
    padding: 6px 10px;
    width: 100%;
  }
  
  .cont_ip ul li {
    margin: 0 0 10px
  }
  
  .book_design .point_t {
    font-size: 14px;
    margin: 0 0 10px
  }
  
  .book_design .point_t:after {
    top: 4px
  }
  
  .book_design .img_box {
    margin: 30px 0;
  }
  
  .book_design .tb_basic {
    margin: 0 0 50px
  }
  
  .cont_tit:not(:first-child) {
    margin: 50px 0 30px;
    font-size: 20px;
  }
  
  .book_design .box_list {
    flex-wrap: wrap;
    justify-content: start
  }
  
  .book_design .box_list li {
    width: 50%;
    margin-bottom: 10%;
    padding: 0 10px;
  }
  
  .book_design .box_list li img {
    width: 70%
  }
  
  .book_design .join_process {
    flex-wrap: wrap;
    justify-content: start
  }
  
  .book_design .join_process li {
    justify-content: start;
    margin: 0;
  }
  
  .book_design .join_process li:not(:last-child):after {
    right: 50%;
    margin-top: 20px;
    transform: rotate(90deg);
    margin-right: -17px;
  }
  
  .book_design .join_process li .num {
    width: 40px;
    height: 40px;
    line-height: 40px
  }
  
  .book_design .link_box .big_t {
    font-size: 24px;
  }
  
  .book_design .link_box .link_btn {
    font-size: 16px;
    display: block;
    width: 100%;
    padding: 15px
  }
  
  .idea_box {
    padding: 50px 0;
  }
  
  .cont_ip ul li select {
    height: 40px;
    line-height: 40px;
  }
  
  .sub_banner {
    padding: 20px 0;
  }
  
  .sub_banner > div {
    width: 100%;
  }
  
  /* search */
  .allsearch .cont_tit {
    padding: 50px 0 0;
  }
  
  .allsearch .sch_input input {
    line-height: 30px
  }
  
  .allsearch .sch_btn {
    width: 56px;
    height: 56px
  }
  
  .allsearch .allsearch_box {
    margin: 30px auto;
  }
  
  .allsearch .sch_tit {
    margin: 0 0 20px;
    font-size: 18px
  }
  
  .allsearch .search_list li {
    padding: 20px 0
  }
  
  .allsearch {
    margin: 0 auto 50px
  }
  
  /* member */
  .member {
    margin: 70px auto;
  }
  
  .member .login_ip {
    padding: 20px 0 0;
  }
  
  .member .member_step {
    margin: 30px 0;
    display: none;
  }
  
  .member .member_step li {
    font-size: 12px;
    border-radius: 0;
  }
  
  .member .member_tit {
    margin: 0 0 30px
  }
  
  .member .join_box {
    display: block
  }
  
  .member .join_box:after {
    display: none;
  }
  
  .member .join_box > div {
    width: 100%;
    padding: 40px;
    background: #f4f4f4;
    margin-top: 20px;
  }
  
  .member .join_box .login_sns {
    margin: 30px 0 0;
  }
  
  .member h2 {
    font-size: 18px
  }
  
  .member .priva_box {
    padding: 20px 0;
  }
  
  .member .priva_box li {
    font-size: 16px;
    padding: 15px 0;
  }
  
  .btn_box {
    display: flex;
    justify-content: center;
  }
  
  .cont_ip ul li.adress button {
    padding: 6px 10px;
    font-size: 12px
  }
  
  .member .join_certi {
    margin: 30px 0;
    display: block;
  }
  
  .member .join_certi:after {
    display: none;
  }
  
  .member .join_certi > div {
    width: 100%;
    padding: 30px
  }
  
  .member .join_certi > div:first-child {
    border-bottom: 1px solid #ddd;
  }
  
  .member .join_certi p {
    font-size: 14px;
  }
  
  .member .join_complete2 {
    margin: 50px 0;
  }
  
  .member .join_complete2 h2 {
    font-size: 18px;
    margin: 20px 0 10px
  }
  
  /* mypage */
  .cont_ip .my_certifi {
    margin: 30px 0;
    display: block;
  }
  
  .cont_ip .my_certifi:after {
    display: none;
  }
  
  .cont_ip .my_certifi > div {
    width: 100%;
    padding: 30px
  }
  
  .cont_ip .my_certifi > div:first-child {
    border-bottom: 1px solid #ddd;
  }
  
  .cont_ip .my_certifi p {
    font-size: 14px;
  }
  
  .idea_complete {
    margin: 0 0 50px
  }
  
  .mp_content {
    display: block;
  }
  
  .mp_content .mp_nav {
    width: 100%;
    margin: 30px 0 0;
  }
  
  .mp_content .mp_nav ul {
    display: flex;
    padding: 10px;
    flex-wrap: wrap;
  }
  
  .mp_content .mp_nav ul li {
    width: 50%;
  }
  
  .mp_content .mp_nav ul li a {
    padding: 5px;
  }
  
  .mp_content .mp_nav_tit {
    padding: 20px 15px
  }
  
  .mp_content .mp_nav_tit h1 {
    margin: 0;
  }
  
  .mp_content .book_content {
    width: 100%;
  }
  
  .mp_content .book_content .wr {
    padding: 0;
  }
  
  /* about */
  .about_cont {
    padding: 50px 0;
  }
  
  .about_cont .cont_tit {
    font-size: 30px;
  }
  
  .about_cont p {
    font-size: 16px
  }
  
  .about_cont .wr {
    padding-bottom: 280px;
  }
  
  /* 찾아오시는 길 */
  .location_cont {
    padding: 50px 0;
  }
  
  .location_cont ul li {
    font-size: 15px
  }
  
  .location_cont ul li span {
    width: auto;
    margin-right: 10px;
  }
  
  .location_cont .map_btn {
    position: relative;
    top: auto;
    right: auto;
    height: 50px;
    line-height: 50px;
    width: 100%;
    margin: 30px 0 0;
  }
  
  /* 약관 */
  .terms_cont {
    padding: 50px 0;
  }
  
  .terms_cont h3 {
    margin: 30px 0 15px;
    font-size: 18px;
  }
  
  .terms_cont h4 {
    margin: 20px 0 10px;
    font-size: 16px;
  }
  
  .terms_cont p {
    font-size: 14px;
  }
  
  .terms_cont td, .terms_cont th {
    padding: 10px 5px
  }
  
  .modal_content {
    width: auto;
    padding: 0 40px;
  }
  
  .modal .modal_content {
    padding: 10px;
    margin: 0 20px;
  }
  
  .book_content .tit_depth > p {
    font-size: 14px;
  }
  
  .modal_imgs .modal_hd > div > img {
    width: 82px;
    height: auto;
  }
  
  .modal_imgs .modal_hd > div > h3 {
    font-size: 14px;
  }
  
  .modal_imgs .modal_container {
    width: calc(100% - 40px);
    padding: 10px;
    margin: 0 40px;
    height: auto;
  }
  
  .modal_imgs .modal_hd {
    padding-bottom: 10px;
  }
  
  .modal_imgs .modal_hd > div {
    gap: 5px;
  }
  
  .modal_imgs .modal_hd > div > span {
    width: 30px;
    height: 30px;
  }
  
  .modal_imgs .modal_hd > div .download {
    width: 30px;
    height: 30px;
  }
  
  .modal_container .modal_cont {
    flex-direction: column;
    row-gap: 10px;
  }
  
  .modal_container .modal_cont .imgs_area {
    max-width: 100%;
    width: 100%;
    height: 248px;
    /* height: 260px; */
    row-gap: 10px;
  }
  
  .modal_container .modal_cont .img_desc {
    max-width: 100%;
    width: 100%;
    height: 150px;
    row-gap: 10px;
  }
  
  .modal_container .modal_cont .imgs_area .imgs_box {
    row-gap: 10px;
  }
  
  .modal_container .modal_cont .imgs_area .imgs_box .imgs {
    height: 171px;
  }
  
  #pdf-container {
    width: 100%;
    margin: 20px;
  }
  
  #pdf-container .pdf-container-inner {
    flex-direction: column;
  }
  
  #pdf-container .canvas-box {
    /* padding-top: 140%; */
    padding-top: 127%;
  }
  
  .schoolBannerSwiper .swiper-slide img.pc_ver {
    display: none;
  }
  
  .schoolBannerSwiper .swiper-slide img.mo_ver {
    display: block;
  }
  
  .sub_top_visual.sub_visual_5 .sub_visual_tit {
    margin-top: 40px;
  }
  
  .sub_top_visual.sub_visual_6 .sub_visual_tit {
    margin-top: 40px;
  }
  
  .sub_top_visual.sub_visual_5 .sub_visual_tit .desc1 {
    margin-bottom: 0;
  }
  
  .sub_top_visual.sub_visual_5 .sub_visual_tit .desc2 br {
    display: block;
  }
  
  .sub_top_visual.sub_visual_6 .sub_visual_tit .desc2 br {
    display: block;
  }
  
  .eduTabs .tab-links {
    flex-wrap: wrap;
  }
  
  .eduTabs .tab-links a {
    width: auto;
    height: auto;
    padding: 10px 44px;
  }
  
  .eduTopArea > p {
    font-size: 28px;
    line-height: 39px;
  }
  
  .eduTopArea .bold {
    font-size: 28px;
    line-height: 39px;
    margin-bottom: 4px;
  }
  
  .eduTopArea > p > br {
    display: block;
  }
  
  .eduTabs .tab-content .tab > ul > li {
    width: 100%;
    height: auto;
    padding: 40px;
    justify-content: space-between;
    flex-wrap: nowrap;
    
  }
  
  .eduTabs .tab-content .tab .img_icon {
    width: 43px;
    height: 43px;
    flex-shrink: 0;
  }
  
  .eduTabs .tab-content .tab .img_icon > img {
    display: none;
  }
  
  .eduTabs .tab-content .tab .img_icon > img.mo_ver {
    display: block;
    width: 100%;
  }
  
  .eduTabs .tab-content .tab .top_area {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }
  
  .eduTabs .tab-content .tab .img_tit {
    font-size: 32px;
    font-weight: 700;
    line-height: normal;
  }
  
  .eduTabs .tab-content .tab .img_tit_desc {
    max-width: 353px;
    width: 100%;
    font-size: 26px;
    line-height: 36px;
  }
  
  .eduTabs .tab-content .tab .img_tit_desc > br {
    display: block;
  }
  
  .eduTabs .tab-content .content {
    row-gap: 20px;
  }
  
  .hover_box {
    position: static;
    left: unset;
    top: unset;
    background: unset !important;
    width: unset;
    height: unset;
    opacity: 1;
    transform: unset;
  }
  
  .hover_box .icon_box {
    position: static;
    transform: unset;
    z-index: unset;
  }
  
  .hover_box .icon_box .icon {
    width: 64px;
    height: 64px;
  }
  
  .hover_box .icon_box .icon > img {
    display: none;
  }
  
  .hover_box .icon_box .icon > img.mo_ver {
    display: block;
    width: 100%;
  }
  
  .eduTabs .tab-content .tab > ul > li:hover {
    /* pointer-events: none; */
  }
  
  #videoModal .img_name {
    font-size: 16px;
    text-align: left;
  }
  
  #videoModal .tit_depth {
    font-weight: 500;
  }
  
  .hd_pops {
  }
  
  .hd_pops_footer .pop_closeBtn > i {
    font-size: 16px;
  }
  
  .popup_wrap {
    display: block;
    position: static;
    transform: unset;
  }
  
  .hd_popup_area {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    width: calc(100% - 100px);
  }
  
  .hd_popup_area:nth-of-type(2) {
    top: 52%;
    left: 52%;
  }
  
  .hd_popup_area:nth-of-type(3) {
    top: 54%;
    left: 54%;
  }
  
  .hd_popup_area:nth-of-type(4) {
    top: 56%;
    left: 56%;
  }
  
}