/*
 * K-BOOKS MOBILE RESPONSIVE v3.1
 * 360 / 390 / 412 / 430 / 768 / 900px 대응
 * 기존 PC 레이아웃은 건드리지 않고 모바일에서만 재배치
 */

/* ---------------------------------------------------------
 * TABLET / MOBILE COMMON
 * --------------------------------------------------------- */
@media (max-width:900px){

  html,body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  body *{
    box-sizing:border-box;
  }

  img,svg,video,canvas,iframe{
    max-width:100%!important;
  }

  #wrapper,
  #container_wr,
  #container,
  .icd-home,
  .icd-home-section,
  .icd-home-shell,
  .icd-publish-shell,
  .kb-mk-shell{
    min-width:0!important;
    max-width:100%!important;
  }

  /* HEADER ------------------------------------------------ */
  html body .icd-util .icd-shell,
  html body .icd-brand-row .icd-shell,
  html body .icd-gnb .icd-shell{
    width:100%!important;
    max-width:none!important;
  }

  html body .icd-util-inner{
    min-height:36px!important;
    padding:0 12px!important;
  }

  html body .icd-util-left{
    display:none!important;
  }

  html body .icd-account{
    width:100%!important;
    display:flex!important;
    gap:0!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    white-space:nowrap!important;
  }

  html body .icd-account::-webkit-scrollbar{
    display:none!important;
  }

  html body .icd-account>a,
  html body .icd-account-learning{
    flex:0 0 auto!important;
  }

  html body .icd-account>a,
  html body .icd-account-learning-btn{
    min-height:36px!important;
    padding:0 9px!important;
    font-size:10px!important;
  }

  html body .icd-brand-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
    gap:10px!important;
    align-items:center!important;
    padding:11px 14px!important;
  }

  html body .icd-kbooks-logo-picture,
  html body .icd-kbooks-logo{
    display:block!important;
    width:auto!important;
    max-width:205px!important;
    height:auto!important;
  }

  html body .icd-mobile-menu-btn{
    display:flex!important;
    width:44px!important;
    height:44px!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid #dce3e5!important;
    border-radius:10px!important;
    background:#fff!important;
  }

  html body .icd-search{
    display:none!important;
  }

  html body .icd-gnb{
    position:static!important;
    width:100%!important;
    max-height:none!important;
    overflow:visible!important;
  }

  html body .icd-gnb .icd-gnb-shell{
    display:block!important;
    padding:6px 14px 14px!important;
  }

  html body .icd-gnb .icd-gnb-list{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  html body .icd-gnb .icd-gnb-item{
    display:block!important;
    width:100%!important;
    margin:0!important;
    border-bottom:1px solid #edf1f2!important;
  }

  html body .icd-gnb .icd-gnb-link{
    width:100%!important;
    min-height:48px!important;
    height:auto!important;
    padding:11px 2px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    white-space:normal!important;
    word-break:keep-all!important;
    font-size:14px!important;
    line-height:1.35!important;
  }

  html body .icd-submenu{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    margin:0 0 8px!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:#f5f7f8!important;
  }

  html body .icd-submenu ul{
    display:block!important;
    margin:0!important;
    padding:5px 10px!important;
  }

  html body .icd-submenu a{
    display:block!important;
    padding:10px 8px!important;
    font-size:12px!important;
    line-height:1.45!important;
    white-space:normal!important;
    word-break:keep-all!important;
  }

  html body .icd-gnb .icd-gnb-quick{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    margin:12px 0 0!important;
    padding:0!important;
    white-space:normal!important;
  }

  html body .icd-gnb .icd-gnb-quick>a,
  html body .icd-gnb .icd-gnb-quick>button{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    margin:0!important;
    padding:8px 7px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    border:1px solid #e0e6e8!important;
    border-radius:9px!important;
    background:#f8fafb!important;
    font-size:10px!important;
    line-height:1.25!important;
    text-align:center!important;
    white-space:normal!important;
  }

  html body .icd-gnb-quick em{
    display:none!important;
  }

  html body .icd-mobile-search{
    display:block!important;
    padding:9px 12px 11px!important;
  }

  html body .icd-mobile-search form{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
  }

  html body .icd-mobile-search input{
    min-width:0!important;
    width:100%!important;
  }

  /* MAIN COMMON ------------------------------------------- */
  html body .icd-home-shell,
  html body .icd-publish-shell{
    width:100%!important;
    max-width:none!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }

  html body .icd-home-section{
    padding-top:46px!important;
    padding-bottom:46px!important;
  }

  html body .icd-section-title{
    display:block!important;
    margin-bottom:22px!important;
  }

  html body .icd-section-title>p{
    max-width:none!important;
    margin-top:10px!important;
    font-size:13px!important;
    line-height:1.7!important;
  }

  /* HERO -------------------------------------------------- */
  html body .icd-home-hero{
    padding:38px 0 34px!important;
  }

  html body .icd-home-hero-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:28px!important;
    align-items:start!important;
  }

  html body .icd-home-hero-copy{
    min-width:0!important;
  }

  html body .icd-kicker{
    font-size:9px!important;
    letter-spacing:.12em!important;
    line-height:1.45!important;
  }

  html body .icd-home-hero h1{
    margin-top:12px!important;
    font-size:clamp(32px,9vw,46px)!important;
    line-height:1.12!important;
    letter-spacing:-.055em!important;
    word-break:keep-all!important;
  }

  html body .icd-home-hero-copy>p{
    margin-top:16px!important;
    font-size:14px!important;
    line-height:1.75!important;
    word-break:keep-all!important;
  }

  html body .icd-home-search{
    width:100%!important;
    margin-top:20px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 52px!important;
  }

  html body .icd-home-search input{
    min-width:0!important;
    width:100%!important;
    height:48px!important;
    padding:0 13px!important;
    font-size:13px!important;
  }

  html body .icd-home-search button{
    width:52px!important;
    min-width:52px!important;
    height:48px!important;
    padding:0!important;
  }

  html body .icd-home-search button span{
    display:none!important;
  }

  html body .icd-home-keywords{
    width:100%!important;
    display:flex!important;
    gap:7px!important;
    margin-top:12px!important;
    padding-bottom:4px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  html body .icd-home-keywords::-webkit-scrollbar{
    display:none!important;
  }

  html body .icd-home-keywords a{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    font-size:10px!important;
  }

  html body .icd-home-ebook-quick{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    width:100%!important;
    margin-top:17px!important;
  }

  html body .icd-home-ebook-quick>span,
  html body .icd-home-ebook-quick>a{
    width:100%!important;
    min-width:0!important;
    padding:10px 12px!important;
    white-space:normal!important;
    word-break:keep-all!important;
    font-size:11px!important;
    line-height:1.45!important;
  }

  html body .icd-home-cover{
    width:min(48vw,190px)!important;
    max-width:190px!important;
    margin:0 auto!important;
    justify-self:center!important;
  }

  /* TWO TRACKS -------------------------------------------- */
  html body .kb-domain-section{
    padding:40px 0 24px!important;
  }

  html body .kb-domain-head{
    display:block!important;
    margin-bottom:18px!important;
  }

  html body .kb-domain-head h2{
    font-size:29px!important;
    line-height:1.2!important;
  }

  html body .kb-domain-head p{
    max-width:none!important;
    margin-top:10px!important;
    font-size:13px!important;
  }

  html body .kb-domain-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  html body .kb-domain-card{
    min-width:0!important;
    min-height:0!important;
    padding:22px!important;
  }

  html body .kb-domain-copy .no{
    margin-bottom:9px!important;
    font-size:9px!important;
    letter-spacing:.11em!important;
  }

  html body .kb-domain-copy h3{
    font-size:27px!important;
  }

  html body .kb-domain-copy p{
    margin-bottom:15px!important;
    font-size:13px!important;
    line-height:1.7!important;
  }

  html body .kb-domain-links{
    gap:5px!important;
  }

  html body .kb-domain-links span{
    padding:6px 8px!important;
    font-size:9px!important;
  }

  html body .kb-domain-status{
    min-height:38px!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 11px!important;
    text-decoration:none!important;
  }

  html body .kb-domain-covers{
    min-width:0!important;
  }

  /* MUST KNOW --------------------------------------------- */
  html body .kb-mk-home{
    padding:48px 0!important;
  }

  html body .kb-mk-shell{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  html body .kb-mk-layout{
    grid-template-columns:1fr!important;
    gap:26px!important;
  }

  html body .kb-mk-visual{
    order:-1!important;
    min-height:210px!important;
  }

  html body .kb-mk-head h2{
    font-size:31px!important;
    line-height:1.2!important;
  }

  html body .kb-mk-lead{
    margin:14px 0 17px!important;
    font-size:14px!important;
    line-height:1.75!important;
  }

  html body .kb-mk-flowline{
    gap:5px!important;
    margin-bottom:18px!important;
    font-size:10px!important;
    line-height:1.5!important;
  }

  html body .kb-mk-products{
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }

  html body .kb-mk-product{
    min-width:0!important;
    padding:13px!important;
  }

  html body .kb-mk-product b{
    font-size:14px!important;
    line-height:1.45!important;
  }

  html body .kb-mk-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }

  html body .kb-mk-actions a{
    min-width:0!important;
    min-height:42px!important;
    padding:7px 9px!important;
    font-size:10px!important;
    text-align:center!important;
  }

  html body .kb-mk-visual img,
  html body .kb-mk-placeholder{
    width:124px!important;
  }

  /* PUBLISH / BOOK CARDS ---------------------------------- */
  html body .icd-publish-strip{
    padding:36px 0 14px!important;
  }

  html body .icd-publish-head{
    display:block!important;
    margin-bottom:16px!important;
  }

  html body .icd-publish-head p{
    max-width:none!important;
    margin-top:8px!important;
    font-size:13px!important;
  }

  html body .icd-publish-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html body .icd-publish-card{
    min-height:0!important;
    grid-template-columns:92px minmax(0,1fr)!important;
    gap:14px!important;
    padding:15px!important;
    border-radius:15px!important;
  }

  html body .icd-publish-card h3{
    font-size:18px!important;
  }

  html body .icd-publish-card p{
    margin-bottom:11px!important;
    font-size:12px!important;
  }

  html body .icd-publish-actions{
    gap:6px!important;
  }

  html body .icd-publish-actions a,
  html body .icd-publish-actions span{
    min-height:35px!important;
    padding:0 9px!important;
    font-size:10px!important;
  }

  /* EXISTING HOME GRIDS ----------------------------------- */
  html body .icd-open-learning,
  html body .icd-story-layout,
  html body .icd-master-layout,
  html body .icd-archive-box{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }

  html body .icd-topic-grid,
  html body .icd-track-grid,
  html body .icd-six-grid,
  html body .lit-index-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  html body .icd-topic-grid>a,
  html body .icd-track-card,
  html body .icd-six-card{
    min-width:0!important;
  }

  html body .icd-story-image,
  html body .icd-master-cover{
    width:min(62vw,260px)!important;
    max-width:260px!important;
    margin:0 auto!important;
  }

  /* EBOOK 3 CARDS ----------------------------------------- */
  html body .icd-ebook-home-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  html body .icd-ebook-home-card{
    display:grid!important;
    grid-template-columns:96px minmax(0,1fr)!important;
    gap:15px!important;
    align-items:center!important;
    min-height:0!important;
    padding:15px!important;
  }

  html body .icd-ebook-home-card img{
    width:96px!important;
    height:auto!important;
    max-height:138px!important;
    object-fit:cover!important;
  }

  html body .icd-ebook-home-card h3{
    font-size:18px!important;
    line-height:1.35!important;
  }

  html body .icd-ebook-home-card p{
    font-size:12px!important;
    line-height:1.6!important;
  }

  /* COMMUNITY --------------------------------------------- */
  html body .icd-update-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  html body .icd-update-head{
    padding:17px!important;
  }

  html body .icd-update-list{
    padding:3px 17px 10px!important;
  }

  html body .icd-community-mini{
    grid-template-columns:1fr!important;
  }

  html body .icd-community-mini>a{
    padding:17px!important;
    border-right:0!important;
    border-bottom:1px solid #e2e8e8!important;
  }

  html body .icd-community-mini>a:last-child{
    border-bottom:0!important;
  }

  html body .icd-community-cta{
    display:block!important;
    padding:19px!important;
  }

  html body .icd-community-cta a{
    display:inline-flex!important;
    margin-top:13px!important;
  }

  /* ARCHIVE ----------------------------------------------- */
  html body .icd-archive-stats{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }

  html body .icd-archive-stats>div{
    min-width:0!important;
    padding:12px 6px!important;
  }

  html body .icd-archive-stats b{
    font-size:20px!important;
  }

  html body .icd-archive-stats span{
    font-size:9px!important;
    line-height:1.35!important;
  }

  /* FOOTER ------------------------------------------------ */
  html body .icd-footer-layout-v3{
    display:block!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }

  html body .icd-footer-brand-v3{
    margin-bottom:25px!important;
  }

  html body .icd-footer-logo-v3{
    max-width:185px!important;
    height:auto!important;
  }

  html body .icd-footer-nav-v3{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:24px 18px!important;
  }

  html body .icd-footer-bottom-v3{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:6px!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }
}

/* ---------------------------------------------------------
 * PHONE 640
 * --------------------------------------------------------- */
@media (max-width:640px){

  html body .icd-home-shell,
  html body .icd-publish-shell{
    padding-left:15px!important;
    padding-right:15px!important;
  }

  html body .icd-home-hero{
    padding-top:30px!important;
  }

  html body .icd-home-hero h1{
    font-size:clamp(30px,9.4vw,39px)!important;
  }

  /* track card: 표지를 위로 보내 텍스트 폭 확보 */
  html body .kb-domain-card{
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
    padding:19px!important;
  }

  html body .kb-domain-covers{
    order:-1!important;
    justify-content:flex-start!important;
    min-height:126px!important;
    padding-left:7px!important;
  }

  html body .kb-domain-covers img{
    width:78px!important;
  }

  html body .kb-domain-card.processing .kb-domain-covers img:first-child{
    width:82px!important;
  }

  html body .kb-domain-covers img+img{
    margin-left:-21px!important;
    transform:translateY(13px)!important;
  }

  html body .kb-domain-status{
    display:flex!important;
    width:100%!important;
  }

  html body .kb-mk-products{
    grid-template-columns:1fr!important;
  }

  html body .kb-mk-actions{
    grid-template-columns:1fr!important;
  }

  html body .icd-topic-grid,
  html body .icd-track-grid,
  html body .icd-six-grid,
  html body .lit-index-grid{
    grid-template-columns:1fr!important;
  }

  html body .icd-publish-card{
    grid-template-columns:78px minmax(0,1fr)!important;
    gap:12px!important;
  }

  html body .icd-publish-cover{
    width:78px!important;
  }

  html body .icd-ebook-home-card{
    grid-template-columns:82px minmax(0,1fr)!important;
    gap:12px!important;
    padding:13px!important;
  }

  html body .icd-ebook-home-card img{
    width:82px!important;
    max-height:118px!important;
  }

  html body .icd-archive-stats{
    grid-template-columns:1fr 1fr!important;
  }

  html body .icd-archive-stats>div:last-child{
    grid-column:1/-1!important;
  }
}

/* ---------------------------------------------------------
 * SMALL PHONE 430 / 390 / 360
 * --------------------------------------------------------- */
@media (max-width:430px){

  html body .icd-brand-inner{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  html body .icd-kbooks-logo-picture,
  html body .icd-kbooks-logo{
    max-width:176px!important;
  }

  html body .icd-gnb .icd-gnb-shell{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  html body .icd-gnb .icd-gnb-quick{
    grid-template-columns:1fr 1fr!important;
  }

  html body .icd-home-shell,
  html body .icd-publish-shell,
  html body .kb-mk-shell{
    padding-left:13px!important;
    padding-right:13px!important;
  }

  html body .icd-home-hero h1{
    font-size:31px!important;
  }

  html body .icd-home-cover{
    width:150px!important;
  }

  html body .kb-domain-head h2,
  html body .kb-mk-head h2{
    font-size:27px!important;
  }

  html body .kb-mk-visual{
    min-height:186px!important;
  }

  html body .kb-mk-visual img,
  html body .kb-mk-placeholder{
    width:106px!important;
  }

  html body .kb-mk-visual img+img,
  html body .kb-mk-placeholder+.kb-mk-placeholder,
  html body .kb-mk-visual img+.kb-mk-placeholder,
  html body .kb-mk-placeholder+img{
    margin-left:-28px!important;
    transform:translateY(16px)!important;
  }

  html body .icd-publish-card{
    grid-template-columns:70px minmax(0,1fr)!important;
  }

  html body .icd-publish-cover{
    width:70px!important;
  }

  html body .icd-ebook-home-card{
    grid-template-columns:74px minmax(0,1fr)!important;
  }

  html body .icd-ebook-home-card img{
    width:74px!important;
  }

  html body .icd-footer-nav-v3{
    grid-template-columns:1fr!important;
    gap:22px!important;
  }
}

@media (max-width:370px){

  html body .icd-gnb .icd-gnb-quick{
    grid-template-columns:1fr!important;
  }

  html body .icd-home-hero h1{
    font-size:29px!important;
  }

  html body .icd-home-search{
    grid-template-columns:minmax(0,1fr) 46px!important;
  }

  html body .icd-home-search button{
    width:46px!important;
    min-width:46px!important;
  }

  html body .icd-publish-card,
  html body .icd-ebook-home-card{
    grid-template-columns:64px minmax(0,1fr)!important;
  }

  html body .icd-publish-cover,
  html body .icd-ebook-home-card img{
    width:64px!important;
  }
}
