@charset "UTF-8";


/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

/* ここからモーダル用CSS */
html, body {
overflow: auto}

html, body, .modalWrapper {
  width: 100%;
  height: 100%;
      z-index: 2147483647!important;

}



.modalCon {
display:none;

}

.modalInner,
#modalInner {
  overflow-x: hidden;
    overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  position: relative!important;
  height: 80vh;
    width:90vw;
  padding: 0;
  cursor: default;
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.3);
          box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.3);
}

/*
モーダル中身
**************************/
.modalInner .inner{
    padding:0px 0px 30px;
    position:relative;
}

.modalInner .inner h4{
    margin:0px auto 40px!important;
    text-align: center;
    font-size:20px!important;
    line-height:180%;
    background: url(../images/bgHeading_underline_blk.gif) no-repeat center bottom;
    padding:40px 0 15px 0!important;
}
.modalInner .inner .companyBox{
    overflow: hidden;
    z-index: auto;
    max-width:800px;
        background: url(../images/bgHeading_underline.gif) no-repeat center bottom;
    
    padding:0 0 40px 0;
    margin:0 0 40px 0;
}
.modalInner .inner .companyBox img{
    float:none!important;
    margin:0 auto 40px!important;
    padding:0!important;
    box-sizing: border-box;
    display: block;
    width:70%;
}
.companyLogo{
    width:30%!important;
}
.modalInner .inner .companyBox div{
    float:none;
    width:100%!important;
    text-align: center!important;
    display: block;

}
.modalInner .inner td h5:nth-of-type(1){
    font-size:18px!important;
    margin:0 0 -15px 0!important;
    text-align: center;
}
.modalInner .inner .companyBox div h5{
    font-size:18px!important;
    margin:0 0 10px 0;
    text-align: center;
}
.modalInner .inner .companyBox div p{
    font-size:14px;
    line-height: 180%
}
.modalInner p{
        font-size:14px;
    line-height: 180%
}

.modalInner .inner .greeting{
    padding:0px 0 0px 0!important;
    margin:40px auto 0 auto!important;
    border-top:1px dotted #000;
    width:90%!important;
}

.modalInner .inner .greetingBox{
    overflow: hidden;
    z-index: auto;
}
.modalInner .inner .greetingBox img{
    float:none!important;
    width:50%!important;
    min-width:50%!important;
    height:auto;
    display: block;
    margin:0 auto 20px!important;
    padding:0!important;
}
.modalInner .inner .greetingBox div{
    float:none!important;
    width:100%!important;
    text-align: left;
    margin:0 auto!important;
    display: block;
    box-sizing: border-box;
}
.modalInner .inner .greetingBox div h5{
    font-size:18px!important;
    color:#e6001e;
    font-weight:600;
    margin:0 0 0px 0!important;
    line-height: 150%
}
.modalInner .inner .greetingBox div p{
    font-size:16px;
    line-height:180%;
}
.modalInner .inner .greetingBox table{
    border-top:1px dotted #000;
    margin:60px 0 20px 0;
}
.modalInner .inner .greetingBox table th{
    font-size:16px;
    border-bottom:0px dotted #000!important;
        vertical-align: top;
    padding:25px 0 0px!important;
    line-height: 100%!important;
    text-align: left;
    display: block!important;
        width:100%!important;
}
.modalInner .inner .greetingBox table td{
    border-bottom:1px dotted #000;
    text-align: left;
    vertical-align: top;
    font-size:14px;
    line-height:160%;
    padding:10px 0 25px 0px!important;
    text-align: left;
    width:100%!important;
    display: block;

}

.modalInner .inner .greetingBox table th span{
    font-size:13px;
}
.modalInner .inner h4,
.modalInner .inner .greeting h4{
    margin:0 0 55px 0!important;
}
.modalInner .inner .greetingBox h5{
    padding:20px 0;
    font-size:28px;

}
.modalInner .inner td h5{
    padding:0px 0!important;
    font-size:18px!important;
    text-align: center!important;
    margin:0 auto!important;
    display: block!important;
}




#btn_close {
  position: fixed!important;
  top: 30px!important;
  right: 30px!important;
    z-index: 20000000;
    width:20px;
    height:auto;

  overflow:hidden
}

#btn_close2 {
    display:none!important;
  position: relative;
display: block!important;
    margin:30px auto!important;
}





#btn_close3 {
  position: fixed;
display: block!important;
    margin:0px auto!important;
    bottom:60px;
    left:50px;
}
#btn_close3 label {
  display: block;
  padding: 0.5em;
  color: #000;
    background:#fff;
    text-align: center;
  text-decoration: none;
  font-size: 1em;
    border:1px solid #333;
    padding:5px 30px;
    border-radius:300px;
    margin:0 auto -50px!important;
    width:40%;
    position: fixed;
    bottom:50px;
    left:50%;
    	  -webkit-transform: translate(-50%, -50%); /* Safari用 */
  transform: translate(-50%, -50%);
}



.modalCheck:not(:checked) ~ .modalWrapper > *:not(.modalWrap) {
  -webkit-filter: blur(0px);
          filter: blur(0px);
}
.modalCheck:not(:checked) ~ .modalWrapper .modalWrap {
  opacity: 0;
  visibility: hidden;
}

.modalCheck:checked ~ .modalWrapper > *:not(.modalWrap) {
  -webkit-filter: blur(3px);
          filter: blur(3px);
}


#modal01:checked ~ .modalWrapper #modal01Con {
  opacity: 1;
  visibility: visible;
}





@media (max-width: 640px) {
  .content {
    margin: 1.5em auto;
  }

  .modalInner {
    padding-left: 1em;
    padding-right: 1em;
  }

  .modalTtl {
    font-size: 1.5em;
    padding-bottom: 1em;
  }

  .modalText .modalCover {
    margin: 0 -1em 1em;
  }
}