@charset "UTF-8";

/* pc -------------------------------------------------------------------------------------*/
@media screen and (min-width: 641px) {

/* サブイメージ */
.sub_image {
width: 100%;
height: 843px;
overflow: hidden;
position: relative;
}

.sub_image img {
width: 100%;
/*height: 100%;*/
object-fit: cover;
object-position: center; /* ★ 常に中央 */
}


/*タイトル部分ここから*/
.titlebar__inner{
  width: 1040px;          /* 指示：左右1040px */
/*  margin: 0 auto;*/
  padding: 18px 20px;
  display: flex;              /* flexbox */
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  position: absolute;
  top:0;
  left: 50%;            /* 親の左から 50% の位置へ */
  transform: translate(-50%, 0%); /* 自身の幅と高さの半分だけ戻す */
}

/*.titlebar__inner img{
width: 21px;
height: 21px;
}*/

/* 左：タイトル（左寄せ＋下線） */
.titlebar__title{
  margin: 0;
  color: #2f6f90;
  font-weight: 800;
  font-size: 38px;
  letter-spacing: .04em;
  line-height: 1;
}
/*タイトル部分ここまで*/

/*方針部分ここから*/
.houshin {
text-align: center;
  position: absolute;
  top:26%;
  left: 50%;            /* 親の左から 50% の位置へ */
  transform: translate(-50%, -50%); /* 自身の幅と高さの半分だけ戻す */
}

.houshin img {
width: 172px;
height: auto;
}

.houshin p {
font-weight: 700;
line-height: 2em;
margin-top: 2.3em;
font-size: 140%;
font-family: "BIZ UDPMincho", "Hiragino Mincho ProN", "MS Mincho", serif;
}

/*方針部分ここまで*/

/*---------------------------------------------------------*/

/* 共通 */
section {
border-top: 5px solid #99bed6;
  max-width:100%;
  margin:0 auto 80px;
  padding:0;
}

.section-title{
  text-align:center;
  font-size:24px;
  letter-spacing:.2em;
  color:#669ec2;
  margin:24px 0;
}

/*---------------------------------------------------------*/

.box_1 {
width: 100%;
position: relative;
line-height: 1.7em;
font-size: 95%;
font-weight: 700;
}

.txt_1 {
width: 45em;
  position: absolute;
  top:50%;
  right: 0;
  transform: translateY(-50%); /* 自身の幅と高さの半分だけ戻す */
}

.txt_2 {
width: 45em;
  position: absolute;
  top:50%;
  left: 0;
  transform: translateY(-50%); /* 自身の幅と高さの半分だけ戻す */
}

.txt_1,
.txt_2 {
text-shadow:
    0 0 10px rgba(255,255,255,1.0),
    0 0 10px rgba(255,255,255,1.0);
/*水平方向オフセット 縦方向オフセット ぼかし RGB 濃度（アルファ）*/
/*ぼかしを重ねることで輪郭を厚く見せられる。*/
}

.txt_1 p,
.txt_2 p
{
margin-bottom: 0.8em;
}

/* ● を before で */
.txt_1 li,
.txt_2 li{
  position: relative;
  padding: 0 0 0 1.4em;
  margin: 0.4em 0;
  line-height: 1.4;
}

.txt_1 li::before,
.txt_2 li::before{
  content: "●";
  position: absolute;
  left: 0;
  top: 0;
  color: #005d99;
}

.txt_3 {
text-align: center;
margin-top: 5em;
}

.txt_3 p {
font-size: 130%;
margin-top: 1.8em;
line-height: 2em;
font-family: "BIZ UDPMincho", "Hiragino Mincho ProN", "MS Mincho", serif;
font-weight: 700;
}

.txt_3 img {
width: 172px;
}

.space {
height: 30px;
}

}


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

/* サブイメージ */
.sub_image {
width: 100%;
height: auto;
overflow: hidden;
position: relative;
}

.sub_image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center; /* ★ 常に中央 */
}

/*タイトル部分ここから*/
.titlebar__inner{
  width: 100%;
/*  margin: 0 auto;*/
  padding: 0.5em 0 0 0.9em;
  display: flex;              /* flexbox */
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  position: absolute;
  top:0;
  left: 0;            /* 親の左から 50% の位置へ */
/*  transform: translate(-50%, 0%); /* 自身の幅と高さの半分だけ戻す */
}

/*.titlebar__inner img{
width: 21px;
height: 21px;
}*/

/* 左：タイトル（左寄せ＋下線） */
.titlebar__title{
  margin: 0;
  color: #2f6f90;
  font-weight: 800;
  font-size: 6.5vw;
  letter-spacing: .04em;
  line-height: 1;
}
/*タイトル部分ここまで*/

/*方針部分ここから*/
.houshin {
text-align: center;
  position: absolute;
  width: 100%;
  top:50%;
  left: 50%;            /* 親の左から 50% の位置へ */
  transform: translate(-50%, -50%); /* 自身の幅と高さの半分だけ戻す */
}

.houshin img {
width: 172px;
height: auto;
}

.houshin p {
font-weight: 700;
line-height: 2em;
margin-top: 2em;
font-size: 110%;
font-family: "BIZ UDPMincho", "Hiragino Mincho ProN", "MS Mincho", serif;
text-shadow:
    0 0 10px rgba(255,255,255,1.0),
    0 0 10px rgba(255,255,255,1.0),
    0 0 10px rgba(255,255,255,1.0),
    0 0 10px rgba(255,255,255,1.0);
/*水平方向オフセット 縦方向オフセット ぼかし RGB 濃度（アルファ）*/
/*ぼかしを重ねることで輪郭を厚く見せられる。*/
}

.houshin .svg {
  width: 30%;
  margin: 0 auto;
}

/*方針部分ここまで*/

/*---------------------------------------------------------*/

/* 共通 */
section {
border-top: 5px solid #99bed6;
  max-width:100%;
  margin:0 auto 5em;
  padding:0;
}

.section-title{
  text-align:center;
  font-size:140%;
  letter-spacing:.1em;
  color:#669ec2;
  margin:0.7em 0;
}

/*---------------------------------------------------------*/

.box_1 {
width: 100%;
/*position: relative;*/
line-height: 1.7em;
font-size: 95%;
/*font-weight: 700;*/
}

.txt_1,
.txt_2
{
margin: 0.8em 0.5em 0 0.5em;
/*  position: absolute;
  top:50%;
  right: 0;
  transform: translateY(-50%); /* 自身の幅と高さの半分だけ戻す */
}

/*
.txt_2 {
width: 45em;
  position: absolute;
  top:50%;
  left: 0;
  transform: translateY(-50%); /* 自身の幅と高さの半分だけ戻す */
/*}*/

.txt_1 p,
.txt_2 p
{
margin-bottom: 0.8em;
}

/* ● を before で */
.txt_1 li,
.txt_2 li{
  position: relative;
  padding: 0 0 0 1.4em;
  margin: 0.4em 0;
  line-height: 1.4;
}

.txt_1 li::before,
.txt_2 li::before{
  content: "●";
  position: absolute;
  left: 0;
  top: 0;
  color: #005d99;
}

.txt_3 {
text-align: center;
margin-top: 5em;
}

.txt_3 p {
font-size: 105%;
margin-top: 1.8em;
line-height: 2em;
font-family: "BIZ UDPMincho", "Hiragino Mincho ProN", "MS Mincho", serif;
font-weight: 700;
}

.txt_3 .svg_2 {
  width: 45%;
  margin: 0 auto;
}

.space {
height: 3em;
}

}