@charset "utf-8";

body { overflow:auto }



/* HEADER */
#K_HEADER { width:100% ; box-sizing:border-box }
#K_HEADER { 
    position:fixed ; left:0 ; top:0 ; z-index:99 ;
    background-color:#ffffff ; height:5rem ; box-shadow:0 0 0.3rem rgba(0,0,0,0.2) ;
}
#K_HEADER > h1 , #K_HEADER > h1 > a { display:block ; overflow:hidden }
#K_HEADER > h1 { width:4.5rem ; height:3.5rem ; position:absolute ; left:1rem ; top:1rem }
#K_HEADER > h1 > a { width:100% ; height:100% ; font-size:0 ; color:transparent ; background:url(../img/logo.png) no-repeat center ; background-size:4.5rem auto }
 


/* HEADER > HISTORY */
#KH_history { 
    width:14.5rem ; height:3rem ; box-sizing:border-box ; background-color:#ffffff ; 
    position:relative ; border-radius:2rem ; border:solid 1px rgba(0,0,0,0.1) ;
    margin:1rem 0 0 6.5rem
}
#KH_history.his_open { background-color:rgba(0,0,0,0.8) ; border-color:rgba(0,0,0,0.8); }
#KH_history > h2 {
    font-family:'Noto Serif KR',serif ; font-size:1.4rem ; line-height:2.8rem ; color:#000000 ; 
    opacity:0.8 ; padding-left:1.5rem ; letter-spacing:-0.05rem 
}
#KH_history.his_open > h2 { color:#ffffff ; opacity:1 }
#KH_history_btn_open { 
    width:3rem ; height:3rem ; font-size:0 ; color:transparent ;
    position:absolute ; right:0 ; top:0
}

#KH_history_btn_open::after { 
    display:block ; overflow:hidden ; content:"" ; opacity:0.5 ;
    width:0.6rem ; height:0.6rem ; box-sizing:border-box ;
    border:solid 0.1rem #000000 ; border-left:none ; border-top:none ; 
    position:absolute ; left:50% ; top:45% ; transform:translate(-50%,-50%) rotate(45deg) ;
}
.his_open #KH_history_btn_open::after { transform:translate(-50%,-50%) rotate(-135deg) ; top:50% ; opacity:1 ; border-color:#ffffff }
 
#KH_history_list , #KH_history_list a , #KH_history_list a::after , 
#KH_history_list a > b , #KH_history_list a > span , #KH_history_btn_open::after ,
#KH_history_btn_close , #KH_history_btn_close::after , #KH_history_btn_close::before  { transition:0.3s all }

#KH_history_list {
    display:block ; overflow:hidden ; width:30rem ; box-sizing:border-box ; padding:0rem 2rem ; height:0 ; 
    background-color:#ffffff ;  border:0 ;  border-radius:1rem ; opacity:0 ;
    position:fixed ; left:1rem ; top:4.2rem 
}
.his_open #KH_history_list  {
    padding-top:1rem ; padding-bottom:1rem ; height:auto ; opacity:1 ; border:solid 1px rgba(0,0,0,0.1)
}
#KH_history_list > ul { width:100% ; box-sizing:border-box ; position:relative }

#KH_history_list a {
    display:block ; overflow:hidden ; width:100% ; box-sizing:border-box ; 
    font-size:1.4rem ; line-height:2.8rem ; font-family:'Noto Serif KR',serif ; color:rgba(0,0,0,0.8) ;
    padding-bottom:0.2rem  ; border-bottom:solid 1px rgba(0,0,0,0.1) ;
    position:relative ; 
}

#KH_history_list a > b , #KH_history_list a > span {
    font-size:inherit ; line-height:inherit ; font-family:inherit ; color:inherit ; font-weight:inherit ;
    letter-spacing:-0.05rem ; display:block ; box-sizing:border-box ;
}
#KH_history_list a > b { float:left ; width:8rem ; padding-left:0.3rem }
#KH_history_list a > span { 
    float:right ; width:16.5rem ; margin-right:1rem ;
    word-wrap:break-word ; white-space:nowrap ; overflow:hidden ; text-overflow:ellipsis
}
#KH_history_list li:last-child > a { border:none ;  padding-left:8rem }
#KH_history_list a:hover , #KH_history_list a:focus { border-color:#0f4ea7 ; color:#000000 }
#KH_history_list a::after {
    display:block ; overflow:hidden ; content:"" ; box-sizing:border-box ;
    width:0.7rem ; height:0.7rem ; border:solid 0.1rem #000000 ; border-left:none ; border-top:none ;
    position:absolute ; right:0 ; top:45% ; transform:translate(-50%,-50%) rotate(-45deg) ;  opacity:0 ;
} 
#KH_history_list a:hover::after { right:0.3rem ; opacity:0.6 ; transform:translate(-50%,-50%) rotate(-45deg)}
#KH_history_btn_close { 
    width:2rem ; height:2rem ; display:block ; overflow:hidden ;
    font-size:0 ; color:transparent ;
    position:absolute ; left:1.8rem ; bottom:1.5rem ; opacity:0.5
}  
#KH_history_btn_close::after , #KH_history_btn_close::before {
    display:block ; overflow:hidden ; content:"" ;
    width:1.5rem ; height:0.1rem ; background-color:#000000 ;
    position:absolute ; left:50% ; top:50%
}
#KH_history_btn_close::after { transform:translate(-50%,-50%) rotate(45deg) }
#KH_history_btn_close::before { transform:translate(-50%,-50%) rotate(-45deg) }
 
#KH_history_btn_close:hover { opacity:0.8 }
#KH_history_btn_close:hover::after  { transform:translate(-50%,-50%) rotate(135deg) }
#KH_history_btn_close:hover::before  { transform:translate(-50%,-50%) rotate(45deg) }



/* SNS */
#KH_sns { display:none }



/* GTN */
#KH_nav_OC { width:5rem ; height:5rem ; position:absolute ; right:0 ; top:0 }
#KH_nav_OC > span , #KH_nav_OC::before , #KH_nav_OC::after { 
    display:block ; overflow:hidden ; position:absolute ; left:50% ;
    width:2.8rem ; height:0.2rem ; background-color:#012d6b ; transform:translate(-50%,-50%) ;
    transition:0.3s all ;
}
#KH_nav_OC::before , #KH_nav_OC::after { content:"" ; font-size:0 ; color:transparent }

#KH_nav_OC::before { top:33% }
#KH_nav_OC > span  { top:50% }
#KH_nav_OC::after  { top:67% }

#KH_nav_OC:hover::before , #KH_nav_OC:hover > span , #KH_nav_OC:hover::after { background-color:#0f4ea7 }
#KH_nav_OC:hover::before { top:70% }
#KH_nav_OC:hover > span  { top:50% ; transform:translate(-50%,-50%) rotate(180deg) }
#KH_nav_OC:hover::after  { top:30% }

.gtn_open #KH_nav_OC > span { opacity:0 }
.gtn_open #KH_nav_OC::before , .gtn_open #KH_nav_OC::after { top:50% ; background-color:#7ac142 }
.gtn_open #KH_nav_OC::before { transform:translate(-50%,-50%) rotate(45deg) }
.gtn_open #KH_nav_OC::after  { transform:translate(-50%,-50%) rotate(-45deg) }  
.gtn_open #KH_nav_OC:hover::before { transform:translate(-50%,-50%) rotate(135deg) }
.gtn_open #KH_nav_OC:hover::after  { transform:translate(-50%,-50%) rotate(45deg) }
 
#K_GTN , #K_GTN_inner , #K_GTN_header , #K_GTN_list , .deep1 , .deep1 > a , .deep2 , .K_GTN_sub { width:100% ; box-sizing:border-box }
#K_GTN { 
    position:fixed ; left:-130% ; top:0 ; z-index:98 ; transition:0.3s all ;
    height:100vh ; padding-top:5rem ; overflow:hidden }
.gtn_open #K_GTN { left:0 }
#K_GTN_inner { height:100% ; overflow:auto ; background-color:#ffffff }
#K_GTN_header { padding:1rem ; padding-top:1.7rem ; text-align:center ; font-size:0 }
#K_GTN_header > b , #K_GTN_header > span { display:inline-block ; margin:0 0.3rem ; margin-bottom:0.7rem }
#K_GTN_header > b {
    font-size:1.4rem ; line-height:1.8rem ; color:#ffffff ; font-weight:500 ; 
    text-shadow:0 0 0.2rem rgba(0,0,0,0.3) ;
    background-color:#7ac142 ; padding:0.3rem 1.3rem 0.5rem 1.3rem ; border-radius:2rem }
#K_GTN_header > span {
    font-size:2rem ; line-height:2.6rem ; font-weight:400 ; word-break:keep-all ;
    letter-spacing:-0.1rem ;
} 

.deep1 a , .deep2 > a , .deep2 > a > b , .deep2 > a > span  { transition:0.3s all }

.deep1 > a { 
    padding:1rem 0.5rem ; padding-bottom:1.2rem ; display:block ; 
    border-top:solid 2px #012d6b ; border-bottom:solid 0.1rem rgba(0,0,0,0.1) ;
    font-size:2rem ; line-height:2.6rem ; font-weight:600 ; text-align:center ; letter-spacing:-0.1rem ;
}
 
#KIIP11 .deep1 > a.nav10 , #KIIP12 .deep1 > a.nav10 , #KIIP13 .deep1 > a.nav10 , #KIIP14 .deep1 > a.nav10 , 
#KIIP21 .deep1 > a.nav20 , #KIIP22 .deep1 > a.nav20 , #KIIP23 .deep1 > a.nav20 , #KIIP24 .deep1 > a.nav20 , 
#KIIP31 .deep1 > a.nav30 , #KIIP32 .deep1 > a.nav30 , #KIIP33 .deep1 > a.nav30 , #KIIP34 .deep1 > a.nav30 , 
#KIIP41 .deep1 > a.nav40 , #KIIP42 .deep1 > a.nav40 , #KIIP43 .deep1 > a.nav40 , #KIIP44 .deep1 > a.nav40 , 
.deep1:hover > a { background-color:#012d6b ; color:#ffffff }

.K_GTN_sub { margin:1rem auto ; text-align:center ; font-size:0 }
.deep2 , .deep2 > a { display:block }
.deep2 > a { 
    border-bottom:solid 1px rgba(0,0,0,0.1) ; text-align:left ;
    padding:1.3rem 0.3rem ; padding-bottom:1rem ;
}
.deep2 > a > b , .deep2 > a > span { display:inline-block ; word-break:keep-all ; margin:0 0.3rem ; margin-bottom:0.5rem }
.deep2 > a > b { 
    font-size:1.2rem ; line-height:1.4rem ;
    border:solid 1px rgba(0,0,0,0.1) ; border-radius:2rem ; padding:0.5rem 1.2rem ; padding-bottom:0.7rem ; 
}
.deep2 > a > span { font-size:1.8rem ; line-height:2.4rem } 

#KIIP11 .deep2 > a.nav11 > b , #KIIP12 .deep2 > a.nav12 > b , #KIIP13 .deep2 > a.nav13 > b , #KIIP14 .deep2 > a.nav14 > b , 
#KIIP21 .deep2 > a.nav21 > b , #KIIP22 .deep2 > a.nav22 > b , #KIIP23 .deep2 > a.nav23 > b , #KIIP24 .deep2 > a.nav24 > b , 
#KIIP31 .deep2 > a.nav31 > b , #KIIP32 .deep2 > a.nav32 > b , #KIIP33 .deep2 > a.nav33 > b , #KIIP34 .deep2 > a.nav34 > b , 
#KIIP41 .deep2 > a.nav41 > b , #KIIP42 .deep2 > a.nav42 > b , #KIIP43 .deep2 > a.nav43 > b , #KIIP44 .deep2 > a.nav44 > b , 
.deep2 > a:hover > b { background-color:#111111 ; border-color:transparent ; color:#ffffff }

#KIIP11 .deep2 > a.nav11 > b , #KIIP12 .deep2 > a.nav12 > b , #KIIP13 .deep2 > a.nav13 > b , #KIIP14 .deep2 > a.nav14 > b { background-color:#26abdb } 
#KIIP21 .deep2 > a.nav21 > b , #KIIP22 .deep2 > a.nav22 > b , #KIIP23 .deep2 > a.nav23 > b , #KIIP24 .deep2 > a.nav24 > b { background-color:#083879 } 
#KIIP31 .deep2 > a.nav31 > b , #KIIP32 .deep2 > a.nav32 > b , #KIIP33 .deep2 > a.nav33 > b , #KIIP34 .deep2 > a.nav34 > b , 
#KIIP41 .deep2 > a.nav41 > b , #KIIP42 .deep2 > a.nav42 > b , #KIIP43 .deep2 > a.nav43 > b , #KIIP44 .deep2 > a.nav44 > b { background-color:#68bc26 } 

#KIIP11 .deep2 > a.nav11 > span , #KIIP12 .deep2 > a.nav12 > span , #KIIP13 .deep2 > a.nav13 > span , #KIIP14 .deep2 > a.nav14 > span , 
#KIIP21 .deep2 > a.nav21 > span , #KIIP22 .deep2 > a.nav22 > span , #KIIP23 .deep2 > a.nav23 > span , #KIIP24 .deep2 > a.nav24 > span , 
#KIIP31 .deep2 > a.nav31 > span , #KIIP32 .deep2 > a.nav32 > span , #KIIP33 .deep2 > a.nav33 > span , #KIIP34 .deep2 > a.nav34 > span , 
#KIIP41 .deep2 > a.nav41 > span , #KIIP42 .deep2 > a.nav42 > span , #KIIP43 .deep2 > a.nav43 > span , #KIIP44 .deep2 > a.nav44 > span , 
.deep2 > a:hover > span { color:#111111 } 

#KIIP11 .deep2 > a.nav11 , #KIIP12 .deep2 > a.nav12 , #KIIP13 .deep2 > a.nav13 , #KIIP14 .deep2 > a.nav14 , 
#KIIP21 .deep2 > a.nav21 , #KIIP22 .deep2 > a.nav22 , #KIIP23 .deep2 > a.nav23 , #KIIP24 .deep2 > a.nav24 , 
#KIIP31 .deep2 > a.nav31 , #KIIP32 .deep2 > a.nav32 , #KIIP33 .deep2 > a.nav33 , #KIIP34 .deep2 > a.nav34 , 
#KIIP41 .deep2 > a.nav41 , #KIIP42 .deep2 > a.nav42 , #KIIP43 .deep2 > a.nav43 , #KIIP44 .deep2 > a.nav44 , 
.deep2 > a:hover { border-color:rgba(0,0,0,0.5) ; background-color:#f7f7f7 ; }

#KH_nav_close , #KH_nav_close::before , #KH_nav_close::after { display:block ; overflow:hidden ; transition:0.3s all }
#KH_nav_close { 
    position:fixed ; right:-3rem ; bottom:2rem ; 
    display:none ; overflow:hidden ; margin:0 ; opacity:0 ;
    width:3rem ; height:3rem ;  transition:0.3s all ; 
    font-size:0 ; color:transparent ;
}    
.gtn_open #KH_nav_close { display:block ; opacity:0.3 ; right:2rem } 



#KH_nav_close::before , #KH_nav_close::after {
    content:"" ; position:absolute ; left:50% ; top:50% ;
    width:2rem ; height:0.2rem ; background-color:#000000 ; 
}
#KH_nav_close::before { transform:translate(-50%,-50%) rotate(45deg) }
#KH_nav_close::after  { transform:translate(-50%,-50%) rotate(-45deg) }
.gtn_open #KH_nav_close:hover , #KH_nav_close:hover { opacity:0.8 }
#KH_nav_close:hover::before { transform:translate(-50%,-50%) rotate(135deg) }
#KH_nav_close:hover::after{ transform:translate(-50%,-50%) rotate(45deg) }



/* SNS */
#KH_sns { display:none } 



/* MAIN */
#K_MAIN { width:100% ; box-sizing:border-box ; overflow:hidden ; padding-top:5rem }
body.gtn_open { overflow:hidden }



/* SIDE NAV */
#K_side_nav { display:none }



/* ASIDE */
#K_ASIDE , #K_ASIDE > ul , #K_ASIDE li , .k_aside_btn { width:4rem }
#K_ASIDE { position:fixed ; z-index:90 ; right:-8rem ; bottom:1rem ; opacity:0 ; }
.sticky #K_ASIDE { opacity:1 ; right:0.5rem }
#K_ASIDE li , .k_aside_btn { height:4rem }
.k_aside_btn { position:relative }
#K_ASIDE li { display:none }
#K_ASIDE li:last-child , .k_aside_btn { display:block } 
.k_aside_btn.goTop { background-color:#012d6b ; border-radius:100% }
#K_ASIDE , .k_aside_btn , .k_aside_btn > span , .k_aside_btn.goTop > span::before , .k_aside_btn.goTop > span::after { transition:0.3s all }
.k_aside_btn.goTop > span { display:block ; width:100% ; height:100% ; font-size:0 ; color:transparent }
.k_aside_btn.goTop > span::before , .k_aside_btn.goTop > span::after { display:block ; content:"" ; position:absolute ; left:50% }
.k_aside_btn.goTop > span::before {
    width:2rem ; height:0.2rem ; background-color:#ffffff ;
    top:35% ; transform:translate(-50%,-50%) ;
}
.k_aside_btn.goTop:focus ,
.k_aside_btn.goTop:hover { background-color:#000000 }
.k_aside_btn.goTop > span::after { 
    width:1.1rem ; height:1.1rem ; 
    border:solid 0.2rem #ffffff ; border-right:none ; border-bottom:none ;
    top:70% ; transform:translate(-50%,-50%) rotate(45deg) 
}
.k_aside_btn.goTop:hover > span::before , 
.k_aside_btn.goTop:focus > span::before { transform:translate(-50%,-50%) rotate(90deg) ; top:50% ; width:1.6rem }
.k_aside_btn.goTop:hover > span::after , 
.k_aside_btn.goTop:focus > span::after{ top:50% }



/* FOOTER */
#K_FOOTER , #KF_nav , #KF_copy , #KF_nav ul , #KF_copy ul , #KF_copy li { width:100% ; box-sizing:border-box }
#K_FOOTER  { background-color:#191919 }
#KF_nav { background-color:#06295b ; padding:1.5rem }
#KF_nav ul { font-size:0 ; text-align:center }
#KF_nav li { display:inline-block ; margin:0.2rem 0.5rem }
#KF_nav a , #KF_nav button { 
    display:block ; overflow:hidden ; border-radius:2rem ;
    font-size:1.4rem ; line-height:1.8rem ; color:#ffffff ;
    padding:0.5rem 1.5rem 0.7rem 1.5rem ; transition:0.3s all ;
    box-sizing:border-box ; border:solid 1px rgba(255,255,255,0.15)
}
#KF_nav a:focus , #KF_nav button:focus ,
#KF_nav a:hover , #KF_nav button:hover  {
    background-color:#ffffff ; border-color:transparent ;
    color:#444444
}

#KF_copy { padding:4rem 1rem }
#KF_copy li { 
    font-size:1.4rem ; line-height:2.4rem ; font-weight:200 ;
    text-align:center ; color:#ffffff ; word-break:keep-all ; letter-spacing:0.05rem ;
    margin-bottom:0.7rem ; opacity:0.8 ;
}


 


/* PC **********/
@media all and (min-width:1100px){
 
    /* HEADER */
    #K_HEADER , #K_HEADER > h1 , #K_HEADER > h1 > a { transition:0.3s all }
    #K_HEADER { background:none ; height:10rem ; box-shadow:none ; width:92% ; min-width:100rem ; }
    .sticky #K_HEADER , .gtn_open #K_HEADER { width:100% }
    #K_HEADER > h1 { width:6rem ; height:4rem ; left:3rem ; top:3rem }
    #K_HEADER > h1 > a { background-image:url(../img/logo_w.png) ; background-size:6rem auto }



    /* HEADER > HISTORY */
    #KH_history { 
        transition:0.3s all ; 
        margin:0 ; position:absolute ; left:11rem ; top:3.5rem ; background-color:rgba(0,0,0,0.05) ; border-color:rgba(255,255,255,0.1) }
    #KH_history > h2 , #KH_history.his_open:hover > h2 { color:#ffffff }
    #KH_history:hover > h2 { color:#111111 }
    #KH_history:hover { background-color:#ffffff }
    #KH_history.his_open:hover {  background-color:#000000 }
    #KH_history_list { width:40rem ; position:absolute ; left:0 ; top:3.2rem }
    #KH_history_list a > span { width:26rem }
    #KH_history_list li:last-child > a { padding-left:9rem }
    #KH_history_btn_open::after , #KH_history.his_open:hover #KH_history_btn_open::after { border-color:#ffffff }
    #KH_history:hover #KH_history_btn_open::after { border-color:#111111 }

   

    /* SNS */
    #KH_sns , #KH_nav_OC { transition:0.3s all }
    #KH_sns { display:block ; overflow:hidden ; width:8rem ; position:absolute ; left:30rem ; top:3.5rem } 
    #KH_sns li { display:block ; width:3rem ; height:3rem ; float:left ; margin-right:1rem }
    #KH_sns li:nth-of-type(1) ,  #KH_sns li:nth-of-type(2) { display:none }
    #KH_sns li > a { 
        font-size:0 ; color:transparent ; display:block ; width:100% ; height:100% ;
        background: no-repeat center ; background-size:3rem auto ; opacity:0.5 ; transition:0.3s all ;
    }
    #KH_sns li > a:hover { opacity:1 ; background-size:3.5rem auto ; }
    #KH_sns li:nth-of-type(3) > a { background-image:url(../img/sns_FB_w.png) }
    #KH_sns li:nth-of-type(4) > a { background-image:url(../img/sns_NB_w.png) } 



    /* GTN */
    #KH_nav_OC { width:3rem ; height:3rem ; right:auto ; top:3.5rem ; left:39rem }
    #KH_nav_OC > span , #KH_nav_OC::before , #KH_nav_OC::after { width:1.5rem ; background-color:#ffffff }
    #KH_nav_OC:hover::before , #KH_nav_OC:hover > span , #KH_nav_OC:hover::after { background-color:#ffffff }
     


    /* SKICKY */
    .sticky #K_HEADER { background-color:#ffffff ; height:6rem ; box-shadow:0 0 0.3rem rgba(0,0,0,0.2) }
    .sticky #K_HEADER > h1 { width:17.6rem ; height:3rem ; top:1.5rem }
    .sticky #K_HEADER > h1 > a { background-image:url(../img/logo_full.png) ; background-size:17.6rem auto }
    
    .sticky #KH_history { border-color:rgba(0,0,0,0.1) ; background-color:#ffffff ; left:22rem ; top: 1.5rem } 
    .sticky #KH_history > h2 , .sticky #KH_history.his_open:hover > h2 { color:#111111 }
    .sticky #KH_history:hover > h2 , .sticky #KH_history.his_open:hover > h2 , .sticky #KH_history.his_open > h2 { color:#ffffff ; opacity:1 }
    
    .sticky #KH_history:hover , .sticky #KH_history.his_open { background-color:#000000 }
    .sticky #KH_history_btn_open::after { border-color:#000000 } 
    .sticky #KH_history.his_open #KH_history_btn_open::after ,
    .sticky #KH_history:hover #KH_history_btn_open::after { border-color:#ffffff ; opacity:1 }

    .sticky #KH_sns { left:38rem ; top:1.5rem ; }
    .sticky #KH_sns li:nth-of-type(3) > a { background-image:url(../img/sns_FB.png) }
    .sticky #KH_sns li:nth-of-type(4) > a { background-image:url(../img/sns_NB.png) }

    .sticky #KH_nav_OC { left:47rem ; top:1.5rem }
    .sticky #KH_nav_OC > span , .sticky #KH_nav_OC::before , .sticky #KH_nav_OC::after ,
    .sticky #KH_nav_OC:hover::before , .sticky #KH_nav_OC:hover > span , .sticky #KH_nav_OC:hover::after { background-color:#111111 }

   

    /* GTN OPEN */ 
    .gtn_open #K_HEADER { background-color:#ffffff ; height:10rem ; box-shadow:none }
    .gtn_open #K_HEADER > h1 { width:23.5rem ; height:4rem ; top:3rem }
    .gtn_open #K_HEADER > h1 > a { background-image:url(../img/logo_full.png) ; background-size:23.5rem auto }

    .gtn_open #KH_history { border-color:rgba(0,0,0,0.1) ; background-color:#ffffff ; left:29rem ; top: 3.5rem } 
    .gtn_open #KH_history:hover { background-color:#000000 } 
    .gtn_open #KH_history > h2 { color:#111111 }
    .gtn_open #KH_history:hover > h2  { color:#ffffff ; opacity:1 }
    .gtn_open #KH_history_btn_open::after { border-color:#111111 } 
    .gtn_open #KH_history:hover #KH_history_btn_open::after { border-color:#ffffff } 

    .gtn_open #KH_nav_OC { left:45rem ; top:2.5rem ; width:5rem ; height:5rem  }
    .gtn_open #KH_nav_OC > span , .gtn_open #KH_nav_OC::before , .gtn_open #KH_nav_OC::after ,
    .gtn_open #KH_nav_OC:hover::before , .gtn_open #KH_nav_OC:hover > span , .gtn_open #KH_nav_OC:hover::after { background-color:#7ac142 } 
    .gtn_open #KH_nav_OC > span , .gtn_open #KH_nav_OC::before , .gtn_open #KH_nav_OC::after { width:3rem }
 
    .gtn_open #KH_sns { font-size:0 ; width:35rem ; left:auto ; right:3rem ; top:3.5rem ; text-align:right ; }
    .gtn_open #KH_sns li:nth-of-type(1) ,  .gtn_open #KH_sns li:nth-of-type(2) , .gtn_open #KH_sns li:nth-of-type(3) ,  .gtn_open #KH_sns li:nth-of-type(4) ,
    .gtn_open #KH_sns li:nth-of-type(1) > a ,  .gtn_open #KH_sns li:nth-of-type(2) > a , .gtn_open #KH_sns li:nth-of-type(3) > a ,  .gtn_open #KH_sns li:nth-of-type(4) > a {
        margin:0 ; padding:0 ; width:auto ; height:auto ; background:none ; opacity:1 ;
    } 
    .gtn_open #KH_sns li:nth-of-type(1) ,  .gtn_open #KH_sns li:nth-of-type(2) ,
    .gtn_open #KH_sns li:nth-of-type(3) ,  .gtn_open #KH_sns li:nth-of-type(4) { 
        display:inline-block ; margin-left:1.3rem ; padding-left:1.3rem ; float:none
    }
    .gtn_open #KH_sns li { position:relative }
    .gtn_open #KH_sns li::before { 
        display:block ; content:"" ; width:0.1rem ; height:1rem ; background-color:#000000 ; opacity:0.1 ;
        position:absolute ; left:0 ; top:50% ; transform:translateY(-50%) ;
    }
    .gtn_open #KH_sns li:nth-of-type(1) { padding-left:0 ; margin-left:0 }
    .gtn_open #KH_sns li:nth-of-type(1)::before  { display:none }
    .gtn_open #KH_sns li:nth-of-type(1) > a ,  .gtn_open #KH_sns li:nth-of-type(2) > a ,
    .gtn_open #KH_sns li:nth-of-type(3) > a ,  .gtn_open #KH_sns li:nth-of-type(4) > a {  
        font-size:1.2rem ; line-height:2.8rem ; color:rgba(0,0,0,0.7) ; 
        padding-bottom:0.2rem ; display:block ;
    }
    .gtn_open #KH_sns li:nth-of-type(1) > a:hover ,  .gtn_open #KH_sns li:nth-of-type(2) > a:hover ,
    .gtn_open #KH_sns li:nth-of-type(3) > a:hover ,  .gtn_open #KH_sns li:nth-of-type(4) > a:hover { color:#000000 }



    /* GTN */
    #K_GTN { padding-top:10rem ; min-width:140rem ; background:none ; background-color:#000000 }
    #K_GTN::before , #K_GTN::after { 
        display:block ; overflow:hidden ; content:""  ; width:50% ; height:100% ;
        position:absolute ; top:0 ; z-index:-1 ;
    }
    #K_GTN::before { 
        left:0 ; opacity:0.5 ;
        background:url(../img/main_visual.jpg) no-repeat center ; background-size:cover ;
    }
    #K_GTN::after { right:0 ; background-color:#ffffff }
    #K_GTN_inner  { 
        position:relative ; background:none ;
        max-width:130rem ; margin:auto ; padding-left:20% ; box-sizing:border-box ; overflow:auto  }
    #K_GTN_header {
        width:20% ; height:100% ; position:absolute ; left:0 ; top:0 ;
        padding:11rem 2rem 0 2rem ; text-align:left ;
    } 
    #K_GTN_header > b {
        font-size:1.8rem ; line-height:2.8rem ; font-weight:500 ; 
        padding:0 1.5rem 0.2rem 1.5rem ; margin-bottom:1.5rem ;
    }
    #K_GTN_header > span  { 
        display:block ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ; letter-spacing:-0.2rem ;
        font-size:4rem ; line-height:5rem ; color:#ffffff ; font-weight:300 
    }

    #K_GTN_list { width:100% ; min-height:100% ; box-sizing:border-box ; padding-bottom:2rem ; background-color:#ffffff ; padding-left:5% }
    .deep1 , .deep1 > a , .deep2 > a { border:0 ; padding:0 ; }
    .deep1 { padding:2rem 0 0 ; border-bottom:solid 1px rgba(0,0,0,0.1) ; transition:0.3s all } 
    .deep1 > a { font-size:2.8rem ; line-height:3rem ; font-weight:600 ; color:#083879 ; text-align:left ; margin-bottom:0 } 
    #K_GTN_list li.deep1:first-of-type { border-top:solid 0.2rem #7ac142 } 
    .K_GTN_sub { overflow:hidden ; padding:0.5rem 0 }
    .deep2 { padding:0 ; margin:0 ; margin-bottom:0.7rem  ; display:block }
    .deep2 > a { border:0 ; padding-right:1rem ; box-sizing:border-box ; padding-left:0.5rem }

    .deep2 > a > b , .deep2 > a > span { display:inline-block }
    .deep2 > a > b { 
        font-size:1.2rem ; line-height:1.4rem ; transition:0.3s all ;
        padding:0.4rem 1rem 0.6rem 1rem ; margin:0.2rem 0.7rem 0 0 ;
        background:none ; position:relative ; overflow:hidden ;
    } 

    .deep2 > a > span  {  
        padding:0 ; margin:0 ; border:0 ; border-radius:0 ;  
        font-size:2rem ; line-height:2.8rem ; letter-spacing:-0.1rem ; word-break:keep-all ; color:rgba(0,0,0,0.7) ; 
    }
  
 
    #KIIP11 .deep1 > a.nav10 , #KIIP12 .deep1 > a.nav10 , #KIIP13 .deep1 > a.nav10 , #KIIP14 .deep1 > a.nav10 , 
    #KIIP21 .deep1 > a.nav20 , #KIIP22 .deep1 > a.nav20 , #KIIP23 .deep1 > a.nav20 , #KIIP24 .deep1 > a.nav20 , 
    #KIIP31 .deep1 > a.nav30 , #KIIP32 .deep1 > a.nav30 , #KIIP33 .deep1 > a.nav30 , #KIIP34 .deep1 > a.nav30 , 
    #KIIP41 .deep1 > a.nav40 , #KIIP42 .deep1 > a.nav40 , #KIIP43 .deep1 > a.nav40 , #KIIP44 .deep1 > a.nav40 , 
    #KIIP11 .deep2 > a.nav11 , #KIIP12 .deep2 > a.nav12 , #KIIP13 .deep2 > a.nav13 , #KIIP14 .deep2 > a.nav14 , 
    #KIIP21 .deep2 > a.nav21 , #KIIP22 .deep2 > a.nav22 , #KIIP23 .deep2 > a.nav23 , #KIIP24 .deep2 > a.nav24 , 
    #KIIP31 .deep2 > a.nav31 , #KIIP32 .deep2 > a.nav32 , #KIIP33 .deep2 > a.nav33 , #KIIP34 .deep2 > a.nav34 , 
    #KIIP41 .deep2 > a.nav41 , #KIIP42 .deep2 > a.nav42 , #KIIP43 .deep2 > a.nav43 , #KIIP44 .deep2 > a.nav44 , 
    .deep1:hover > a , .deep2 > a:hover , .deep2 > a:hover > b , .deep2 > a:hover { background:none }
    .deep2 > a:hover > b { color:#000000 } 

    #KIIP11 .deep1 > a.nav10 , #KIIP12 .deep1 > a.nav10 , #KIIP13 .deep1 > a.nav10 , #KIIP14 .deep1 > a.nav10 , 
    #KIIP21 .deep1 > a.nav20 , #KIIP22 .deep1 > a.nav20 , #KIIP23 .deep1 > a.nav20 , #KIIP24 .deep1 > a.nav20 , 
    #KIIP31 .deep1 > a.nav30 , #KIIP32 .deep1 > a.nav30 , #KIIP33 .deep1 > a.nav30 , #KIIP34 .deep1 > a.nav30 , 
    #KIIP41 .deep1 > a.nav40 , #KIIP42 .deep1 > a.nav40 , #KIIP43 .deep1 > a.nav40 , #KIIP44 .deep1 > a.nav40 , 
    .deep1 > a , .deep1:hover > a { color:#083879 }
    .deep1 > a { display:inline-block ; padding-right:2rem ; padding-left:0.5rem ; width:auto ; position:relative }

    #KIIP31 .deep1 > a.nav30 , #KIIP32 .deep1 > a.nav30 , #KIIP33 .deep1 > a.nav30 , #KIIP34 .deep1 > a.nav30 , 
    #KIIP41 .deep1 > a.nav40 , #KIIP42 .deep1 > a.nav40 , #KIIP43 .deep1 > a.nav40 , #KIIP44 .deep1 > a.nav40 ,
    .deep1.deep13 > a , .deep1.deep14 > a , .deep1.deep13:hover > a , .deep1.deep14:hover > a { color:#66b924 }
 
    .deep1 > a::after {
        width:1rem ; height:1rem ; display:block ; overflow:hidden ; content:"" ;
        border:solid 0.3rem #083879 ; border-left:none ; border-bottom:none ;
        position:absolute ; right:-1rem ; top:100% ; opacity:0 ; transition:0.3s all ; transform:rotate(-45deg);
    }

    .deep13 > a::after , .deep14 > a::after { border-color:#66b924 }

    #KIIP11 .deep1 > a.nav10::after , #KIIP12 .deep1 > a.nav10::after , #KIIP13 .deep1 > a.nav10::after , #KIIP14 .deep1 > a.nav10::after , 
    #KIIP21 .deep1 > a.nav20::after , #KIIP22 .deep1 > a.nav20::after , #KIIP23 .deep1 > a.nav20::after , #KIIP24 .deep1 > a.nav20::after , 
    #KIIP31 .deep1 > a.nav30::after , #KIIP32 .deep1 > a.nav30::after , #KIIP33 .deep1 > a.nav30::after , #KIIP34 .deep1 > a.nav30::after , 
    #KIIP41 .deep1 > a.nav40::after , #KIIP42 .deep1 > a.nav40::after , #KIIP43 .deep1 > a.nav40::after , #KIIP44 .deep1 > a.nav40::after ,
    .deep1:hover > a::after { opacity:1 ; right:0 ; top:0.3rem ; transform:rotate(0)  }
    .deep2 > a:hover > b { 
        background-color:#083879 ; color:#ffffff ; border-color:#083879 ;
        letter-spacing:0.2rem ;
    }
 
    .deep2 > a:hover > span { color:#000000 } 
    .deep13 .deep2 > a:hover > b , .deep14 .deep2 > a:hover > b { background-color:#68bc26 ; border-color:transparent } 

    .deep2 > a > span , .deep2 > a:hover > span { font-weight:300 }
    .deep2 > a:hover > span { color:#000000 }

    .deep1:hover { background-color:#f7f7f7 }



    /* MAIN */
    #K_MAIN { padding-top:0 } 
 


    /* SIDE NAV */
    #K_side_nav { 
        display:block ; overflow:hidden ; width:55rem ;
        position:absolute ; right:3rem ; top:4rem ;
    }
    .K_SN_d1 > a , .K_SN_d2 > a , .K_SN_d2::before{ transition:0.3s all }
    #K_SN_list { width:100% ; box-sizing:border-box }
    .K_SN_d1 { display:block ; overflow:hidden ; margin-bottom:3rem ; text-align:right ; }
    .K_SN_d1 > a { 
        display:block ; opacity:0.4 ; margin-left:4rem ; float:right ;
        font-size:2rem ;  ; color:#ffffff ; font-weight:500 ; text-shadow:0 0 0.2rem rgba(0,0,0,0.3) }
    .K_SN_d1:hover > a { opacity:1 }

    .K_SN_d1 > a , .K_SN_d2 > a { line-height:2.4rem ; padding-bottom:0.2rem }
    .K_SN_sub , .K_SN_d2 { display:inline-block } 
    .K_SN_d2 > a { display:block ; overflow:hidden ; font-size:1.4rem ; color:#ffffff ; opacity:0 ; margin-right:-1.5rem }
    .K_SN_d2 > a:hover , .K_SN_d2 > a:focus { opacity:1 }
    .K_SN_d2 { padding-left:1.3rem ; margin-left:1.3rem ; position:relative }
    .K_SN_d2::before {
        display:block ; overflow:hidden ; content:"" ;
        width:0.1rem ; height:1rem ; background-color:#ffffff ; opacity:0 ;
        position:absolute ; left:0 ; top:50% ; transform:translateY(-50%) }
    .K_SN_sub > li:first-of-type { padding-left:0 ; margin-left:0 }
    .K_SN_sub > li:first-of-type::before { display:none }

    .K_SN_d1:hover .K_SN_d2 > a { opacity:0.7 }
    .K_SN_d1:hover .K_SN_d2 > a:hover { opacity:1 }
    .K_SN_d1:hover .K_SN_d2::before { opacity:0.15 }

    .K_SN_d1:hover li.K_SN_d2:nth-of-type(3) > a { transition-delay:0s ; margin-right:0 }
    .K_SN_d1:hover li.K_SN_d2:nth-of-type(2) > a { transition-delay:0.1s ; margin-right:0 }
    .K_SN_d1:hover li.K_SN_d2:nth-of-type(1) > a  { transition-delay:0.2s ; margin-right:0 }

    .K_SN_d2 > a:focus { opacity:1 ; margin-right:0 }
 
    #KIIP11 .K_SN_d11 > a.K_SN_10 , #KIIP12 .K_SN_d11 > a.K_SN_10 , #KIIP13 .K_SN_d11 > a.K_SN_10 , #KIIP14 .K_SN_d11 > a.K_SN_10 ,
    #KIIP21 .K_SN_d12 > a.K_SN_20 , #KIIP22 .K_SN_d12 > a.K_SN_20 , #KIIP23 .K_SN_d12 > a.K_SN_20 , #KIIP24 .K_SN_d12 > a.K_SN_20 , 
    #KIIP31 .K_SN_d13 > a.K_SN_30 , #KIIP32 .K_SN_d13 > a.K_SN_30 , #KIIP33 .K_SN_d13 > a.K_SN_30 , #KIIP34 .K_SN_d13 > a.K_SN_30 ,
    #KIIP41 .K_SN_d14 > a.K_SN_40 , #KIIP42 .K_SN_d14 > a.K_SN_40 , #KIIP43 .K_SN_d14 > a.K_SN_40 , #KIIP44 .K_SN_d14 > a.K_SN_40 { opacity:0.8 }
 

    
    /* ASIDE */
    #K_ASIDE { right:-8rem ; bottom:0 ; background-color:#ffffff ; box-sizing:border-box }
    #K_ASIDE::before , #K_ASIDE::after {
        display:block ; content:"" ; position:absolute ; top:0 ; left:0 ;
        background-color:rgba(0,0,0,0.1) ;
    }
    #K_ASIDE::before { width:100% ; height:1px }
    #K_ASIDE::after  { width:1px ; height:100% }

    .sticky #K_ASIDE { right:0 }
    #K_ASIDE , #K_ASIDE > ul , #K_ASIDE li , .k_aside_btn { width:7rem ; box-sizing:border-box }
    #K_ASIDE li , .k_aside_btn { height:8rem }
    #K_ASIDE li { display:block }
    .k_aside_btn { padding-top:1rem }
    .k_aside_btn.goTop , .k_aside_btn.goTop .k_aside_btn , #K_ASIDE li:last-child { border-radius:0 ; height:7rem }
    .k_aside_btn.goTop > span::before { top:40% }
    .k_aside_btn.goTop > span::after  { top:60% }
    .k_aside_btn.goTop:hover > span::before { transform:translate(-50%,-50%) rotate(90deg) ; top:50% ; width:2rem }
    .k_aside_btn.goTop:hover > span::after { top:45% }

    .k_aside_btn::before { transition:0.3s all }
    .k_aside_btn::before , .k_aside_btn::after { display:block ; overflow:hidden ; content:"" }
    .k_aside_btn::before { 
        width:4rem ; height:4rem ; margin:auto ; margin-bottom:0.3rem ; 
        background:no-repeat center ; background-size:4rem auto ; opacity:0.5 ;
    }
    .k_aside_btn:hover::before , .k_aside_btn:focus::before { opacity:0.8 }
    .k_aside_btn.linkCopy::before { background-image:url(../img/icon_link.png) }
    .k_aside_btn.popApply::before { background-image:url(../img/icon_bell.png) }
    .k_aside_btn.goHistory::before { background-image:url(../img/icon_history.png) }
    .k_aside_btn::after { 
        width:3rem ; height:0.1rem ; background-color:#000000 ; opacity:0.1 ;
        position:absolute ; bottom:0 ; left:50% ; transform:translateX(-50%) ;
    }
    .k_aside_btn span { 
        display:block ; width:100% ; box-sizing:border-box ; color:rgba(0,0,0,0.5) ;
        font-size:1.2rem ; line-height:1.6rem ; text-align:center ; letter-spacing:-0.05rem }
    .k_aside_btn:hover span , .k_aside_btn:focus span { color:rgba(0,0,0,0.9) }
 


    /* FOOTER */
    #KF_nav { padding:2rem 0 }
    #KF_nav ul { max-width:110rem ; margin:auto ; text-align:right ; position:relative }
    #KF_nav ul::before {
        display:block ; content:"" ; width:16rem; height:3rem ;
        background:url(../img/footer_logo.png) no-repeat center ; background-size:16rem auto ;
        position:absolute ; left:0 ; top:50% ; transform:translateY(-50%) ;
    }
    #KF_nav li { margin:0 ; padding:0.5rem 1.5rem 0.5rem 0 ; margin-right:1.5rem ; position:relative }
    #KF_nav li:last-child { padding-right:0 ; margin-right:0 }
    #KF_nav li::after {
        display:block ; overflow:hidden ; content:"" ; width:0.1rem ; height:1rem ; background-color:#ffffff ;
        position:absolute ; right:0 ; top:50% ; transform:translateY(-50%) ; opacity:0.1 ;   
    }
    #KF_nav a , #KF_nav button { font-size:1.4rem ; line-height:1.8rem ; padding:0 ; padding-bottom:0.2rem ; border:none ; border-radius:0 ; color:rgba(255,255,255,0.8) }
    #KF_nav a:hover , #KF_nav button:hover ,
    #KF_nav a:focus , #KF_nav button:focus { background:none ; color:#ffffff }

    #KF_copy { padding:4rem 0 5rem }
    #KF_copy ul { overflow:hidden ; position:relative ; max-width:110rem ; margin:auto }
    #KF_copy li { text-align:left ; margin-bottom:1rem }
    #KF_copy li:nth-child(2) , #KF_copy li:nth-child(3) { width:16rem ; float:left }
    #KF_copy li:nth-child(4) {
        display:block ; width:40rem ; text-align:right ;
        position:absolute ; right:0 ; top:0
    }
 
}

/* PRINT **********/
@media print { }