@charset "utf-8";
/* CSS Document */

/*reset*/
*{
 margin: 0;
 padding: 0;
 list-style: none;
}
html{
 font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
 font-size: 62.5%;
 color: #333;
 line-height: 1.15;
 -webkit-text-size-adjust: 100%;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}


a{
 text-decoration: none;
 transition: color 0.3s, opacity 0.3s;
}
@media (min-width:769px){
 body{ min-width: 1000px;}
 .pc_none{ display: none!important;}
}
@media (max-width:768px){
 .sp_none{ display: none!important;}
}




/*header*/
header, .headerInner{
 position: absolute;
 width: 100%;
 box-sizing: border-box;
 top: 0;
 left: 0;
 z-index: 50;
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
}
.headerInner{
 display: flex;
 justify-content: space-between;
 align-items: center;
 background-color: rgba(255,255,255,0);
}
.logo{
 background-image: url("../images/top/logo-white.png");
 background-repeat: no-repeat;
 background-position: left center;
 background-size: contain;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 display: block;
}

  @media (min-width:769px){
    .headerInner{
     min-width: 1000px;
     height: 85px;
     padding: 0 70px;
     transition: background-color 0.3s;
     letter-spacing: 1.5px;
    }
    header:hover .headerInner{ background-color: #fff;}
    .logo{
     width: 272px;
     height: 48px;
     transition: background-image 0.3s;
     margin-top: 10px;
    }
    header:hover .logo{ background-image: url("../images/top/logo-blue.png");}
    .nav{
     display: flex !important;
     width: 480px;
     justify-content: space-between;
     align-items: center;
     }
    .nav a{
     color: #fff;
     font-size: 1.6rem;
     position: relative;
     height: 85px;
     line-height: 85px;
     padding: 10px 3px 0;
     box-sizing: border-box;
     font-weight: bold;
     display: block;
    }
    header:hover .nav a{ color: #333;}
    .nav a::after{
     position: absolute;
     transition: .4s;
     content: '';
     width: 0;
     left: 50%;
     bottom: 0;
     height: 6px;
     background: #004a81;
    }
    .nav a:hover::after{
     left: 0;
     width: 100%;
    }
  }
  @media (max-width:768px){
    .headerInner{
     height: 60px;
     padding-left: 10px;
     padding-right: 185px;
    }
    .topLogo{
     width: 100%;
     height: 50px;
   }
    .logo{
     width: 100%;
     height: 100%;
    }
    .nav{
     display: none;
     flex-flow: column;
     justify-content: center;
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 80vh;
     box-sizing: border-box;
     padding-top: 50px;
     background-color: rgba(255,255,255,0.9);
     z-index: 10;
    }
    .nav li{
     text-align: center;
     margin-bottom: 7vh;
    }
    .nav li:last-child{ margin-bottom: 0;}
    .nav a{
     color: #333;
     font-size: 2rem;
     font-weight: bold;
     display: inline-block;
    }
    .navButton{
     position: fixed;
     top: 0;
     right: 0;
     width: 65px;
     height: 60px;
     z-index: 100;
     background-color: #000;
     cursor: pointer;
    }
    .navButton p{
     color: #fff;
     font-weight: bold;
     font-size: 1.2rem;
     height: 60px;
     line-height: 60px;
     text-align: center;
    }
    .buttonClose,
    header.active .buttonOpen{ display: none;}
    header.active .buttonClose{ display: block;}
   .closeArea{
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
    display: none;
   }
   header.active .closeArea{ display: block;}
  }




/*お問い合わせへ飛ぶボタン*/
a.contactBtn{
 position: fixed;
 display: block;
 box-sizing: border-box;
 color: #fff;
 font-weight: bold;
 background-color: #004a81;
 z-index: 100;
 transition: opacity 0.3s, visibility 0.3s;
}
a.contactBtn.hide{
 opacity: 0;
 visibility: hidden;
}
  @media (min-width:769px){
    a.contactBtn{
     padding-left: 15px;
     font-size: 1.6rem;
     text-indent: 2.6em;
     top: 165px;
     right: 0;
     width: 50px;
     height: 200px;
     border-radius: 15px 0 0 15px;
     letter-spacing: 1.5px;
     -webkit-writing-mode: vertical-lr;
     -ms-writing-mode: tb-lr;
     writing-mode: vertical-lr;
   }
    a.contactBtn::after{
     content: '〉';
     margin-top: 10px;
     transition: margin-top 0.3s;
    }
    a.contactBtn:hover{ opacity: 0.7;}
    a.contactBtn:hover::after{ margin-top: 15px;}
  }
  @media (max-width:768px){
    a.contactBtn{
     font-size: 1.2rem;
     text-align: center;
     top: 0;
     right: 65px;
     width: 105px;
     height: 60px;
     padding-top: 20px;
    }
    a.contactBtn::after{
     content: '〉';
     transform: rotate(90deg);
     position: absolute;
     bottom: 1px;
     left: 45px;
    }
  }




/*contact*/
.contact{
 background-color: #004a81;
 color: #fff;
 letter-spacing: 0.25px;
}
.contact a{ color: #fff;}
.contact h2{
 font-weight: normal;
 color: #fff;
 text-align: center;
 background: url("../images/top/contact-title.png") no-repeat center top;
 background-size: 175px auto;
}
.contact dd a{
 display: inline-block;
 background: url("../images/top/icon-map.png") no-repeat left 1px center;
 background-size: 14px auto;
 border-bottom: 1px solid #fff;
 padding-left: 21px;
 margin-top: 7px;
 margin-bottom: 20px;
}
.contact .mail,
.contact .tel{
 box-sizing: border-box;
 border: 1px solid #fff;
 text-align: center;
 display: block;
}
.contact .mail{
 background-image: url("../images/top/icon-mail.png");
 background-repeat: no-repeat;
 background-position: left 12% center;
 background-size: 24px auto;
}
.contact .tel{
 background-image: url("../images/top/icon-tel.png");
 background-repeat: no-repeat;
 background-position: left 16% top 46%;
 background-size: 24px auto;
}
  @media (min-width:769px){
    .contact{ padding: 100px 0 120px;}
    .contact a:hover{ opacity: 0.6;}
    .contact h2{
     padding-top: 60px;
     font-size: 1.6rem;
     margin-bottom: 120px;
    }
    .contact .tel{ pointer-events: none;}
    .info-osaka{
     margin: 0 auto 100px;
     width: 700px;
     overflow: hidden;
    }
    .info-osaka dl{
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 34px;
    }
    .info-osaka dt{
     font-size: 2.6rem;
     padding-left: 20px;
     line-height: 64px;
     font-weight: bold;
     border-left: 14px solid #fff;
    }
    .info-osaka dd{
     font-size: 1.6rem;
     line-height: 2.6rem;
    }
    .contact .info-osaka dd a{
     background-size: 16px auto;
     padding-left: 25px;
     margin-top: 0;
     margin-bottom: 0;
     margin-left: 20px;
    }
    .info-osaka .mail,
    .info-osaka .tel{
     width: 320px;
     height: 70px;
     line-height: 70px;
     border-radius: 35px;
     text-indent: 30px;
     font-size: 1.8rem;
    }
    .info-osaka .mail{ float: left;}
    .info-osaka .tel{ float: right;}
    .info-osaka .tel span{ font-size: 1.4rem;}
    .contact .eigyousyo{
     display: flex;
     justify-content: space-between;
     width: 980px;
     margin: 0 auto;
    }
    .eigyousyo dt{
     font-size: 2.2rem;
     padding-left: 20px;
     line-height: 42px;
     font-weight: bold;
     border-left: 10px solid #fff;
     margin-bottom: 35px;
    }
    .eigyousyo dd{
     font-size: 1.5rem;
     line-height: 2.4rem;
     margin-bottom: 20px;
    }
    .eigyousyo .tel{
     background-position: left 19% top 46%;
     background-size: 18px auto;
     font-size: 1.5rem;
     width: 280px;
     height: 50px;
     line-height: 50px;
     border-radius: 25px;
     text-indent: 21px;
    }
    .eigyousyo .tel span{ font-size: 1.2rem;}
  }
  @media (max-width:768px){
    .contact{ padding: 12.5vw 0 20px;}
    .contactInner{
     width: 75%;
     min-width: 270px;
     margin: 0 auto;
    }
    .contact h2{
     background-size: 42.7% auto;
     padding-top: 14%;
     font-size: 3.8vw;
     margin-bottom: 65px;
    }
    .contact dl{
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
     margin-bottom: 20px;
    }
    .contact dt{
     font-size: 3.6vw;
     padding-left: 6px;
     line-height: 6.6vw;
     font-weight: bold;
     border-left: 6px solid #fff;
    }
    .contact dd{
     font-size: 3.3vw;
     line-height: 5.2vw;
    }
    .contact dd a{
     background-size: 8% auto;
     padding-left: 1.2em;
     margin-top: 3px;
     margin-bottom: 15px;
    }
    .contact .mail,
    .contact .tel{
     width: 100%;
     height: 11vw;
     line-height: 11vw;
     border-radius: 5.5vw;
     text-indent: 1.2em;
     font-size: 3.6vw;
     border: 1.5px solid #fff;
     margin: 0 auto;
    }
    .contact .mail{
     background-position: left 16% center;
     background-size: 7% auto;
     margin-bottom: 15px;
    }
    .contact .tel{
     background-position: left 18% top 46%;
     background-size: 7% auto;
     margin-bottom: 50px;
    }
    .contact .tel span{ font-size: 3vw;}
  }




footer{
 background-color: #004a81;
 color: #fff;
 box-sizing: border-box;
 letter-spacing: 0.25px;
}
footer > div{ border-top: 1px solid rgba(255,255,255,0.4);}
footer li a{
 color: #fff;
 display: block;
}
footer .footerLogo a{
 display: block;
 text-indent: 100%;
 overflow: hidden;
 white-space: nowrap;
 background: url("../images/top/logo-white.png") no-repeat center;
 background-size: contain;
 width: 350px;
 height: 61px;
}
footer small{
 font-size: 1.2rem;
 display: block;
 text-align: center;
}
  @media (min-width:769px){
    footer{ padding-bottom: 55px;}
    footer > div{
     margin: 0 auto 115px;
     width: 980px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding-top: 30px;
    }
    footer ul{
     display: flex;
     justify-content: space-between;
     width: 440px;
    }
    footer li a{ font-size: 1.5rem;}
    footer li a:hover{ opacity: 0.6;}
  }
  @media (max-width:768px){
    footer{ padding-bottom: 20px;}
    footer > div{
     padding-top: 6%;
     width: 75%;
     min-width: 270px;
     margin: 0 auto;
    }
    footer ul{
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
     margin-bottom: 55px;
    }
    footer li:nth-child(2){ order: 2;}
    footer li:nth-child(3){ order: 1;}
    footer li:nth-child(4){ order: 3;}
    footer li:not(:nth-child(n+3)){ width: 60%;}
    footer li:nth-child(n+3){ width: 40%;}
    footer li:nth-child(2n+1){ margin-bottom: 6%;}
    footer li a{ font-size: 3.3vw;}
    footer .footerLogo a{
     width: 250px;
     height: 44px;
     margin: 0 auto 20px;
    }
    footer small{ font-size: 1rem;}
  }




/*下層ページ共通部分*/

/*titleWrap*/
.titleWrap{
 height: 425px;
 box-sizing: border-box;
 padding-top: 213px;
}
.titleWrap h1{
 color: #fff;
 text-align: center;
 font-size: 2.2rem;
 font-weight: bold;
 padding-top: 85px;
 letter-spacing: 2px;
}
  @media (max-width:768px){
    .titleWrap{
     height: 230px;
     padding-top: 125px;
    }
    .titleWrap h1{
     font-size: 1.4rem;
     padding-top: 57px;
    }
  }




/*anchorLink*/
.anchorLink{
 display: flex;
 justify-content: center;
 background-color: #f1f6fa;
 width: 100%;
 box-sizing: border-box;
}
.anchorLink li{ height: 100%;}
.anchorLink li a{
 color: #333;
 display: flex;
 align-items: center;
 height: 100%;
 position: relative;
 font-weight: bold;
}
.anchorLink li a::after{
 content: "〉";
 transform: rotate(90deg);
 position: absolute;
 font-weight: normal;
}
  @media (min-width:769px){
    .anchorLink{
     font-size: 1.6rem;
     height: 110px;
     z-index: 5;
     transition: height 0.3s, opacity 0.3s, visibility 0.3s;
    }
    .anchorLink.fixed{
     position: fixed;
     top: 0;
     left: 0;
     height: 80px;
    }
    .anchorLink.hide{
     opacity: 0;
     visibility: hidden;
    }
    .anchorLink li{ margin: 0 70px;}
    .anchorLink li a::after{
     bottom: 13px;
     left: calc(50% - 8px);
     transition: bottom 0.3s, opacity 0.3s;
    }
    .anchorLink li a:hover{ opacity: 0.7;}
    .anchorLink li a:hover::after{ bottom: 8px;}
    .anchorLink.fixed li a::after{ opacity: 0;}
  }
  @media (max-width:768px){
    .anchorLink{
     font-size: 1.1rem;
     font-weight: bold;
     height: 50px;
     border-bottom: 1px solid #cacaca;
    }
    .anchorLink li{
     width: calc(100% / 3);
     box-sizing: border-box;
    }
    .anchorLink li:not(:nth-of-type(3n)){ border-right: 1px solid #cacaca;}
    .anchorLink li a{ justify-content: center;}
    .anchorLink li a::after{
     bottom: 1px;
     left: calc(50% - 6px);
    }
  }




/*section内*/
section{ padding: 160px 0 200px;}
section > h2{
 font-size: 3.2rem;
 color: #1798db;
 letter-spacing: 2px;
 padding-bottom: 23px;
 text-align: center;
 margin-bottom: 115px;
}
  @media (max-width:768px){
    section{ padding: 80px 0 100px;}
    section:first-of-type{ padding-top: 110px;}
    section > h2{
     font-size: 2.4rem;
     padding-bottom: 20px;
     margin-bottom: 60px;
    }
  }


/*table*/
section table{
 font-size: 1.6rem;
 line-height: 2.8rem;
 border-collapse: collapse;
}
section table tr{ border-bottom: 1px solid #cdcdcd;}
section table tr:first-child{ border-top: 1px solid #cdcdcd;}
section table th,
section table td{
 box-sizing: border-box;
 padding-top: 25px;
 padding-bottom: 25px;
 vertical-align: top;
}
section table th{
 background-color: #f1f6fa;
 font-weight: normal;
}
  @media (max-width:768px){
    section table{
     font-size: 1.4rem;
     line-height: 2.1rem;
    }
    section table th,
    section table td{
     padding-top: 15px;
     padding-bottom: 15px;
    }
    section table td{ padding-left: 10px;}
  }