/*
	Basic CSS Document
	produce by World Agent
	URL:http://worldagent.jp
	Theme Name: Original-Thema
	Author: worldagent
	Template: Original-Thema
*/

ol,
ul {
    list-style: none;
    padding: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


a:focus,
a:active,
a:visited {
    outline: none!important;
}

a,
a::before,
a::after {
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    transition: 0.25s;
}

body:hover {
    -webkit-transition: 0s;
    -moz-transition: 0s;
    -o-transition: 0s;
}

.nowrap{
    white-space: nowrap;
}
/*  pointer events  */

.sp_event_auto {
    pointer-events: none;
}


/*  overflow  */

.of_hidden {
    overflow: hidden
}

.of_auto {
    overflow: auto
}


/*  shadow  */

.bs_rb_lt {
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
}

.bs_rb {
    box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.3), 3px 3px 5px rgba(0, 0, 0, 0.2);
}

.bs_rb_dk {
    box-shadow: 3px 3px 7px 1px rgba(0, 0, 0, 0.8);
}

.bs_around_lt {
    box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.3);
}

.bs_around {
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2), 0 0 10px 4px rgba(0, 0, 0, 0.3);
}

.bs_around_dk {
    box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.8), 0 0 20px 0px rgba(0, 0, 0, 0.2);
}

.ts_rb {
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3), 3px 3px 6px rgba(0, 0, 0, .3);
}

.ts_rb_dk {
    text-shadow: 4px 4px 6px rgba(0, 0, 0, 0.8), 3px 3px 6px rgba(0, 0, 0, .8);
}

.ts_around {
    text-shadow: 0 0 20px rgba(0, 0, 0, .3), 0 0 15px rgba(0, 0, 0, .3), 0 0 10px rgba(0, 0, 0, .4);
}

.ts_around_dk {
    text-shadow: 0 0 20px rgba(0, 0, 0, .9), 0 0 15px rgba(0, 0, 0, .9), 0 0 10px rgba(0, 0, 0, .9), 0 0 5px rgba(0, 0, 0, .9);
}


/*  border  */

.bd {
    border: 1px solid #333;
}

.bdt {
    border-top: 1px solid #333;
}

.bdl {
    border-left: 1px solid #333;
}

.bdr {
    border-right: 1px solid #333;
}

.bdb {
    border-bottom: 1px solid #333;
}

.bdtb {
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}

.bdlr {
    border-left: 1px solid #333;
    border-right: 1px solid #333;
}

.bd0 {
    border: none;
}

.bdt0 {
    border-top: none;
}

.bdl0 {
    border-left: none;
}

.bdr0 {
    border-right: none;
}

.bdb0 {
    border-bottom: none;
}

.bdb2 {
    border-bottom: solid 2px #edb5d2;
}

@media screen and (max-width: 767px) {
    .spbd {
        border: 1px solid #333;
    }
    .spbdt {
        border-top: 1px solid #333;
    }
    .spbdl {
        border-left: 1px solid #333;
    }
    .spbdr {
        border-right: 1px solid #333;
    }
    .spbdb {
        border-bottom: 1px solid #333;
    }
    .spbdtb {
        border-top: 1px solid #333;
        border-bottom: 1px solid #333;
    }
    .spbdlr {
        border-left: 1px solid #333;
        border-right: 1px solid #333;
    }
    .spbd0 {
        border: none;
    }
    .spbdt0 {
        border-top: none;
    }
    .spbdb0 {
        border-bottom: none;
    }
    .spbdl0 {
        border-left: none;
    }
    .spbdr0 {
        border-right: none;
    }
}

.bdw2 {
    border-width: 2px;
}

.bdw3 {
    border-width: 3px;
}

.bdw5 {
    border-width: 5px;
}

.bdw10 {
    border-width: 10px;
}

.dash {
    border-style: dashed;
}

.dot {
    border-style: dotted;
}

.bd_black {
    border-color: #000;
}

.bd_gray {
    border-color: #ccc;
}

.bd_white {
    border-color: #fff;
}

.bd_red {
    border-color: #fd3535;
}

.bd_dgreen {
    border-color: #306418;
}


/*  hr  */

.hr {
    border: 0;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;
    height: 1px;
    background-color: #333;
}

.hr_gray {
    background-color: #ccc;
    border-color: #ccc;
}

.hr_white {
    background-color: #fff;
    border-color: #fff;
}

.hr_pink {
    background-color: #edb5d2;
    border-color: #edb5d2;
}

.hr_giza {
    border: none;
    padding: 0 .5em .5em 2em;
    background: url(../img/common/hr-12.png) repeat-x bottom;
}

hr .hr_btn {
    margin: 0px;
    background-color: #333;
}

/*  border-radius  */

.bdrs0 {
    border-radius: 0;
}

.bdrs2 {
    border-radius: 2px;
}

.bdrs3 {
    border-radius: 3px;
}

.bdrs5 {
    border-radius: 5px;
}

.bdrs10 {
    border-radius: 10px;
}

.bdrs50p {
    border-radius: 50%;
}


/*  width  */

.w100p {
    width: 100%;
}

.w120 {
    width: 120px;
}

.w150 {
    width: 150px;
}


/*  height  */

.h100p {
    height: 100%;
}

.h100vh {
    height: 100vh;
}


/*  MAX width  */

.maxw100 {
    max-width: 100px;
}

.maxw130 {
    max-width: 130px;
}

.maxw150 {
    max-width: 150px;
}

.maxw180 {
    max-width: 180px;
}

.maxw200 {
    max-width: 200px;
}

.maxw250 {
    max-width: 250px;
}

.maxw280 {
    max-width: 280px;
}

.maxw290 {
    max-width: 290px;
}

.maxw300 {
    max-width: 300px;
}

.maxw350 {
    max-width: 350px;
}

.maxw400 {
    max-width: 400px;
}

.maxw450 {
    max-width: 450px;
}

.maxw500 {
    max-width: 500px;
}

.maxw600 {
    max-width: 600px;
}

.maxw650 {
    max-width: 650px;
}

.maxw700 {
    max-width: 700px;
}

.maxw725 {
    max-width: 725px;
}

.maxw800 {
    max-width: 800px;
}

.maxw900 {
    max-width: 900px;
}

.maxw990 {
    max-width: 990px;
}

.maxw1000 {
    max-width: 1000px;
}

.maxw1030 {
    max-width: 1030px;
}

.maxw1200 {
    max-width: 1200px;
}

.maxw1310 {
    max-width: 1310px;
}

.maxw1470 {
    max-width: 1470px;
}


/*  backface  */

.backface {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}


/*  position  */

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}


/*  font-weight  */

.bold {
    font-weight: bold;
}

.normal {
    font-weight: normal;
}


/*  line-height  */

.lh_0 {
    line-height: 0;
}

.lh_1 {
    line-height: 1;
}

.lh_13 {
    line-height: 1.3;
}

.lh_15 {
    line-height: 1.5;
}

.lh_18 {
    line-height: 1.8;
}

.lh_2 {
    line-height: 2;
}

.lh_25 {
    line-height: 2.5;
}


/*  letter-spacing  */

.ls_-1 {
    letter-spacing: -1px;
}

.ls_-05 {
    letter-spacing: -0.5px;
}

.ls_0 {
    letter-spacing: 0px;
}

.ls_1 {
    letter-spacing: 1px;
}

.ls_2 {
    letter-spacing: 2px;
}


/*  floating  */

.fl_r {
    float: right;
}

.fl_l {
    float: left;
}

.fl_none {
    float: none;
}


/*  vertical-align  */

.va_-2 {
    vertical-align: -2px;
}

.va_-1 {
    vertical-align: -1px;
}

.va_1 {
    vertical-align: 1px;
}

.va_2 {
    vertical-align: 2px;
}

.va_middle {
    vertical-align: middle;
}

.va_top {
    vertical-align: top;
}

.va_bottom {
    vertical-align: bottom;
}


/*  display  */

.inline {
    display: inline;
}

.i_block {
    display: inline-block;
}

.block {
    display: block;
}

.d_table {
    display: table;
}

.t_cell {
    display: table-cell;
}


/*  font-family  */

.serif {
    font-family: "游明朝", "Yu Mincho", "游明朝体", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.sans {
    font-family: 'Noto Sans JP', "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, 'メイリオ', Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}


/*  font-size  */

.fs0 {
    font-size: 0;
}

.fs10 {
    font-size: 10px;
}

.fs11 {
    font-size: 11px;
}

.fs12 {
    font-size: 12px;
}

.fs13 {
    font-size: 13px;
}

.fs14 {
    font-size: 14px;
}

.fs15 {
    font-size: 15px;
}

.fs16 {
    font-size: 16px;
}

.fs18 {
    font-size: 18px;
}

.fs19 {
    font-size: 19px;
}

.fs20 {
    font-size: 20px;
}

.fs22 {
    font-size: 22px;
}

.fs24 {
    font-size: 24px;
}

.fs25 {
    font-size: 25px;
}

.fs26 {
    font-size: 26px;
}

.fs27 {
    font-size: 27px;
}

.fs28 {
    font-size: 28px;
}

.fs30 {
    font-size: 30px;
}

.fs32 {
    font-size: 32px;
}

.fs34 {
    font-size: 34px;
}

.fs36 {
    font-size: 36px;
}

.fs45 {
    font-size: 45px;
}

.fs48 {
    font-size: 48px;
}

.fs54 {
    font-size: 54px;
}

@media only screen and (max-width: 767px) {
    .fs14 {
        font-size: 12px;
    }
    .fs15 {
        font-size: 13px;
    }
    .fs16 {
        font-size: 14px;
    }
    .fs18 {
        font-size: 16px;
    }
    .fs19 {
        font-size: 17px;
    }
    .fs20 {
        font-size: 18px;
    }
    .fs22 {
        font-size: 20px;
    }
    .fs24 {
        font-size: 22px;
    }
    .fs25 {
        font-size: 23px;
    }
    .fs26 {
        font-size: 24px;
    }
    .fs27 {
        font-size: 25px;
    }
    .fs28 {
        font-size: 26px;
    }
    .fs30 {
        font-size: 28px;
    }
    .fs32 {
        font-size: 30px;
    }
    .fs34 {
        font-size: 32px;
    }
    .fs36 {
        font-size: 34px;
    }
    .fs45 {
        font-size: 30px;
    }
    .fs48 {
        font-size: 34px;
    }
    .fs54 {
        font-size: 36px;
    }
    .spfs10 {
        font-size: 10px;
    }
    .spfs11 {
        font-size: 11px;
    }
    .spfs12 {
        font-size: 12px;
    }
    .spfs13 {
        font-size: 13px;
    }
    .spfs14 {
        font-size: 14px;
    }
    .spfs16 {
        font-size: 16px;
    }
    .spfs18 {
        font-size: 18px;
    }
    .spfs20 {
        font-size: 20px;
    }
    .spfs22 {
        font-size: 22px;
    }
    .spfs24 {
        font-size: 24px;
    }
    .spfs28 {
        font-size: 28px;
    }
    .spfs34 {
        font-size: 34px;
    }
    .spfs40 {
        font-size: 40px;
    }
}


/*  font-color  */

.white,
.white a {
    color: #FFF;
}

.black,
.black a {
    color: #333;
}

.l-blue,
.l-blue a {
    color: #34b6d0;
}

.red,
.red a {
    color: #fd3535;
}

.dred,
.dred a {
    color: #80252B;
}

.pink,
.pink a {
    color: #ffb4b0;
}

.lgray,
.lgray a {
    color: #eee;
}

.gray,
.gray a {
    color: #CCC;
}

.dgray,
.dgray a,
a.dgray {
    color: #090909;
}

.purple,
.purple a {
    color: #6A5367;
}

.lbeige,
.lbeige a {
    color: #FBF8EA;
}

.dbeige,
.dbeige a {
    color: #AA995D;
}

.orange,
.orange a {
    color: #ff7800;
}

.sky,
.sky a {
    color: #1f7ab6;
}

.brown,
.brown a {
    color: #db7c0b;
}

.dgreen,
.dgreen a {
    color: #306418;
}


/*  bg-color  */

.bg_c7_bk {
    background: rgba(0, 0, 0, .7);
}

.bg_black {
    background: #333;
}

.bg_dkblack {
    background: #000;
}

.bg_white {
    background: #FFF;
}

.bg_dwhite {
    background: #f3f3f3;
}

.bg_lgray {
    background: #eee;
}

.bg_gray {
    background: #ccc;
}

.bg_dgray {
    background: #666;
}

.bg_dkgray {
    background: #444;
}

.bg_lblue {
    background: #638eaf;
}

.bg_dblue {
    background: #3D74BA;
}

.bg_dkblue {
    background: #163b95;
}

.bg_lbeige {
    background: #FBF8EA;
}

.bg_dbeige {
    background: #AA995D;
}

.bg_red {
    background: #F00;
}

.bg_dred {
    background: #80252B;
}

.bg_dpink {
    background: #BB476D;
}

.bg_yellow {
    background: #FFE5BF;
}

.bg_lyellow {
    background: #FFE5BF;
}

.bg_green {
    background: #7eaf63;
}

.bg_dgreen {
    background: #306418;
}

.bg_purple {
    background: #8363af;
}

.bg_brown {
    background-color: #231815;
}

.bg_orange {
    background: #e7351d;
}



/* ■■■■■■■■■■■■■■■■■■■■
	margin padding
■■■■■■■■■■■■■■■■■■ */

.mgauto {
    margin: auto;
}

.mglrauto {
    margin-right: auto;
    margin-left: auto;
}

.mgright {
    margin-right: 0;
    margin-left: auto;
}

.mg0 {
    margin: 0;
}



/* .mgl margin left */

.mgl5 {
    margin-left: 5px;
}

.mgl10 {
    margin-left: 10px;
}

.mgl15 {
    margin-left: 15px;
}

.mgl20 {
    margin-left: 20px;
}

.mgl25 {
    margin-left: 25px;
}

.mgl30 {
    margin-left: 30px;
}

.mgl40 {
    margin-left: 40px;
}

.mgl50 {
    margin-left: 50px;
}


/* .mgr margin right */

.mgr5 {
    margin-right: 5px;
}

.mgr10 {
    margin-right: 10px;
}

.mgr15 {
    margin-right: 15px;
}

.mgr20 {
    margin-right: 20px;
}

.mgr25 {
    margin-right: 25px;
}

.mgr30 {
    margin-right: 30px;
}

.mgr40 {
    margin-right: 40px;
}

.mgr50 {
    margin-right: 50px;
}


/* .mgt margin top */

.mgt0 {
    margin-top: 0;
}

.mgt5 {
    margin-top: 5px;
}

.mgt10 {
    margin-top: 10px;
}

.mgt15 {
    margin-top: 15px;
}

.mgt20 {
    margin-top: 20px;
}

.mgt25 {
    margin-top: 25px;
}

.mgt30 {
    margin-top: 30px;
}

.mgt35 {
    margin-top: 35px;
}

.mgt40 {
    margin-top: 40px;
}

.mgt50 {
    margin-top: 50px;
}

.mgt55 {
    margin-top: 55px;
}

.mgt60 {
    margin-top: 60px;
}

.mgt70 {
    margin-top: 70px;
}

.mgt80 {
    margin-top: 80px;
}

.mgt90 {
    margin-top: 90px;
}

.mgt100 {
    margin-top: 100px;
}

.mgt150 {
    margin-top: 150px;
}

.mgt350 {
    margin-top: 350px;
}


/* .mgb margin bottom */

.mgb0 {
    margin-bottom: 0px;
}

.mgb5 {
    margin-bottom: 5px;
}

.mgb10 {
    margin-bottom: 10px;
}

.mgb15 {
    margin-bottom: 15px;
}

.mgb20 {
    margin-bottom: 20px;
}

.mgb25 {
    margin-bottom: 25px;
}

.mgb30 {
    margin-bottom: 30px;
}

.mgb40 {
    margin-bottom: 40px;
}

.mgb50 {
    margin-bottom: 50px;
}

.mgb60 {
    margin-bottom: 60px;
}

.mgb70 {
    margin-bottom: 70px;
}

.mgb80 {
    margin-bottom: 80px;
}

.mgb90 {
    margin-bottom: 90px;
}

.mgb100 {
    margin-bottom: 100px;
}

.mgb150 {
    margin-bottom: 150px;
}



/* .pd padding */

.pd0 {
    padding: 0;
}

.pd5 {
    padding: 5px;
}

.pd10 {
    padding: 10px;
}

.pd15 {
    padding: 15px;
}

.pd20 {
    padding: 20px;
}

.pd25 {
    padding: 25px;
}

.pd30 {
    padding: 30px;
}

.pd40 {
    padding: 40px;
}

.pd50 {
    padding: 50px;
}


/* .pdt padding top */

.pdt0 {
    padding-top: 0px;
}

.pdt5 {
    padding-top: 5px;
}

.pdt10 {
    padding-top: 10px;
}

.pdt15 {
    padding-top: 15px;
}

.pdt20 {
    padding-top: 20px;
}

.pdt25 {
    padding-top: 25px;
}

.pdt30 {
    padding-top: 30px;
}

.pdt35 {
    padding-top: 35px;
}

.pdt40 {
    padding-top: 40px;
}

.pdt50 {
    padding-top: 50px;
}

.pdt60 {
    padding-top: 60px;
}

.pdt70 {
    padding-top: 70px;
}

.pdt80 {
    padding-top: 80px;
}

.pdt90 {
    padding-top: 90px;
}

.pdt100 {
    padding-top: 100px;
}

.pdt130 {
    padding-top: 130px;
}

.pdt170 {
    padding-top: 170px;
}

.pdt270 {
    padding-top: 270px;
}

.pdt500 {
    padding-top: 500px;
}

.pdt600 {
    padding-top: 600px;
}

.pdt800 {
    padding-top: 800px;
}


/* .pdt padding bottom */

.pdb0 {
    padding-bottom: 0px;
}

.pdb5 {
    padding-bottom: 5px;
}

.pdb10 {
    padding-bottom: 10px;
}

.pdb15 {
    padding-bottom: 15px;
}

.pdb20 {
    padding-bottom: 20px;
}

.pdb25 {
    padding-bottom: 25px;
}

.pdb30 {
    padding-bottom: 30px;
}

.pdb40 {
    padding-bottom: 40px;
}

.pdb50 {
    padding-bottom: 50px;
}

.pdb60 {
    padding-bottom: 60px;
}

.pdb70 {
    padding-bottom: 70px;
}

.pdb80 {
    padding-bottom: 80px;
}

.pdb90 {
    padding-bottom: 90px;
}

.pdb100 {
    padding-bottom: 100px;
}

.pdb150 {
    padding-bottom: 150px;
}

.pdb170 {
    padding-bottom: 170px;
}


/* .pdl padding left */

.pdl0 {
    padding-left: 0;
}

.pdl2 {
    padding-left: 2px;
}

.pdl5 {
    padding-left: 5px;
}

.pdl10 {
    padding-left: 10px;
}

.pdl15 {
    padding-left: 15px;
}

.pdl20 {
    padding-left: 20px;
}

.pdl25 {
    padding-left: 25px;
}

.pdl30 {
    padding-left: 30px;
}

.pdl40 {
    padding-left: 40px;
}

.pdl50 {
    padding-left: 50px;
}

.pdl70 {
    padding-left: 70px;
}


/* .pdr padding right */

.pdr0 {
    padding-right: 0;
}

.pdr2 {
    padding-right: 2px;
}

.pdr5 {
    padding-right: 5px;
}

.pdr10 {
    padding-right: 10px;
}

.pdr15 {
    padding-right: 15px;
}

.pdr20 {
    padding-right: 20px;
}

.pdr25 {
    padding-right: 25px;
}

.pdr30 {
    padding-right: 30px;
}

.pdr40 {
    padding-right: 40px;
}

.pdr50 {
    padding-right: 50px;
}


/* sm-gutters Class Rules */

.sm_gutters {
    margin-right: -5px;
    margin-left: -5px;
}

.sm_gutters>[class^="col-"],
.sm_gutters>[class*=" col-"] {
    padding-right: 5px;
    padding-left: 5px;
}


/* no-gutters Class Rules */

.no_gutters {
    margin-right: 0;
    margin-left: 0;
}

.no_gutters>[class^="col-"],
.no_gutters>[class*=" col-"] {
    padding-right: 0;
    padding-left: 0;
}



/* ■■■■■■■■■■■■■■■■■■■■
				MEDIA
■■■■■■■■■■■■■■■■■■ */

@media screen and (max-width: 767px) {
    /*  pointer events  */
    .sp_event_auto {
        pointer-events: auto;
    }
    /*  floating  */
    .sp_fl_r {
        float: right;
    }
    .sp_fl_l {
        float: left;
    }
    .sp_fl_none {
        float: none;
    }
    /*  position  */
    .sp_static {
        position: static;
    }
    /*  width %  */
    .sp_wauto {
        width: auto;
    }
    .sp_w100p {
        width: 100%;
    }
    /*  font-weight  */
    .sp_bold {
        font-weight: bold;
    }
    .sp_normal {
        font-weight: normal;
    }
    /*  letter-spacing  */
    .spls_-1 {
        letter-spacing: -1px;
    }
    .spls_-05 {
        letter-spacing: -0.5px;
    }
    .spls_0 {
        letter-spacing: 0px;
    }
    .spls_1 {
        letter-spacing: 1px;
    }
    /*  text-align  */
    .sp_left {
        text-align: left;
    }
    .sp_center {
        text-align: center;
    }
    /*  display  */
    .sp_iblock {
        display: inline-block;
    }
    .sp_block {
        display: block;
    }
    /* sp margin */
    .spmgauto {
        margin: auto;
    }
    .spmglrauto {
        margin-right: auto;
        margin-left: auto;
    }
    .spmgright {
        margin-right: 0;
        margin-left: auto;
    }
    /* .spmgt margin top */
    .spmgt0 {
        margin-top: 0px;
    }
    .spmgt5 {
        margin-top: 5px;
    }
    .spmgt10 {
        margin-top: 10px;
    }
    .spmgt15 {
        margin-top: 15px;
    }
    .spmgt20 {
        margin-top: 20px;
    }
    .spmgt25 {
        margin-top: 25px;
    }
    .spmgt30 {
        margin-top: 30px;
    }
    .spmgt40 {
        margin-top: 40px;
    }
    .spmgt50 {
        margin-top: 50px;
    }
    .spmgt60 {
        margin-top: 60px;
    }
    .spmgt70 {
        margin-top: 70px;
    }
    .spmgt80 {
        margin-top: 80px;
    }
    .spmgt90 {
        margin-top: 90px;
    }
    .spmgt100 {
        margin-top: 100px;
    }
    .spmgt150 {
        margin-top: 150px;
    }
    .spmgt200 {
        margin-top: 200px;
    }
    .spmgt250 {
        margin-top: 250px;
    }
    /* .spmgb margin bottom */
    .spmgb0 {
        margin-bottom: 0px
    }
    .spmgb5 {
        margin-bottom: 5px
    }
    .spmgb10 {
        margin-bottom: 10px
    }
    .spmgb15 {
        margin-bottom: 15px
    }
    .spmgb20 {
        margin-bottom: 20px
    }
    .spmgb25 {
        margin-bottom: 25px
    }
    .spmgb30 {
        margin-bottom: 30px
    }
    .spmgb40 {
        margin-bottom: 40px
    }
    .spmgb50 {
        margin-bottom: 50px
    }
    /* .spmgl margin left */
    .spmgl0 {
        margin-left: 0px;
    }
    .spmgl2 {
        margin-left: 2px;
    }
    .spmgl5 {
        margin-left: 5px;
    }
    .spmgl10 {
        margin-left: 10px;
    }
    .spmgl15 {
        margin-left: 15px;
    }
    .spmgl20 {
        margin-left: 20px;
    }
    .spmgl25 {
        margin-left: 25px;
    }
    .spmgl30 {
        margin-left: 30px;
    }
    .spmgl35 {
        margin-left: 35px;
    }
    .spmgl40 {
        margin-left: 40px;
    }
    .spmgl50 {
        margin-left: 50px;
    }
    /* .spmgr margin right */
    .spmgr0 {
        margin-right: 0px;
    }
    .spmgr2 {
        margin-right: 2px;
    }
    .spmgr5 {
        margin-right: 5px;
    }
    .spmgr10 {
        margin-right: 10px;
    }
    .spmgr15 {
        margin-right: 15px;
    }
    .spmgr20 {
        margin-right: 20px;
    }
    .spmgr25 {
        margin-right: 25px;
    }
    .spmgr30 {
        margin-right: 30px;
    }
    .spmgr40 {
        margin-right: 40px;
    }
    .spmgr50 {
        margin-right: 50px;
    }
    /* sp padding */
    .sppd0 {
        padding: 0px;
    }
    .sppd5 {
        padding: 5px;
    }
    .sppd10 {
        padding: 10px;
    }
    .sppd15 {
        padding: 15px;
    }
    .sppd20 {
        padding: 20px;
    }
    .sppd25 {
        padding: 25px;
    }
    .sppd30 {
        padding: 30px;
    }
    /* .sppdt padding top */
    .sppdt0 {
        padding-top: 0px;
    }
    .sppdt5 {
        padding-top: 5px;
    }
    .sppdt10 {
        padding-top: 10px;
    }
    .sppdt15 {
        padding-top: 15px;
    }
    .sppdt20 {
        padding-top: 20px;
    }
    .sppdt25 {
        padding-top: 25px;
    }
    .sppdt30 {
        padding-top: 30px;
    }
    .sppdt40 {
        padding-top: 40px;
    }
    .sppdt50 {
        padding-top: 50px;
    }
    .sppdt150 {
        padding-top: 150px;
    }
    .sppdt250 {
        padding-top: 250px;
    }
    /* .sppdb padding bottom */
    .sppdb0 {
        padding-bottom: 0px;
    }
    .sppdb5 {
        padding-bottom: 5px;
    }
    .sppdb10 {
        padding-bottom: 10px;
    }
    .sppdb15 {
        padding-bottom: 15px;
    }
    .sppdb20 {
        padding-bottom: 20px;
    }
    .sppdb25 {
        padding-bottom: 25px;
    }
    .sppdb30 {
        padding-bottom: 30px;
    }
    .sppdb40 {
        padding-bottom: 40px;
    }
    .sppdb50 {
        padding-bottom: 50px;
    }
    /* .sppdl padding left */
    .sppdl0 {
        padding-left: 0px;
    }
    .sppdl5 {
        padding-left: 5px;
    }
    .sppdl10 {
        padding-left: 10px;
    }
    .sppdl15 {
        padding-left: 15px;
    }
    .sppdl20 {
        padding-left: 20px;
    }
    .sppdl25 {
        padding-left: 25px;
    }
    .sppdl30 {
        padding-left: 30px;
    }
    .sppdl40 {
        padding-left: 40px;
    }
    .sppdl50 {
        padding-left: 50px;
    }
    /* .sppdr padding right */
    .sppdr0 {
        padding-right: 0px;
    }
    .sppdr5 {
        padding-right: 5px;
    }
    .sppdr10 {
        padding-right: 10px;
    }
    .sppdr15 {
        padding-right: 15px;
    }
    .sppdr20 {
        padding-right: 20px;
    }
    .sppdr25 {
        padding-right: 25px;
    }
    .sppdr30 {
        padding-right: 30px;
    }
    .sppdr40 {
        padding-right: 40px;
    }
    .sppdr50 {
        padding-right: 50px;
    }
    /* sp-gutters Class Rules */
    .sp_sm_gutters {
        margin-right: -5px;
        margin-left: -5px;
    }
    .sp_sm_gutters>[class^="col-"],
    .sp_sm_gutters>[class*=" col-"] {
        padding-right: 5px;
        padding-left: 5px;
    }

    .sp_no_gutters {
        margin-right: 0;
        margin-left: 0;
    }
    .sp_no_gutters>[class^="col-"],
    .sp_no_gutters>[class*=" col-"] {
        padding-right: 0;
        padding-left: 0;
    }
}




/* bootstrap grid max543px + width 20% */

.visible-ss {
    display: none !important;
}

.col-ss-1,
.col-ss-2,
.col-ss-3,
.col-ss-4,
.col-ss-5,
.col-ss-6,
.col-ss-7,
.col-ss-8,
.col-ss-9,
.col-ss-10,
.col-ss-11,
.col-ss-12,
.col-ss-20,
.col-xs-20,
.col-sm-20,
.col-md-20,
.col-lg-20 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

@media screen and (max-width: 543px) {
    .col-ss-1,
    .col-ss-2,
    .col-ss-3,
    .col-ss-4,
    .col-ss-5,
    .col-ss-6,
    .col-ss-7,
    .col-ss-8,
    .col-ss-9,
    .col-ss-10,
    .col-ss-11,
    .col-ss-12 {
        float: left;
        padding-right: 5px;
        padding-left: 5px;
    }
    .col-ss-12 {
        width: 100%;
    }
    .col-ss-11 {
        width: 91.66666667%;
    }
    .col-ss-10 {
        width: 83.33333333%;
    }
    .col-ss-9 {
        width: 75%;
    }
    .col-ss-8 {
        width: 66.66666667%;
    }
    .col-ss-7 {
        width: 58.33333333%;
    }
    .col-ss-6 {
        width: 50%;
    }
    .col-ss-5 {
        width: 41.66666667%;
    }
    .col-ss-4 {
        width: 33.33333333%;
    }
    .col-ss-3 {
        width: 25%;
    }
    .col-ss-2 {
        width: 16.66666667%;
    }
    .col-ss-1 {
        width: 8.33333333%;
    }
    .col-ss-pull-12 {
        right: 100%;
    }
    .col-ss-pull-11 {
        right: 91.66666667%;
    }
    .col-ss-pull-10 {
        right: 83.33333333%;
    }
    .col-ss-pull-9 {
        right: 75%;
    }
    .col-ss-pull-8 {
        right: 66.66666667%;
    }
    .col-ss-pull-7 {
        right: 58.33333333%;
    }
    .col-ss-pull-6 {
        right: 50%;
    }
    .col-ss-pull-5 {
        right: 41.66666667%;
    }
    .col-ss-pull-4 {
        right: 33.33333333%;
    }
    .col-ss-pull-3 {
        right: 25%;
    }
    .col-ss-pull-2 {
        right: 16.66666667%;
    }
    .col-ss-pull-1 {
        right: 8.33333333%;
    }
    .col-ss-pull-0 {
        right: auto;
    }
    .col-ss-push-12 {
        left: 100%;
    }
    .col-ss-push-11 {
        left: 91.66666667%;
    }
    .col-ss-push-10 {
        left: 83.33333333%;
    }
    .col-ss-push-9 {
        left: 75%;
    }
    .col-ss-push-8 {
        left: 66.66666667%;
    }
    .col-ss-push-7 {
        left: 58.33333333%;
    }
    .col-ss-push-6 {
        left: 50%;
    }
    .col-ss-push-5 {
        left: 41.66666667%;
    }
    .col-ss-push-4 {
        left: 33.33333333%;
    }
    .col-ss-push-3 {
        left: 25%;
    }
    .col-ss-push-2 {
        left: 16.66666667%;
    }
    .col-ss-push-1 {
        left: 8.33333333%;
    }
    .col-ss-push-0 {
        left: auto;
    }
    .col-ss-offset-12 {
        margin-left: 100%;
    }
    .col-ss-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-ss-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-ss-offset-9 {
        margin-left: 75%;
    }
    .col-ss-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-ss-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-ss-offset-6 {
        margin-left: 50%;
    }
    .col-ss-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-ss-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-ss-offset-3 {
        margin-left: 25%;
    }
    .col-ss-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-ss-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-ss-offset-0 {
        margin-left: 0;
    }
    /* ss visible hidden */
    .hidden-ss {
        display: none !important;
    }
    .visible-ss {
        display: block !important;
    }
    table.visible-ss {
        display: table !important;
    }
    tr.visible-ss {
        display: table-row !important;
    }
    th.visible-ss,
    td.visible-ss {
        display: table-cell !important;
    }
    /* ss-gutters Class Rules */
    .ss_sm_gutters {
        margin-right: -5px;
        margin-left: -5px;
    }
    .ss_sm_gutters>[class^="col-"],
    .ss_sm_gutters>[class*=" col-"] {
        padding-right: 5px;
        padding-left: 5px;
    }

    .ss_no_gutters {
        margin-right: 0;
        margin-left: 0;
    }
    .ss_no_gutters>[class^="col-"],
    .ss_no_gutters>[class*=" col-"] {
        padding-right: 0;
        padding-left: 0;
    }
}


/* grid width 20% */

@media screen and (max-width: 543px) {
    .col-ss-20 {
        float: left;
        width: 20%;
    }
}

.col-xs-20 {
    float: left;
    width: 20%;
}

@media (min-width: 768px) {
    .col-sm-20 {
        float: left;
        width: 20%;
    }
}

@media (min-width: 992px) {
    .col-md-20 {
        float: left;
        width: 20%;
    }
}

@media (min-width: 1200px) {
    .col-lg-20 {
        float: left;
        width: 20%;
    }
}

.img-circle {
    border-radius: 50%;
}