@charset "UTF-8";

main#top section{
  margin-bottom:0;
}
/* --------- responsive --------- */
@media screen and (max-width:767px){
  main#top section{
    margin-bottom:4rem;
  }
  main#top section h2{
    margin-bottom:1.5em;
  }
}

/* ---------------------------------------------------
| メインビジュアルCSS
--------------------------------------------------- */
#mainbanner{
  position: relative;
}
#mainbanner h1{
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 31rem;
  height: 31rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #00a5d9 0, #5fb5d0 50%, #2e6eb1 100%);
}
#mainbanner h1 span.h1-aflac{
  font-size: 3.9rem;
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 51.5%;
  transform: translate(-50%,-50%);
  width: 100%;
  line-height: 1.2;
  letter-spacing: .4rem;
}
#mainbanner h1 label{
  display: block;
  line-height: 1.3;
}
#mainbanner h1 small{
  font-size: 1.9rem;
  font-weight: normal;
  display: block;
  line-height: 1.6;
  letter-spacing: .5rem;
}

/* --------- responsive --------- */
@media screen and (max-width:767px){
  #mainbanner h1{
    width: 16rem;
    height: 16rem;
  }
  #mainbanner h1 span.h1-aflac{
    font-size: 1.8rem;
    letter-spacing: .2rem;
  }
  #mainbanner h1 label{
    line-height: 1.3;
  }
  #mainbanner h1 small{
    font-size: 1.2rem;
    letter-spacing: .1rem;
  }
}
@media screen and (min-width:656px){
  .pcMV{display:block;}
  .spMV{display:none;}
}
@media screen and (max-width:655px){
  .pcMV{display:none;}
  .spMV{display:block;}
}

/* ---------------------------------------------------
| ニュース一覧
--------------------------------------------------- */
#news{
  padding:8rem 0;
}
#news h2{
  margin:0 0 3rem;
  font-size:3rem;
  text-align:center;
  letter-spacing:.2rem;
  font-weight:400;
}
#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:2rem;
  }
  #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;
  }
}


/* ---------------------------------------------------
| 保険ダイレクトについて
--------------------------------------------------- */
#about {
  padding:8rem 0;
  background: #f9f9f9 url(/images/index/about-bg.jpg) no-repeat top right/contain;
}
#about h2 {
	font-size: 3rem;
  line-height:1em;
}
#about h2 span {
	font-size: 1.3rem;
	color: #2e6eb1;
}
#about .about-p {
	margin: 0 0 2rem;
	line-height: 1.8;
  text-align:center;
  text-shadow:1px 1px 1px rgba(255,255,255,.7);
}
/* --------- responsive --------- */
@media screen and (max-width:1079px) {
  #about {
    width: 100%;
  }
  #about .inner{
    width:96%;
    margin:0 auto;
  }
  #about .about-p{
    text-align:left;
  }
  #about .about-p br{
    display:none;
  }
}
@media screen and (min-width:768px) and (max-width:1079px) {
  #about {
    margin: 0;
  }
  #about h2{
    text-align:left;
  }
  #about h2,
  #about .about-p{
    width: 49rem;
  }
}
@media screen and (max-width:767px) {
  #about {
    padding:4rem 0;
    background: #f9f9f9;
  }
  #about h2 {
    font-size:2rem;
    justify-content: center;
  }
  #about h2 span {
    font-size: 1rem;
  }
  #about h3 {
    font-size: 1.6rem;
    width: 20rem;
    margin: 0 auto 2rem;
  }
}


/* ---------------------------------------------------
| 保険ダイレクトの強み
--------------------------------------------------- */
#strength {
  padding:12rem 0 0;
}
#strengthWrap{
  position:relative;
  padding:8rem;
}
#strengthWrap::after{
  position:absolute;
  top:0;left:0;
  content:"";
  width:100%;
  height:100%;
  background:url(/images/index/bg_strength.jpg) no-repeat bottom center/cover;
  opacity:.6;
  z-index:1;
}
#strengthWrap .inner{
  display:flex;
  display:-ms-flexbox;
  flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  justify-content:space-between;
  -ms-flex-pack:justify;
}
#strengthWrap dl{
  position:relative;
  width:33%;
  padding:2em;
  text-align:center;
  background:rgba(255,255,255,.8);
  border-radius:.5rem;
  z-index:10;
}
#strengthWrap dl::before{
  position:absolute;
  display:inline;
  top:-1.5em;;
  left:0;right:0;
  margin:auto;
  content:"01";
  width:3em;
  height:3em;
  line-height:3em;
  color:#fff;
  background:#2e6eb1;
  border-radius:100rem;
}
#strengthWrap dl:first-child::before{content:"01";}
#strengthWrap dl:nth-child(2)::before{content:"02";}
#strengthWrap dl:nth-child(3)::before{content:"03";}
#strengthWrap dl dt{
  position:relative;
  margin-bottom:2rem;
  padding-top:16rem;
  font-size:1.6rem;
  font-weight:700;
  color:#2e6eb1;
}
#strengthWrap dl dt::before{
  position:absolute;
  top:2rem;
  left:0;right:0;
  margin:auto;
  width:10rem;height:10rem;
  background-size:contain;
  content:"";
}
#strengthWrap dl:first-child dt::before{background-image:url(/images/index/strength-icon1.png);}
#strengthWrap dl:nth-child(2) dt::before{background-image:url(/images/index/strength-icon2.png);}
#strengthWrap dl:nth-child(3) dt::before{background-image:url(/images/index/strength-icon3.png);}
#strengthWrap dl dd{
  font-size:1.4rem;
  line-height:1.8em;
}
#strengthWrap p{
  position:relative;
  z-index:10;
}

/* --------- responsive --------- */
@media screen and (max-width:1079px) {
  #strengthWrap{
    position:relative;
    padding:6rem 2rem;
  }
  #strengthWrap .inner{
    display:block;
    width:96%;
    margin:0 auto;
  }
  #strengthWrap dl{
    width:100%;
    margin:0 0 4rem;
    padding:4rem 2rem 4rem 14rem;
    text-align:left;
  }
  #strengthWrap dl::before{
    position:absolute;
    display:inline;
    top:-1.5em;;
    left:-1.5em;right:auto;
    margin:0;
    text-align:center;
  }
  #strengthWrap dl dt{
    position:relative;
    margin-bottom:2rem;
    padding:0;
  }
  #strengthWrap dl dt::before{
    position:absolute;
    top:-2rem;
    left:-12rem;right:auto;
    margin:0;
  }
}
@media screen and (min-width:768px) and (max-width:1079px) {

}
@media screen and (max-width:767px) {
  #strength {
    padding:0;
  }
  #strengthWrap{
    position:relative;
    padding:3rem 1.5rem;
  }
  #strengthWrap dl{
    margin:0 0 3rem;
    padding:1.5rem 1rem 1.5rem 7rem;
  }
  #strengthWrap dl::before{
    font-size:1.2rem;
  }
  #strengthWrap dl dt{
    margin-bottom:1rem;
    font-size:1.4rem;
    line-height:1.4em;
  }
  #strengthWrap dl dt::before{
    top:1rem;
    left:-6rem;
    width:5rem;height:5rem;
  }
  #strengthWrap dl dd{
    font-size:1.2rem;
    line-height:1.4em;
  }
}

/* ---------------------------------------------------
| コンサルティングの流れ/保険事業の承継
--------------------------------------------------- */
#bizOther{
  padding:12rem 0 8rem;
}
#bizOther .inner{
  display:flex;
  display:-ms-flexbox;
  flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  justify-content:space-between;
  -ms-flex-pack:justify;
}
#flow,#ma{width:46%;}
/*#bizOther figure{width:90%;height:20rem;}*/
#bizOther figure img{width:100%;height:20rem;}
.biz-p {
	margin:2rem 0;
	line-height: 1.8;
}
/* --------- responsive --------- */
@media screen and (max-width:1079px) {
  #bizOther{
    padding:0;
  }
  #bizOther .inner{
    display:block;
    width:96%;
    margin:0 auto;
  }
  #flow,#ma{
    display:flex;
    display:-ms-flexbox;
    flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    justify-content:space-between;
    -ms-flex-pack:justify;
    width:100%;
    margin:6rem 0;
    padding:0;
  }
  #bizOther h2{
    width:100%;
  }
  #bizOther figure{
    width:25%;
  }
  #bizOther figure img{
    width:100%;
    height:15rem;
  }
  #bizOther .biz-p{
    width:70%;
  }
}
@media screen and (min-width:768px) and (max-width:1079px) {

}
@media screen and (max-width:767px) {
  #bizOther figure{
    width:33%;
  }
  #bizOther figure img{
    height:10rem;
  }
  #bizOther .biz-p{
    width:60%;
	  margin:0;
  }
}



/* ---------------------------------------------------
| ボタン
--------------------------------------------------- */
.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:2rem auto 0 !important;
  }
}