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


/* WireFrame */
#container { padding-bottom: 12em; }
footer { height: 12em; }
@media only screen and (max-width: 680px) and (orientation: portrait) {
  #container { padding-bottom: 0; }
	footer { height: auto; position: relative; }
}


/* Footer Menu */
#fmenu { padding: .8em 0; border-top: solid 5px #05A; }
#fmenu ul { width: 94%; max-width: 900px; margin: 0 auto; display: flex; justify-content: space-between; }
#fmenu ul li { font-size: 105%; line-height: 1.2; font-weight: bold; width: 24%; }
#fmenu ul li a { text-align: center; color: #FFF; padding: .6em 0; display: block; }
#fmenu ul li a:hover { opacity: .8; }
#fmenu ul li#fmenu1 a { background: #66CCEE; }
#fmenu ul li#fmenu2 a { background: #FFAA55; }
#fmenu ul li#fmenu3 a { background: #B1D070; }
#fmenu ul li#fmenu4 a { background: #ED7B86; }
@media only screen and (max-width: 768px) {
  #fmenu ul li { font-size: 93%; line-height: 1.2; }
}
@media only screen and (max-width: 680px) {
  #fmenu ul { flex-wrap: wrap; }
  #fmenu ul li { width: 49%; }
  #fmenu ul li#fmenu1, #fmenu ul li#fmenu2 { padding-bottom: 2%; }
}


/* Common */
header { box-shadow: none; }
#intro-column h1, #contents h1 { font-size: 150%; line-height: 1.2; font-weight: bold; text-align: center; color: #FFF; margin-bottom: 50px; padding: .5em 0; position: relative; }
#intro-column h1 strong, #contents h1 strong { width: 94%; max-width: 700px; margin: 0 0 -50px -350px; display: block; position: absolute; left: 50%; bottom: 0; }
#intro-column h1 strong img, #contents h1 strong img { width: 100%; height: auto; }
.column { width: 94%; max-width: 700px; margin: 0 auto; padding-bottom: 3em; zoom: 1; overflow: hidden; }
.column:after { content: ""; clear: both; display: block; }
@media only screen and (max-width: 680px) {
  #intro-column h1, #contents h1 { margin-bottom: 0; }
  #intro-column h1 strong, #contents h1 strong { display: none; }
}
