@charset "utf-8";

/*---------------------*/
/*       setting       */
/*---------------------*/
html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, header, hgroup, section, srticle, aside, footer, figure, figcaption, nav{
  margin:0;
  padding:0;
  font-size: 16px;
}

html {
  max-width: 640px;
  margin: 0 auto;
  position: relative; /* Fix for absolute positioning */
}

header, hgroup, section, srticle, aside, footer, figure, figcaption, nav{
  display:block;
}

img{
  border:0;
  vertical-align: top;
  width: 100%;
  max-width: 100%;
}

ul, ol{
  list-style:none;
}
footer{
	padding-bottom: 20%;
}

/*---------------------*/
/*         tab         */
/*---------------------*/
.acc_box.top{
	padding-bottom: 5%;
    background: #e6f7ff;
}

.acc_box input {
    display: none;
}

.acc_box label {
    display: block;
    cursor: pointer;
    transition: all 1s;
}

.acc_box .acc_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: .5s;
}

.acc_btn:checked + label + .acc_show {
    height: auto;
    opacity: 1;
}

.acc_btn + label .close {
    display: none;
}

.acc_btn:checked + label .open {
    display: none;
}

.acc_btn + label .close {
    display: none;
}

.acc_btn:checked + label .close {
    display: block;
}

/*---------------------*/
/*         btn         */
/*---------------------*/
.nav.fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 10;
    max-width: 640px;
    margin: auto;
}

.nav .container {
    display: flex;
    display: -webkit-flex;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
}