@charset "UTF-8";
@import url("sp-under.css");



@media screen and (max-width: 768px) {
  
  /*header*/
  header nav{
    display: none;
  }
  
  #hum-btn
  ,#l-nav{
    display: block;
  }
  .lang-switch{
    position: fixed;
    right: 60px;
    top: min(40px,4.5vw)
  }
  .home .header-inner .lang-switch{
    bottom: auto;
    top: min(40px,5vw);
    left: auto;
    right: 60px;
    transform:none;
  }
  /*key*/
   #key.home{
    aspect-ratio: 1/.7;
  }
    
  /*banner*/
  .bnr-slider-blc.inner{
    padding-left: 0;
    padding-right: 0;
  }
  .bnr-slider-wrap .slide-next{
    right: 10px;
  }
  .bnr-slider-wrap .slide-prev{
    left: 10px;
  }
  
  /*profile*/
  
  .sec-profile-blc{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    background: none;
  }
  .sec-profile-blc .thumb{
    position: relative;
    right: auto;
    top: auto;
    margin-left: 0;
    width: 100%;
    
  }
  .sec-profile-blc .cmnt-wrap{
    width: calc(100% - 40px);
    background: var(--gra-nvy);
    margin-top: min(-80px,-10vw);
    border-radius: 5px;
  }
  .sec-profile-blc .cmnt-wrap .cmnt{
    width: 100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center;
  }
  .sec-profile-blc .cmnt-wrap .cmnt .in-text{
    width: 100%;
    margin-top: 2em;
  }
  .sec-profile-blc .cmnt-wrap .cmnt .btn-wrap{
    width: 100%;
    justify-content: center;
  }
  
  /*fan*/
  .sec-funclub-blc{
    background-size: auto 30%;
  }
  
}

@media screen and (max-width: 480px) {

  body{
    font-size: 3.6vw;
  }
  
  .round-btn{
    width: min(200px,100%);
    
  }
  .round-btn > *{
    aspect-ratio:1/0.225;
  }
  /*header*/
  
  .home header .logo{
/*    display: none;*/
    margin-left: auto;
    opacity: 0;
  }
  .home header.open .logo{
    opacity: 1;
  } 
  #hum-btn{
    right: auto;
    left: 20px;
  }
  .lang-switch{
    right: auto;
    left: 60px;
  }
  .hum-set{
    right: auto;
    left: 20px;
    -webkit-flex-direction: row-reverse;
    -moz-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    -o-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
  .l-nav-inner{
    padding-top: 20vw;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 150px;
  }
  .l-nav-header{
    opacity: 1;
  }
  .l-nav-inner .page-navigation{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    gap:5vw;
  }
  .home .header-inner .lang-switch{
    right: auto;
    left: 60px;
  }
  .home .open .header-inner .lang-switch > *{
    border: 2px solid var(--clr-nvy);
    color:  var(--clr-nvy);
  }
  
  /*key*/
  #key.home{
    aspect-ratio: auto;
    height: 85vh;
  }
  .sp-title{
    display: block;
  }
  .home-key-cmnt{
    bottom: 0;
    transform: translateY(-25%) translateX(-50%);
  }
  
  /*index content*/
  .inner{
    padding-left: 20px;
    padding-right: 20px;
  }
  .clvr-title > *{
    font-size: 2.24em;
  }
  
  /*information*/
  .sec-info_list li{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: flex-start;
    align-items: flex-start;
    gap:1em;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 30px;
  }
  .sec-info_list li::after{
    content: "";
    width: 30%;
    height: 5px;
    border-radius: 10px;
    background: var(--bs-gra-nvy);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 10px;
  }
  .sec-info_list li .date
  ,.sec-info_list li .post-title{
    width: 100%;
  }
  .sec-news-box .btn-wrap, .sec-sche-blc .btn-wrap{
    justify-content: center;
  }
  /*disco*/
  .sec-disco-blc .clvr-title{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
  }
  .sec-disco-blc .btn-wrap{
    justify-content: center;
  }
  
  /*contents*/
  .sec-contents-box{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center;
  }
  .sec-contents-box .cnt-item .title{
    font-size: 2.24em;
  }
  .sec-contents-box .cnt-item{
    width: 85%;
  }
  
  /*fan*/
  .sec-funclub-blc{
    background-image: url("../image/hongjinyoung/wall-fun_sp.png");
    background-size: 100%;
  }
  .funclub-box-wrap > .fun-item{
    width: 100%;
    padding-bottom: 15vw;
  }
  .funclub-box-wrap .fun-item.clm{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    gap:5vw;
    padding-bottom: 15vw;
  }
  .funclub-box-wrap .fun-item.clm > *{
    width: 100%;
  }
  .funclub-box-wrap .fun-item .in-title
  ,.funclub-box-wrap.fee .title{
    font-size: 2em;
  }
  .funclub-box-wrap .fun-item.clm > .cmnt .in-title{
    text-align: center;
  }
  
  .funclub-box-wrap.fee > .fun-item.full{
    background: none;
  }
  .fun-fee-list {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    gap:5vw;
  }
  .fun-fee-list > *{
    background: var(--gra-nvy);
    border-radius: 10px;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .fun-fee-list dt
  ,.fun-fee-list dd{
    width: 100%;
  }
  .fun-fee-list dd{
    border-left: none;
    border-top: 1px solid #fff;
  }
  
  /*footer*/
  footer{
    padding-bottom: 20vw;
  }
  .footer-inner{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center;
    gap:5vw;
  }
  .foot-logo{
    width: 100%;
  }
  .foot-nav{
    display: none;
  }
  .footer-inner .page-navigation{
    display: none;
  }
  
}