/* * * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * * * * I N T R O * * * * * * * * * */
#INTRO{
    min-width: 320px;
    max-width: 768px;
    width: 100%; height: 100%;
    position: fixed; 
    top: 0;
    z-index: 999; 
}
#INTRO .bg {
    width: 100%; height: 100%;
    position: absolute; 
    top: 0; left: 0; 
    transition: ease-in-out;
}
#INTRO .bg1 {
    background: rgba(255,255,255,.3); 
    /*animation: intro_bg1 3s;*/
}
#INTRO .bg2 {
    background: #f7f7f7; 
    /*animation: intro_bg2 3s; */
}
#INTRO .bg.stop{
    animation-play-state: paused;
}
/* INTRO 이미지 & 텍스트 애니메이션 */
.introAni{
    width:100%; height:100%;
    margin: 0 auto;
    padding: 10px;
    text-align:center;
    position: relative;
}
.introAni .IA_cnt{
    width: 100%; height: 60%;
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
}
.IA_cnt .IA_inner{
    width: 100%; height: 100%;
}

/* INTRO inner 도형 에니메이션 4s */
.IA_inner .IA_Img{
    width: 60px; height: 30%;
    position: relative;
    margin: 0 auto;
    padding-top: 30%;
}
.circle{
    width:55px;
    height:55px;
    border:5px solid #884c7d;
    background-color: #f7f7f7;
    border-radius:50%;
    position:absolute;
    bottom:0;
    opacity: 0;
    animation: circle 4s ease-in-out;
}
.square{
    width:55px;
    height:55px;
    border:5px solid #d18f5b;
    background-color: #f7f7f7;
    position:absolute;
    bottom:0;
    opacity:0;
    animation: square 4s ease-in-out;
}
.triangle{
    width:0;
    height:0;
    border-left:30px solid transparent;
    border-right:30px solid transparent;
    border-bottom:50px solid #b58099;
    position:absolute;
    bottom:0;
    animation: triangle 4s ease-in-out;
    opacity:0;
}
.triangle::after{
    content:"";
    width:0;
    height:0;
    border-left:20px solid transparent;
    border-right:20px solid transparent;
    border-bottom: 34px solid #f7f7f7;
    position:absolute;
    bottom:-45px;
    left:-20px;
    
    /*animation: triangleAfter 4s ease-in-out;*/
}
.intro_logo{
    position:absolute;
    bottom:0; left: -180%;
    width: 260px; height: 62px;
    
    overflow: hidden;
    animation: logo 4s ease-in-out;
}
.shadow{
    width:60px; height:4px;
    background-color:rgba(0,0,0,.1);
    border-radius:3px;
    animation:shadow 4s ease-in-out;
    margin:auto;
    position:absolute;
    bottom:-4px;
    left:0;
    right:0;
  
}

/* */

.IA_inner h2.text{
    margin-top: 40px; 
    overflow: hidden; 
    opacity: 1;
}
.IA_inner h2.text p{
    display: block;
    margin: 0 5px;
    font-size: 16px; 
    color: #333232; 
    font-weight: 500;
}

/* INTRO SKIP BUTTON & 애니메이션 */
.IA_inner .skip{
    position:absolute; 
    top:100%; left:50%; 
    transform: translate(-50%,0);
    
    width:60px; height:60px; 
    line-height:60px; 
    border-radius:50%; 
    background: transparent; 
    cursor:pointer;
}
.IA_inner .skip>span{
    font-size:10px;
    font-weight:500;
    line-height: 20px;
    color:#333232;
    
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    animation: skipblink 3s;
}
@keyframes skipblink{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}
.IA_inner .skip .timebar{
    position: absolute;
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    overflow: hidden;
}
.IA_inner .skip .timebar>var{
    position: relative; 
    display: block; 
    float: left; 
    width: 50%; height: 100%; 
    overflow: hidden;
}
.IA_inner .skip .timebar>var>em{
    position: absolute;
    top: 0; 
    width: 100%; height: 100%; 
    overflow: hidden; 
    transform: rotate(-180deg);
}
.IA_inner .skip .timebar>var.left>em {
    left: 0; 
    transform-origin: right center;
}
.IA_inner .skip .timebar>var.right>em{
    right: 0;
    transform-origin: left center;
}
.IA_inner .skip .timebar>var>em:after{
    content: '';
    width: 200%; height: 100%;
    display: block; 
    box-sizing: border-box;
    /*border: 3px solid #ff7800; */
    border-radius: 50%; 
}
.IA_inner .skip .timebar>var.right>em:after{
    margin-left: -100%;
}
.IA_inner .skip.active .timebar var.right em{
    transform: rotate(0deg);
    transition: 1.5s linear;
}
.IA_inner .skip.active .timebar var.left em{
    transform: rotate(0deg); 
    transition: 1.5s 1.5s linear;
}

/* INTRO 백그라운드 애니메이션 효과들 Keyframes */
@-webkit-keyframes intro_bg1 {
	0%{ background: #ffa800 }
	25%{ background: #ffcebf }
	50%{ background: #fff }
	75%{ background: #f9f0d2 }
	100%{ background: #ffa800 }
}
@keyframes intro_bg1 {
	0%{ background: #ffa800 }
	25%{ background: #ffcebf }
	50%{ background: #fff }
	75%{ background: #f9f0d2 }
	100%{ background: #ffa800 }
}
@-webkit-keyframes intro_bg2 {
	0%{ background: #fff }
	25%{ background: #f9f0d2 }
	50%{ background: #ffa800 }
	75%{ background: #ffcebf }
	100%{ background: #fff }
}
@keyframes intro_bg2 {
	0%{ background: #fff }
	25%{ background: #f9f0d2 }
	50%{ background: #ffa800 }
	75%{ background: #ffcebf }
	100%{ background: #fff }
}
/* INTRO 도형 애니메이션 효과들 Keyframes */
@-webkit-keyframes circle{
    0%{ transform: translateY(0); }
    10%{ transform: translateY(-190px); }
    20%{ transform: translateY(0) scaleY(1.2);opacity:1; }
    20.1%{ opacity: 0; }
    100%{ opacity: 0; }
}
@keyframes circle{
    0%{ transform: translateY(0); }
    10%{ transform: translateY(-190px); }
    20%{ transform: translateY(0) scaleY(1.2);opacity:1; }
    20.1%{ opacity: 0; }
    100%{ opacity: 0; }
}
@-webkit-keyframes square{
    0%{ transform: translateY(0);opacity:0; }
    19%{ transform: translateY(0);opacity:0; }
    20%{ opacity: 1; }
    30%{ transform: translateY(-190px) rotate(90deg); }
    40%{ transform: translateY(0) rotate(180deg);opacity:1; }
    40.1%{ transform: translateY(0);opacity:0; }
    100%{ opacity: 0; }
}
@keyframes square{
    0%{ transform: translateY(0);opacity:0; }
    19%{ transform: translateY(0);opacity:0; }
    20%{ opacity: 1; }
    30%{ transform: translateY(-190px) rotate(90deg); }
    40%{ transform: translateY(0) rotate(180deg);opacity:1; }
    40.1%{ transform: translateY(0);opacity:0; }
    100%{ opacity: 0; }
}
@-webkit-keyframes triangle{
    0%{ transform: translateY(0);opacity:0; }
    39%{ transform: translateY(0);opacity:0; }
    40%{ opacity: 1; }
    50%{ transform: translateY(-190px) rotate(60deg); }
    60%{ transform: translateY(0) rotate(120deg);opacity:1; }
    60.1%{ transform: translateY(0);opacity:0; }
    100%{ opacity: 0; }
}
@keyframes triangle{
    0%{ transform: translateY(0);opacity:0; }
    39%{ transform: translateY(0);opacity:0; }
    40%{ opacity: 1; }
    50%{ transform: translateY(-190px) rotate(60deg); }
    60%{ transform: translateY(0) rotate(120deg);opacity:1; }
    60.1%{ transform: translateY(0);opacity:0; }
    100%{ opacity: 0; }
}
@-webkit-keyframes triangleAfter{
    0%{ border-bottom: 34px solid #ffa800; }
    40%{ border-bottom: 34px solid #ffbb60; }
    50%{ border-bottom: 34px solid #ffcebf; }
    100%{ border-bottom: 34px solid #ffcebf; }
}
@keyframes triangleAfter{
    0%{ border-bottom: 34px solid #ffa800; }
    40%{ border-bottom: 34px solid #ffbb60; }
    50%{ border-bottom: 34px solid #ffcebf; }
    100%{ border-bottom: 34px solid #ffcebf; }
}
@-webkit-keyframes logo{
    0%{ transform: translateY(0);opacity:0; }
    59%{ transform: translateY(0);opacity:0; }
    60%{ opacity: 1; }
    70%{ transform: translateY(-50px); }
    92%{ transform: translateY(0); }
    100%{ transform: translateY(0);opacity:1; }
}
@keyframes logo{
    0%{ transform: translateY(0);opacity:0; }
    59%{ transform: translateY(0);opacity:0; }
    60%{ opacity: 1; }
    70%{ transform: translateY(-50px); }
    92%{ transform: translateY(0); }
    100%{ transform: translateY(0);opacity:1; }
}
@-webkit-keyframes shadow{
    0%{ width: 60px; }
    10%{ width: 10px; }
    20%{ width: 60px; }
    30%{ width: 10px; }
    40%{ width: 60px; }
    50%{ width: 10px; }
    60%{ width: 60px; }
    70%{ width: 10px; }
    92%{ width: 10px; }
    100%{ width: 60px; }
}
@keyframes shadow{
    0%{ width: 60px; }
    10%{ width: 10px; }
    20%{ width: 60px; }
    30%{ width: 10px; }
    40%{ width: 60px; }
    50%{ width: 10px; }
    60%{ width: 60px; }
    70%{ width: 10px; }
    92%{ width: 10px; }
    100%{ width: 60px; }
}


/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * *  S M A L L - P O P  B A N N E R * * * */
.smBnr{
	width: 100%;
    min-width: 320px;
    max-width: 768px;	
	border-bottom: 1px solid #eee;
	font-size: 0;
}
.smBnr .slideBnr .imgInfo{
	max-height: 70px;
}


/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * * * H E A D E R * * * * * * * * */


header{
    width: 100%;
    min-width: 320px;
    max-width: 768px;
    position: fixed;
    z-index: 100;
}

.h_top{
    width: 100%; height: 50px;
    text-align: center;
    position: relative;
    background: rgba(0,0,0,.2);
    border-bottom: rgba(225,225,225,0);
    
    transition: all .25s;
}

/* 헤더 LOGO 이미지 */
.h_top .logo{
    display: inline-block;
    width: 100px; height: 25px;
    margin-top: 12px;
    overflow: hidden;
    position: relative;
}
.h_top .logo>img{
    position: absolute;
    bottom: 0; left: 0;
}
/* 헤더 NAV 아이콘 */
.h_top .gnbIcn{
    width: 58px; height: 50px;
    position: absolute;
    top: 0; left: 0;
    padding: 12px 13px 14px 13px;
    cursor: pointer;
    
    transition: all .4s;
    -webkit-transition: all .4s;
    -ms-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
}
.h_top .gnbWrap .gnbLine{
    width: 25px;
    height: 2px;
    background-color: #fff;
    margin: 5px 0;
    transition: .4s;
    display: block;
    position: relative;
}
.h_top .gnbIcn .gnbLine:last-child{
    margin-bottom: 0;
}

/* 네비게이션 아이콘 클릭 addClass STYLE */
.h_top .gnbIcn.active{
    background: #ff7800;
}
.h_top .gnbIcn.active .gnbWrap .gnbLine{
    background-color: #fff;
}
.h_top .gnbIcn.active .gnbWrap .gnbLine.bar1{
    -webkit-transform: rotate(-42deg) translate(-2px, 6px);
    transform: rotate(-45deg) translate(-2px, 6px);
}
.h_top .gnbIcn.active .gnbWrap .gnbLine.bar2{
    opacity: 0;
}
.h_top .gnbIcn.active .gnbWrap .gnbLine.bar3{
    -webkit-transform: rotate(45deg) translate(-4px, -8px);
    transform: rotate(45deg) translate(-4px, -8px);
}

/* 헤더 TEL 아이콘 */
.h_top .gnbTel{
    width: 50px; height: 50px;
    position: absolute;
    top: 0; right: 0;
    padding: 13px;
    cursor: pointer;    
}
.h_top .gnbTel .gnbWrap{
    height: 100%;
}


/* HEADER 스크롤 애니메이션 addClass STYLE */
.h_top.active{
    background: rgba(255,255,255,1);
    border-bottom: 1px solid rgba(225,225,225,1);
}
.h_top.active .logo>img{
    top: 0;
}
.h_top.active .gnbWrap .gnbLine{
    background-color: #333;
}

/* */




/* * 헤더 NAV 버튼 클릭 INNER OPEN * */
#mmenu{
    max-width: 768px;
    position: fixed;
    top:50px; bottom: 0;
    margin: 0 auto;
    width: 0%; 
    background: rgba(0,0,0,0.5);
    z-index: 100;
    overflow: hidden;
    
    transition: all .25s;
}
#mmenu .mnav{
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background: #fff;
    white-space: nowrap;
    
    overflow-y: auto;
    padding-bottom: 80px;
    
}
/* 헤더 NAV inner 타이틀 영역 */
#mmenu .mnav .mlogo{
    width: 100%; height: 58px;
    background: #ff7800;
    padding: 17px 0;
}
#mmenu .mnav .mlogo .minTit{
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    color: #fff;
    text-align: center;
    display: none;
}

/* 헤더 NAV inner 클릭 addClass STYLE */
#mmenu.active{
    width: 100%;
}
/**/

/* 헤더 NAV inner 메뉴 영역 ( ACCORDION TABS ) */
.accordion {
}
.accordion .toggle{
    position: relative;
    width: 100%;
    display: block;
    background: #fff;
    border-bottom: 1px solid #eee;
    text-align: left;
    padding: 15px;
    transition: all .3s ease;
    cursor: pointer;
}
.accordion .toggle>a{
    display: block;
    width: 100%; height: 100%;
    color: #333;
    font-weight: 500;
}
.accordion li:last-child .toggle{
    border-bottom: 0; 
}
.accordion li .toggle>a:after{
    content: '\002B';
    font-weight: bold;
    float: right;
    transform: rotate(-90deg);
    transition: all .3s ease;
}

/* 아코디언 open STYLE */
.accordion li.open .toggle{ 
    box-shadow: 0 3px 10px 0 rgba(153,153,153,.2);
}
.accordion li.open .toggle>a{
    color: #ff7800; 
    
}
.accordion li.open .toggle>a:after{
    transform: rotate(-45deg);
}


/* 아코디언 inner STYLE */
.inner{
    display: none;
    background: #f7f7f7;
    padding: 20px 0;
}

.inner>li{ 
    width: 100%; 
}
.inner>li>a{
    display: block;
    background: #f7f7f7;
    padding: 10px 25px;
    -webkit-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    
    text-align: left;
    font-size: 14px;
    line-height: 20px;
    color: #888;
}
.inner>li>a:hover{
    color: #ff7800;
}


/* */

.h_bot{
    width: 100%; height: 40px;
    background: white;
    border-bottom: 1px solid #e1e1e1;
    display: none;
}

.h_bot .gnb{
    display: flex;
    justify-content: space-between;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    position: relative;
}
.h_bot .gnb{
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.h_bot .gnb::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

.h_bot .gnb li{
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: auto;
    margin: 0 5px;
}
.h_bot .gnb>li>a{
    display: block;
    color: #333;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-align: center;
    line-height: 40px;
    padding: 0 5px;
    position: relative;
    font-size: 0.8em;
    cursor: pointer;
}
.h_bot .gnb>li>a.selected{
    color: #ff7800;
}

/* 서브페이지에서의 LNB MENU 고정노출 */
.MenuSlide{
    width: 100%; height: 40px;
    z-index: 100;
    display: none;
    position: relative;
}

.MenuSlide .lnb{
    width: 100%;
    display: flex;
    justify-content: space-between;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    position: absolute;
    top: 0;
    background: rgba(0,0,0,.8);
    padding-right: 10px;
}
.MenuSlide .lnb{
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.MenuSlide .lnb::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

.MenuSlide .lnb.menuCh{
    display: none;
}

.MenuSlide .lnb li{
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: auto;
    margin: 0 5px;
}
.MenuSlide .lnb>li>a{
    display: block;
    color: #ddd;
    text-align: center;
    line-height: 40px;
    padding: 0 5px;
    position: relative;
    font-size: 12px;
}


/* 페이지 메뉴 selected STYLE */
.MenuSlide .lnb>li>a.selected{
    color: #fff;
    font-weight: 500;
}

/* Slide MENUON - COURSE PAGE */
.MenuSlideOn{
    display: block;
}
.menuOn{
    display: flex !important;  
}


/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * * * F O O T E R * * * * * * * * */
footer{
    border-top: 1px solid #ddd;
    padding:  20px 0 80px 0;
    margin-top: 30px;
}

footer.landing{
    margin-top: 0;
}
/* F - TOP */
.f_top{
    width: 100%;
}

.f_top .fLogo{
    float: left;
    width: 90px;
    height: 30px;
    padding: 1px 0;
    overflow: hidden;
}
.f_top .fTel {
    float: left;
    display: inline-block;
    height: 30px;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
    color: #555;
    margin-left: 10px;
}
.f_top .fBranch{
    float: left;
    display: inline-block;
    width: 140px;
    min-width: 100px;
    margin-left: 10px;
}

/* F- BOT */
.f_bot{
    width: 100%;
    margin-top: 10px;
}

.f_bot .divide{
    display: inline-block;
    width: 1px; height: 11px;
    background: #ddd;
    margin: 0 7px;
}
.f_bot .fnb ul li{
    float: left;
}
.f_bot .fnb ul li>a{
    font-size: 14px;
    color: #666;
}
.f_bot .fInfo{
    margin-top: 15px;
    font-size: 12px;
    line-height: 2;
    color: #888;
}
.f_bot .fInfo .fInfo_line{
    display: inline-block;
    font-size: 12px;
    line-height: 2;
    color: #888;
}
.f_bot .fInfo .fInfo_line>a{
    color: #888;
}
.f_bot .fInfo .small{
    display: block;
    font-size: 11px;
    margin-top: 20px;
    color: #888;    
}


/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * *  Q U I C K  M I D  &  B O T * * * * */
#QuickMid .qmMenu{
    display: flex;
    width: 100%;
}
.qmMenu>li{
    border-right: 1px solid #eee;
}
.qmMenu>li:last-child{
    border-right: none;
}
.qmMenu>li .qmBox{
    display: block;
    width: 100%;
    background: white;
    text-align: center;
    padding: 15px 5px;
    position: relative;
}

.qmMenu>li .qmBox .qmMenuIcn{
    display: inline-block;
    width: 55px; height: 50px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50px;
}
.qmMenu>li .qmBox .qmMenuTxt{
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: #555;
}

/* * Q U I C K  M I D  구 분 * */
#QuickMid{
    width: 100%;
    border-bottom: 1px solid #eee;
    background: #fff;
}
.qmMenu>li{
    width: 20%;
}
.qmMenu>li .qmBox .qmMenuTxt.orange{
    color: #ff7800;
    font-weight: 500;
}
/* QUICKMID 아이콘 구분 STYLE */
.qmMenu>li>a .qmi01{
    background-image: url(/img/basic/QUICKMID_m_01.svg);
}
.qmMenu>li>a .qmi02{
    background-image: url(/img/basic/QUICKMID_m_40_2304.gif);
}
.qmMenu>li>a .qmi03{
    background-image: url(/img/basic/QUICKMID_m_03.svg);
}
.qmMenu>li>a .qmi04{
    background-image: url(/img/basic/QUICKMID_m_04.svg);
}
.qmMenu>li>a .qmi05{
    background-image: url(/img/basic/QUICKMID_m_05.svg);
}
.qmMenu>li>a .qmi06{
    background-image: url(/img/basic/QUICKMID_m_06.svg);
}
.qmMenu>li>a .qmi07{
    background-image: url(/img/basic/QUICKMID_m_07.svg);
}


/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * I N Q U I R Y  F I X E D* * * * * */
#IQuick-Fixed{
    padding-top: 20px;
}
.IQF_title{
    border-bottom: 3px solid #000;
    padding: 30px 0;
    text-align: center;
}
.IQF_title p{
    color: #888;
    font-size: 14px;
    line-height: 20px;
    margin-top: 7px;
    
    font-size: 11px;
    line-height: 17px;
    margin-top: 5px;
}
.IQ_Btn{
    padding: 20px 0;
}

/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * Q I U C K  F I X E D * * * * * * */
#QuickFixed{
    max-width: 768px;
    min-width: 320px;
    position: fixed;
    bottom: 0px;
    z-index: 200;
    width: 100%;
    /**/display: none;
}
.quickFix{
    width: 100%;
    z-index: 99;
}
/* 퀵DB 노출 시 상단부분 */
.quickFix .fixedHd{
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.6);
    color: white;
    text-align: center;
    display: none;
}
.quickFix .fixedHd>div{
    position: absolute;
    top: 55%; left: 50%;
    transform: translate(-50%,-50%);
    cursor: pointer;
    color: #fff;
}

/* 퀵전화상담 아이콘 영역 */
.quickFix .qkcnt .qk-tel{
    width: 3.5rem;
    height: 3.5rem;
    background: #ff7800;
    border-radius: 100%;
    position: absolute;
    right: 2%;
    bottom:68px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    box-shadow: 0px 0px 5px rgba(150, 150, 150, 1);
}
.quickFix .qkcnt .qk-tel .qtel-btn{
    width: 2.1rem;
    padding-top: 7px; 
}

/* 퀵메뉴 아이콘 영역 */
.quickFix .qktit{   
    width: 100%;
    /*border-radius: 10px 10px 0 0;*/
    background: #ff7800;
    display: flex;
}
.qfMenu{
    width: 83%;
    display: flex;
}
.qfMenu>li{
    width: 25%;
}
.qfMenu>li .qfBox, .tbtnWrap .tbtn, .tbtnWrap .tbtn_on{
    display: block;
    width: 100%;
    text-align: center;
    padding: 7px 5px 10px 5px;
} 

.qfMenu>li .qfBox .qfMenuIcn, 
.tbtn .tbtnIcn, .tbtn_on .tbtnIcn{
    width: 100%; height: 30px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 28px 28px;
    overflow: hidden;
}
.qfMenu>li .qfBox .qfMenuTxt, 
.tbtn .tbtnTxt, .tbtn_on .tbtnTxt{
    font-size: 12px;
    line-height: 18px;
    color: #fff;
}

.tbtnWrap .tbtn, 
.tbtnWrap .tbtn_on{
    display: none;
}
.tbtnWrap .active{
    display: block;
}

.tbtnWrap{
    width: 17%;
} 
/* 퀵메뉴 아이콘 구분 */
.qfMenu>li .qfBox .qfi01{
    background-image: url(/img/basic/QUICKBOT_m_01.svg);
}
.qfMenu>li .qfBox .qfi02{
    background-image: url(/img/basic/QUICKBOT_m_02.svg);
}
.qfMenu>li .qfBox .qfi03{
    /*background-image: url(/img/basic/QUICKBOT_m_03.svg);*/
    background-image: url(/img/basic/QUICKBOT_m_05.svg);
}
.qfMenu>li .qfBox .qfi04{
    background-image: url(/img/basic/QUICKBOT_m_04.svg);
}

.tbtn .tbtnIcn{
    background-image: url(/img/basic/TBTN_wh.svg);
}
.tbtn_on .tbtnIcn{
    background-image: url(/img/basic/CBTN_wh.svg);
}


/* 퀵메뉴 원버튼형 + overlay top버튼 */
.qktit.oneBtn{
	position: relative;
}
.qktit.oneBtn .qfMenu{
	width: 100%;
}
.qktit.oneBtn .qfMenu > a{
	text-align: center;
	display: block;
	width: 100%; height: 100%;
    padding: 15px 0 17px 0;
	line-height: 30px;
	font-size: 20px;
	font-weight: 600;
	color: #fff;
}

.tbtnWrap.overlay{
	position: absolute;
	right: 0px; top: 0; /*top: -62px;*/
} 
.tbtnWrap.overlay .overbg{
    padding: 16px 15px;
	
}
.tbtnWrap.overlay .tbtn, .tbtnWrap.overlay .tbtn_on{
    width: 100%;
    text-align: center;
	background: rgba(0,0,0,.2);
	border-radius: 2px;
	padding: 0;
} 

/* 퀵DB 클릭 노출 */
.quickFix .qktxt{ 
    width: 100%;
    background: #fff;
    display: none;
}
.tuitable.IQ_table tr .title{
    width: 18%;
    color: #555;
    background: #f7f7f7;
}
.quickFix .qktxt .agreecheck{
    padding: 0 10px;
}
/*수강료문의버튼*/
.quickFix .qktxt .tuiBtn{
    padding: 0 10px 20px 10px;
}
/*버튼사이텍스트영역*/
.quickFix .qktxt .sideTxt{
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #666;
    padding: 10px 0;
    background: #fff;
    border-bottom: 1px solid #eee;
    text-align: center;
    animation: blink 1.2s infinite;
}
@keyframes blink{
    0%{
    }
    50%{
        /*color: #c22b34;*/
        color: #ff7800;
    }
    100%{
    }
}

/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * T A B L E  & I N P U T * * * * * */

/* * IQ - 아코디언 * */
.IQ_accordion .IQ_toggle{
    border-bottom: 1px solid  #eee;
}
.IQ_accordion .IQ_toggle .IQ_tit{
}
.IQ_tit .IQ_title{
    display: block;
    float: left;
    max-width: 90%; height: 100%;
    padding: 10px;
    color: #000;
    font-weight: 500;
    font-size: 14px;
    text-align: center;
}
.IQ_tit .IQ_title .IQ_subtit{
    color: #999;
    margin-left: 7px;
    font-size: 11px;
}
.IQ_tit .IQ_more{
    width: 40px; height: 40px;
    float: right;
    font-size: 0;
    padding: 10px;
    position: relative;
}
.IQ_tit .IQ_more>img{
    width: 20px; height: 20px;
    position: absolute;
}
.IQ_tit .IQ_more>img.moreup{
    display: none;
}

/* IQ아코디언 open STYLE */
.IQ_accordion li.open .IQ_toggle .IQ_tit .IQ_title{
    color: #ff7800;
    font-weight: 700;
}
.IQ_accordion li.open .IQ_toggle .IQ_tit .IQ_more>img.moreup{
    display: block;
    transform: rotate(180deg);
}
.IQ_accordion li.open .IQ_toggle .IQ_tit .IQ_more>img.moredw{
    display: none;
}

/* 아코디언 IQ_inner */
.IQ_accordion .IQ_inner{
    border-bottom: 1px solid  #eee;
    /*display: none;*/
}
.subjectInputs{
    /*padding: 20px 0 30px 20px;*/
    padding: 20px 0 20px 10px;  
}
.subjectInputs label{
    width: 33%;
    margin: 7px 0;
}

/* 기타 경고문 */
.IQ_Warn {
    display: inline-block;
    font-size: 12px;
    margin-left: 0px;
    color: #000;
    font-weight: 500;
}
/* TABLE */
.IQ_table{
    width: 100%;
    border-bottom: 2px solid #000;
}
.IQ_table tr>*{
    padding: 15px 10px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    font-size: 13px;
    color: #999;
}
.IQ_table tr .title{
    width: 25%;
    font-size: 14px;
    font-weight: 500;
    color: #000;
}

/* 모바일결제 결제금액 적용 버튼 */
.IQ_table tr td .payprice{
    width: 80%;
    float: left;
}
.IQ_table tr td .paybutton {
    float: left;
    margin: 0 5px;
    font-size: 11px;
    color: #888;
    background: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 2px;
    padding: 4px 10px;
    cursor: pointer;
}

/* 개인정보처리방침*/
.agreecheck{
    margin-bottom: 12px;
}
.agreecheck label{
    font-size: 11px;
    color: #888;
}
.agreecheck input[type='checkbox'] {
    width: 14px; height: 14px;
    -webkit-border-radius: 50%;
}
.agreecheck input[type='checkbox']:checked:after {
    width: 6px; height: 6px;
    background: #888;
    -webkit-border-radius: 50%;
}
.agreecheck>a{
    display: inline-block;
    margin-top: 5px;
    float: right;
    color: #888;
    font-size: 11px;
}
.agreecheck>a:after{
    content:'\25B8';
}

/* 지점선택 */
.IQ_table tr .branchInputs label{
	min-width: 170px;
}

/*label 내 부가설명*/
.IQ_table tr td label .tdExample{
    font-size: 11px;
    color: #888;
    display: inline-block;
    margin-left: 5px;
	margin-right: 10px;
}
/*label 내 깜박이+아이콘 class 추가*/
label.blink{
}
.blink{
    font-weight: 600;
    animation: blinkRed .75s infinite;
}
@keyframes blinkRed{
    0%{
        
    }
    50%{
        color: #c22b34;
    }
    100%{
        
    }
}
label span.icon{
    width: 12px;
    display: inline-block;
    vertical-align: middle;
    min-width: 60px;
}
/* DB FORM INPUT STYLE */
label{
    font-size: 14px;
    color: #666;
    cursor: pointer;
    background: #fff;
    display: inline-block;
    min-width: 80px;
}
input{
    outline: none;
}

input[type='checkbox'] {
    margin: 0px 5px 3px 0;
    background: #fff; 
    border: solid 1px #ddd;
    height: 14px; width: 14px; 
    -webkit-appearance: none; 
    -webkit-border-radius: 3px; 
    padding: 0;
    vertical-align: middle;
    cursor: pointer;
}
input[type='checkbox']:checked {
    margin-right: 5px !important;
    background: #fff !important; 
    border: solid 1px #c9c9c9;
    border: 0 \0/IE8+9;
}
input[type='checkbox']:checked:after {
    content: ""; 
    display: block; 
    width: 6px; 
    height: 6px; 
    background: #ff7800;
    position: relative; 
    top: 3px; left: 3px; 
    -webkit-border-radius: 0px;
} 
.inputTxtWrap{
    /* text input Wrap style Box */
    border: 1px solid #ddd;
    position: relative;
    height: 30px;
}
input[type='text'] {
    width: 100%;
    height: 28px;
    font-size: 12px;
    border: none;
    padding: 5px;
    vertical-align: middle;
    background: #fff;
    color: #666;
}
input[type='password'] {
    width: 100%;
    height: 28px;
    font-size: 12px;
    border: none;
    padding: 5px;
    vertical-align: middle;
    background: #fff;
    color: #666;
}
.inputNum{
    width: 100%;
    display: flex;
    justify-content: space-around;
}
.inputNum>li{
    margin-right: 10px;
}
.inputNum>li:last-child{
    margin-right: 0;
}
input::-webkit-input-placeholder{
    color: #999;
    padding-left: 3px;
    font-family: 'Noto Sans KR', sans-serif;
}
input::-ms-input-placeholder{
    color: #999;
    padding-left: 3px;
    font-family: 'Noto Sans KR', sans-serif;
}
input::-moz-input-placeholder{
    color: #999;
    padding-left: 3px;
    font-family: 'Noto Sans KR', sans-serif;
}
input::-o-input-placeholder{
    color: #999;
    padding-left: 3px;
    font-family: 'Noto Sans KR', sans-serif;
}
.textareaWrap{
    /* text input Wrap style Box */
    border: 1px solid #ddd;
    position: relative;
    height: 100px;
}
textarea{
    width: 100%; height: 98px;
    outline: none; 
    padding: 5px 10px;
    border: none;
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
    letter-spacing: -0.02em;
    color: #666;
}
textarea::-webkit-input-placeholder{
    color: #999;
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
}
textarea::-ms-input-placeholder{
    color: #999;
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
}
textarea::-moz-input-placeholder{
    color: #999;
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
}
textarea::-o-input-placeholder{
    color: #999;
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
}

.selectWrap{
    border: 1px solid #ddd;
    position: relative;
    height: 30px;
}
.selectWrap:first-child:after{
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    right: 2px;
    width: 29px;
    height: 27px;
    background: url(/img/basic/INPUT_SELECT.svg) no-repeat 5px 0;
    background-size: 100%;
}
select{
    outline: none;
    width: 100%; height: 28px;
    font-size: 11.5px;
    margin: 0;
    color: #666;
    background: none;
    border: none;
    padding-left: 5px;
    vertical-align: top;
    min-width: 72px;

}
/* */


/* * * * * * * * * * * * * * * * * * * * */
/* * * * * * * I N C L U D E * * * * * * */
#INCLUDE .pgTitle.Basic{
    background-image: url(/img/basic/include_pgTitle_bg_m.jpg);
    background-position: 35% center;
}
/* 개인정보보호정책 페이지 */
#privacy{
    padding-top: 20px;
}
#privacy h4{
    color: #000;
    text-align: center;
    padding: 20px 0;
    border-bottom: 2px solid #000;
}
#privacy .privacy_Cnt{
    padding-top: 15px;
}
.privacy_Cnt .cntArea{
    padding-bottom: 15px;
}
.privacy_Cnt p {
    font-size: 12px;
    line-height: 18px;
    padding-bottom: 10px;
}
.privacy_Cnt h5{
    float: none;
    color: #000;
    font-weight: 700;
    font-size: 13px;
    line-height: 19px;
    padding: 10px 0;
}

.privacy_Cnt ul {
    padding-bottom: 10px;
    padding-left: 7px;
}
.privacy_Cnt li {
    padding-bottom: 3px;
    font-size: 10.5px;
    color: #555;
}
.privacy_Cnt li.bold {
    font-weight: 500;
    font-size: 11px;
    color: #333;
    margin-left: -5px;
    padding-top: 10px;
}
.privacy_Cnt ul li:before {
    content: '-';
    display: inline-block;
    margin-left: -7px;
    margin-right: 3px;
}
.privacy_Cnt li.bold:before {
    content: '';
    margin-left: 0;
    margin-right: 0;
}

/* 사이트맵 페이지 */
#sitemap .sitemap_Cnt{
    padding-bottom: 30px;
}
#sitemap h3{
    color: #000;
    text-align: center;
    padding: 20px 0;
    border-bottom: 2px solid #000;
}
#sitemap .listBx{
    display: flex;
    flex-wrap: wrap;
    padding: 0 5px;
}
#sitemap .listBx .list{
    width: 50%;
    padding-right: 20px;
    margin-top: 20px;
}
#sitemap .listBx .list:nth-child(2), 
#sitemap .listBx .list:nth-child(4){
    padding-right: 0;
}
#sitemap .listBx .list h4{
    font-size: 16px;
    font-weight: 600;
    padding: 15px 0;
    border-bottom: 1px solid #333;
}

#sitemap .listBx .list ul{
    padding: 15px 0;
    display: flex;
    flex-wrap: wrap;
}
#sitemap .listBx .list ul li{
    width: 100%;
}

#sitemap .listBx .list ul li a{
    display: inline-block;
    width: 100%; height: 100%;
    padding: 3px 0;
    font-size: 14px;
}

/* 수강료안내 페이지 */
#tuition{
    padding-top: 10px;
}
#tuition h4{
    color: #000;
    text-align: center;
    padding: 20px 0;
}

.tui_table >table{
	width: 100%;
	
}

.tui_table,
.tui_table th,
.tui_table td{
	text-align: center;
/*	padding: 10px 15px;*/
	margin: auto;
	vertical-align: middle;
}


.tui_table th {
	border: 1px solid #ddd;
	background-color: #f5f5f5;
	font-size: 14px;
}

.tui_table .tui_border_top{
	border-top: 2px solid #000;
	font-weight: 700;
}

.tui_table .tui_border_top>th>span{
	font-size: 12px;
}

.tui_table td{
	border: 1px solid #ddd;
	font-size: 13px;
}

.tui_table .tui_border_bottom{
	border-bottom: 2px solid #000;
}

.tui_table .clear_border_l{
	border-left: 1px solid #fff;
}

.tui_table .clear_border_r{
	border-right: 1px solid #fff;
}


/* list 2분할 small ver */
#sitemap .listBx .list.divide-2 ul li{
    width: 50%;
}




/* * * * * * * * * * * * * * * * * * * * * * * */
/* * * * * * * * * M E D I A  * * * * * * * * */


/* SM POPBNR 미디어쿼리 슬라이드  height값 조절 */
@media screen and (max-width: 700px){.smBnr .slideBnr .imgInfo{max-height: 63px;}}
@media screen and (max-width: 630px){.smBnr .slideBnr .imgInfo{max-height: 57px;}}
@media screen and (max-width: 570px){.smBnr .slideBnr .imgInfo{max-height: 51px;}}
@media screen and (max-width: 510px){.smBnr .slideBnr .imgInfo{max-height: 46px;}}
@media screen and (max-width: 450px){.smBnr .slideBnr .imgInfo{max-height: 41px;}}
@media screen and (max-width: 411px){.smBnr .slideBnr .imgInfo{max-height: 37.4px;}}
@media screen and (max-width: 375px){.smBnr .slideBnr .imgInfo{max-height: 34px;}}
@media screen and (max-width: 360px){.smBnr .slideBnr .imgInfo{max-height: 32.5px;}}
@media screen and (max-width: 320px){.smBnr .slideBnr .imgInfo{max-height: 29px;}}

/* */
@media screen and (max-width: 540px){
    /* INTRO */
    .IA_inner .IA_Img{
        padding-top: 50%;
    }
    .intro_logo{
        left: -125%;
        width: 200px; height: 62px;
    }
    /* HEADER */
    #mmenu .mnav{
        background: #fff;
    }
    .accordion{
        background: #fff;
    }
    /* QUICK MID */
    .qmMenu>li, 
    .qbMenu>li{
        border-right: none;
    }
    .qmMenu>li .qmBox, 
    .qbMenu>li .qbBox{
        padding: 10px 0;
    }
    
    .qmMenu>li .qmBox .qmMenuIcn, 
    .qbMenu>li .qbBox .qbMenuIcn{
        height: 40px;
        background-size: 35px;
    }
    .qmMenu>li .qmBox .qmMenuTxt, 
    .qbMenu>li .qbBox .qbMenuTxt{
        font-size: 12px;
        font-weight: normal;
    }
    
    /* FOOTER */
    .f_top .fBranch{
        width: 100px;
        max-width: 100px;
    }
    .f_bot .fnb ul li>a{
        font-size: 12px;
    }
    .f_bot .fInfo{
        font-size: 10.5px;
        line-height: 1.7;
    }
    .f_bot .fInfo .fInfo_line{
        display: block;
        font-size: 10.5px;
        line-height: 1.7;
    }
    .f_bot .fInfo .small{
        font-size: 9px;
        margin-top: 10px;
    }
      
    /* IQ 아코디언 */
    .IQ_tit .IQ_title{
        font-size: 12px;
        text-align: left;
    }
    /* IQ 아코디언_inner */
    .subjectInputs label{
        width: 49%;
        margin: 5px 0;
    }  
    
    /* 기타경고문 */
    .IQ_Warn {
        font-size: 9px;
    }
    /* TABLE & INPUT */
    .IQ_table tr>*{
        padding: 10px;
        font-size: 12px;
    }
    .IQ_table tr .title{
        width: 20%;
        font-size: 12px;
    }
    /*지점선택*/
	.IQ_table tr .branchInputs{
		padding: 15px 12px !important;
	}
	.IQ_table tr .branchInputs label{
		min-width: 120px;
	}
    /* 개인정보처리방침*/
    .agreecheck input[type='checkbox'] {
        width: 12px; height: 12px;
    }
    /* 사이트맵 */
    #sitemap .listBx .list{
        margin-top: 10px;
    }
    #sitemap .listBx .list h4{
        font-size: 14px;
        padding: 10px 0;
    }
    #sitemap .listBx .list ul{
        padding: 10px 0;
    }
    #sitemap .listBx .list ul li a{
        font-size: 12px;
    }
    /* INPUT */
    label{
        font-size: 12px;
    }
    input[type='checkbox'] {
        height: 12px; width: 12px; 
    }
    input[type='checkbox']:checked:after {
        width: 6px; height: 6px; 
        top: 2px; left: 2px; 
        border-radius: 2px;
    }
    input[type='text'] {
        font-size: 11px;
    }
    input::-webkit-input-placeholder{
        font-size: 10px;
        padding-left: 0;
    }
    input::-ms-input-placeholder{
        font-size: 10px;
        padding-left: 0;
    }
    input::-moz-input-placeholder{
        font-size: 10px;
        padding-left: 0;
    }
    input::-o-input-placeholder{
        font-size: 10px;
        padding-left: 0;
    }
    
    textarea{
        font-size: 11px;
    }
    textarea::-webkit-input-placeholder{
        font-size: 10px;
    }
    textarea::-ms-input-placeholder{
        font-size: 10px;
    }
    textarea::-moz-input-placeholder{
        font-size: 10px;
    }
    textarea::-o-input-placeholder{
        font-size: 10px;
    }
    
    select{
        font-size: 10.5px;
    }
    
}




/* 화면 넓이 아이폰6 보다 좁은 경우 */
@media screen and (max-width: 365px){
    .Wrapper{
        padding: 0 5px;
    }
    /* HEADER */
    #mmenu .mnav .mlogo .minTit{
        font-size: 14px;
    }
    .accordion .toggle>a{
        font-size: 15px;
    }
    
    /* QUICK FIXED 하단 네비 */
    #QuickFixed{
        left: 0;
    }
    .qfMenu>li .qfBox .qfMenuTxt, .tbtn .tbtnTxt, .tbtn_on .tbtnTxt{
        font-size: 10px;
    }
    
    /* FOOTER */
    .f_top .fTel{
        font-size: 18px;
    }
    .f_top .fBranch{
        width: 80px;
        min-width: 80px;
        max-width: 80px;
    }
    .f_bot .fnb ul li>a{
        font-size: 11px;
    }
    
    
    /* TABLE & INPUT */
    .IQ_table tr .title{
        width: 22%;
    }
    .inputTxtWrap, .selectWrap{
        height: 27px;
    }
    input[type='text'] {
        height: 24px;
    }
    .selectWrap:first-child:after{
        width: 26px; height: 24px;
    }
    select{
        height: 24px;
        min-width: 55px;
        padding-left: 0;
    }
    /* 아코디언 IQ_inner */
    .subjectInputs label{
        font-size: 11px;
    }
    .subjectInputs label.tiny{
        font-size: 10px;
    }
    /*버튼사이텍스트영역*/
    .quickFix .qktxt .sideTxt{
        font-size: 12px;
    }
    /*지점선택*/
    .IQ_table tr .branchInputs label{
        margin-bottom: 3px;
		min-width: 100px;
    }
}