@charset "UTF-8";

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 10px; }
body { color: #111; font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif; font-size: 1.8rem; line-height: 1.6; -webkit-text-size-adjust: 100%; }
img { border: 0; vertical-align: top; transition: all .3s ease; -ms-interpolation-mode: bicubic; }
button { background: transparent; border: none; appearance: none; cursor: pointer; outline: none; }
a { transition: all .3s ease; }
a:link { color: #; text-decoration: none; }
a:visited { color: #; text-decoration: none; }
a:hover { color: #; text-decoration: underline; }
a:hover img { opacity: 0.8; }

/* --------------------------------------------------
  汎用クラス
-------------------------------------------------- */

.d-block { display: block; }
.d-flex { display: flex; }
.d-none { display: none; }
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.clearfix::after { content: ''; display: block; clear: both; }

/* --------------------------------------------------
  グローバルヘッダ
-------------------------------------------------- */

#globalHeader { background: #000; }
#globalHeader .inner { margin: 0 auto; padding: 50px 10px; max-width: 1000px; text-align: center; }
#globalHeader h1 { color: #fff; font-size: 2.8rem; }

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

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

/* --------------------------------------------------
  パンくず
-------------------------------------------------- */

#path { padding: 20px; background: #f4f4f4; }
#path .inner { margin: 0 auto; max-width: 1000px; font-size: 1.6rem; }
#path span {}
#path strong { font-weight: normal; }

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

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

/* --------------------------------------------------
  メイン
-------------------------------------------------- */

main { margin: 0 auto; padding: 50px 10px; max-width: 1000px; display: block; }
main section {}
main h2 { margin-bottom: 30px; padding-left: 10px; border-left: solid 4px #000; font-size: 2.4rem; }
main p { margin: 2rem 0; }
main ul, main ol { margin: 2rem 0 2rem 3rem; }
main table { margin: 2rem 0; width: 100%; border-collapse: collapse; }
main th, main td { padding: 20px; border: solid 1px #ccc; }
main th { background: #f4f4f4; }
main input[type="text"], main input[type="password"] { padding: 10px; border: solid 1px #ccc; font-size: 100%; }
main select { font-size: 100%; }
main #button { margin: 30px 0; display: flex; align-items: center; justify-content: center; gap: 20px; }
main #button button { padding: 10px; width: 200px; font-size: 100%; text-align: center; transition: all .3s ease; }
main #button button[type="submit"] { background: #000; border: solid 1px #000; color: #fff; }
main #button button[type="submit"]:hover { background: #fff; color: #000; }
main #button button[type="button"] { background: #666; border: solid 1px #666; color: #fff; }
main #button button[type="button"]:hover { background: #fff; color: #666; }
main .w50 { width: 50%; }
main .w100 { width: 100%; }
main label.error { margin-top: 10px; color: #f00; font-size: 1.6rem; display: block; }

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

@media screen and (max-width: 767px) {
  main table { border-top: solid 1px #ccc; }
  main col  { width: 100%; }
  main th, main td { width: 100%; display: block; }
  main th { border-width: 0 1px; }
  main #button { flex-direction: column; }
  main #button button { padding: 20px; width: 90%; }
  main .w50 { width: 100%; }
}

/* --------------------------------------------------
  グローバルフッタ
-------------------------------------------------- */

#globalFooter {}
#globalFooter .inner { margin: 0 auto; padding: 20px 10px; max-width: 1000px; text-align: center; }
#globalFooter p {}

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

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