@charset "utf-8";

/* 인사말 */
.greeting { word-break:keep-all; margin-top:5rem; }
.greeting .box { position:relative; padding:3rem 2rem; background:#eff8ff url('/images/template/T0003/sub/greeting_bg.png') no-repeat right bottom; border-radius:0 0 3rem 0; box-shadow:5px 5px 0 #0092ff; margin-top:2.2rem; }
.greeting .box:before { content:"GREETING"; position:absolute; left:0; top:-2.2rem; font-size:2.5rem; color:#eff8ff; font-weight:900; line-height:1; letter-spacing:10px; }
.greeting .box p { font-size:1.2rem; }
.greeting .box p strong { font-weight:700; }
.greeting .box.img_box { padding-right:13rem; }
.greeting .box.img_box .img { position:absolute; right:2.5rem; top:-2.2rem; width:9rem; max-height:10.25rem; border-radius:1rem; box-shadow:3px 3px 20px rgba(0,0,0,0.2); overflow:hidden; }
.greeting .box.img_box .img img { width:100%; } 
.greeting .con { padding:1.5rem 0; }
.greeting .con p + p { margin-top:1.5rem; }
.greeting .con p.sign { text-align:right; }
.greeting .con p.sign strong { color:111; font-size:0.85rem; font-weight:700; letter-spacing:5px;} 

/* 상징 */
.symbol { position:relative; word-break:keep-all; } 
.symbol > div { position:relative; min-height:10.5rem; padding:1.5rem 2rem 1.5rem 15rem; border:2px solid #dcdcdc; border-top:0; border-radius:0 0 1.75rem 1.75rem; margin-bottom:1.4rem; } 
.symbol > div:before { content:""; position:absolute; left:-2px; top:0; width:calc(100% + 4px); height:3px; background:#0072ff; }
.symbol > div h3 { font-weight:600; margin-bottom:1rem; }
.symbol > div h3 strong { display:inline-block; width:5.6rem; padding:0.3rem 0.5rem; color:#fff; text-align:center; background:#0072ff; border-radius:2.1rem; margin-right:1rem; }
.symbol > div .img { position:absolute; left:1.5rem; top:1.2rem; width:10rem; max-height:8rem; border-radius:0.5rem; border:1px solid #ededed; box-shadow:3px 3px 10px rgba(0,0,0,0.1); overflow:hidden; }
.symbol > div .img img { width:100%; }
.symbol .slogan { padding:1.5rem; text-align:center; min-height:0; }
.symbol .slogan h3 strong { font-size:1.1rem; width:auto; padding:0.35rem 1rem; }
.symbol .slogan p { font-size:1rem; font-weight:600; }
.symbol .symbol1:before { background:#48b1ff; }
.symbol .symbol1 h3 strong { background:#48b1ff; }
.symbol .symbol2:before { background:#00b29f; }
.symbol .symbol2 h3 strong { background:#00b29f; }
.symbol .symbol3:before { background:#00ba53; }
.symbol .symbol3 h3 strong { background:#00ba53; }
.symbol .symbol4:before { background:#f05959; }
.symbol .symbol4 h3 strong { background:#f05959; }
.symbol_song { position:relative; background:#f0f8ff; border:1px solid #dbdbdb; }
.symbol_song h3 {padding:1rem 13rem 1rem 1.5rem; font-size:1.1rem; font-weight:700; }
.symbol_song .btn { position:absolute; right:1rem; top:0.6rem; }
.symbol_song .btn a { min-width:0; padding:0.5rem .9rem }
.symbol_song .rsp_img { background:#fff; padding:1rem; border-top:1px solid #dbdbdb; }

/* 연혁 */
.history_wrap { position:relative; overflow:hidden; }
.history_wrap:before { content:""; position:absolute; left:0.4rem; top:0.5rem; width:1px; height:100%; border-left:2px dotted #cdcdcd; }
.history_wrap dl { position:relative; display:flex; }
.history_wrap dl + dl { margin-top:1.5rem; }
.history_wrap dl dt { width:8rem; font-size:1.2rem; font-weight:700; padding-left:2rem; }
.history_wrap dl dt:before { content:""; position:absolute; left:0; top:0.5rem; width:0.9rem; height:0.9rem; background:#0072ff;  border:4px solid #cce3ff; border-radius:50%; }
.history_wrap dl dd { width:calc(100% - 8rem); background:#eef7ff; padding:1.25rem 1.5rem; border-radius:0 0 0 1.5rem; }
.history_wrap dl dd ul li { position:relative; padding-left:6.7rem; }
.history_wrap dl dd ul li + li { margin-top:0.7rem; }
.history_wrap dl dd ul li:before { content:""; position:absolute; left:0; top:0.5rem; width:0.3rem; height:0.3rem; background:#0072ff; border-radius:50%; }
.history_wrap dl dd ul li strong { position:absolute; left:0.7rem; top:0; font-size:0.85rem; font-weight:700; color:#0f4b95; } 

/*연습실 신청*/
.roomlist ul{display:flex;gap: 2rem;flex-wrap: wrap;margin-top:1.5rem}
.roomlist ul li{width: calc(33.3333333333% - 1.3333rem);padding: 1rem;border-radius: 1.5rem;border: 2px solid #E3E0E0;text-align: center;box-sizing:border-box;vertical-align: middle;-webkit-transition:all .15s; -ms-transition:all .15s; transition:all .15s;}
.lst h3{font-weight:700;color: #222;}
.lst .txt{margin:0.5rem;color: #333;font-size: 0.8rem;}
.lst .txt2{/* border-top:1px solid #ccc; *//* border-bottom:1px solid #ccc; */padding: 1rem 0;margin-top: 0.5rem;line-height:1.5;/* border: 1px solid #b0d6e2; */color: #333;border-radius: 1rem;background: #ecf9fd;}
.lst .info{border-top:1px solid #ccc; border-bottom:1px solid #ccc; padding:0.5rem 0; line-height:1.5;color: #333;}
.roomlist ul li:hover {border: 2px solid #1960b1; box-shadow:3px 3px 5px rgba(0, 0, 0,0.1);}
.roomlist ul li:hover .available{background: #1960b1;}


.r_btn {display:inline-block;zoom:1;margin:0 5px 5px 0;font-size:14px;color: #fff;line-height:20px;background: #328bf1;text-align:center;border-radius:3px;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;border:1px solid transparent;white-space:nowrap;padding: 6px 20px;font-size: 0.75rem;margin-top: 0.5rem;-webkit-transition:all .15s; -ms-transition:all .15s; transition:all .15s; }
.false { background:#858585; }


.innerWrap {padding: 1rem;border-radius: 1.5rem;border: 2px solid #E3E0E0;text-align: center; box-sizing:border-box;}
.innerWrap ul{display:flex; gap: 1rem; flex-wrap: wrap; margin-top:1.5rem}
.innerWrap ul li{width: calc(25% - 1rem); font-size:0.8rem; color:#222;}
.innerWrap h3{font-weight:700;color: #222; font-size:1rem; padding-bottom:0.5rem; border-bottom:1px solid #ccc;}
.innerWrap_btns {float:right;}

/* 합격자조회 260521 */
.small_popup {position:relative;padding: 1.5rem 2rem;width: 680px;border: 5px solid #e9f6fd;/* border-top:none; */border-radius: 1.75rem;margin: 20px auto 0 auto;overflow:hidden;}
/*.small_popup:before { content:""; position:absolute; left:-2px; top:0; width:calc(100% + 4px); height:3px; background:#0072ff; }*/
.small_popup img{/* float:left; */max-width: 4rem;/* text-align: center; */margin: 0 auto;display: block;}
.small_popup .txt_wrap{/* float:left; *//* padding-left: 2rem; *//* width:calc(100% - 4rem); */}
.small_popup .txt_wrap p{/* background: #f8f9fc; */padding: 1rem 0;/* border-radius:1.5rem; */}
.small_popup .tit1{position:relative;color:#00418a;font-size: 1.125rem;text-align: center;margin-top: 0.5rem !important;padding-top:0.35rem;background: none;}
.small_popup .tit2{background:none; text-align: center;}
.small_popup fieldset{width:100%;padding: 1rem 1.25rem;background: #f4f6fb;border-radius: 1.25rem;}
.small_popup fieldset label{ color: #111; font-weight: 600;}
.small_popup fieldset input{height: 28px;line-height: 28px;font-size: 0.75rem;border: 1px solid #ddd;width: 163px;}
.btn_find {display:inline-block;height:1.65rem;line-height:1.65rem;/* margin:0 3px 3px 0; */padding: 0 0.8rem;/* border:1px solid transparent; */background: #00418a;font-size:0.75rem;color:#fff;vertical-align:middle;-webkit-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s;}
 .btn_find:hover{background:#07284e;}
.objBtm{text-align:center;margin-top: 0.5rem;}
.objBtm span{position:relative;/* width: 150px; */}
.objBtm span+span{margin-left:0.5rem}
.objBtm span:before{content:"";display:block;width: 2px;height: 15px;position: absolute;background: #d0cece;right: -7px;top: 4px;}
.objBtm span:last-child:before{display:none;}



@media (max-width:960px){
    /* 상징 */
    .symbol > div { padding-left:13rem; } 
}
@media (max-width:768px){
    /* 인사말 */
    .greeting {margin-top:2.5rem; }
    .greeting .box { padding:2rem 1.5rem; }
    .greeting .box:before { letter-spacing:3px;}
    .greeting .box p { font-size:1rem; }
    .greeting .box.img_box { padding-right:1.5rem; }
    .greeting .box.img_box .img { position:relative; right:auto; top:auto; display:block; margin:0 auto 1rem; }
    .greeting .con p + p { margin-top:1rem; }

    /* 연혁 */
    .history_wrap:before { display:none; }
    .history_wrap dl { display:block; }
    .history_wrap dl dt { padding-left:1.5rem; }
    .history_wrap dl dd { width:auto; margin:0.5rem 0 0;}

    /*연습실 신청*/
     .roomlist ul{gap:1rem;}
  .roomlist ul li{width: 48%;}
  }
  
  @media (max-width:690px){
    /* 합격자조회 260521 */
    .small_popup{width:100%;}
    .small_popup fieldset input{width:145px;}
}


@media (max-width:600px){
    /* 상징 */
    .symbol > div { padding:1.5rem; }
    .symbol > div .img { position:relative; left:auto; top:auto; display:block; margin:0 auto 1rem;  }
    .symbol > div h3 { text-align:center; }
    .symbol_song h3 { padding:1rem 1rem 0; text-align:center; }
    .symbol_song .btn { position:relative; right:auto; top:auto; text-align:center; padding-bottom:1rem; }
    
    /*연습실 신청*/
    .innerWrap ul li{width: calc(48% - 1rem);}
    
    
     /* 합격자조회 260521 */
     .small_popup fieldset input{width:160px;}
     .btn_find{text-align:center; display:block; margin:10px auto 0 auto; width:6rem; } 
}

@media (max-width:580px){
 /* 합격자조회 260521 */
      .small_popup fieldset label{/* margin-top: 0; */}
     .small_popup fieldset input{display:block;width:100%;margin-bottom: 0.5rem;}
}


@media (max-width:480px){
    /* 연혁 */
    .history_wrap dl dd { padding:1rem; }
    .history_wrap dl dd ul li { padding-left:0.7rem; }
    .history_wrap dl dd ul li strong { position:relative; left:auto; top:auto; display:block; }

     /*연습실 신청*/
     .roomlist ul{gap:0.5rem;}
  .roomlist ul li{width: 100%;/* padding: 0.5rem; */}

     .innerWrap ul li{width: 100%;}
     
     
}