@charset "utf-8";

/* HEADER */
#TE_header { 
    width:100% ; background:url(../TE2_img/dot_b10.png) repeat-x 0 3.95rem rgba(0,0,0,0.15) ; height:4rem ;
    position:fixed ; left:0 ; top:0 ; z-index:95 }

#TE_hover_close  { 
    position:fixed ; left:0 ; top:0 ; z-index:94 ;
    display:block ; overflow:hidden ; width:100% ; height:0 ; font-size:0 ; color:transparent ; text-indent:-9999px ; border-radius:0 ;
    background-color:#000000 ; opacity:0  } 

 #TE_hover_close.open { height:100% ; opacity:0.1  }

#TE_header .TE_inner { width:96% ; max-width:75rem ; margin:auto ; position:relative } 

#TE_logo , #TE_logo > a { display:block ; width:8rem ; height:2.5rem  }
#TE_logo { position:absolute ; left:0 ; top:.75rem }
#TE_logo > a { color:transparent ; font-size:0 ; background:url(../TE2_img/TE2_logo.png) no-repeat left top  }

#TE_nav , #TE_nav_ul , .TE_nav_sub { width:47.5rem ; margin:auto }
#TE_nav_ul:after , #TE_log > ul:after { content:"" ; display:block ; clear:both }
.nav_li { float:left }
.nav_li.li1 , .nav_li.li2 { width:12.1% } 
.nav_li.li3 { width:13.8% } 
.nav_li.li4 { width:16.3% } 
.nav_li.li5 { width:14.9% } 
.nav_li.li6 { width:21.4% } 
.nav_li.li7 { width:9.4% } 
#TE_nav_ul .TE2_n3_br { display:block } 

.nav00 { 
    display:block ; text-align:center ; position:relative ;
    font-size:0.8rem ; line-height:4rem ; color:#ffffff ; color:rgba(256,256,256,0.9) ; font-weight:500 ; letter-spacing:-0.5px    }
.nav00::before { 
    position:absolute ; right:-0.1rem ; top:50% ;
    content:"" ; display:block ; width:0.15rem ; height:0.15rem ; background-color:rgba(255,255,255,0.3) }
.open .nav00::before , .sticky .nav00::before { background-color:rgba(0,0,0,0.2) }
.nav00.nav70:before { display:none }
    
#TE_nav_OC { display:none }
#TE_nav_OC , #TE_nav_OC > b , .TE_log_li  , .TE_log_btn  { width:2.5rem ; height:2.5rem }
#TE_nav_OC { position:absolute ; right:0 ; top:0.75rem }
#TE_nav_OC > b , #TE_nav_OC > b > span  { display:block ; overflow:hidden }
#TE_nav_OC > b  { position:relative}
#TE_nav_OC > b > span { 
    position:absolute ; left:50% ; transform:translateX(-50%) ;     
    color:transparent ; font-size:0 ; 
    width:1.3rem ; height:.15rem ; border-radius:1rem ; background-color:#ffffff }
#TE_nav_OC > b > span:nth-child(1) { top:.75rem }
#TE_nav_OC > b > span:nth-child(2) { top:50% ; transform:translate(-50%,-50%)}
#TE_nav_OC > b > span:nth-child(3) { bottom:.75rem }

#TE_log , #TE_log > ul , .TE_log_li  , .TE_log_btn   { display:block ; overflow:hidden }
#TE_log , #TE_log > ul { width:7.5rem }
#TE_log { position:absolute ; right:0 ; top:0.75rem }
.TE_log_li { float:left }
.TE_log_li.KKO , .TE_log_li.advice ,
.TE_log_li.tel , .TE_log_li.close , #TEM_btns { display:none }
.TE_log_btn { 
    font-size:0 ; color:transparent ; opacity:0.7 ;
    background:url(../TE2_img/TE2_top_icons.png) no-repeat 0px 0px ;}
.login .TE_log_btn { background-position:0 0 }
.join .TE_log_btn { background-position:-2.5rem 0 }
.app .TE_log_btn { background-position:-5rem 0 }
.logout .TE_log_btn { background-position:-7.5rem 0 }
.mypage .TE_log_btn { background-position:-10rem 0 }
.TE_log_btn:hover { opacity:1 ;}
 
.nav00:after { 
    content:"" ; display:block ; position:absolute ; left:50% ; bottom:0 ; transform:translateX(-50%) ;  
    width:0 ; height:0.1rem ; background-color:#2e96de ; opacity:0 }
.nav_li:hover .nav00 { opacity:1 }

.TE_M1 .nav_li.li1 .nav10:after , .TE_M2 .nav_li.li2 .nav20:after , .TE_M3 .nav_li.li3 .nav30:after , 
.TE_M4 .nav_li.li4 .nav40:after , .TE_M5 .nav_li.li5 .nav50:after , .TE_M6 .nav_li.li6 .nav60:after ,
.TE_M7 .nav_li.li7 .nav70:after , .TE_M8 .nav_li.li8 .nav80:after , .TE_M9 .nav_li.li9 .nav90:after , 
.nav_li:hover .nav00:after { width:100% ; opacity:1 }
 
#TE_header.open , #TE_btn_close , .TE_nav_sub , .nav_sub , 
#TE_header , #TE_nav_OC > b > span , .nav00 , .TE_log_btn  , .nav00:after { transition:0.5s all }



/* HEADER + NAV */ 
.TE2_n3_br { display:none }
.TE_nav_sub {  
    display:block ; overflow:hidden ; opacity:0 ; box-sizing:border-box ; 
    height:0 ; text-align:left ;  
    position:fixed ; left:50% ; top:5.2rem ; transform:translateX(-50%) ; } 
.TE_nav_sub > li { display:inline-block ; font-size:0.8rem ; color:rgba(0,0,0,0.7) ; margin:0 0.5rem }

 .li2 .TE_nav_sub { padding-left:6rem }
 .li4 .TE_nav_sub { padding-left:16rem }
 .li5 .TE_nav_sub { padding-left:13rem }
 .li6 .TE_nav_sub { text-align:right ; padding-right:4.5rem }
 .li6 .TE_nav_sub ,  .li7 .TE_nav_sub { text-align:right }
 
.sub1 .li1 .TE_nav_sub , .sub2 .li2 .TE_nav_sub , .sub3 .li3 .TE_nav_sub , 
.sub4 .li4 .TE_nav_sub , .sub5 .li5 .TE_nav_sub , .sub6 .li6 .TE_nav_sub , 
.sub7 .li7 .TE_nav_sub , .sub8 .li8 .TE_nav_sub , .sub9 .li9 .TE_nav_sub { height:4rem ; opacity:1 ; top:4rem }

.nav_sub {
    display:block ; color:#595959 ; font-weight:400 ; opacity:0.7 ;
    font-size:0.8rem ; line-height:1.1rem ; text-align:center ; padding:0.9rem 0 }
 
#TE_11 .nav_sub.nav11 , #TE_12 .nav_sub.nav12 , #TE_13 .nav_sub.nav13 , #TE_14 .nav_sub.nav14 , #TE_15 .nav_sub.nav15 , #TE_16 .nav_sub.nav16 , #TE_17 .nav_sub.nav17 , 
#TE_21 .nav_sub.nav21 , #TE_22 .nav_sub.nav22 , #TE_23 .nav_sub.nav23 , #TE_24 .nav_sub.nav24 , #TE_25 .nav_sub.nav25 , #TE_26 .nav_sub.nav26 , #TE_27 .nav_sub.nav27 , 
#TE_31 .nav_sub.nav31 , #TE_32 .nav_sub.nav32 , #TE_33 .nav_sub.nav33 , #TE_34 .nav_sub.nav34 , #TE_35 .nav_sub.nav35 , #TE_36 .nav_sub.nav36 , #TE_37 .nav_sub.nav37 , 
#TE_41 .nav_sub.nav41 , #TE_42 .nav_sub.nav42 , #TE_43 .nav_sub.nav43 , #TE_44 .nav_sub.nav44 , #TE_45 .nav_sub.nav45 , #TE_46 .nav_sub.nav46 , #TE_47 .nav_sub.nav47 , 
#TE_51 .nav_sub.nav51 , #TE_52 .nav_sub.nav52 , #TE_53 .nav_sub.nav53 , #TE_54 .nav_sub.nav54 , #TE_55 .nav_sub.nav55 , #TE_56 .nav_sub.nav56 , #TE_57 .nav_sub.nav57 , 
#TE_61 .nav_sub.nav61 , #TE_62 .nav_sub.nav62 , #TE_63 .nav_sub.nav63 , #TE_64 .nav_sub.nav64 , #TE_65 .nav_sub.nav65 , #TE_66 .nav_sub.nav66 , #TE_67 .nav_sub.nav67 , 
#TE_71 .nav_sub.nav71 , #TE_72 .nav_sub.nav72 , #TE_73 .nav_sub.nav73 , #TE_74 .nav_sub.nav74 , #TE_75 .nav_sub.nav75 , #TE_76 .nav_sub.nav76 , #TE_77 .nav_sub.nav77 , 
#TE_81 .nav_sub.nav81 , #TE_82 .nav_sub.nav82 , #TE_83 .nav_sub.nav83 , #TE_84 .nav_sub.nav84 , #TE_85 .nav_sub.nav85 , #TE_86 .nav_sub.nav86 , #TE_87 .nav_sub.nav87 , 
#TE_91 .nav_sub.nav91 , #TE_92 .nav_sub.nav92 , #TE_93 .nav_sub.nav93 , #TE_94 .nav_sub.nav94 , #TE_95 .nav_sub.nav95 , #TE_96 .nav_sub.nav96 , #TE_97 .nav_sub.nav97 , 
.nav_sub:hover { color:#111111 ; opacity:1 ;}
 


/* HEADER + OPEN + STICKY */
#TE_header.open , #TE_header.sticky { background-color:#ffffff } 
#TE_header.open  { height:8rem }
.open #TE_logo > a , .sticky #TE_logo > a { background-position:left bottom }
 
.open #TE_nav_OC > b > span , .sticky #TE_nav_OC > b > span { background-color:#cccccc }
.open #TE_nav_OC:hover > b > span , .sticky #TE_nav_OC:hover > b > span { background-color:#aaaaaa } 
.open #TE_nav_OC > b > span:nth-child(1) { top:50% ;  transform:translate(-50%,-50%) rotate(45deg)}
.open #TE_nav_OC > b > span:nth-child(2) { opacity:0 }
.open #TE_nav_OC > b > span:nth-child(3) { bottom:50%  ; transform:translate(-50%,50%) rotate(-45deg) }

.open .nav00 , .sticky .nav00 { color:rgba(0,0,0,0.6) }
.nav_li:hover .nav00  { color:rgba(0,0,0,0.8) } 

.open .login .TE_log_btn , .sticky .login .TE_log_btn { background-position:0 -2.5rem }
.open .join .TE_log_btn , .sticky .join .TE_log_btn{ background-position:-2.5rem -2.5rem }
.open .app .TE_log_btn , .sticky .app .TE_log_btn  { background-position:-5rem -2.5rem }
.open .logout .TE_log_btn , .sticky .logout .TE_log_btn  { background-position:-7.5rem -2.5rem }
.open .mypage .TE_log_btn , .sticky .mypage .TE_log_btn  { background-position:-10rem -2.5rem }
 


/* MAIN */
#TE2_main { display: block ; overflow: hidden }



/* SECTION */
.TE2_section , .TE2_section_inner { width:100% ; display:block } 
.TE2_section_inner { max-width:55rem ; margin:auto } 




/* FOOTER */
#TE2_footer  { display: block ; overflow: hidden ; width:100% ;}



/* FOOTER+ADVICE */
#TE2F_advice , #TE2F_advice fieldset , #TE2F_advice_title , #TE2F_advice label , 
#TE2F_advice_btn , #TE2F_advice_btn > span , #TE2F_advice_btn::before { display: block ; overflow: hidden }
#TE2F_advice { width:100% ; padding:1.5rem 0 ; background: url(../TE2_img/TE2F_advice_bg.png) repeat-x left top;}
#TE2F_advice fieldset { width:55rem ; margin:auto ; position: relative; }

#TE2F_advice_title , .TE2F_advice_input { float:left}
#TE2F_advice_title , .TE2F_advice_agree {width:8.5rem }
#TE2F_advice_title { 
    position: static ; height: auto ; vertical-align:top ;
    width:8.8rem ; font-size:1.2rem ; line-height:1.3rem ; color:#ffffff ; font-weight:500 ; letter-spacing: -1px}
.TE2F_advice_input {
    box-sizing: border-box ; padding:0 0.5rem ; padding-bottom:0.1rem  ; border-radius:0.3rem ;
    font-size:0.8rem ; line-height:2.4rem ; border:0  ; color:#444444 ; text-align:left ; margin-right:0.4rem ;
    background-color: #ffffff ; border:0 ;
}

.TE2F_advice_input.name { width:6rem } 
.TE2F_advice_input.tel  { width:10rem } 
.TE2F_advice_input.cnt  { width:24rem }

.TE2F_advice_agree { position: absolute ; left:0 ; bottom:0 }
.TE2F_advice_agree label { font-size:0.6rem ; line-height:0.8rem ; color:#ffffff ; font-weight:100 ; }
.TE2F_advice_agree label > a { font-size: inherit ; line-height:inherit ; color:inherit ; font-weight: inherit ;}
.TE2F_advice_agree label > a:hover { text-decoration: underline }
.TE2F_advice_agree input { float:left ; margin-right:0.2rem ; margin-top:0.1rem } 
#TE2F_advice_btn , #TE2F_advice_btn::before { border-radius:0.3rem ; height:2.5rem }
#TE2F_advice_btn {
    width:5rem ; height:2.5rem ;   padding:0px ; line-height:0 ;
    background-color:#fdc239 ; position: relative ; 
}

#TE2F_advice_btn > span , #TE2F_advice_btn::before { position: absolute ; transition: 0.3s all }
#TE2F_advice_btn > span {  
    left:50% ; top:50% ; transform: translate(-50%,-50%); width:100% ;
    font-size:0.8rem; line-height:1.3rem ; color:#111111 ; font-weight:500 ; text-align:center ;
}
#TE2F_advice_btn::before {  left:5% ; top:90% ; content:""; width:90% ; background-color:#ffffff ; opacity:0.2 }
#TE2F_advice_btn:hover::before { top:50% ; opacity:0.2 ; width:100% ; left:0 }



/* FOOTER+TIN */
#TE2F_TIN , #TE2F_copy { background-color:#ececec ; width:100% }
#TE2F_TIN , #TE2F_copy , #TE2F_TIN_inner , #TE2F_copy_inner , #TE2F_TIN_sns { display:block ; overflow: hidden }
#TE2F_TIN_inner , #TE2F_copy_inner { width:100% ; max-width:55rem ; margin:auto ; position: relative }

#TE2F_TIN { 
    background-image: url(../TE2_img/TE2F_bg_sh.gif) ; background-repeat: repeat-x ; background-position:left top ;
    padding-top:3rem ; padding-bottom:2.5rem ; border-bottom:solid 1px #d4d4d4 }
#TE2F_copy { padding:2.5rem 0 }


#TE2F_TIN_nav , #TE2F_TIN_sns {  width:25rem ; position: absolute  }
#TE2F_TIN_nav { top:0 ; right:0 ; text-align:right }
#TE2F_TIN_nav > li { 
    display: inline-block ; padding:0 1rem ;
    background:url(../TE2_img/dot_b10.png) no-repeat right center ; background-size:1px 0.5rem  ;
}
#TE2F_TIN_nav > li:first-child { padding-left:0} 
#TE2F_TIN_nav > li:last-child { padding-right:0 ; background:none ;} 
#TE2F_TIN_nav a { 
    display:block ; padding-bottom:0.1rem  ; transition: 0.3s all ; opacity:0.6 ; 
    font-size:0.8rem ; line-height:1rem  ; color:#111111 ; font-weight:400 }
#TE2F_TIN_nav a:hover { opacity:1 }
#TE2F_TIN_nav a > br { display:none }

#TE2F_TIN_TI ,  #TE2F_TIN_infor , #TE2F_TIN_infor dd { display:block }
#TE2F_TIN_TI { position: relative ; width: 27rem ; overflow: hidden;}
#TE2F_TIN_tel { width: 14rem ; float:left }
#TE2F_TIN_infor { width: 13rem ; float:right }
#TE2F_TIN_tel dt , #TE2F_TIN_infor dt { font-size:0.7rem ; line-height:0.8rem ; margin-bottom: 0.25rem }
#TE2F_TIN_tel dt , #TE2F_TIN_infor dd { color:rgba(0,0,0,0.7)}
#TE2F_TIN_infor dt { color:transparent }
#TE2F_TIN_tel dd { 
    font-family: 'Titillium Web', sans-serif ; font-weight:700 ; letter-spacing:-2px ;
    font-size: 2.3rem ; line-height:2.4rem ; color:#315395 }
#TE2F_TIN_infor dd { font-size: 0.7rem ; line-height:1.2rem ; letter-spacing:-0.5px }
#TE2F_TIN_infor dd span , #TE2F_TIN_infor dd b  { 
    font-size: 0.7rem ; line-height:1.1rem ; font-weight:400 ; color:inherit }
#TE2F_TIN_infor dd span { margin-right:0.2rem}
#TE2F_TIN_infor dd:last-child { position:absolute; left:0 ; bottom:0 ; width:14rem ; } 

#TE2F_TIN_sns { text-align:right ; right:0 ; bottom:0 }
#TE2F_TIN_sns li { display: inline-block }
#TE2F_TIN_sns a , #TE2F_TIN_sns span , #TE2F_TIN_sns b { display:block }
#TE2F_TIN_sns a { overflow: hidden }
#TE2F_TIN_sns span { font-size: 0.7rem ; line-height:2rem ; color:rgba(0,0,0,0.8) ; float:left }
#TE2F_TIN_sns span > br { display:none }
#TE2F_TIN_sns b { 
    font-size:0 ; color:transparent ; opacity:0.7 ; transition: 0.3s all ; 
    width:2rem ; height:2rem ; background: url(../TE2_img/TE2F_sns_icons.png) no-repeat 0 0 }
#TE2F_TIN_sns li:nth-child(1) b { background-position: 0 0 ; float: right }
#TE2F_TIN_sns li:nth-child(2) b { background-position: -2rem 0 }
#TE2F_TIN_sns li:nth-child(3) b { background-position: -4rem  0 }
#TE2F_TIN_sns li:nth-child(4) b { background-position: -6rem  0 }
#TE2F_TIN_sns li:nth-child(5) b { background-position: -8rem  0 }
#TE2F_TIN_sns a:hover b { opacity:1 }

#TE2F_copy ul , #TE2F_copy p { display:block ; width:20rem }
#TE2F_copy ul { float:left ; padding-left:9rem ; background: url(../TE2_img/TE2F_logo.png) no-repeat left top } 
#TE2F_copy p { float:right } 
#TE2F_copy ul > li , #TE2F_copy p { font-size:0.7rem ; line-height:1.3rem ; color:rgba(0,0,0,0.7)  }
#TE2F_copy ul > li { display: inline-block ; margin-right:1.5rem  }
#TE2F_copy p { text-align:right ; text-transform: uppercase }



/* ASIDE */
#TE2_aside , #TE2_aside ul , #TE2_aside li , #TE2_aside a , #TE2_aside span { display:block ; overflow:hidden }
#TE2_aside , #TE2_aside ul , .TE2A_top ,  #TE2_aside li , #TE2_aside a  { width:4rem }
#TE2_aside {  position: fixed ; right:-4.5rem ; bottom:0 ; z-index: 82; }
#TE2_aside.show { right:0rem }
#TE2_aside ul , #TE2_aside a  { box-sizing: border-box   }
#TE2_aside ul { 
    border-bottom:solid 1px rgba(0,0,0,0.1) ;
    background-color: #e5e5e5 ; margin-bottom: 0.25rem } 
#TE2_aside li , #TE2_aside a , #TE2_aside { transition: 0.3s all }
#TE2_aside a  { 
    background: url(../TE2_img/TE2_aside.png) no-repeat 0 0 ;
    border:solid 1px rgba(0,0,0,0.1) ; border-right:0 ; border-bottom:0  ; height:4.5rem }
#TE2_aside a , #TE2_aside .TE2A_top { font-size: 0 ; color:transparent }
#TE2_aside a { padding-top:3.25rem ; opacity:0.7 }
#TE2_aside a:hover { opacity:1 ; }
#TE2_aside li:hover { background-color:#ffffff ;} 
#TE2_aside span  { font-size:0.6rem ; line-height: 0.7rem ; text-align: center; color:#000000 ; font-weight:400 }

#TE2_aside .TE2A.li1 { background-color:#fdc239;}
#TE2_aside .TE2A.li1 > a { background-position:0 0 ; opacity:1 ;}
#TE2_aside .TE2A.li2 > a { background-position:0 -4.5rem }
#TE2_aside .TE2A.li3 > a { background-position:0 -9rem}
#TE2_aside .TE2A.li4 > a { background-position:0 -13.5rem }
#TE2_aside .TE2A.li5 > a { background-position:0 -18rem }
#TE2_aside .TE2A.li6 > a { background-position:0 -22.5rem }

#TE2_aside .TE2A_top {  
    height:2rem ; padding:0  ; border:0 ;  opacity:0.7 ; 
    background-color:#111111 ; background-position:0 -27rem }



/* ETC */
.TE2_lang { font-size: inherit ; line-height: inherit ; color:inherit ; font-weight: inherit }



/* LOGIN POPUP */
#login_pop , #login_pop form , #login_pop_box , #login_pop_logo ,
#login_pop label , #login_pop label::before { display:block ; overflow:hidden }
#login_pop { 
    display:block ; opacity:0 ;
    position: fixed ; left:0 ; top:50% ; z-index:100 ;
    width:100% ; height:0 ; box-sizing:border-box ;  
    background-color:rgba(0,0,0,0.6) ; padding:0 }
#login_pop.open {  opacity:1 ; height:100% ; top:0 }    
#login_pop form , #login_pop fieldset { width:100% ; box-sizing:border-box }
#login_pop form { border-radius:0.2rem ; max-width:25rem ; width:90% }
#login_pop form { 
    background-color:#ffffff ; height:0 ; 
    position:fixed ; left:50% ; top:50% ; transform:translate(-50%,-50%) }
#login_pop fieldset { padding:1.5rem 2.5rem }
#login_pop_box { position:relative ; width:100% }

#login_pop fieldset { display:none }

#login_pop.open { padding:1rem }
#login_pop.open fieldset { display:block }
#login_pop.open form { height:auto }
 
#login_pop_logo { 
    width:8rem ; height:2.5rem ; margin-bottom:1rem ;
    font-size:0 ; color:transparent ; background:url(../TE2_img/TE2_logo.png) no-repeat left bottom }
#login_pop label { width:100% ; box-sizing:border-box ; padding:0.5rem ; padding-left:2.5rem ; position:relative ; border:solid 1px rgba(0,0,0,0.1) }
#login_pop label::before { 
    position:absolute ; top:50% ; left:0.5rem ; transform:translateY(-50%) ; opacity:0.5 ;
    width:1.5rem ; height:1.5rem ; content:"" ; background:url(../TE2_img/login_icon.png) no-repeat left top }
.login_pop_input {width:100% ; padding:0 0.25rem ; font-size:0.8rem ; line-height:1.4rem ; height:1.5rem ; box-sizing:border-box }
#login_pop label:first-of-type { border-bottom:0 }
#login_pop label:last-of-type { margin-bottom:0.5rem }
#login_pop label:last-of-type::before { background-position:right bottom }
#login_pop label:hover::before { opacity:0.9 }

#login_pop label , #login_pop label::before , 
.btn_yellow::before , .btn_yellow , .btn_yellow:hover > span , .btn_white , #login_pop_close , #login_pop { transition:0.3s all }

.btn_yellow , .btn_yellow::before , .btn_white , #login_pop_btns , #login_pop_btns li { display:block ; overflow:hidden  }
.btn_yellow { 
    position:relative ; width:100% ; box-sizing:border-box ; border-radius:0.1rem ;
    text-align:center ; padding:0.6rem 0.2rem ; background-color:#fdc138 ; 
}
.btn_yellow::before { 
    position:absolute ; content:"" ; left:50% ; top:96% ; transform:translateX(-50%) ;
    width:95% ; height:6rem ; background-color:#ffffff ; opacity:0.05 ; }
.btn_yellow > span { font-size:0.9rem ; line-height:1rem ; color:#111111 ; font-weight:600 }
.btn_yellow:hover::before  { top:90% }
.btn_yellow:hover { background-color:#111111 }
.btn_yellow:hover > span { color:#ffffff } 
.btn_yellow:hover::before { top:50% ; opacity:0.1 ;}

.btn_blue::before , .btn_blue , .btn_blue:hover > span , .btn_white , #login_pop_close , #login_pop { transition:0.3s all }

.btn_blue , .btn_blue::before , .btn_white , #login_pop_btns , #login_pop_btns li { display:block ; overflow:hidden  }
.btn_blue { 
    position:relative ; width:100% ; box-sizing:border-box ; border-radius:0.1rem ;
    text-align:center ; padding:0.6rem 0.2rem ; background-color:#32569a ; 
}
.btn_blue::before { 
    position:absolute ; content:"" ; left:50% ; top:96% ; transform:translateX(-50%) ;
    width:95% ; height:6rem ; background-color:#ffffff ; opacity:0.05 ; }
.btn_blue > span { font-size:0.9rem ; line-height:1rem ; color:#ffffff ; font-weight:600 }
.btn_blue:hover::before  { top:90% }
.btn_blue:hover { background-color:#111111 }
.btn_blue:hover > span { color:#ffffff } 
.btn_blue:hover::before { top:50% ; opacity:0.1 ;}

.kakao_login { 
    position:relative; width:100%; box-sizing:border-box; border-radius:0.1rem;display:block;margin-top:10px;
    text-align:center; padding:0.6rem 0.2rem; background-color:#fdc239; 
    font-size:0.9rem; line-height:1rem; color:#ffffff; font-weight:600;
    background-image: url("/TE2_img/kakao_icon.png");background-repeat: no-repeat;background-position:top 50% left 24px;
    background-size: auto 80%;
}
#kakao_login.kakao_login{width:80%; margin:auto; margin-top:5px;}

.btn_white {
    width:100% ; box-sizing: border-box ; padding: 0.6rem 0.5rem ; border:solid 1px rgba(0,0,0,0.1) ;
    font-size:0.8rem ; line-height:1rem ; text-align:center ; font-weight:500 ; border-radius:0.1rem ;
}
.btn_white:hover { background-color:#f7f7f7 ; color:#111111 ; border-color:rgba(0,0,0,0.2) }

#login_pop_btns { padding-top:1rem ; width:100% ; margin-bottom:0.5rem }
#login_pop_btns li { width:100% }
#login_pop_btns li:nth-child(1) { max-width:12.5rem ; float:left }
#login_pop_btns li:nth-child(2) { max-width:7rem ; float:right }

#login_pop_close , #login_pop_close > b , #login_pop_close > b::before , #login_pop_close > b::after  { display:block ; overflow:hidden  } 
#login_pop_close , #login_pop_close > b {  
    width:1.5rem ; height:1.5rem; font-size:0 ; color:transparent ; opacity:0.4 }
#login_pop_close { position: absolute ; top:0.75rem ; right:0 }
#login_pop_close > b { position:relative  }    
#login_pop_close > b::before , #login_pop_close > b::after { 
    content:"" ; width:1.2rem ; height:0.1rem ; background-color:#000000 ; 
    position: absolute ; left:50% ; top:50% ; border-radius:1rem ; }
#login_pop_close > b::before { transform: translate(-50%,-50%) rotate(-45deg) }
#login_pop_close > b::after { transform: translate(-50%,-50%) rotate(45deg) }
#login_pop_close:hover { opacity:0.9 } 

.hidden_iframe { width:0 ; height:0 ; border:0 ; overflow:hidden ; overflow:hidden ; position:fixed ; left:-1rem ; bottom:-1rem ; opacity:0 }



/* FOOTER BANNER */
.footer_banner , .footer_banner_inner , .footer_banner_inner a { 
    display:block ; overflow:hidden ;
    width:100% ; height:6.5rem ; margin:auto
}
.footer_banner_inner a { font-size:0 ; color:transparent }





/* MIDDLE ****/
@media all and (max-width:1360px){

    /* HEADER + NAV */  
    #TE_nav  {width:63%} 
    #TE_nav_ul { width:100% } 
    .TE_nav_sub  { width:70% }
    .nav00  { word-break:break-all ; line-height:1rem ; padding:1rem 0.5rem ; box-sizing: border-box }
 
    .li1 .TE_nav_sub , .li2 .TE_nav_sub , .li3 .TE_nav_sub ,  .li4 .TE_nav_sub ,  
    .li5 .TE_nav_sub , .li6 .TE_nav_sub , .li7 .TE_nav_sub  { padding:0 ; margin:0 ; text-align:center }

    .li2 .TE_nav_sub { left:40% }
    .li6 .TE_nav_sub { left:70% }
}





/* MOBILE ****/
@media all and (max-width:1100px){
 
    /* HEADER */
    #TE_header { min-width:16rem }
    #TE_header , #TE_logo , #TE_logo > a , #TE_header.open , #TE_nav_OC , #TE_nav_OC > b  , #TE_log , #TE_header .TE_inner  { height:3rem }
    #TE_header , #TE_header.open , #TE_header.sticky { background-position:0 2.95rem ; background-color:#ffffff ;} 
    #TE_header .TE_inner { width:100% ; min-width:16.5rem ; position:static } 
    #TE_logo , #TE_logo > a   { width:6.5rem ; box-sizing:border-box }
    #TE_logo { position:fixed ; left:3.5rem ; top:0 }
    #TE_logo > a , .open #TE_logo > a , .sticky #TE_logo > a { 
        background:url(../TE2_img/TE2M_logo.png) no-repeat center center ; background-size:6.5rem 3rem }

    #TE_nav_OC { display:block }    
    #TE_nav_OC , #TE_nav_OC > b { width:3rem }
    #TE_nav_OC { background-color:#32569a ; position:fixed ; left:0 ; top:0 }
    
    #TE_nav_OC > b > span:nth-child(1) { top:1rem }
    #TE_nav_OC > b > span:nth-child(2) { top:50% ; transform:translate(-50%,-50%)}
    #TE_nav_OC > b > span:nth-child(3) { bottom:1rem }

    #TE_nav_ul .TE2_n3_br { display:none }  


    /* HEADER+BTN */
    #TEM_btns , .TEM_btn_li , .TEM_btn { display: block ; overflow: hidden ; height:3rem }
    .TEM_btn_li , .TEM_btn { width:3rem ; box-sizing:border-box  }
    #TEM_btns {  width:6rem ; position:absolute ; right:0 ; top:0 ;  background-color:rgba(0,0,0,0.05) }
    .TEM_btn_li { float:left }
    .TEM_btn { 
        font-size:0 ; color:transparent ; text-indent: -444rem ; opacity:0.5 ; transition:0.3s all ;
        border-left:solid 1px rgba(0,0,0,0.1) ;  background-position:center center  }
    .TEM_btn:hover  { opacity:0.8 } 
    .app .TEM_btn { background-image:url(../TE2_img/TE2H_icon_app.png) }
 
    .TEM_btn_li.tel { background-color:#32569a }
    .TEM_btn_li.tel:hover { background-color:#111111 }
    .tel .TEM_btn { background-image:url(../TE2_img/TE2H_icon_tel_W.png) ; opacity:1 }
    
    
    /* HEADER + NAV OPEN BTN */
   .open #TE_nav_OC:hover , .sticky #TE_nav_OC:hover , #TE_nav_OC:hover { background-color:#111111 ;}
   .open #TE_nav_OC > b > span , .sticky #TE_nav_OC > b > span { background-color:#ffffff } 
   .open #TE_nav_OC:hover > b > span , .sticky #TE_nav_OC:hover > b > span , #TE_nav_OC:hover > b > span { background-color:#fec139 } 

   .open #TE_nav_OC > b > span:nth-child(1) { top:1rem ; transform:translateX(-50%) rotate(0deg)  }
   .open #TE_nav_OC > b > span:nth-child(2) { top:50% ; transform:translate(-50%,-50%) ; opacity:1 ;}
   .open #TE_nav_OC > b > span:nth-child(3) { bottom:1rem ; transform:translateX(-50%) rotate(0deg) }


    /* NAV + TOP */ 
    #TE_log , #TE_log > ul , .TE_log_li , .TE_log_btn , .close .TE_log_btn > b { height:3rem  }
    .TE_log_li.KKO , .TE_log_li.advice ,
    .TE_log_li.tel , .TE_log_li.close , #TEM_btns ,
    .close .TE_log_btn > b , .close .TE_log_btn > b > span { display:block ; overflow:hidden }
    .TE_log_li  , .TE_log_btn , .close .TE_log_btn > b { width:3rem ; box-sizing:border-box  }
    #TE_log , #TE_log > ul { width:100% }
    #TE_log { 
        position:fixed ; left:-101% ; top:0rem ; z-index:96 ; transition:0.3s all ;
        width:100% ; background:url(../TE2_img/dot_b10.png) repeat-x right bottom #f2f2f2 }
    .mOpen #TE_log { left:0% }

    .TE_log_btn {
        background:none ;
        background-repeat:no-repeat ; background-position:center center ; background-size:cover   ;
        width:3rem ; border-right:solid 1px rgba(0,0,0,0.1) ; box-sizing:border-box ;  
        padding-top:1.8rem ; vertical-align: top ; 
        font-size:0.55rem ; line-height:0.7rem  ; text-align:center ; text-indent:0 ; color:#111111 ; font-weight:400 ; letter-spacing:-0.5px }
 
    .open .KKO .TE_log_btn , .sticky .KKO .TE_log_btn , .KKO .TE_log_btn ,
    .open .advice .TE_log_btn , .sticky .advice .TE_log_btn , .advice .TE_log_btn , 
    .open .login .TE_log_btn , .sticky .login .TE_log_btn , .login .TE_log_btn ,
    .open .logout .TE_log_btn , .sticky .logout .TE_log_btn , .logout .TE_log_btn ,
    .open .join .TE_log_btn , .sticky .join .TE_log_btn , .join .TE_log_btn ,
    .open .app .TE_log_btn , .sticky .app .TE_log_btn , .app .TE_log_btn ,
    .open .tel .TE_log_btn , .sticky .tel .TE_log_btn, .tel .TE_log_btn ,
    .logout .TE_log_btn , .mypage .TE_log_btn { background:url(../TE2_img/TE2H_icons.png) no-repeat 0 0 ;}
 
    .open .login .TE_log_btn , .sticky .login .TE_log_btn , .login .TE_log_btn { background-position: 0 0 ;}
    .open .logout .TE_log_btn , .sticky .logout .TE_log_btn , .logout .TE_log_btn { background-position: -3rem 0 ;}
    .open .join .TE_log_btn , .sticky .join .TE_log_btn , .join .TE_log_btn { background-position: -6rem 0 ;}
    .open .app .TE_log_btn , .sticky .app .TE_log_btn , .app .TE_log_btn { background-position: -9rem 0 ;}
    .open .tel .TE_log_btn , .sticky .tel .TE_log_btn, .tel .TE_log_btn { background-position: -12rem 0 ;}
    .open .mypage .TE_log_btn , .sticky .mypage .TE_log_btn, .mypage .TE_log_btn { background-position: -15rem 0 ;}
    .open .KKO .TE_log_btn , .sticky .KKO .TE_log_btn , .KKO .TE_log_btn { background-position: -18rem 0 ;}
    .open .advice .TE_log_btn , .sticky .advice .TE_log_btn , .advice .TE_log_btn { background-position: -21rem 0 ;}
 
    .open .login .TE_log_btn , .sticky .login .TE_log_btn , .login .TE_log_btn ,
    .open .join .TE_log_btn , .sticky .join .TE_log_btn , .join .TE_log_btn ,
    .logout .TE_log_btn , .mypage .TE_log_btn  { color:#ffffff }

    .TE_log_li.login , .TE_log_li.join , .TE_log_li.logout , .TE_log_li.mypage { background-color:#054198 }

    .TE_log_li.close , .close .TE_log_btn { padding:0 ; opacity:1 ; }
    .TE_log_li.close { position:absolute ; top:0 ; right:0 ; border:0px } 
    .close .TE_log_btn > b { position: relative ; background-color:#fec139; } 
    .close .TE_log_btn > b  > span { 
        position:absolute ; left:50% ; top:50% ;    
        color:transparent ; font-size:0 ; 
        width:1.3rem ; height:.15rem ; border-radius:1rem ; background-color:#111111 } 
    .close .TE_log_btn > b  > span:nth-child(1) { transform:translate(-50%,-50%) rotate(45deg) }
    .close .TE_log_btn > b  > span:nth-child(2) { transform:translate(-50%,-50%) rotate(-45deg) }
    .close .TE_log_btn:hover > b { background-color:#111111 }
    .close .TE_log_btn:hover > b > span { background-color:#fec139 }

    .close .TE_log_btn , .close .TE_log_btn > b  , .close .TE_log_btn > b > span , #TE_nav { transition:all 0.3s }

    .TE_log_li.app , .TE_log_li.tel { display:none ;}

        
    /* NAV BG CLOSE */
    #TE_hover_close { width:100% ; height:100% ; left:-101%}
    #TE_hover_close.open { left:0 }



    /* NAV */
    #TE_nav , #TE_nav_ul { width: 100%  ; box-sizing:border-box }
    #TE_nav { 
        display:block ; overflow:auto  ; 
        height:100vh  ; padding-top:3rem ; margin-left:-101% ; }
    .mOpen #TE_nav  { margin-left:0} 
    #TE_nav_ul {  height:auto ; background-color:#ffffff ; padding:1.5rem ; padding-top:1rem  }

    .nav_li , .nav_li.li1 , .nav_li.li2 , .nav_li.li3 , .nav_li.li4 , .nav_li.li5 , .nav_li.li6 , .nav_li.li7 , .nav_li.li8 , .nav_li.li9 ,
    .opn .nav_li , .opn .nav_li.li1 , .opn .nav_li.li2 , .opn .nav_li.li3 , .opn .nav_li.li4 , .opn .nav_li.li5 , .opn .nav_li.li6 , .opn .nav_li.li7 , 
    .opn .nav_li.li8 , .opn .nav_li.li9 {
        position:static ; display: block ; width:100% ; float:none ; margin:0 ; margin-bottom:1.5rem  ; padding:0 }

    .nav00::after , .nav00::before { display:none }
    .nav00 , .open .nav00 , .sticky .nav00 { 
        padding:0.5rem 0 ; margin:0 ; margin-bottom:0.5rem  ; 
        border-bottom:0 ; background:url(../TE2_img/dot_b10.png) repeat-x left bottom ;
        font-size:1.2em ; line-height: 1.5rem ; font-weight:600 ; color:#111111 ; text-align:left ; letter-spacing:-0.1rem;} 
    .nav00 { position:relative ;}
    .nav00::after { 
        left:0 ; bottom:0 ; opacity:1 ; transform: none;
        content:"" ; display:block ; width:5rem ; height:0.1rem ; background-color:#2e96de ;} 

    .TE_nav_sub { display:block ; position:static ; opacity:1 ; width:100% ; height:auto ; padding:0 ; margin:0 ; transform: none ; text-align:center }        
    
    .li1 .TE_nav_sub , .li2 .TE_nav_sub , .li3 .TE_nav_sub ,  .li4 .TE_nav_sub ,  
    .li5 .TE_nav_sub , .li6 .TE_nav_sub , .li7 .TE_nav_sub , .li8 .TE_nav_sub , .li9 .TE_nav_sub ,
    .sub1 .li1 .TE_nav_sub, .sub2 .li2 .TE_nav_sub, .sub3 .li3 .TE_nav_sub, .sub4 .li4 .TE_nav_sub, 
    .sub5 .li5 .TE_nav_sub, .sub6 .li6 .TE_nav_sub, .sub7 .li7 .TE_nav_sub, .sub8 .li8 .TE_nav_sub, 
    .sub9 .li9 .TE_nav_sub { padding:0 ; margin:0 ; height:auto ; text-align:left ; }

    .nav_sub  , .TE_nav_sub > li {  padding:0 ; margin:0 ; text-align:left }
    .TE_nav_sub > li  { margin-right:1rem ; margin-bottom:0.5rem ; width:43% }
    .nav_sub { word-break:keep-all ; line-height:1rem ;}



    /* MAIN */
    #TE2_main { margin-bottom:2rem }



    /* FOOTER */
    #TE2_footer { background-color:#ececec ; border-top:solid 1px #d4d4d4 } 
    #TE2F_advice { display:none } 
    #TE2F_TIN , #TE2F_copy { background:none}
    #TE2F_TIN , #TE2F_TIN_inner { padding:0px }
 
    #TE2F_TIN_nav { 
        padding:0.5rem ; overflow: hidden ; width:100% ; position: static ; text-align:center ;
        box-sizing: border-box ; border-bottom:solid 1px rgba(0,0,0,0.1) }
    #TE2F_TIN_nav > li , #TE2F_TIN_nav > li:first-child , #TE2F_TIN_nav > li:last-child {
        display:inline-block ; background:none ;  margin:0.2rem ; padding:0 }

    #TE2F_TIN_nav a { padding:0.25rem 0.75rem ; border-radius:3rem ; border:solid 1px rgba(0,0,0,0.1) }
    #TE2F_TIN_nav a:hover { background-color:#444444 ; color:#ffffff }     

    #TE2F_TIN_TI {  padding:0 1.5rem ;  position:static ; box-sizing: border-box ; width:100% ; }
    #TE2F_TIN_tel , #TE2F_TIN_infor , #TE2F_TIN_sns { float:none ; width:100% ; position: static ; padding:1rem 0 ; margin:0 }
    #TE2F_TIN_tel , #TE2F_TIN_infor { border-bottom: dashed 1px rgba(0,0,0,0.2) ; text-align:center }
    #TE2F_TIN_infor dd , #TE2F_TIN_infor dd:last-child { position: static ; display: block ; width: auto  }
    #TE2F_TIN_infor dt { margin:0 ; padding:0 ; height:0 }

    #TE2F_TIN_sns { text-align: center;}
    #TE2F_TIN_sns span {  font-size:0.6rem ; line-height: 0.8rem ; text-align:right; padding-top:0.1rem }
    #TE2F_TIN_sns span > br { display:block }

    #TE2F_copy , #TE2F_copy_inner  , #TE2F_copy ul , #TE2F_copy p  { padding:0 ; margin:0 }
    #TE2F_copy , #TE2F_copy_inner  { width:100% ; background-color:#2f2f2f }
    #TE2F_copy_inner { padding:2rem 1.5rem ; box-sizing: border-box; }
    #TE2F_copy ul , #TE2F_copy p { position: static ;  background:none ; text-align:center ; width:100% ; float:none }
    #TE2F_copy ul > li , #TE2F_copy p { 
        font-size:0.8rem ; line-height:1.2rem ; font-weight: 300; 
        color:#ffffff  }
    #TE2F_copy ul > li , #TE2F_copy ul > li:last-child { margin:0 0.5rem ; word-break: keep-all;}
    #TE2F_copy ul > li  { margin-bottom:0.3rem }
    #TE2F_copy ul { margin-bottom: 0.5rem}

    #TE2F_TIN_infor dd span , #TE2F_TIN_infor dd b  { font-size: 0.8rem }



    /* ASIDE */ 
    #TE2_aside ,#TE2_aside > ul { width:100% }
    #TE2_aside { position:static ; margin-bottom:1.5rem ; } 
    #TE2_aside > ul , #TE2_aside li { background:none }
    #TE2_aside > ul { text-align:center }
    #TE2_aside li { 
        display:inline-block ; box-sizing:border-box ; 
        margin:0.05rem ; margin-bottom:0.3rem ; background-color:#f7f7f7 ; 
        border-radius:0.2rem ; border:solid 1px rgba(0,0,0,0.1)}
    #TE2_aside > ul , #TE2_aside a { border:0px }

    #TE2_aside .TE2A_top { width:2rem ; position:fixed ; right:0 ; z-index:90 ; ; bottom:0 ; margin:0 }
    #TE2_aside .TE2A_top { background-position: -1rem -27rem ; opacity:0.6 ; } 
    #TE2_aside .TE2A_top:hover { opacity:0.9 }
     


    /* LOGIN POPUP */
    #login_pop_btns li:nth-child(1) , #login_pop_btns li:nth-child(2) { float:none ; width:100% ; max-width:none }
    #login_pop_btns li:nth-child(1) { margin-bottom:0.25rem }
 


    /* FOOTER BANNER */
    .footer_banner  { display:none } 
}


/* MOBILE ****/
@media all and (max-width:514px){
    #TE2_aside .li4, #TE2_aside .li6 {display:none;}
}


/* MOBILE ****/
@media all and (max-width:360px){
    .TE_nav_sub > li { display:block ; width:auto }
}


/* MOBILE ****/
@media all and (max-width:341px){
    #TE2_aside li  { width:23% }
    #TE2_aside a  { height:initial; width: 100%; background-position-x: center !important; }
    #TE2_aside span {font-size: 0.5rem; margin-bottom:3px;}
}


/* MOBILE ****/
@media all and (max-width:266px){
    #TE2_aside li  { width:22% }
}