@charset "utf-8";
/* CSS Document */

/* トレインワンーフォント */
p {
  font-family: "Train One", system-ui;
  font-weight: 400;
  font-style: normal;
}

.londrina-shadow-regular {
  font-family: "Londrina Shadow", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* バックの背景画像 */
body {
  background-image: url(../img/port-back05.png);
  background-repeat: repeat;
    width: 100%;
    height: 100%;
     background-size: cover;        
    background-repeat: no-repeat; 
    background-position: center;
        position: relative;
        z-index: 5000;

  background-attachment: fixed; /* これが重要！ */
}

a {
  /* 通常時の下線を消す */
  text-decoration: none;
}




/* ファーストビュー */
.firstview{
  display: flex;
  justify-content: center;
}

.firstview-content {
  margin-top: 20%;
}


/* グローバルナビ */
ul {
  list-style-type: none;
}

.nav-box0{
    display: flex;
    justify-content: center;
    margin-top: 10%;
} 

/* あいさつ */
.greeting{
  display: flex;
  justify-content: center;
  padding: 20%;
}

/* タイトル */
.title-about{
  display: flex;
  justify-content: center;
  padding: 5%;
}

/*画像をまんなかに置く */
.center-img{
  display: flex;
  justify-content: center;
}

/* モットー */
.title-motto{
  display: flex;
  justify-content: center;
  padding-top: 20%;
  padding-bottom: 3%;
}

/* webデザイン */
.image-container {
  /* 子要素を重ねるための基準にする */
  position: relative;
  /* 必要に応じて、画像のサイズを調整 */
  width: 69%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 8%;
}

.background-img {
  /* 親要素の100%の幅にする */
  width: 100%;
  /* 念のため、表示方法をブロック要素に指定 */
  display: block;
}

.overlay-img {
  /* 親要素の左上を基準に、絶対位置で配置する */
  position: absolute;
  /* 重ねる位置を調整する */
  top: 11%;
  left:4.51%;
  /* 必要に応じて画像のサイズを調整 */
  width: 50%;
}

/* webタイトル */
.title-webdesign{
  display: flex;
  justify-content: center;
  padding-top: 20%;
  padding-bottom: 5%;
}


/* グラフィックタイトル */
.title-graphic{
  display: flex;
  justify-content: center;
  padding-top: 15%;
  padding-bottom: 5%;
}





/* フッター */
.footer-box0{
    display: flex;
    justify-content: center;
}
.footer-about{
    margin-right: 30px;
}
.footer-web{
    margin-right: 25px;
}

footer p{
    color: #e2e0df;
    text-align: center;
    padding: 7%;
    padding-bottom: 2%;
}

