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

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

@font-face {
  font-family: 'JosefinSans-SemiBold';
  src: url('../fonts/JosefinSans-SemiBold.ttf') format('truetype');
}

@font-face {
  font-family: 'JosefinSans-Regular';
  src: url('../fonts/JosefinSans-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'JosefinSans-Light';
  src: url('../fonts/JosefinSans-Light.ttf') format('truetype');
}

body{display:none}

.jfr{font-family: 'JosefinSans-Regular';}
.jfb{font-family: 'JosefinSans-SemiBold';}
.jfl{font-family: 'JosefinSans-Light';}

*{
  font-family: "Noto Sans Japanese";
  box-sizing: border-box;
  font-feature-settings: "palt";
}

body{background:#fff;}
a{  transition: .3s;}

a:hover{text-decoration:none;}
ul{
  list-style:none;
  padding:0;
  margin:0;
}

body {
  position:relative;
}

.hid {
  position:absolute;
  width:0px;
  height:0px;
  overflow:hidden;
  font-size:8pt;
}


/* header */
header{
  position:fixed;
  height:70px;
  width:100%;
  z-index:1000;
  background:#fff;
}

header h1{
  position:absolute;
  top:20px;
  left:18px;
  height:30px;
  width:250px;
  font-size:1rem;
  margin:0;
  padding:0;
}

header h1 a{
  display:block;
  height:100%;
  width:100%;
  background:url(../images/common/logo.svg) no-repeat;
  background-size:contain;
}

#HeaderNav{
  position:absolute;
  top:0;
  right:85px;
  height:100%;
}

#HeaderNav li{
  display:inline-block;
  height:100%;
  margin:0;
  padding:0;
}

#HeaderNav li a{
  width:150px;
  text-align: center;
  display:block;
  height:100%;
  font-size:1.4rem;
  line-height:70px;
}

.set{
  /*background:#7092C2;*/
  background:#026BB2;
  color:white;
}

.ent{
  /*background:#7092C2;*/
  background:#026BB2;
  color:white;
}

.int{
  background:#026BB2;
  color:white;
}

.set:hover{
  /*color:#7092C2;*/
  color:#026BB2;
  background:white;
}
.ent:hover{
  /*color:#7092C2;*/
  color:#026BB2;
  background:white;
}
.int:hover{
  color:#026BB2;
  background:white;
}

.int.disable {
  pointer-events: none;
  background-color: #909090;
}

footer ul li::first-child{
  text-align:left;
}

/* sp menu */

.drawer--right .drawer-hamburger,
.drawer--right .drawer-open .drawer-hamburger{
  right:20px;
  top:7px;
  position:fixed;
}

.drawer--right.drawer-open .drawer-hamburger{
  right:20px !important;
  width:30px;
}

.drawer--right.drawer-open .drawer-hamburger-icon:after,
.drawer--right.drawer-open .drawer-hamburger-icon:before{
  background-color:white;
}

.drawer-toggle{
}

.drawer-nav{
  background:#114a9a;
}
.drawer-menu {
  padding:30px;
}


@media screen and (max-width:767px){

.drawer-nav{
  background:#114a9a;
  position:fixed;
}
.drawer-menu {
  padding:30px;
  height:100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

}

.drawer-menu li ul{
  margin-bottom:2rem;
}

.drawer-menu li h4{
  font-size:2rem;
  line-height:3rem;
  color:white;
  letter-spacing: 3px;
}

.drawer-menu li h4 a span{font-size:1rem;}

.drawer-menu li{
  font-size:1.5rem;
  line-height:3rem;
  color:white;
  letter-spacing: 3px; 
}

.drawer-menu li a{
  display:block;
  color:white;
}

.drawer-menu li ul li a{
  margin-left:2rem;
}

.drawer-menu li ul li ul{
  margin-left:2rem;
}

.drawer-menu li ul li ul li a{
  font-size:1.4rem;
}

.drawer-menu li a {
  position: relative;
  display: inline-block;
  transition: .3s;
}
.drawer-menu li a.disable {
  pointer-events: none;
  opacity: 0.4;
}
.drawer-menu li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  height: 3px;
  background-color: #fff;
  transition: .3s;
}
.drawer-menu li a:hover::after {
  width: 100%;
}


section{padding:2rem;}

#SectionP{margin-top:-70px;padding-top:70px;}
#SectionC{margin-top:-70px;padding-top:80px;}



.col-xs-1-5, .col-sm-1-5, .col-md-1-5, .col-lg-1-5,
.col-xs-2-5, .col-sm-2-5, .col-md-2-5, .col-lg-2-5,
.col-xs-3-5, .col-sm-3-5, .col-md-3-5, .col-lg-3-5,
.col-xs-4-5, .col-sm-4-5, .col-md-4-5, .col-lg-4-5 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}   
.col-xs-1-5 {
    width: 20%;
    float: left;
}
.col-xs-2-5 {
    width: 40%;
    float: left;
}

.col-xs-3-5 {
    width: 60%;
    float: left;
}

.col-xs-4-5 {
    width: 80%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-1-5 {
        width: 20%;
        float: left;
    }
    .col-sm-2-5 {
        width: 40%;
        float: left;
    }
    .col-sm-3-5 {
        width: 60%;
        float: left;
    }
    .col-sm-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-1-5 {
        width: 20%;
        float: left;
    }
    .col-md-2-5 {
        width: 40%;
        float: left;
    }
    .col-md-3-5 {
        width: 60%;
        float: left;
    }
    .col-md-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        float: left;
    }
    .col-lg-2-5 {
        width: 40%;
        float: left;
    }
    .col-lg-3-5 {
        width: 60%;
        float: left;
    }
    .col-lg-4-5 {
        width: 80%;
        float: left;
    }
}





.col-sm-1-6 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
@media (min-width: 768px) {
    .col-sm-1-6 {
        width: calc(100% / 6);
        float: left;
    }
}
