@charset "utf-8";
/* history.jsp */
 
.KS_ACC_BOX , .KS_ACC_item  { width:100% ; box-sizing:border-box ; text-align:center } 
.KS_ACC_title {     
    padding:1rem 0.5rem 1.2rem 3rem ; word-break:keep-all ; cursor:pointer ;
    font-size:2rem ; line-height:3rem ; text-align:left ; font-weight:500 ; color:#444444 ; letter-spacing:-0.1rem ;
    border-top:solid 0.2rem #012c68 }
.KS_ACC_item { position:relative }
.KS_ACC_item:last-of-type { border-bottom:solid 1px rgba(0,0,0,0.1) } 


.KS_ACC_btn_open > span { font-size:0 ; color:transparent ; width:0 ; height:0 ; display:block ; overflow:hidden ; position:absolute ; left:0 ; top:0 }
.KS_ACC_btn_open , .KS_ACC_btn_open::before , .KS_ACC_btn_open::after { transition:0.3s all }
.KS_ACC_btn_open {
    width:3rem ; height:3rem ; overflow:hidden ;
    font-size:0 ; color:transparent ;
    position:absolute ; left:0 ; top:1.2rem  
}
 
.KS_ACC_btn_open::before , .KS_ACC_btn_open::after { 
    display:block ; overflow:hidden ; content:"" ;
    width:1rem ; height:0.2rem ; border-radius:1rem ;
    background-color:#012c68 ; position:absolute ;
}
.KS_ACC_btn_open::before { transform:translate(-50%,-50%) rotate(45deg) ; left:50% ; top:40% }
.KS_ACC_btn_open::after  { transform:translate(-50%,-50%) rotate(-45deg) ; left:50% ; top:60% }

.KS_ACC_item:hover .KS_ACC_btn_open { transform:rotate(90deg) }



/* HISTORY */
.HIS_list { text-align:center ; display:flex ; flex-wrap:wrap ; justify-content:center } 
.HIS_list > li { 
    position:relative ;
    border:solid 1px rgba(0,0,0,0.1) ; box-sizing:border-box ; background-color:#ffffff ; border-radius:0.4rem ;
    overflow:hidden ; width:23rem  ; margin:1.4rem }
.HIS_box , .HIS_box_head , .HIS_box_head b , .HIS_box_head span ,
.HIS_box_body , .HIS_box_body , .HIS_box_body > b , .HIS_box > a { display:block ; overflow:hidden } 
.HIS_box_head b , .HIS_box_head span , .HIS_box_body , .HIS_box_body > b , .HIS_box > a { width:100% ; text-align:center }
.HIS_box_head b { 
    background-color:#012d6b ; padding:0.4rem 0 ; 
    font-size:1.4rem ; color:#ffffff ; line-height:1.8rem ; font-weight:400 }
.HIS_box_head > span { height:11rem ; background-repeat:no-repeat ; background-size:95rem auto }
.HIS_box_body > b { 
    font-size:1.6rem ; line-height:2rem ; font-weight:500 ; word-break:keep-all ; 
    padding:0.8rem ; padding-bottom:1.2rem ; box-sizing:border-box }
.HIS_box > a { height:100% ; font-size:0 ; color:transparent ; position:absolute ; left:0 ; top:0 }

#y23 .HIS_box_head > span { background-image:url(../../history/KIIP_2023.jpg) }
#y22 .HIS_box_head > span { background-image:url(../../history/KIIP_2022.jpg) }
#y21 .HIS_box_head > span { background-image:url(../../history/KIIP_2021.jpg) }
#y20 .HIS_box_head > span { background-image:url(../../history/KIIP_2020.jpg) }
#y19 .HIS_box_head > span { background-image:url(../../history/KIIP_2019.jpg) }
#y18 .HIS_box_head > span { background-image:url(../../history/KIIP_2018.jpg) }
#y17 .HIS_box_head > span { background-image:url(../../history/KIIP_2017.jpg) }
#y16 .HIS_box_head > span { background-image:url(../../history/KIIP_2016.jpg) }
#y15 .HIS_box_head > span { background-image:url(../../history/KIIP_2015.jpg) }
#y14 .HIS_box_head > span { background-image:url(../../history/KIIP_2014.jpg) }

.HIS_list > li , .HIS_box_head b { transition:0.3s all }
.HIS_list > li:hover { border-color:#7ac142 }
.HIS_list > li:hover .HIS_box_head b { background-color:#7ac142 ; text-shadow:0 0 0.2rem rgba(0,0,0,0.2) ; }

.M12 .HIS_box_head > span { background-position:0 0 }
.M11 .HIS_box_head > span { background-position:-24rem 0 }
.M10 .HIS_box_head > span { background-position:-48rem 0 }
.M09 .HIS_box_head > span { background-position:-72rem 0 }

.M08 .HIS_box_head > span { background-position:0 -12rem }
.M07 .HIS_box_head > span { background-position:-24rem -12rem }
.M06 .HIS_box_head > span { background-position:-48rem -12rem }
.M05 .HIS_box_head > span { background-position:-72rem -12rem }

.M04 .HIS_box_head > span { background-position:0 -24rem }
.M03 .HIS_box_head > span { background-position:-24rem -24rem }
.M02 .HIS_box_head > span { background-position:-48rem -24rem }
.M01 .HIS_box_head > span { background-position:-72rem -24rem }




/* PC **********/
@media all and (min-width:1100px){ 
    .KS_ACC_BOX  { max-width:110rem ; margin:auto }  
}