@charset "UTF-8";



/* ---------------------------------------------------
| メインビジュアルCSS
--------------------------------------------------- */
#mv{
  position:relative;
  width:100%;
  height:700px;
/*  margin-bottom:8em; */
  margin-bottom:4em;
  background-image:url(/img/index/mv.jpg);
  background-size:cover;
  background-position:center 90%;
  overflow:hidden;
}
/* --------- responsive --------- */
@media screen and (min-width:1500px) {
  #mv{height:800px;}
}
@media screen and (min-width:1200px) and (max-width:1499px) {
  #mv{height:700px;}
}
@media screen and (min-width:768px) and (max-width:1199px) {
  #mv{height:600px;}
}
@media screen and (max-width:767px) {
  #mv{height:200px;margin:0;}
}

/* ---------------------------------------------------
| 共通
--------------------------------------------------- */
#about,#business,#greeting{margin:4em 0 8em;}
#about p,#business p,#greeting p{font-size:1.2em;}
.contFlex{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  position:relative;
  margin:4em auto;
}
@media screen and (max-width:767px) {
  #about,#business,#greeting{margin:4em 0;}
  #about p,#business p,#greeting p{font-size:.9em;}
}

/* ---------------------------------------------------
| #about
--------------------------------------------------- */
#about p{
  margin:0 auto 1.5em;
  width:44em;
}

/* --------- responsive --------- */
@media screen and (max-width:767px) {
  #about{margin:4em 0;}
  #about p{
    margin:0 auto 1em;
    width:100%;
    font-size:1em;
  }
}


/* ---------------------------------------------------
| #business
--------------------------------------------------- */
#business{overflow:hidden;}
/* --------- responsive --------- */
@media screen and (min-width:768px) {
  #business h3{color:#2287ca;}
  #business .contTxt,#business figure{width:48%;}
  .imgCallcenter img{box-shadow:1em -1em 0 rgba(157,198,81,.5);}
  .imgCompliance img{box-shadow:-1em 1em 0 rgba(157,198,81,.5);}
}
@media screen and (max-width:767px) {
  #business .contFlex{margin:2em auto 3em;}
  #business h3{text-shadow:2px 2px #fff;}
  #business .contTxt{position:relative;width:100%;z-index:10;}
  #business figure{position:absolute;top:-2.7em;right:0;width:40%;z-index:1;}
  #business figure::before,#business figure::after{
    position:absolute;
    content:"";
    width:0;height:0;
    border-width:1em;
    border-style:solid;
    border-color:#fff transparent transparent;
    box-shadow:0 -2px 0 rgba(0,0,0,.1);
  }
  #business figure::before{
    top:-1.2em;right:-1.2em;transform:rotate(225deg);
  }
  #business figure::after{
    bottom:-1.2em;left:-1.2em;transform:rotate(45deg);
  }
}

/* ---------------------------------------------------
| #corporate
--------------------------------------------------- */
#corporate{
  position:relative;
  padding:4em 0;
  background-image:url(/img/index/bgCorporate.jpg);
  background-size:cover;
}
#corporate::after{
  position:absolute;
  top:0;left:0;
  content:"";
  width:100%;height:100%;
  background-color:rgba(0,0,0,.8);
}
#corporate .inner{
  color:#fff;
  z-index:1;
}

/* --------- responsive --------- */
@media screen and (min-width:768px) {
  #corporate dl{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    width:30em;
    margin:1em auto;
  }
  #corporate dl dt,
  #corporate dl dd{
    margin:.5em auto;
    line-height:1.75em;
  }
  #corporate dl dt{
    width:8em;
    border-right:1px solid #fff;
  }
  #corporate dl dd{
    width:calc(100% - 8em);
    padding-left:2em;
  }
}
@media screen and (max-width:767px) {
  #corporate dl dt,
  #corporate dl dd{
    margin:.25em auto;
    font-size:.9em;
    line-height:1.5em;
  }
  #corporate dl dt{
    text-decoration:underline;
  }
  #corporate dl dd{
    margin-bottom:1.5em;
  }
}


/* ---------------------------------------------------
| #greeting
--------------------------------------------------- */
#greeting figure,#greeting figure img{width:200px;}

/* --------- responsive --------- */
@media screen and (min-width:768px) {
  .contGreet{width:800px;}
}
@media screen and (max-width:767px) {
  #greeting figure{margin:1em auto;}
}




/* ---------------------------------------------------
| ボタン
--------------------------------------------------- */
.btn,.btnRev{
  width:30rem;
  margin:4rem auto 0 !important;
}
.btn a,.btnRev a{
  display:block;
  padding:1em;
  color:#00a5d9;
  background:rgba(255,255,255,.3);
  text-align:center;
  text-decoration:none;
  border:1px solid #00a5d9;
  transition:.3s;
}
.btnRev a{
  color:#fff;
  background:rgba(0,165,217,.8);
  border:2px solid #00a5d9;
}
.btn a:hover{
  color:#fff;
  background:rgba(0,165,217,.8);
}
.btnRev a:hover{
  color:#00a5d9;
  background:rgba(255,255,255,.8);
}
/* --------- responsive --------- */
@media screen and (min-width:768px) and (max-width:1079px) {
  .btn,.btnRev{
    width:30rem;
  }
}
@media screen and (max-width:767px){
  .btn,.btnRev{
    width:60%;
    margin:1rem auto 0 !important;
  }
  .btn a,.btnRev a{
    padding:.5em;
  }
}

/* ---------------------------------------------------
| ニュース一覧
--------------------------------------------------- */
#news{
  padding:8rem 0;
}
#news dl{
  align-items: center;
  width:80rem;
  margin:0 auto;
}
.newsList dl{display:none;}
.newsList dl:first-child,.newsList dl:nth-child(2),
.newsList dl:nth-child(3),.newsList dl:nth-child(4),.newsList dl:nth-child(5){display:flex;}
#news dt{
  width:15%;
  color: #2e6eb1;
  font-weight: bold;
}
#news dd{
  width:85%;
  padding:1.6rem 0 1.6rem 4rem;
  border-left:.1rem solid #555555;
}

/* --------- responsive --------- */
@media screen and (max-width:1079px) {
  #news .inner{
    width:96%;
    margin:0 auto;
  }
  #news dl{
    width:100%;
  }
}
@media screen and (max-width:767px){
  #news{
    padding:4rem 0 0;
  }
  #news h2{
    font-size:1.4em;
  }
  #news dl{
    display:block;
    width:96%;
    margin:0 auto;
  }
  #news dt{
    width:100%;
    margin:0 0 .5em;
    color: #555;
    font-size: 1.4rem;
  }
  #news dd{
    width:100%;
    margin:0 0 1.5em;
    padding:0;
    border-left:0;
    line-height:1.4;
    text-align: justify;
    font-size:1.4rem;
  }
}