@charset "utf-8";

/* main */
#main { padding:7rem 1.5rem 0 }



/* visual */   
#visual , .visual_img { width:100% ; height:34rem ; position:relative }
#visual { overflow:hidden ; border-radius:0.4rem ; margin-bottom:5rem }

.visual_img { background:url(../img_sub/visual.jpg) no-repeat center ; background-size:cover }
#K11 .visual_img { background-image:url(../img_sub/visual_11.jpg) }
#K12 .visual_img { background-image:url(../img_sub/visual_12.jpg) }
#K13 .visual_img { background-image:url(../img_sub/visual_13.jpg) }
#K14 .visual_img { background-image:url(../img_sub/visual_14.jpg) }
#K15 .visual_img { background-image:url(../img_sub/visual_15.jpg) }

#K21 .visual_img { background-image:url(../img_sub/visual_21.jpg) }
#K22 .visual_img { background-image:url(../img_sub/visual_22.jpg) }
#K23 .visual_img { background-image:url(../img_sub/visual_23.jpg) }
#K24 .visual_img { background-image:url(../img_sub/visual_24.jpg) }
#K25 .visual_img { background-image:url(../img_sub/visual_25.jpg) }

#K31 .visual_img { background-image:url(../img_sub/visual_31.jpg) }
#K32 .visual_img { background-image:url(../img_sub/visual_32.jpg) }
#K33 .visual_img { background-image:url(../img_sub/visual_33.jpg) }
#K34 .visual_img { background-image:url(../img_sub/visual_34.jpg) }
#K35 .visual_img { background-image:url(../img_sub/visual_35.jpg) }

#K41 .visual_img { background-image:url(../img_sub/visual_41.jpg) }
#K42 .visual_img { background-image:url(../img_sub/visual_42.jpg) }
#K43 .visual_img { background-image:url(../img_sub/visual_43.jpg) }
#K44 .visual_img { background-image:url(../img_sub/visual_44.jpg) }
#K45 .visual_img { background-image:url(../img_sub/visual_45.jpg) }

#headline { 
    width:100% ; padding:1rem 1.5rem ; text-align:center ;
    position:absolute ; left:50% ; top:50% ; z-index:21 ; transform:translate(-50%,-50%) ;
}
.visual_img::before {
    display:block ; content:"" ; width:100% ; height:100% ;
    position:absolute ; right:0 ; top:0 ; z-index:20 ;
    background-color:#000000 ; opacity:0.5 ;
}
#breadcrumb , .BC__li { display:inline-block }
#breadcrumb { font-size:0 ;  border-bottom:solid 0.2rem #0e1ea3 ; padding-bottom:0.5rem ; margin-bottom:2rem }
.BC__li , .HL__title , .HL__name { color:#ffffff ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ; word-break:keep-all }
.BC__li { 
    position:relative ;
    font-size:1.4rem ; line-height:1.8rem ; 
    padding:0 1rem 0.2rem 0 ; margin-right:1rem }
.BC__li:last-child { padding-right:0 ; margin-right:0 } 
.BC__li.now { font-weight:600 }
.BC__li::before {
    display:block ; content:"" ; width:0.5rem ; height:0.5rem ; opacity:0.5 ;
    border:solid 1px #ffffff ; border-left:none ; border-bottom:none ;
    position:absolute ; right:-0.2rem ; top:50% ; transform:translateY(-50%) rotate(45deg) ;
}
.BC__li:last-child::before { display:none }

.HL__title {  
    font-size:3.2rem ; line-height:4.4rem ; font-weight:800 }
.HL__title > br { display:none }
.HL__name { font-size:1.8rem ; line-height:2.8rem ; padding-top:3rem }
 


/* article */
#article { width:100% ; display:block }
.section { margin-bottom:9rem }
.sub     { margin-bottom:6rem }

.K__p , .table__rw td , .notice__li { font-size:1.8rem ; line-height:3rem ; font-weight:400 ; color:#444444 ; text-align:justify }
p.K__p { margin-bottom:3rem }
.K__p a:hover , .table__rw td a:hover  , .notice__li a:hover ,
.K__p a:focus , .table__rw td a:focus  , .notice__li a:focus { text-decoration:underline }

.section:last-child , .sub:last-child , p.K__p:last-child { margin-bottom:0 }

.K__lead { 
    color:#111111 ; line-height:3.6rem ; font-weight:500 ;
    border-bottom:solid 1px rgba(0,0,0,0.1) ;
    padding-bottom:0.3rem ;
}

.sec__title { 
    font-size:3rem ; line-height:4rem ; color:#111111 ; font-weight:800 ; text-align:center ; 
    margin-bottom:2.5rem ; letter-spacing:-0.2rem ;
}



/* TABLE */
.table__rw { padding-top:2rem ; margin-bottom:5rem }
.table__rw , .table__rw table { width:100% }
.table__rw tbody { border-top:solid 0.2rem #0e1ea3 }
.table__rw thead , colgroup { display:none }
.table__rw table , .table__rw tbody , .table__rw tfoot , .table__rw tr { display:block }
.table__rw tr , .table__rw td { text-align:left }
.table__rw tr { border-bottom:solid 1px rgba(0,0,0,0.2) ; padding:0.7rem 0.2rem }
.row__line    { border-top:solid 1px rgba(0,0,0,0.2) ; margin-top:0.2rem }
.table__rw tr.point { background-color:#f7f7f7 ; border-color:rgba(0,0,0,0.4) }
.table__rw tr.table__row { border-bottom:dashed 1px rgba(0,0,0,0.1) }
.table__rw td { 
    display:inline-block ; margin-right:3rem ;
    padding-bottom:0.2rem ;
}
.table__rw td br { display:none }
.table__rw .point td { color:#111111 ; font-weight:500 }

.table__rw td:last-child { margin-right:0 }

.table__caption { 
    font-size:2rem ; line-height:2.8rem ; color:#111111 ; font-weight:600 ;
    margin-bottom:1.5rem ; display:block ;
}
.table__caption > b , .table__tag {
    display:inline-block ; overflow:hidden ; border-radius:0.4rem ; padding:0.2rem 0.8rem 0.4rem ;
    font-size:1.2rem ; line-height:1.8rem ; color:#ffffff ; font-weight:500 ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ;
    background-color:#0e1ea3 ; position:relative ; top:0.2rem  
} 
.table__tag::after { 
    display:inline-block ; content:":" ; overflow:hidden ; width:0 ; height:0 ;
    font-size:0 ; color:transparent
}
.table__tag { 
    top:0.5rem ; margin-right:0.5rem ;
    background-color:#eee ; text-shadow:none ; color:#444444 ;
    border:solid 1px rgba(0,0,0,0.1) ; padding:0 0.4rem 0.2rem ;
}

.table__list li { 
    margin:0 3rem 0.5rem 0 ; display:inline-block ; 
    font-size:inherit ; line-height:inherit ; font-weight:inherit ; color:inherit ; text-align:left ;
    word-break:keep-all ;
}
.table__list li:last-child { margin:0 }
.table__list.dot li { position:relative ; padding-left:1rem }
.table__list.dot li::before {
    display:block ; content:"" ; width:0.4rem ; height:0.4rem ; 
    background-color:#000000 ; opacity:0.3 ;
    position:absolute ; left:0 ; top:1.3rem
}



/* notice */
.K__sup { 
    font-size:60%; line-height:inherit ; font-weight:inherit ; color:inherit ; font-family:inherit ; 
    position:relative ; top:-0.2rem
} 
.notice {
    position:relative ;
    width:100% ; overflow:hidden ; border:solid 1px rgba(0,0,0,0.1) ; background-color:#f7f7f7 ;
    padding:2rem ; border-radius:0.6rem ; margin-bottom:4rem ;
} 
.notice__li { margin-bottom:1.5rem ; position:relative ; padding-left:1.8rem }
.notice__li > .K__sup { position:absolute ; left:0 ; top:-0.2rem } 
.notice__title { 
    display:block ; overflow:hidden ; width:0 ; height:0 ; 
    font-size:0 ; color:transparent ; 
    position:absolute ; left:0 ; top:0
}
.notice:last-child , .notice__li:last-child { margin-bottom:0 }  



/* fun */
.this__fun { width:100% ; padding:0 1.5rem ; margin-bottom:4rem }
.PP__box   { margin-bottom:1rem }
.PP__item  { margin-bottom:0.5rem }
.PP__icon , .PP__link , .PP__icon::before , .PP__icon::after { transition:0.3s all }
.PP__link , .TH__btn__open {
    overflow:hidden ; border-radius:0.4rem ;
    width:100% ; display:block ; position:relative ;
    font-size:1.8rem ; line-height:2.8rem ; font-weight:400 ;  
} 
.PP__link  {  
    border:solid 1px rgba(0,0,0,0.1) ; padding:1rem 1rem 1.2rem 6rem ;
    word-wrap:break-word ; white-space:nowrap ; overflow:hidden ; text-overflow:ellipsis 
}
.PP__link:hover , .PP__link:focus { color:#111111 ; border-color:rgba(0,0,0,0.2) ; box-shadow:0 0.1rem 0.3rem rgba(0,0,0,0.3) }
.PP__icon , .PP__icon::after { top:50% ; transform:translateY(-50%) }
.PP__icon {
    display:block ; overflow:hidden ; width:5rem ; height:5rem ;
    font-size:0 ; color:transparent ;
    position:absolute ; left:0 ; top:50% ; transform:translateY(-50%) ; 
}
.PP__icon::before , .PP__icon::after { position:absolute ; display:block ; content:"" }
.PP__icon::after {
    width:1px ; height:3rem ; background-color:#111111 ; opacity:0.1 ;
    right:0 ; 
}
.PP__icon::before { 
    width:3rem ; height:3rem ; display:block ; opacity:0.2 ;
    background:url(../img/icon_sprite.png) no-repeat left bottom ; background-size:auto 6rem ;
    left:50% ; top:50% ; transform:translate(-50%,-50%) ;
}
.prev .PP__icon::before { transform:translate(-50%,-50%) rotate(180deg) }
.PP__link:hover .PP__icon::before , .PP__link:focus .PP__icon::before { opacity:0.6 }

.TH__btn__open , .TH__btn__open::after { transition:0.3s all } 
.TH__btn__open { 
    background-color:#0e1ea3 ;
    color:#ffffff ; text-align:left ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ;
    padding:1rem 4rem 1.2rem 2rem ;
}
.TH__btn__open::after {
    display:block ; content:"" ; width:0.8rem ; height:0.8rem ; opacity:0.8 ;
    border:solid 2px #ffffff ; border-left:none ; border-top:none ;
    position:absolute ; right:1rem ; top:45% ; transform:translate(-50%,-50%) rotate(45deg) ;
}
.TH__btn__open:hover::after , 
.TH__btn__open:focus::after { opacity:1 ; transform:translate(-50%,-50%) rotate(45deg) scale(1.1) }

.open .TH__btn__open { background-color:#111111 }
.open .TH__btn__open::after { transform:translate(-50%,-50%) rotate(225deg) ; top:55% }

.TH__box__list , .TH__box__wrap { left:50% ; top:50% ; transform:translate(-50%,-50%) }
.TH__box__list {
    width:0 ; height:0 ; display:block ; overflow:hidden ;
    position:fixed ; z-index:110 ; 
    background-color:rgba(0,0,0,0.7) ;
    transition:0.3s all ;
}
.open .TH__box__list {
    width:100vw ; height:100vh ; overflow:auto ;
    transition:none ; 
}
.TH__box__wrap { 
    display:none ;
    position:absolute ; width:90% ; max-width:60rem ; overflow:hidden ; 
    border-radius:0.6rem ; background-color:#0e1ea3 ;
    box-shadow:0 0 0.5rem rgba(0,0,0,0.3) ; 
}
.open .TH__box__wrap { display:block }
.TH__list , .TH__item , .TH__box__title { display:block ; width:100% }
.TH__box__title {
    padding:1rem 1rem 1.2rem ; width:100% ;
    font-size:2rem ; line-height:2.8rem ; color:#ffffff ; font-weight:600 ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ; text-align:center  
} 
.TH__list      { margin-bottom:1rem ; max-height:45rem ; overflow:auto ; padding:0 2rem }
.TH__container { background-color:#ffffff ; padding:0 0 1.5rem } 
.TH__link      { 
    display:block ; transition:0.3s all ;
    font-size:1.8rem ; line-height:2.8rem ; word-break:keep-all ;
    padding:1rem 0.2rem 1.2rem ; border-bottom:solid 1px rgba(0,0,0,0.1)
}
.TH__link > b  { font-weight:600 }
.now .TH__link { border-bottom:solid 0.2rem #0e1ea3 }
.now .TH__link > b { color:#0e1ea3 }

.TH__link:hover , .TH__link:focus { color:#111111 ; border-color:#0e1ea3 }

.TH__btn__close , .TH__btn__close::before , .TH__btn__close::after { transition:0.3s all }
.TH__btn__close { 
    width:3rem ; height:3rem ; margin:auto ; 
    position:absolute ; right:1rem ; top:1rem ;
    display:block ; overflow:hidden ; opacity:0.8 ;
    font-size:0 ; color:transparent ;
}
.TH__btn__close::before , .TH__btn__close::after { 
    display:block ; content:"" ;
    width:2.4rem ; height:0.1rem ; background-color:#ffffff ;
    position:absolute ; left:50% ; top:50%
}  
.TH__btn__close:hover , .TH__btn__close:focus { opacity:1 }
.TH__btn__close::before { transform:translate(-50%,-50%) rotate(45deg) }
.TH__btn__close::after  { transform:translate(-50%,-50%) rotate(-45deg) }
.TH__btn__close:hover::before , .TH__btn__close:focus::before { transform:translate(-50%,-50%) rotate(135deg) }
.TH__btn__close:hover::after , .TH__btn__close:focus::after   { transform:translate(-50%,-50%) rotate(45deg) }



/* images */
.imgs , .imgs__left , .imgs__right , .imgs img  , .img , .img img { width:100% }
.imgs , .img { text-align:center ; font-size:0 ; margin:0 auto 4rem } 
.imgs { padding-top:1rem }
.imgs:last-child , .img:last-child { margin-bottom:0 }
.imgs__left , .imgs__right { max-width:59rem ; margin:0 auto }
.imgs__left { margin-bottom:2rem }
.imgs img , .img img , .img_outline::before , .img__line { border-radius:0.4rem }
.imgs__cap {
    font-size:1.6rem ; line-height:2.8rem ; text-align:center ;
    border-bottom:solid 1px rgba(0,0,0,0.1) ;
    padding:0.5rem 0.5rem 0.7rem ;
}
.img_outline { position:relative }
.img_outline::before { 
    display:block ; content:"" ; 
    width:100% ; height:100% ; box-sizing:border-box ;
    border:solid 1px rgba(0,0,0,0.1) ;
    position:absolute ; left:50% ; top:50% ; transform:translate(-50%,-50%) ;
} 

 



/* PC */
@media screen and (min-width:1024px){ 

    /* main */
    #main { padding:7rem 0 0 }

 

    /* visual */
    #visual , .visual_img { height:40rem }
    #headline , .visual_img::before { width:50rem }
    #headline { 
        padding:0 3rem 0 4rem ; text-align:left ;
        left:auto ; right:0  ; top:auto ; bottom:8rem ; transform:none }
    #breadcrumb { padding-bottom:0.2rem }
    .BC__li     { font-size:1.8rem ; line-height:2.8rem ; padding-right:1.5rem ; margin-right:1.5rem }
    .BC__li::before { width:0.7rem ; height:0.7rem ; right:-0.2rem }
    .HL__name       { font-size:2rem ; padding-top:4rem }

    .HL__title { 
        font-family:'Black Han Sans',sans-serif ;
        font-size:4rem ; line-height:5rem ; font-weight:normal ; letter-spacing:-0.15rem }
    .HL__title > br { display:block }
 

        
    /* TABLE */
    .table__rw table { 
        display:table ;
        border:0 ; border-spacing:0 ; border-collapse:collapse } 
    .table__rw colgroup { display:table-column-group }
    .table__rw thead    { display:table-header-group }
    .table__rw tbody    { display:table-row-group ; border:none }
    .table__rw tfoot    { display:table-footer-group }
    .table__rw tr , .table__rw th , .table__rw td , .table__rw tr.table__row { padding:0 ; margin:0 ; border:none }
    .table__rw tr       { display:table-row ; position:relative }
    .table__rw th , .table__rw td { 
        display:table-cell ; 
        text-align:center ; vertical-align:middle ; word-break:keep-all 
    } 
    .table__rw th.table__row , .table__rw td.table__row {
        position:absolute ; left:0 ; top:0 ; 
        display:none ; overflow:hidden ; padding:0 ; margin:0 ;
        width:0 ; height:0
    }
    .table__caption     { display:table-caption }
    .table__tag         { 
        background:none ; border:none ;
        width:0 ; height:0 ; display:block ; overflow:hidden ;
        font-size:0 ; color:transparent
    } 
    .table__rw th { 
        background-color:#0e1ea3 ; padding:1.2rem 0.5rem 1.4rem ; 
        font-size:1.6rem ; line-height:2rem ; color:#ffffff ; font-weight:400  ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ;
        position:relative ; border:solid 1px #0e1ea3
    }
    .table__rw th::after {
        display:block ; content:"" ; width:1px ; height:1.4rem ; background-color:#ffffff ; opacity:0.3 ;
        position:absolute ; right:0 ; top:50% ; transform:translateY(-50%) ;
    } 
    .table__rw th:last-child:after { display:none } 
    .table__rw td { 
        padding:0.7rem 0.5rem 0.9rem ; 
        border:solid 1px rgba(0,0,0,0.1) ; border-top:none }
    .table__rw td br { display:block }

    .table__list li { margin:0 0 1rem 0 ; display:block }
    .table__list li:last-child { margin:0 }

    .row__line    { border:none ; margin:0 }



    /* NOTICE */
    .notice { padding:4rem ; position:relative }   
    


    /* fun */
    .this__fun { 
        position:relative ;
        width:98% ; max-width:120rem ; min-height:6rem ; padding:0 ; margin:0 auto 5rem }
    .this__fun::before { 
        display:block ; content:"" ; width:100% ; height:1px ;
        background-color:rgba(0,0,0,0.1) ;
        position:absolute ; left:0 ; top:50% ;
    }  
    .PP__box , .TH__box { margin:0 ; position:absolute ; top:0 }
    .PP__box { width:68% ; left:0 }
    .TH__box { width:25% ; position:absolute ; right:0 }
    .PP__box::after { display:block ; content:"" ; clear:both } 
    .PP__item { margin:0 ; width:49.4% }
    .PP__item.prev { float:left } 
    .PP__item.next { float:right } 
    .PP__link { background-color:#ffffff }
    .prev .PP__link { padding:1.5rem 1rem 1.7rem 6.5rem }
    .next .PP__link { padding:1.5rem 6.5rem 1.7rem 1rem ; text-align:right } 
    .next .PP__icon { left:auto ; right:0 }
    .next .PP__icon::after { right:auto ; left:0 }
    .TH__btn__open { padding:1.5rem 4rem 1.7rem 2rem }
    .TH__btn__open::after { right:1.5rem }

    .TH__box__list , .TH__box__wrap , .open .TH__box__list { 
        margin:0 ; padding:0 ; transform:none ; overflow:hidden ;
        width:100% ; min-width:auto ; max-width:none ; height:auto }
    .TH__box__list { 
        overflow:hidden ; height:0 ;
        position:absolute ; left:0 ; top:auto ; bottom:6.5rem ;
        border-radius:0.6rem ; 
        background-color:#ffffff ;   
    }
    .open .TH__box__list { box-shadow:0 0 0.3rem rgba(0,0,0,0.3) ; height:auto }

    .TH__box__wrap { position:static ; background:none ; box-shadow:none ; border-radius:0 ; border:none }
    
    .TH__box__title {  
        background-color:#0e1ea3 ; padding:1rem 3rem 1.2rem 2rem ;
        font-size:1.6rem ; line-height:2.2rem ; text-align:left ;
    }
    .TH__link {
        font-size:1.6rem ; line-height:2.4rem ;
        padding:0.7rem 0.2rem 0.9rem ;
    }

    .TH__btn__close { 
        width:2rem ; height:2rem ; 
        right:1rem ; top:1.2rem ; opacity:0.8 ;
    }
    .TH__btn__close::before , .TH__btn__close::after { width:1.8rem }


    /* images */
    .imgs::after { display:block ; content:"" ; clear:both } 
    .imgs__left , .imgs__right { width:49.16% ; margin:0 }
    .imgs__left , .img.left    { float:left } 
    .imgs__right , .img.right  { float:right }  
    .img.left  { margin:0.7rem 5rem 0 0 }
    .img.right { margin:0.7rem 0 0 5rem }
} 





/* PRINT */
@media print { 

    /* visual */
    #visual , .visual_img { height:auto ; border-radius:0 }
    #visual { border-bottom:solid 1px rgba(0,0,0,0.1) ; padding-bottom:3rem }
    .visual_img { display:none }
    #headline   { position:static ; transform:none }
    .BC__li , .HL__title , .HL__name { color:#111111 ; text-shadow:none }
    .BC__li::before { border-color:#111111 ; opacity:0.5 }



    /* TABLE */
    .table__rw table { 
        display:table ;
        border:0 ; border-spacing:0 ; border-collapse:collapse } 
    .table__rw colgroup { display:table-column-group }
    .table__rw thead    { display:table-header-group }
    .table__rw tbody    { display:table-row-group }
    .table__rw tfoot    { display:table-footer-group }
    .table__rw tr , .table__rw th , .table__rw td , .table__rw tr.table__row { padding:0 ; margin:0 ; border:none }
    .table__rw tr       { display:table-row }
    .table__rw th , .table__rw td { 
        display:table-cell ; 
        text-align:center ; vertical-align:middle ; word-break:keep-all 
    }
    .table__caption     { display:table-caption }
    .table__tag         { 
        background:none ; border:none ;
        width:0 ; height:0 ; display:block ; overflow:hidden ;
        font-size:0 ; color:transparent
    }
    .table__rw th { 
        background-color:#0e1ea3 ; padding:1.2rem 0.5rem 1.4rem ; 
        font-size:1.6rem ; line-height:2rem ; color:#ffffff ; font-weight:400  ; text-shadow:0 0 0.3rem rgba(0,0,0,0.3) ;
        position:relative ; border:solid 1px #0e1ea3
    }
    .table__rw th::after {
        display:block ; content:"" ; width:1px ; height:1.4rem ; background-color:#ffffff ; opacity:0.3 ;
        position:absolute ; right:0 ; top:50% ; transform:translateY(-50%) ;
    } 
    .table__rw th:last-child:after { display:none } 
    .table__rw td { 
        padding:0.7rem 0.5rem 0.9rem ; 
        border:solid 1px rgba(0,0,0,0.1) ; border-top:none }



    /* fun */
    .this__fun { display:none }



    /* images */
    .imgs::after { display:block ; content:"" ; clear:both } 
    .imgs__left , .imgs__right { width:49.16% ; margin:0 }
    .imgs__left , .img.left    { float:left } 
    .imgs__right , .img.right  { float:right }  
    .img.left  { margin:0.7rem 5rem 0 0 }
    .img.right { margin:0.7rem 0 0 5rem }

    .img_outline::before { display:none }
    .img_outline img { border:solid 1px rgba(0,0,0,0.1) }
 
 
}