/*=========================================================
common
=========================================================*/

*{
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  font-size: 16px;
  list-style: none;
  text-decoration: none;
}

	head,
  style,
  script,
  meta,
  title,
  link{
  display: none;
}


/*=========================================================
width
=========================================================*/
header,
header img,
h2,
h2 a,
h2 img,
#information,
#entry form,
#entry div dl,
#entry div dl dd input,
#entry div dl dd select,
#entry div dl dd textarea,
#entry_btn,
#entry.thanks .message h2,
#entry.thanks .message p,
#entry.thanks .message a,
footer{
  width: 100%;
}


#information p,
#information ul,
#entry .entry_box,
#entry .entry_caution{
  width: 45%;
}

#entry div dl dt{
  width: 20%;
}

#entry .entry_box dl:nth-child(4) dd select,
#entry.thanks .message{
  width: 40%;
}

#entry div dl dd{
  width: 80%;
}

#information ul li{
  width: 31%;
}

#entry_btn input{
  width: 25%;
}

#entry .entry_box dl:nth-child(4) dd p,
header h1{
  width: 10%;
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
  #information p,
  #information ul,
  #entry div dl dt,
  #entry div dl dd{
    width: 100%;
  }

  #entry.thanks .message{
    width: 80%;
  }


  #information ul li{
  width: 29.333%;
  }

  #entry_btn input{
    width: 30%;
  }

  header h1{
    width: 20%;
  }
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
  #information p,
  #information ul,
  #entry div dl dt,
  #entry div dl dd{
    width: 100%;
  }

  #entry.thanks .message{
    width: 80%;
  }

  #information ul li{
  width: 29.333%;
  }

  #entry_btn input{
    width: 40%;
  }

  header h1{
    width: 20%;
  }
}

@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
  #information p,
  #information ul,
  #entry div dl dt,
  #entry div dl dd,
  #entry .entry_box,
  #entry .entry_caution{
    width: 100%;
  }

  #entry.thanks .message{
    width: 88%;
  }

  header h1{
    width: 40%;
  }

    #entry_btn input{
    width: 46%;
  }
}

/*=========================================================
height
=========================================================*/
header img,
h2 img{
  height: auto;
}

select,
input,
textarea{
  height: 100%;
}

#entry .entry_box dl{
  height: 60px;
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
#entry .entry_box dl{
    height: 100px;
  }
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
#entry .entry_box dl{
    height: 130px;
  }
}

@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
  #entry .entry_box dl{
    height: 110px;
  }

  #entry .entry_caution ul{
    height: 300px;
  }
}


/*=========================================================
justify-content
=========================================================*/
#entry form{
  justify-content: space-between;
}

#information ul li,
#entry .entry_box dl:nth-child(4) dd p,
#entry_btn,
#entry.thanks .message h2,
#entry.thanks .message a,
footer{
  justify-content: center;
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
  #information p{
  justify-content: center;
  }
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
    #information p{
    justify-content: center;
  }
}

/*=========================================================
align-items
=========================================================*/
header,
header img,
header p,
#information ul li,
h3,
h3 span,
#entry .entry_box dl dt,
#entry .entry_box dl dt span,
#entry .entry_box dl dd,
#entry .entry_box dl dd p{
  align-items: center;
}

#entry form{
  align-items: flex-start;
}

/*=========================================================
margin
=========================================================*/
header p{
  margin-left: auto;
}

#entry.thanks .message{
  margin: 80px auto;
}

#information p,
#information ul,
#entry div{
  margin: 30px 2.5%;
}

h3 span,
#entry .entry_box dl dt span{
  margin-right: 8px;
}

h3,
#entry .entry_box dl,
#entry.thanks .message h2,
#entry.thanks .message p{
  margin-bottom: 20px;
}

#information ul li{
  margin: 0 1.1%;
}

#entry .entry_caution ul li{
  margin: 5px;
}

#entry .entry_caution p{
  margin-bottom: 30px 
}

#entry.confirm #entry_btn .btn.back{
  margin-right: 5%;
}


@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
  #information ul li{
    margin: 0 2%;
  }

  #entry .entry_box dl dt{
    margin-bottom: 10px;
  }

}


@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
  #information ul li{
    margin: 0 2%;
  }

  #entry .entry_box dl dt{
    margin-bottom: 10px;
  }

}


@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
  #information p,
  #information ul,
  #entry div{
    margin: 10px 5%;
  }

  #entry .entry_box dl dt{
    margin-bottom: 10px;
  }

  #entry .entry_box dl,
  #entry_btn input{
    margin-bottom: 20px;
  }

}


/*=========================================================
padding
=========================================================*/
header,
#entry .entry_caution ul,
footer,
#entry_btn input{
  padding: 20px;
}

#entry.thanks .message{
  padding: 50px;
}

h3 span,
select,
input,
textarea{
  padding: 10px;
}

#entry .entry_box dl dt span{
  padding: 2px 4px;
}


@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
  #information ul li{
    padding: 20px 0;
  }
}

@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
  #information ul li{
    padding: 20px 0;
  }
}

@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
  #information{
    padding-bottom: 30px;
  }
}


/*=========================================================
color
=========================================================*/
header p{
  color:dimgrey;
}

h3,
#information p,
#entry .entry_box dl dt,
#entry .entry_box dl dt span,
#entry .entry_box dl dd,
#entry .entry_box dl dd p,
#entry.confirm #entry_btn .btn.back{
  color: #fff;
}

#information ul li{
  color: #63A7EA;
}

h3 span,
#entry_btn input:hover,
#information ul .place{
  color: #000;
}

#entry_btn input{
  color: yellow;
}


/*=========================================================
background
=========================================================*/
#entry .entry_btn{
  background: #29ABE2;
}

body,
#information,
#entry{
  background: #0071BC;
}

#entry .entry_box dl dt span{
  background: #ED1E79;
}

#information ul li,
#entry .entry_box dl:nth-child(6) dt span,
#entry .entry_box dl:nth-child(7) dt span{
  background: #4786CF;
}

h3 span,
#entry_btn input:hover,
#information ul .place{
  background: yellow;
}

header,
footer,
#entry .entry_caution ul,
#entry.thanks .message{
  background: #fff;
}

#entry_btn input{
  background: #29ABE2;
}

#entry.confirm #entry_btn .btn.back{
  background: #aeaeae;
}

#entry.confirm #entry_btn .btn.back:hover{
  background: #717171;
}


/*=========================================================
font-size
=========================================================*/
header p,
#entry_btn input,
#entry.thanks .message h2{
  font-size: 160%;
}

h3,
h3 span,
#entry.thanks .message a{
  font-size: 120%;
}

#information p,
#information ul li{
  font-size: 140%;
}

#entry .entry_box dl dt span{
  font-size: 80%;
}


@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: landscape) {/*（ここにタブレット横用スタイルを記述）*/
  #information p{
    font-size: 200%;
  }
}


@media only screen and (min-device-width: 767px) and (max-device-width: 1366px) and (orientation: portrait) {/*（ここにタブレット縦用スタイルを記述）*/
  #information p{
    font-size: 152%;
  }
}

@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
    #information p{
    font-size: 70%;
  }

  header p,
  #entry .entry_caution ul li{
    font-size: 80%;
  }

  h3,
  h3 span{
    font-size: 100%;
  }

  #entry_btn input{
    font-size: 94%;
  }


  #entry.thanks .message h2{
    font-size: 170%;
  }

  h3,
  h3 span,
  #entry.thanks .message a{
    font-size: 110%;
  }

  
}


/*=========================================================
font-weight
=========================================================*/
#entry.thanks .message a{
  font-weight: bold;
}


/*=========================================================
border
=========================================================*/
select,
input,
textarea{
  border: none;
}


/*=========================================================
border-radius
=========================================================*/
#entry .entry_box dl dd,
select,
input,
textarea,
#entry .entry_box dl dt span{
  border-radius: 5px
}

#entry.thanks .message{
    border-radius: 10px
}

h3 span{
  border-radius: 50%;
}

#information ul li{
  border-top-left-radius: 10% 50%;
  border-top-right-radius: 10% 50%;
  border-bottom-left-radius: 10% 50%;
  border-bottom-right-radius: 10% 50%;
}


/*=========================================================
overflow
=========================================================*/

@media screen and (max-width: 767px) {/*（ここにモバイル用スタイルを記述）*/
  #entry .entry_caution ul{
    overflow: auto;
  }
}


/*=========================================================
outline
=========================================================*/
#entry.confirm input[type="text"],
#entry.confirm textarea{
  outline: none;
}