.flex-box { display: flex; display: -ms-flexbox; }
.sp { justify-content: space-between; }
.ff-on { color: #000 !important; border-color: #000 !important; }
#mqHeader { width: 100%;  position: fixed; top: 0; left: 0; z-index: 999; transition: all 0.3s; }
.h-active {  background-color: #fff; }
#mqHeader .logo { display: inline-block; }
#mqHeader .logo a { color: #fff; transition: all 0.3s; }
#mqHeader .inner { align-items: center; }
#mqHeader .parent { position: relative; }
#mqHeader nav { margin-right: 70px; }
#mqHeader .parent .parent-list { text-align: center; position: relative;  }
#mqHeader .parent .parent-list .parent-link { font-size: 24px; color: #fff; font-weight: 500;  width: 100%; display: block; padding: 50px 65px; position: relative; transition: all 0.3s; }
#mqHeader .parent .parent-list::after { width: 0; content: ''; height: 2px; background-color: #003370; display: block; position: absolute; left: 50%; transform: translateX(-50%); bottom: -2px; z-index: 103; transition: all 0.5s; }
#mqHeader .parent .parent-list:hover::after{ width: 100%; }
#mqHeader .parent .parent-list:hover .child-box { background-color: #f6f6f6; box-shadow: inset 0 10px 10px -10px rgba(0, 0, 0, .2);   }
#mqHeader .child-box {  width: 100%; display: none; position: absolute; top: 135px; height: 400px; z-index: 103; padding: 20px 0; }
#mqHeader .child .child-list:hover a { color: #0f37a8; text-decoration: underline; }
#mqHeader .child .child-list .child-link { font-size: 22px; padding: 20px; font-weight: 400; width: 100%; display: block; text-align: center; }
#mqHeader .contact_btn { color: #fff; font-size: 22px; padding: 14px 18px; line-height: 29px; font-weight: 400; display: inline-block; border: 2px solid #fff; border-radius: 35px; transition: all 0.3s; }
#mqHeader .contact_btn.contact_c { color: #000; border: 1px solid #000; }
#mqHeader .contact_btn:hover { color: #fff !important; background-color: #000; border: 2px solid #000; }
#mqHeader .active { opacity: 1; visibility: visible; }
#mqHeader .header_navBg { display: none; width: 100%; height: 400px; position: absolute; top: 135px; left: 0; background-color: #fff; z-index: 102; box-shadow: inset 0 10px 10px -10px rgba(0, 0, 0, .2); }

.respon-menu { width: 100%; position: fixed; top: 0; right: 0; overflow: auto;  opacity: 0; visibility: hidden; transition: 0.4s;  display: flex; justify-content: flex-end; }
.respon-menu .res-frame { width: 45%; height: 100vh; overflow: auto; background-color: #fff; }
.respon-menu .res-frame .res-top { justify-content: flex-end; }
.respon-menu .res-frame .res-top h2 { color: #fff; font-weight: 600; }
.respon-menu .close-bt img { vertical-align: middle; }
.respon-menu .r-parent-list:first-child { border-top: 1px solid #ccc; }
.respon-menu .r-parent-list { border-bottom: 1px solid #ccc; } 
.respon-menu .r-parent .p-l { font-weight: 600; justify-content: space-between; -ms-flex-pack: justify; align-items: center; }
.respon-menu .r-parent .p-l.on { border-bottom: 1px solid #0e3773; }
.respon-menu .r-parent .p-l img { transition: all 0.3s; }
.respon-menu .r-parent .on img { transform: rotate(90deg); }
.respon-menu .r-child { display: none; background-color: #f5f5f5; }
.respon-menu .r-child a { display: block; font-weight: 600; }

 
/** footer **/
#mqFooter {  width: 100%; background-color: #252d3b; }
#mqFooter .f-logo a { display: block; }
#mqFooter h1,
#mqFooter .address span { color: #fff; font-weight: 400; letter-spacing: -1.2px; }
#mqFooter h1,
#mqFooter .address { font-style: normal; }
#mqFooter .copyright { color: #4e596d !important; display: block; }

/* sub */
#mqSub .visual { background: no-repeat center / cover; }
#mqSub .visual .v_title { font-size: 32px; font-weight: 600; text-align: center; color: #fff; }
#mqSub .intro { background-image: url('../img/cont/intro_bg.jpg'); }
#mqSub .rd { background-image: url('../img/cont/rd_bg.jpg'); }
#mqSub .pr { background-image: url('../img/cont/board_bg.jpg'); }
#mqSub .employ { background-image: url('../img/cont/employ_bg.jpg'); }

#mqSubNavi { border-top: 1px solid #e8e7e6; border-bottom: 1px solid #e8e7e6; }
#mqSubNavi .parent { align-items: center; }
#mqSubNavi .parent a { display: block; }
#mqSubNavi .parent a:hover { text-decoration: underline; }
#mqSubNavi .parent .parent-data { position: relative; }
#mqSubNavi .parent .p-d { position: relative; }
#mqSubNavi .parent .p-d:not(:last-child)::after { content: ''; width: 1px; height: 20px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: inline-block; background-color: #e7e7e7; }
#mqSubNavi .parent .p-d .parent-link { background-image: url(/img/inc/sub_arrow.png); background-repeat: no-repeat; position: relative; }
#mqSubNavi .parent .data-box { position: absolute; left: -1px; border: 1px solid #ccc; border-top: 0; display :none; z-index:100; }
#mqSubNavi .parent .child-link { background: #fff; }
#mqSubNavi .parent .child-data { position: relative; }

/*** Mobile ***/
@media screen and (min-width:1px) and (max-width:767px) {
    .mm-none { display: none; }
    #mqHeader .m-bt { width: 30px; }
    #mqHeader .logo a { font-size: 18px; }

    .respon-menu .res-frame .res-top { padding: 22px 20px; }
    .respon-menu .close-bt img { width: 20px; }
    .respon-menu .r-parent { margin-bottom: 30px; }
    .respon-menu .r-parent .p-l  { font-size: 14px; padding: 20px; }
    .respon-menu .r-parent .p-l img { width: 5px; }
    .respon-menu .r-child a { font-size: 13px; padding: 10px 20px; }

    /* footer */
    #mqFooter { padding: 40px 0 20px 0; word-wrap: break-word; word-break: keep-all; }
    #mqFooter .f-logo img { width: 100px; }
    #mqFooter .address span,
    #mqFooter .copyright { font-size: 13px; }
    

    /* sub */
    #mqSub { margin-top: 76px; }
    #mqSub .visual { padding: 90px 0; }
    #mqSub .visual .v_title { font-size: 20px; }

    #mqSubNavi .parent .parent-link { font-size: 14px; padding: 10px; width: 105px; background-position: right 10px center; background-size: 8px; }
    #mqSubNavi .parent .p-d:not(:last-child)::after { height: 13px; }
    #mqSubNavi .parent .home-data a { padding: 10px; } 
    #mqSubNavi .parent .home-data a img { width: 13px; }
    #mqSubNavi .parent .child-link { width: 95px; padding: 10px; }
    #mqSubNavi .parent .data-box { top: 43px; }

    
}

/*** Mobile & Tablet ***/
@media screen and (min-width:1px) and (max-width:1319px) {
    .m-block { display: block }
    .m-none { display: none !important; }
    .inner { padding: 0 20px; }

    /** header **/
    #mqHeader { padding: 15px 0; }
    #mqHeader .inner { justify-content: space-between; }
    #mqHeader .m-bt img { width: 100%; vertical-align: bottom; }
    .respon-menu .r-child { padding: 20px 0; }
    #mqHeader .header_navBg { display: none !important; }
    /* footer */
    #mqFooter { text-align: center; }
    #mqFooter h1 { margin-bottom: 10px; }
    #mqFooter .copyright { margin-top: 10px; }
} 

/*** Tablet ***/
@media screen and (min-width:768px) and (max-width:1319px) {
    
    #mqHeader .logo {width: 320px; }
    #mqHeader .logo a { font-size: 25px; }
    #mqHeader .m-bt { width: 40px; }
    
    .respon-menu .res-frame .res-top { padding: 40px 30px; }
    .respon-menu .res-frame .close-bt img { width: 30px; }
    .respon-menu .r-parent { margin-bottom: 50px; }
    .respon-menu .r-parent .on { background-size: 100%; }
    .respon-menu .r-parent .p-l  { font-size: 20px; padding: 30px; }
    .respon-menu .r-parent .p-l img { width: 10px; }
    .respon-menu .r-child a { font-size: 18px; padding: 10px 30px; }

    /* footer */
    #mqFooter { padding: 30px 20px; }

    /* sub */
    #mqSub { margin-top: 76px; }
    #mqSub .visual { padding: 155px 0; }
    #mqSub .visual .v_title { font-size: 25px; }
    #mqSub .breadcrumb { padding: 15px 0; }
    #mqSub .breadcrumb .bc-frame .home-btn { padding-left: 20px; }
    #mqSub .breadcrumb .bc-frame li { font-size: 18px; background-size: 18px !important; }
    #mqSub .breadcrumb .bc-frame li:not(:last-child):after { width: 5px; height: 13px; }
    #mqSub .subNavi nav .navi_title { padding: 60px 10px 15px 10px; margin-bottom: 15px; font-size: 20px; }
    #mqSub .subNavi nav .navi .navi_list a { padding: 15px; font-size: 18px; }
    

}

/*** Tablet & Desktop ***/
@media screen and (min-width:768px) {
    .pct-none { display: none; }
    /* footer */
    #mqFooter .address span,
    #mqFooter .copyright { font-size: 14px; }
    
    /* sub */
    #mqSub .subNavi nav { position: absolute; }

    #mqSubNavi { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; }
    #mqSubNavi .parent .p-d:not(:last-child)::after { height: 20px; }
    #mqSubNavi .parent .parent-link { padding: 23px 25px; width: 160px; background-position: right 20px center;}
    #mqSubNavi .parent a { font-size:1.2em; }
    #mqSubNavi .parent .home-data a { padding: 20px; } 
    #mqSubNavi .parent .child-link { width: 150px; padding: 10px 25px; }
    #mqSubNavi .parent .parent-data-box { top: 74px; }
}

/*** Desktop ***/
@media screen and (min-width:1320px) {
    
    .pc-none { display: none; }
    .inner { width: 1320px; margin: 0 auto; }
    

    /* footer */
    #mqFooter { padding: 50px 20px; }
    #mqFooter .f-logo a { margin-right: 50px; }
    #mqFooter h1,
    #mqFooter .address span { font-size: 18px; }
    #mqFooter .inner { display: flex; align-items: center; }
    

    /* sub */
    #mqSub { margin-top: 135px; }
    #mqSub .visual { padding: 175px; }
    

}