@charset "utf-8";
/****************************************
           Font Face
*****************************************/
@font-face {
    font-family: 'ackaisyo';
    font-style: normal;
    font-weight: 400;
    src: url(/css/font/ackaisyo.woff2) format('woff2'),
    url(/css/font/ackaisyo.woff) format('woff'),
    url(/css/font/ackaisyo.ttf) format('truetype');
    font-display: swap;
}

/****************************************
           Common Layout
*****************************************/
/* flexbox */
.flex{
    width: 100%;
    display:-ms-flexbox;
    display:-webkit-box;
    display:-webkit-flex;
    display:flex;
}
.flex.flexwrap{flex-wrap: wrap;}
.justify_l{justify-content: flex-start;}
.justify_r{justify-content: flex-end;}
.justify_c{justify-content: center;}
.justify_spb{justify-content: space-between;}
.justify_spa{justify-content: space-around;}

/****************************************
         setting
*****************************************/
html{min-height: 100vh;}
body{
    font-size: 14px;
    min-height: 100vh;
}
a{
    text-decoration:none!important;
    transition: all 0.3s;
    outline:none;
}
a:hover{}

li{list-style: none!important;}

.d-i{display:inline-block!important;}
.d-n{display:none!important;}

.clearfix:after {
    display:block;
    clear:both;
    height:0px;
    visibility:hidden;
    content:".";
}
.clearfix {
    min-height: 1px;
}
* html .clearfix {
    height: 1px;
    height: auto;
    overflow: hidden;
}

.p-r{position:relative;}
.p-a{position:absolute;}
.p-f{position:fixed;}

/****************************************
        font/color
*****************************************/
.color_red{color:#C00}
.color_blue{color:#2679b5}
.font_alert{
    font-weight: bold;
    color:#C00
}

/****************************************
         size
*****************************************/
.f10{font-size:10px;}
.f11{font-size:11px;}
.f12{font-size:12px;}
.f14{font-size:14px;}
.f16{font-size:16px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f24{font-size:24px;}
.f28{font-size:28px;}
.f28{font-size:32px;}

.lh100{line-height:1em}
.lh120{line-height:1.2em}
.lh140{line-height:1.4em}
.lh150{line-height:1.5em}
.lh200{line-height:2em}

.tc{text-align:center!important;}
.tl{text-align:left!important;}
.tr{text-align:right!important;}

.w5{width:5%!important;}
.w10{width:10%!important;}
.w14{width:calc(100% / 7)!important;}
.w15{width:15%!important;}
.w16{width:calc(100% / 6)!important;}
.w20{width:20%!important;}
.w25{width:25%!important;}
.w30{width:30%!important;}
.w33{width:calc(100% / 3)!important;}
.w35{width:35%!important;}
.w40{width:40%!important;}
.w45{width:45%!important;}
.w50{width:50%!important;}
.w55{width:55%!important;}
.w60{width:60%!important;}
.w65{width:60%!important;}
.w66{width:calc(100% / 3 * 2)!important;}
.w70{width:70%!important;}
.w75{width:75%!important;}
.w80{width:80%!important;}
.w85{width:85%!important;}
.w90{width:90%!important;}
.w95{width:95%!important;}
.w100{width:100%!important;}


/****************************************
         margin/padding
*****************************************/
.ma{margin-right:auto;margin-left:auto;}

.m2{margin-top:2px;margin-bottom:2px;}
.m4{margin-top:4px;margin-bottom:4px;}
.m6{margin-top:6px;margin-bottom:6px;}
.m8{margin-top:8px;margin-bottom:8px;}
.m10{margin-top:10px;margin-bottom:10px;}
.m16{margin-top:16px;margin-bottom:16px;}
.m20{margin-top:20px;margin-bottom:20px;}
.m24{margin-top:24px;margin-bottom:24px;}
.m32{margin-top:32px;margin-bottom:32px;}

.ms2{margin-right:2px;margin-left:2px;}
.ms4{margin-right:4px;margin-left:4px;}
.ms6{margin-right:6px;margin-left:6px;}
.ms8{margin-right:8px;margin-left:8px;}
.ms10{margin-right:10px;margin-left:10px;}
.ms16{margin-right:16px;margin-left:16px;}
.ms20{margin-right:20px;margin-left:20px;}
.ms24{margin-right:24px;margin-left:24px;}
.ms32{margin-right:32px;margin-left:32px;}

.mt2{margin-top:2px!important;}
.mt4{margin-top:4px!important;}
.mt6{margin-top:6px!important;}
.mt8{margin-top:8px!important;}
.mt10{margin-top:10px!important;}
.mt16{margin-top:16px!important;}
.mt20{margin-top:20px!important;}
.mt24{margin-top:24px!important;}
.mt32{margin-top:32px!important;}

.mb2{margin-bottom:2px!important;}
.mb4{margin-bottom:4px!important;}
.mb6{margin-bottom:6px!important;}
.mb8{margin-bottom:8px!important;}
.mb10{margin-bottom:10px!important;}
.mb16{margin-bottom:16px!important;}
.mb20{margin-bottom:20px!important;}
.mb20{margin-bottom:24px!important;}
.mb32{margin-bottom:32px!important;}

.pa2{padding:2px;}
.pa4{padding:4px;}
.pa6{padding:6px;}
.pa8{padding:8px;}
.pa10{padding:10px;}
.pa16{padding:16px;}
.pa20{padding:20px;}
.pa24{padding:24px;}
.pa32{padding:32px;}

.p2{padding-top:2px;padding-bottom:2px;}
.p4{padding-top:4px;padding-bottom:4px;}
.p6{padding-top:6px;padding-bottom:6px;}
.p8{padding-top:8px;padding-bottom:8px;}
.p10{padding-top:10px;padding-bottom:10px;}
.p16{padding-top:16px;padding-bottom:16px;}
.p20{padding-top:20px;padding-bottom:20px;}
.p24{padding-top:24px;padding-bottom:24px;}
.p32{padding-top:32px;padding-bottom:32px;}

.ps2{padding-left:2px;padding-right:2px;}
.ps4{padding-left:4px;padding-right:4px;}
.ps6{padding-left:6px;padding-right:6px;}
.ps8{padding-left:8px;padding-right:8px;}
.ps10{padding-left:10px;padding-right:10px;}
.ps16{padding-left:16px;padding-right:16px;}
.ps20{padding-left:20px;padding-right:20px;}
.ps24{padding-left:24px;padding-right:24px;}
.ps32{padding-left:32px;padding-right:32px;}

.pt2{padding-top:2px!important;}
.pt4{padding-top:4px!important;}
.pt6{padding-top:6px!important;}
.pt8{padding-top:8px!important;}
.pt10{padding-top:10px!important;}
.pt16{padding-top:16px!important;}
.pt20{padding-top:20px!important;}
.pt24{padding-top:24px!important;}
.pt32{padding-top:32px!important;}

.pb2{padding-bottom:2px!important;}
.pb4{padding-bottom:4px!important;}
.pb6{padding-bottom:6px!important;}
.pb8{padding-bottom:8px!important;}
.pb10{padding-bottom:10px!important;}
.pb16{padding-bottom:16px!important;}
.pb20{padding-bottom:20px!important;}
.pb20{padding-bottom:24px!important;}
.pb32{padding-bottom:32px!important;}

.space {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 12px 0
}

[class*=vspace-] {
    display: none
}

.space-32,[class*=vspace-32] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 32px 0 31px
}

.space-30,[class*=vspace-30] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 30px 0 29px
}

.space-28,[class*=vspace-28] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 28px 0 27px
}

.space-26,[class*=vspace-26] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 26px 0 25px
}

.space-24,[class*=vspace-24] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 24px 0 23px
}

.space-22,[class*=vspace-22] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 22px 0 21px
}

.space-20,[class*=vspace-20] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 20px 0 19px
}

.space-18,[class*=vspace-18] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 18px 0 17px
}

.space-16,[class*=vspace-16] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 16px 0 15px
}

.space-14,[class*=vspace-14] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 14px 0 13px
}

.space-12,[class*=vspace-12] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 12px 0 11px
}

.space-10,[class*=vspace-10] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 10px 0 9px
}

.space-8,[class*=vspace-8] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 8px 0 7px
}

.space-6,[class*=vspace-6] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 6px 0 5px
}

.space-4,[class*=vspace-4] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 4px 0 3px
}

.space-2,[class*=vspace-2] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 2px 0 1px
}

.space-0,[class*=vspace-0] {
    max-height: 1px;
    min-height: 1px;
    overflow: hidden;
    margin: 0
}

.material-icons.md-16 { font-size: 16px; }
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-22 { font-size: 22px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }
