@charset "UTF-8";
body{
  background-color: #ffffff;
  /*background-image: url(background1.jpeg);*/
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  font-family:'Avenir','Helvetica Neue','Helvetica','Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', '游ゴシック', 'Yu Gothic', 'ＭＳ Ｐゴシック', sans-serif;


}
header{
  margin-left: 0px;
  margin-right: 0px;
  width: 95%;
  padding: 30px 4% 10px;
  background-color: #0b30be;
  position:fixed;
  top: 0;
  display: flex;
  align-items: center;
}
header a{
  color: #ffffff;
}
footer{
  margin-left: auto;
  margin-right: auto;
  margin-bottom: auto;
  background-color:   #eaedf2;
  text-align: center;
  padding: 15px 0;
}
footer p{
  color: #000000;
  font-size: 0.875rem;
}

h1{
  margin: 0;
  padding: 0;
  font-size: 20px;
  text-align: center;
  color:000000;
}
h2{
  text-align: center;
  color:000000;
}
h3{
  text-align: center;
  color:000000;
}
h4{
  text-align: center;
}
h5{
  font-size: 37px;
  text-align: center;
  margin: 0;
}
h6{
  font-size: 50px;
  text-align: center;
  margin: 0;

}
p{
  font-size:16px;
  line-height: 1.7;
  text-align: center;
  color: #444444;
}
b{
  font-size:16px;
  line-height: 1.7;
  text-align: center;
  color: #000000;
}
a{
  text-decoration: none;
  color: #000000
}

ul{
  list-style: none;
  margin: 0;
  display: flex;
}
li{

  font-size: 14px;
}
nav{
  margin: 0 0 0 auto;
}


.pink{
  width:auto;
  height:auto;
  background-color: #F05F8D;
  color:#ffffff;
}

.red{
  width:auto;
  height:auto;
  background-color: #F30100;
  color:#ffffff;
}

.blue{
  width:auto;
  height:auto;
  background-color: #0b30be;
  color:#ffffff;
}
.blue2{
  width:auto;
  height:auto;
  background-color: #3EC0FF;
  color:#ffffff;
}
.lavender{
  width:auto;
  height:auto;
  background-color: #e6e6fa;
  color:#000000;
}

.gray{
  width:auto;
  height:auto;
  background-color: #eaedf2;
  color:#000000;
}

.textleft{
  margin-left: 250px;
  margin-right: 250px;
  font-size:16px;
  line-height: 1.7;
  text-align: left;
  color: #444444;
}
.textleft1{
  margin-left: 200px;
  margin-right: 200px;
  line-height: 1.7;
  text-align: left;
  color: #000000;
}
.textleft2{
  text-align: left;
}


.sns{
  width:160px;
  height:80px;
  margin:auto;
  text-align: center;
}

.Form {
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;

}
@media screen and (max-width: 480px) {
  .Form {
    margin-top: 40px;
  }
}
.Form-Item {
  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }
}
.Form-Item:nth-child(5) {
  border-bottom: 1px solid #ddd;
}
.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
  text-align: left;
}
.Form-Item-Label-center {
  width: 100%;

  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
}
.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label.isMsg {
    margin-top: 0;
  }
}
.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: #1e90ff;
  color: #fff;
  font-size: 14px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
}
.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Item-Textarea {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 216px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Btn {
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 280px;
  display: block;
  letter-spacing: 0.05em;
  background: #5bc8ac;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
}
@media screen and (max-width: 480px) {
  .Form-Btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 16px;
  }
}

.more {
  text-align: center;
  margin-top: 20px;
}
button {
  background-color: #5C6BC0;
  border: none;
  cursor: pointer;
  outline: none;
  color:#fff;
  padding: 0;
  line-height: 40px;
  width: 200px;
  border-radius: 20px;
}

ul.ddmenu {
   margin: 0px;               /* メニューバー外側の余白(ゼロ) */
   padding: 0px 0px 0px 15px; /* メニューバー内側の余白(左に15px) */
  /* background-color: #cc0000; /* バーの背景色(濃い赤色) */
}

/* -------------------------- */
/* ▼メインメニュー項目の装飾 */
/* -------------------------- */
ul.ddmenu li {
   width: 135px;           /* メニュー項目の横幅(125px) */
   display: inline-block;  /* ★1:横並びに配置する */
   list-style-type: none;  /* ★2:リストの先頭記号を消す */
   position: relative;    /*  ★3:サブメニュー表示の基準位置にする */
}

ul.ddmenu a {
   background-color: #00FFFF; /* メニュー項目の背景色(濃い赤色) */
   color: black;              /* メニュー項目の文字色(白色) */
   line-height: 35px;         /* メニュー項目のリンクの高さ(40px) */
   text-align: center;        /* メインメニューの文字列の配置(中央寄せ) */
   text-decoration: none;     /* メニュー項目の装飾(下線を消す) */
   font-weight: bold;         /* 太字にする */
   display: block;            /* ★4:項目内全域をリンク可能にする */
   margin: 0 0 0 15px;
   font-size: 16px;
}
ul.ddmenu a:hover {
   background-color: #0b30be; /* メニュー項目にマウスが載ったときの背景色(淡いピンク) */
   color: #eeeeee;            /* メニュー項目にマウスが載ったときの文字色(濃い赤色) */
}
ul.ddmenu ul {
   display: none;       /* ★1:標準では非表示にする */
   margin: 0px;         /* ★2:サブメニュー外側の余白(ゼロ) */
   padding: 0px;        /* ★3:サブメニュー内側の余白(ゼロ) */
   position: absolute;  /* ★4:絶対配置にする */
}

/* ---------------------------------- */
/* ▼サブメニューがある場合に開く処理 */   /* ※サブメニューが1階層しか存在しない場合の記述 */
/* ---------------------------------- */
ul.ddmenu li:hover ul {
   display: block;      /* ★5:マウスポインタが載っている項目の内部にあるリストを表示する */
}

p.nonhaku{
  line-height: 0;
}
Resources