html {
    font-size:16px;
    line-height:1.5;
    color:#404040;
  }
  
  #skip-link a:focus{top:0}
  
  header .logo{
    display:block;
    width:17.25rem;
    height:3.525rem;
    background:url(/images/logo-ww.png) no-repeat 0 0;
    background-size:contain;
    text-indent:-9999px;
  }
  header.header-main .logo{
    background-image:url(/images/logo-main.png);
  }
  
  .menu-main > li > ul{
    display:block;
    overflow: visible;
  }
  .menu-main > li > ul li a{
    position:relative;
    display:block;
  }
  .menu-main > li > ul li a:hover:before{
    content:"";
    display:block;
    width:calc(100% + 20px);
    height:100%;
    position:absolute;
    left:-10px;
    top:0;
    background:#F5F5F5;
    z-index:-1;
  }
  
  /* swiper */
  .swiper-pagination.swiper-pagination-bullets{
    bottom:1.5rem;
  }
  .swiper-pagination.swiper-pagination-bullets > span{
    width:0.75rem;
    height:0.75rem;
    border-radius:0.375rem;
    border:1px solid #fff;
    background-color:transparent;
    opacity:1;
  }
  .swiper-pagination.swiper-pagination-bullets > span.swiper-pagination-bullet-active{
    background-color:#fff;
  }
  
  .main-slider .swiper-slide > div{
    height:42.5rem;
  }
  .item-slider .swiper-slide > div{
    height:42.5rem;
  }
  .exhibit-slider .swiper-slide > div{
    height:28.125rem;
  }
  .pager-thumb01 li.current a{
    position:relative;
  }
  .pager-thumb01 li.current a:after{
    content:"";
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    box-sizing: border-box;
    border:4px solid #8A64EA;
  }
  .education-finished > dl > dd{
    height:33.125rem;
    background-image:url(/images/bg-education-finished.png)
  }
  
  
  .masonry01 .grid-item, .masonry01 .grid-sizer{
    width:21.6%
  }
  .masonry01 .gutter-sizer{
    width:4.5333333333%
  }
  
  footer .logo{
    display:block;
    width:25.5rem;
    height:7.75rem;
    background:url(/imag/logo-footer-ww.png) no-repeat 0 0;
    background-size:contain;
    text-indent:-9999px;
  }
  
  .list-gallary01{
    gap:2.5rem 1.6129% ;
  }
  .list-gallary01 > li{
    width:23.79%;
  }
  .list-gallary01 > li > span:first-of-type{
    padding-bottom:141.35%;
  }
  
  .list-gallary02 > li{
    width:21.6%;
  }
  .list-gallary02 > li > span:first-of-type{
    padding-bottom:118.66%;
  }
  .list-gallary03 > div{
    padding-bottom:100%;
  }
  .list-gallary03 > ul{
    gap:4%;
  }
  .list-gallary03 > ul > li{
    width:48% !important;
    padding-bottom:50%;
    margin-bottom:4%;
  }
  
  
  /*
  
  .list-board01 >  li > a > span:last-of-type{
    flex-basis:24%;
  }
  .list-board01 >  li > a > span:last-of-type >span{
    padding-bottom:67.8%;
  }
  .list-board02 >  li > a > span:first-of-type{
    flex-basis:24%;
  }
  .list-board02 >  li > a > span:first-of-type >span{
    padding-bottom:67.8%;
  }
  */
  .menu-tab01 li.checked a{
    background-color:#8A64EA;
    border-color:#8A64EA;
    color:#fff;
  }
  
  select {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='https://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%2371717a' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
    background-position: right 0rem center;
    background-repeat: no-repeat;
    background-size: 1.5em 1.5em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
  }
  
  
  /*레이아웃 모바일모드 변환*/
  @media screen and (max-width:1023px) {
  
    header .logo{
      width:230px;
      height:40px;
    }
    footer .logo{
      width:230px;
      height:40px;
    }
    .main-slider .swiper-slide > div{
      height:634px;
    }
    .main-slider .item-slide > div{
      height:634px;
    }
  
  }
  /*모바일 폰*/
  @media screen and (min-width: 320px) and (max-width: 767px) {
    html {
      font-size:14px
    }
    .masonry01 .grid-item, .masonry01 .grid-sizer{
      width:48%
    }
    .masonry01 .gutter-sizer{
      width:4%
    }
    .list-gallary02 > li{
      width:47.5%;
    }
    /*
    .list-board02 >  li > a > span:first-of-type{
      flex-basis:40%;
    }
    */
    .education-finished > dl > dd{
      height:300px;
    }
  }
  
  /* 태블릿 모드 세로 */
  @media all and (min-width: 768px) and (max-width:1023px) {
    html {
      font-size:14px
    }
  }
  
  
  /* 태블릿 가로 */
  @media all and (min-width: 1024px) and (max-width: 1279px) {
    html {
      font-size:14px
    }
  }
  
  /* PC 화면 */
  @media (min-width:1280px) {
    html {
      font-size:16px;
    }
  }
  
  
  /* micro width */
  @media screen and (max-width: 350px) {
    html {
      font-size: 12px
    }
  }