@charset "UTF-8";
/* CSS Document */
/* ==========================================================================
下層ページ　CSR（社会貢献活動）
  ========================================================================== */
.csr .title_wrap {
  position: relative;
  padding: 90px 0;
}
.bg_fx_csr {
  background-image: url(images/csr_bk.jpg);
  background-position-y: 0;
}
.csr .title_wrap h2 {
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  color: #fff;
}
.csr .title_wrap .bk_txt {
  font-size: clamp(4.25rem, -0.343rem + 9.06vw, 6rem); /*68-96px, 811-1120px*/
  color: #323B75;
  letter-spacing: .1em;
  text-align: center;
  padding: 40px 0 0;
}
/*=============================================================
トップ
=============================================================*/
section#csr_top .outer {
  box-sizing: border-box;
  padding: 130px 0;
  position: relative;
  max-height: 600px;
  display: flex;
  align-items: center;
  background-image: url(images/top_bg.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 20% center;
  top: 0;
  left: 0;
  margin-bottom: 50px;
}
section#csr_top h2 {
  margin-top: 0px;
  font-size: 48px;
  color: #fff;
  font-weight: 500;
  line-height: 1.4em;
  text-align: center;
  margin-bottom: 50px;
}
section#csr_top h2 span {
  font-size: 36px;
  color: #fff;
  display: inline-block;
  margin-bottom: 20px;
}
section#csr_top p {
  font-size: 20px;
  color: #fff;
  text-align: left;
  line-height: 1.8em;
  width: 70%;
  margin: 0 auto;
}
section#support,
section#mind{
  margin-bottom: 80px;
}
section#support p {
  font-size: 20px;
  text-align: center;
  line-height: 2.2em;
}
section#support .box1 {
  background-image: url("images/box_heart.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 40% auto;
  padding: 50px 0 120px;
}
section#support .box1 h3 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 48px;
  border-bottom: solid 2px #0066cb;
  text-align: center;
  color: #0066cb;
  padding-bottom: 16px;
  margin-bottom: 40px;
  font-weight: 600;
}
section#support .box1 h3 span {
  display: inline-block;
  width: 7%;
  height: auto;
}
section#support .box2 {
  margin-bottom: 50px;
}
section#support .box2 .ac {
text-align: center;
}
section#support .box2 h4 {
  font-size: 30px;
  text-align: center;
  color: #0066cb;
  border-bottom: solid 1px #0066cb;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
section#support .box2 h4 span {
  background-image: url("images/link_icon.png");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 6%;
  padding: 0 40px;
}
section#support .box2 h4 a {
  text-decoration: underline;
  text-decoration-color: #0066cb;
  text-decoration-thickness: 1px;
}
section#support .box2 p {
  text-align: left;
  margin-bottom: 50px;
}
section#support .box2 img {
  margin-bottom: 50px;
}
section#mind dl {
margin-bottom: 50px;
}
section#mind dl dt {
margin: 0;
background-color: #0066cb;
border-radius: 40px;
font-size: 30px;
text-align: center;
color: #fff;
padding: 16px 0;
margin-bottom: 20px;
background-image: url("images/point.png"),url("images/point.png");
background-repeat: no-repeat,no-repeat;
background-position: right 16px center,left 16px center;
background-size: 3%;
}
section#mind dl dd {
font-size: 18px;
text-align: left;
line-height: 2.2em;
margin: 0;
}


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

section#csr_top .outer {
margin-top: 0;
}
section#csr_top .outer {
  box-sizing: border-box;
  padding: 50px 0;
  position: relative;
  max-height: 600px;
  display: flex;
  align-items: center;
  background-image: url(images/top_bg.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 20% center;
  top: 0;
  left: 0;
  margin-bottom: 50px;
}

.inner {
width: 90%;
margin: 0 auto;
}

.bg_fx_csr {
    background-image: url(images/csr_bk.jpg);
    aspect-ratio: 3 / 1;
    margin-top: 5vw;
    display: flex;
    align-items: center;
    justify-content: center;
}
   .bg_fx_csr .title_wrap {
        position: relative;
        width: 100%;
}
        .bg_fx_csr h2 {
            color: #fff;
            text-align: center;
            position: relative;
            z-index: 2;
        }

       .bg_fx_csr  .bk_txt {
            width: 100%;
            position: absolute;
            color: #323B75;
            letter-spacing: .1em;
            text-align: center;
            left: 0;
            top: 0;
            font-size: clamp(1.75rem, 0.143rem + 7.14vw, 3rem);/*28-48px, 360px-640*/
        }


section#csr_top h2 {
  font-size: 24px;
}        
section#csr_top h2 span {
font-size: 16px;
}  
section#csr_top p {
  font-size: 14px;
  color: #fff;
  text-align: left;
  line-height: 1.8em;
  width: 100%;
  margin: 0 auto;
} 
section#support,
section#mind{
  margin-bottom: 0px;
}
section#support .box1 {
  background-image: url("images/box_heart.png");
  background-repeat: no-repeat;
  background-position: center top 20px;
  background-size: 100% auto;
  padding: 20px 0 50px;
  margin-bottom: 40px;
}
section#support .box1 h3 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  border-bottom: solid 2px #0066cb;
  text-align: center;
  color: #0066cb;
  padding-bottom: 16px;
  margin-bottom: 20px;
  font-weight: 600;
  line-height: 1.4em;
}
section#support .box1 h3 span {
  display: inline-block;
  width: 20%;
  height: auto;
}
section#support p {
  font-size: 14px;
}

section#support .box2 h4 {
font-size: 20px;
}
section#support .box2 p {
margin-bottom: 20px;
}

section#mind dl dt {
margin: 0;
background-color: #0066cb;
border-radius: 40px;
font-size: 20px;
text-align: center;
color: #fff;
padding: 16px 0;
margin-bottom: 20px;
background-image: url("images/point.png"),url("images/point.png");
background-repeat: no-repeat,no-repeat;
background-position: right 16px center,left 16px center;
background-size: 6%;
}
section#mind dl dd {
font-size: 14px;
text-align: left;
line-height: 1.8em;
margin: 0;
}


        
    }


/*=============================================================
CSR
=============================================================*/
.csr {
  section {
    .outer {
      margin-top: 80px;
      @media print, screen and (min-width: 641px) and (max-width: 810px) {
        margin-top: 50px;
      }
      @media print, screen and (min-width: 360px) and (max-width: 640px) {
        margin-top: 40px;
      }
    }
    .inner {
      width: 1200px;
      margin-left: auto;
      margin-right: auto;
      @media print, screen and (max-width: 1300px) {
        width: 90%;
      }
    }
    p, a, span, li, dt, dd, h2, h3, h4, figcaption {
      font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
      color: #222;
      line-height: 1;
    }
    .baseFontGothic {
      font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
    }
   
        }
      }
      


