@charset "utf-8";
/* =============================================================================
▼ tag > form
==============================================================================*/
button,
input,
select,
textarea {
    font-family: inherit;
    font-size: 1rem;
}

body textarea {
    font-size: 1.1rem;
}

input[type="text"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="email"],
input[type="date"],
input[type="time"],
input[type="number"],
input[type="range"],
input[type="color"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
select,
textarea {
    width: auto;
}

html form input,
html form textarea,
html form select,
html button {
    background: #fff;
    border: solid 1px #aaa;
    -webkit-box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.5);
    box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.5);
    font-family: inherit;
    margin: 0.25em 0;
    padding: 0.25em 0.5em;
    vertical-align: middle;
    font-size: 0.9em;
}

html form ul li + li {
    margin-left: 1rem;
}

/* .img_chk : 画像のラジオボタンとチェックボックスを使用 */
#wpmem_login input[type="radio"],
#wpmem_login input[type="checkbox"],
#wpmem_reg input[type="radio"],
#wpmem_reg input[type="checkbox"],
form.img_chk input[type="radio"],
form.img_chk input[type="checkbox"] {
    display: none;
}

#wpmem_login input[type="radio"] + label,
#wpmem_login input[type="checkbox"] + label,
#wpmem_reg input[type="radio"] + label,
#wpmem_reg input[type="checkbox"] + label,
form.img_chk input[type="radio"] + label,
form.img_chk input[type="checkbox"] + label {
    position: relative;
    display: inline-block;
    padding: 0.5rem 1rem 0.3rem 1.4rem;
}

#wpmem_login input[type="radio"] + label:before,
#wpmem_login input[type="checkbox"] + label:before,
#wpmem_reg input[type="radio"] + label:before,
#wpmem_reg input[type="checkbox"] + label:before,
form.img_chk input[type="radio"] + label:before,
form.img_chk input[type="checkbox"] + label:before {
    margin: auto 0;
    display: block;
    position: absolute;
    content: "";
    width: 1.2rem;
    height: 1.2rem;
    top: 0;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
#wpmem_login input[type="radio"] + label:before,
#wpmem_reg input[type="radio"] + label:before,
form.img_chk input[type="radio"] + label:before {
    background-image: url("./images/iconmonstr-radio.png");
}

#wpmem_login input[type="radio"]:checked + label:before,
#wpmem_reg input[type="radio"]:checked + label:before,
form.img_chk input[type="radio"]:checked + label:before {
    background-image: url("./images/iconmonstr-radio_check.png") !important;
}

#wpmem_login input[type="checkbox"] + label:before,
#wpmem_reg input[type="checkbox"] + label:before,
form.img_chk input[type="checkbox"] + label:before {
    background-image: url("./images/iconmonstr-square.png");
}

#wpmem_login input[type="checkbox"]:checked + label:before,
#wpmem_reg input[type="checkbox"]:checked + label:before,
form.img_chk input[type="checkbox"]:checked + label:before {
    background-image: url("./images/iconmonstr-square_check.png") !important;
}

/* =============================================================================
▼ 設定 > サイズ
==============================================================================*/
/* 自動リサイズ */
img,
object,
embed,
video {
    max-width: 100%;
    height: auto;
}

/* 横サイズパーセント */
.per5 {
    width: 5% !important;
}
.per10 {
    width: 10% !important;
}
.per20 {
    width: 20% !important;
}
.per30 {
    width: 30% !important;
}
.per35 {
    width: 35% !important;
}
.per40 {
    width: 40% !important;
}
.per45 {
    width: 45% !important;
}
.per50 {
    width: 50% !important;
}
.per60 {
    width: 60% !important;
}
.per70 {
    width: 70% !important;
}
.per80 {
    width: 80% !important;
}
.per90 {
    width: 90% !important;
}
.full {
    width: 100% !important;
}
.width_3em {
    width: 3em !important;
}
.width_4em {
    width: 4em !important;
}
.width_5em {
    width: 5em !important;
}
.width_12em {
    width: 12em !important;
}

/* 文字サイズ */
.text8 {
    font-size: 0.8em;
}
.text9 {
    font-size: 0.9em;
}
.text10 {
    font-size: 1em;
}
.text11 {
    font-size: 1.1em;
}
.text12 {
    font-size: 1.2em;
}
.text13 {
    font-size: 1.3em;
}
.text14 {
    font-size: 1.4em;
}
.text15 {
    font-size: 1.5em;
}
.text16 {
    font-size: 1.6em;
}
.text17 {
    font-size: 1.7em;
}
.text18 {
    font-size: 1.8em;
}
.text19 {
    font-size: 1.9em;
}
.text20 {
    font-size: 2em;
}
.text21 {
    font-size: 2.1em;
}
.text22 {
    font-size: 2.2em;
}
.text23 {
    font-size: 2.3em;
}
.text24 {
    font-size: 2.4em;
}
.text25 {
    font-size: 2.5em;
}
.text26 {
    font-size: 2.6em;
}

/* =============================================================================
▼ 設定 > リセット解除
==============================================================================*/
#container,
#header,
#wrapper,
#nav,
#footer {
    display: block;
}

/* table */
table th {
    vertical-align: middle;
}

/* =============================================================================
▼ tag > list
==============================================================================*/
ol,
ul:not(.disc):not(.disp-flex):not(.disp-ib) {
    margin-left: 1.5em;
}
ol,
ul:not(.disc):not(.disp-flex):not(.disp-ib) > li {
    margin: 1rem auto;
}

p + dl,
p + ol,
p + ul.disc,
ul + ul,
ul.disc + p,
ul.disc + .table,
ul + ol,
ul + dl,
ol + ol,
ol + p,
ol + .table,
ol + ul,
ol + dl,
dl + dl,
dl + p,
dl + .table,
dl + ol,
dl + ul {
    margin-top: 1rem;
}

dl dd {
    padding-left: 1.5rem;
}

ol {
    margin: 1rem 1.5rem;
}
ol li {
    margin-left: 0.6rem;
    padding: 0.5rem 0 0.5rem 0.25rem;
    list-style-type: decimal; /* 算用数字 */
}

/* mark */
.disc {
    list-style-type: disc !important;
    margin-left: 0.5rem;
    padding-left: 1.5rem;
}

/* =============================================================================
▼ tag > display
==============================================================================*/
.block {
    display: block;
}

.disp-ib {
    font-size: 0 !important;
    letter-spacing: -1em !important;
    word-spacing: -1em !important;
}
:root .disp-ib {
    font-size: 0.1px;
    letter-spacing: -1px;
    word-spacing: -1px;
}
.disp-ib > * {
    display: inline-block !important;
    font-size: 1rem;
    letter-spacing: normal;
    word-spacing: normal;
    *display: inline;
    *zoom: 1;
    vertical-align: top;
}

/* 疑似テーブル : .non_responsiveをつけるとテーブルのまま */
.table {
    margin-right: auto;
    margin-left: auto;
    display: table;
}
.table.non_responsive {
    display: table !important;
}

.table .row {
    display: table-row;
}
.table.non_responsive .row {
    display: table-row !important;
}

.table .cell {
    display: table-cell;
    vertical-align: top;
}
.table.non_responsive .cell {
    display: table-cell !important;
}

.table.pad .row > .cell,
.table.pad > .cell {
    padding: 2.5px 5px;
}

.table .row > .cell:first-child {
    padding-left: 0;
}

.table.tb-fix {
    table-layout: fixed;
}

/* =============================================================================
▼ flex [.disp-flex]
============================================================================= */
ul.disp-flex {
    list-style-type: none;
}
.disp-flex {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;

    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-flex-pack: justify;
    -moz-flex-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    -moz-justify-content: space-between;
    justify-content: space-between;

    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start;

    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

/* align-items:要素全体の中央を基準 */
.disp-flex.align-items_center {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
}

.disp-flex > .flex-item.flex-grow {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex-grow: 1;
    -moz-flex-grow: 1;
    flex-grow: 1;
}

/*
  area_flexの子要素に対してvertical-alignのような扱いをさせる
.area_flex > *{
	-webkit-box-align:center;
	-moz-box-align:center;
	-ms-flex-align:center;
	-webkit-align-items:center;
	-moz-align-items:center;
	align-items:center;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-webkit-flex-pack:center;
	-moz-flex-pack:center;
	-ms-flex-pack:center;
	-webkit-justify-content:center;
	-moz-justify-content:center;
	justify-content:center;
  }
*/
/* .disp-flexの子要素のうち、可変領域に指定 */
.disp-flex > .variable {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    flex: 1;
}

/* =============================================================================
▼ tag > 配置
==============================================================================*/
.posi-abs {
    position: absolute;
}
.posi-rel {
    position: relative;
}

.align-left {
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
}
.align-center {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}
.align-right {
    margin-left: auto !important;
    margin-right: 0 !important;
    text-align: right !important;
}

/* .tableじゃなければブロック属性を付与 */
.align-left:not(.table) {
    display: block;
}
.align-center:not(.table) {
    display: block;
}
.align-right:not(.table) {
    display: block;
}

.ver-top {
    vertical-align: top !important;
}
.ver-bottom {
    vertical-align: bottom !important;
}
.ver-middle {
    vertical-align: middle !important;
}