@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Open+Sans&display=swap');

.alert-error{
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
}

ul.errorlist{
    list-style: none;
    padding:0px;
}

ul.errorlist li{
    color: #842029;
}

.uni-form{
    max-width:600px;
}

.uni-form .form-group{
    margin-bottom: 2rem;
}

button.d-block{
    width:100%;
    max-width:100%;
}

.category-header{
    background-color: #d8e3ee;
    padding:.2em 0;
    text-align: left;
    position: fixed;
    top: 89.7px;
    right: 0;
    left: 0;
    z-index: 1029;
}

.category-header h2{
    background-color: #d8e3ee;
    padding:.18em 0;
    text-align: left;
    font-size:1rem;
    margin-bottom: 0px;
    font-weight: normal;
}

.page-header{
    padding:.67em 0;
    flex-basis: 100%;
    margin-bottom:24px;
    letter-spacing: .03em;
    font-size: calc(1.525rem + .9vw);
}

h3.page-header{
    font-size: calc(1.425rem + .9vw);
}

.page-header small{
    font-weight:normal;
    font-size: .475em;
}

.page-header small.sep{
    font-size: 1.3em;
    color:#C24292;
}

.state-nav em{
    display:inline-block;
    padding:10px 20px;
    border-radius:30px;
    border: 1px solid #d8e3ee;
    margin-right:6px;
}

.state-nav.state0 em{
    background-color:#e9ecef;
}

.state-nav.state1 em{
    background-color:#d5f0e6;
}

.state-nav.state2 em{
    background-color:#C24292;
}

.row#state_of_idps img{
    max-width:100%;
    width:48px;
}

.row#state_of_idps .wrap{
    border-radius:7px;
    border: 1px solid #d8e3ee;
    background-color:#FFF;
    padding:12px;
}

.row#state_of_idps .wrap .name{
    border-radius:30px;
    padding:12px 16px;
    text-decoration:none;
}

.row#state_of_idps .wrap.state0 .name{
    color: #495057;
    background-color:#e9ecef;
}

.row#state_of_idps .wrap.state0 .icon{
    width:24px;
    height:24px;
}

.row#state_of_idps .wrap.state0 .name:hover,
.row#state_of_idps .wrap.state0 .name:focus,
.row#state_of_idps .wrap.state0 .name:active
{
    background-color:#4ac5cf;
    color:#FFF;
}

.row#state_of_idps .wrap.state0 .name:hover .icon,
.row#state_of_idps .wrap.state0 .name:focus .icon,
.row#state_of_idps .wrap.state0 .name:active .icon
{
    background-color:#FFF;
    mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z" /></svg>');
}

.row#state_of_idps .wrap.state1 .name{
    color: #1c6b4d;
    background-color: #d5f0e6;
}

.row#state_of_idps .wrap.state1 .icon{
    background-color:#1c6b4d;
    width:24px;
    height:24px;
    mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" /></svg>');
}

.row#state_of_idps .wrap.state1.hvr .name:hover,
.row#state_of_idps .wrap.state1.hvr .name:focus,
.row#state_of_idps .wrap.state1.hvr .name:active
{
    color: #fff;
    background-color: #6c757d;
}

.row#state_of_idps .wrap.state1.hvr .name:hover .icon,
.row#state_of_idps .wrap.state1.hvr .name:focus .icon,
.row#state_of_idps .wrap.state1.hvr .name:active .icon
{
    background-color:#FFF;
    mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM4.5 7.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1h-7z" /></svg>');
}

.row#state_of_idps .wrap.state2 .name{
    color: #fff;
    background-color:#C24292;
}

.row#state_of_idps .wrap.state2 .icon{
    background-color:#fff;
    width:24px;
    height:24px;
    mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="24" height="24"><path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z" /></svg>');
}

.row#state_of_idps .wrap.state2 .name:hover,
.row#state_of_idps .wrap.state2 .name:focus,
.row#state_of_idps .wrap.state2 .name:active
{
    color: #fff;
    background-color:#C24292;
}

.btn{
    border-radius:20px;
    padding:4px 16px;
}

.btn-lg{
    font-size:1rem;
    border-radius:30px;
    padding: 12px 30px;
    letter-spacing: .02em;
}

.btn-sm{
}

.btn-primary{
    background-color:#C24292;
    border:1px solid #C24292;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active
{
    background-color:#d651a4;
    border:1px solid #d651a4;
    color:#FFF;
}

.btn-info{
    background-color:#42b9c2;
    border:1px solid #42b9c2;
    color:#FFF;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active
{
    background-color:#4ac5cf;
    border:1px solid #4ac5cf;
    color:#FFF;
}

.btn-light{
    background-color:#FFF;
    border:2px solid #4295c2;
    color:#4295c2;
    font-weight: bold;
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active
{
    background-color:#4ca1cf;
    color:#FFF;
}

.content{
    padding-bottom:60px;
    flex:1;
}

.footer{
    border-top: 1px solid #d8e3ee;
    background:#E5EAF0;
}

.footer ul{
    list-style:none;
    font-size:0;
    line-height:1;
    padding:0;
}

.footer ul li{
    font-size:13px;
}

.footer div{
    font-size:13px;
    color:#475A71;
    text-decoration:none;
}

.footer a{
    font-size:13px;
    color:#3a358c;
}

.footer-arrow {
    margin: 1px 0 0 6px;
}

.header .navbar-toggler {
    border: none!important;
}

.header .navbar-toggler:focus {

}

.card{
    background-color:transparent!important;
    border:none!important;
}

.card-footer{
    background-color:transparent!important;
    border-top:none;
}

.card-body{
    background-color:#FFF;
    border-radius:7px;
    border: 1px solid #d8e3ee;
    padding:24px;
}

.card-body-noframe{
    padding:24px;
}

.list-header .card-body{
    padding:0px 24px;
    background-color:transparent;
    border:none;
    border-radius:0px;
}

.card-header{
    background-color:transparent!important;
    border-bottom:none!important;
    padding:.67em 0;
    letter-spacing: 0.05em;
    flex-basis: 100%;
    font-size: calc(1.2rem + .3vw);
    font-weight: bold;
    margin-bottom:16px;
}

.card-header:first-child{
    border-radius:0!important;
}

.header .navbar-nav .nav-link{
    padding: 5px 20px!important;
    color:#2a3b4c;
}

.header .dropdown-menu i{
    width:25px;
    text-align: center;
}

.header{
/*
    -webkit-box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
    */
    border-bottom: 1px solid #d8e3ee;
    background:#FFF;
    padding-top:1rem;
    padding-bottom:1rem;
}
.header-logo{
    display:inline-block;
    width:200px;
}

.header-logo-sp{
    display:inline-block;
    width:80px;
}

.footer-nii-logo{
    width:200px;
    max-width:200px;
}

body{
    font-family:Noto Sans JP,Open Sans,Helvetica,Arial,sans-serif;
    color:#2a3b4c;
    display:flex;
    flex-direction:column;
    min-height: 100vh;
    overflow-y: scroll;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1,h2,h3{
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 150%;
}

a{
    transition: .3s background-color ease;
}

a:hover,
a:active
{
    color:#C24292;
}

img{
    max-width:100%;
}

#wrapper{
  padding-top: 89.7px;
  background-color: #f8f9fa !important;
  display: flex;
  flex-flow: column;
  flex:1;
}

.content{
    padding-top:5rem;
}

#switch-language {
  margin: 5px 0 0 10px;
  padding: 5px 8px;
}

#inquiry {
  color: #337ab7;
  text-decoration: none;
  font-size: 13px;
}

#inquiry:hover {
  color: #23527c;
  text-decoration: underline;
}

.welcome {
  background: #fff;
  flex:1;
  text-align: center;
  overflow: hidden;
  position: relative;
}

.welcome:after, .welcome:before {
  content: '';
  position: absolute;
  width: 50vw;
  height: 80vh;
  transform: rotate(-25deg);
  z-index: 1;
}

.welcome:before {
  left: -15vw;
  top: -30%;
  background: #fff;
  background: -moz-linear-gradient(left,#e2e7ef 0,#fff 100%);
  background: -webkit-linear-gradient(left,#e2e7ef 0,#fff 100%);
  background: linear-gradient(to right,#e2e7ef 0,#fff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e7ef', endColorstr='#ffffff', GradientType=1);
}

.welcome:after {
  right: -5vw;
  top: -15%;
  background: #fff;
  background: -moz-linear-gradient(left,#fff 0,#e2e7ef 100%);
  background: -webkit-linear-gradient(left,#fff 0,#e2e7ef 100%);
  background: linear-gradient(to right,#fff 0,#e2e7ef 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2e7ef', GradientType=1);
}

.welcome .container{
  position:relative;
  z-index: 3;
  padding:60px 30px;
}

.welcome-logo {
  width: 400px;
}

#delete-project-members {
  padding-top: inherit;
  padding-bottom: inherit;
}

select, select.form-control{
/*  padding: 0.375rem 2.25rem 0.375rem 0.75rem;*/
}

.form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"], .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"]
{
/*  padding-right: 2.25rem;*/
}

/* modal */
#mask.hidden, #modal.hidden {
  display: none;
}

#mask {
  background: rgba(0,0,0,.6);
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 1;
}

#modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  margin: 0 auto;
  z-index: 2;
}

@media (max-height:390px),(max-width:575px) {
    .welcome-logo {
      width: 330px;
    }
    .header{
        padding-top:0.5rem;
        padding-bottom:0.5rem;
    }
    .header-logo {
        width: 140px;
    }
    #wrapper{
      padding-top: 59.98px;
    }
    .category-header{
        top: 59.98px;
    }
    .category-header h2{
        font-size:0.77rem;
    }
    .content{
        padding-top:4rem;
    }
}

/* terms */
.terms h3{
    margin-top:2rem;
}
.terms ol > li > ol > li{
    list-style-type: lower-roman;
}

/* about */
img#img_about{
    width: 100%;
    max-width: 768px;
}

/* about */
img#img_about{
    width: 100%;
    max-width: 768px;
}