/*===============================================
　全体設定
===============================================*/
html{width :100%; height:100%; font-size:10pt; background:#FFFFFF; font-family: 'Barlow Condensed',sans-serif;}
body{height:100%;}

img{
	max-width: 100%;
	height: auto;
	width :auto;
}

:focus {
    outline: none;
}

input[type="tel"]{
    border:none;
}

.bck_sccc{
	background: linear-gradient(to right,#000349,#11f0f9);
	background: -webkit-linear-gradient(left,#000349,#11f0f9);
}

.mv_eff_back{
	background:#000349;
}

.mv_eff{
	overflow:hidden;
	position:relative;
}

.mv_eff:before{
	content:"";
	width :100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	background: linear-gradient(to right,rgba(17, 240, 240, 0),rgba(17, 240, 240, 1));
	background: -webkit-linear-gradient(left,rgba(17, 240, 240, 0),rgba(17, 240, 240, 1));
	transform:translateX(0);
	transition: all 1s linear 0s;
}


.mv_eff:after{
	content:"";
	width :100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	background: linear-gradient(to left,rgba(17, 240, 240, 0),rgba(17, 240, 240, 1));
	background: -webkit-linear-gradient(right,rgba(17, 240, 240, 0),rgba(17, 240, 240, 1));
	transform:translateX(100%);
	transition: all 1s linear 0s;
}

.mv_eff:hover:before{
	transform:translateX(-100%);
}
.mv_eff:hover:after{
	transform:translateX(0);
}

input[type="tel"]{
    border:none;
}

/*===============================================
　button
===============================================*/
input[type="submit"],
input[type="button"],
button[type="button"]{cursor:pointer;}

.btn_jmb{
    min-width:  82px;
    border-radius: 12px / 50%;
    border:0;
    text-align: center;
    font-weight: 600;
    padding: 2px; 
}

.btn_jmb.sign_in{
    background: #4D4D4D;
    color:#FFF;
}

.btn_jmb.sign_up{
    background: #0BBAF7;
    color:#FFF;
}

.btn_jmb.lotto{
    background: #0292FC;
    color:#FFF;
    border:1px solid #0292FC;
}

.btn_jmb.first{
    background: #00375f;
    color:#EEE;
}

.btn_jmb.btn_bet{
    background: #000;
    color:#FFF;
    width: 100%;
    border-radius: 0;
    letter-spacing:2px;
}

.btn_jmb.home{
    background: #C0C0C0;
    color:#FFF;
    border:1px solid #C0C0C0;
}

.btn_jmb.mycurrency{
    background: #FFBB52;
    color:#FFF;
    border:1px solid #FFBB52;
}

/*===============================================
　space
===============================================*/
.spc10 {margin-top:10px; }
.spc20 {margin-top:20px; }
.spc50 {margin-top:50px; }
.spc100{margin-top:100px;}

.spc10_l{margin-left:10px;}
.spc20_l{margin-left:20px;}

.fl_l{float:left;}
.fl_r{float:right;}

.ml50{margin-left:50px;}
.ml20{margin-left:20px;}
.ml10{margin-left:10px;}
.ml5 {margin-left: 5px;}

.mr50{margin-right:50px;}
.mr20{margin-right:20px;}
.mr10{margin-right:10px;}
.mr5 {margin-right: 5px;}

.mt50{margin-top:50px;}
.mt25{margin-top:25px;}
.mt20{margin-top:20px;}
.mt15{margin-top:15px;}
.mt10{margin-top:10px;}
.mt5 {margin-top: 5px;}

.mb50{margin-bottom:50px;}
.mb25{margin-bottom:25px;}
.mb20{margin-bottom:20px;}
.mb15{margin-bottom:15px;}
.mb10{margin-bottom:10px;}
.mb5 {margin-bottom: 5px;}


.pl50{padding-left:50px;}
.pl20{padding-left:20px;}
.pl10{padding-left:10px;}
.pl5 {padding-left: 5px;}

.pr50{padding-right:50px;}
.pr20{padding-right:20px;}
.pr10{padding-right:10px;}
.pr5 {padding-right: 5px;}

.pt50{padding-top:50px;}
.pt25{padding-top:25px;}
.pt20{padding-top:20px;}
.pt15{padding-top:15px;}
.pt10{padding-top:10px;}
.pt5 {padding-top: 5px;}

.pb50{padding-bottom:50px;}
.pb25{padding-bottom:25px;}
.pb20{padding-bottom:20px;}
.pb15{padding-bottom:15px;}
.pb10{padding-bottom:10px;}
.pb5 {padding-bottom: 5px;}


.m0{margin:0;}
.p0{padding:0;}

.m10{margin:10px;}
.p10{padding:10px;}

.m20{margin:20px;}
.p20{padding:20px;}

.m050{margin: 0 50px;}
.m025{margin: 0 25px;}
.m020{margin: 0 20px;}
.m015{margin: 0 15px;}
.m010{margin: 0 10px;}
.m05 {margin: 0 5px;}

.p050{padding: 0 50px;}
.p025{padding: 0 25px;}
.p020{padding: 0 20px;}
.p015{padding: 0 15px;}
.p010{padding: 0 10px;}
.p05 {padding: 0 5px;}


.w200{width:200px;}
.w160{width:160px;}
.w150{width:150px;}
.w100{width:100px;}
.w90 {width:90px;}
.w80 {width:80px;}
.w70 {width:70px;}
.w60 {width:60px;}
.w50 {width:50px;}
.w40 {width:40px;}
.w30 {width:30px;}
.w20 {width:20px;}

.w100p{width:100%;}
.w90p {width: 90%;}
.w80p {width: 80%;}
.w70p {width: 70%;}
.w60p {width: 60%;}
.w50p {width: 50%;}

.w49p {width: 49%;}
.w48p {width: 48%;}
.w47p {width: 47%;}
.w46p {width: 46%;}
.w45p {width: 45%;}
.w44p {width: 44%;}
.w43p {width: 43%;}
.w42p {width: 42%;}
.w41p {width: 41%;}
.w40p {width: 40%;}

.w30p {width: 30%;}
.w25p {width: 25%;}
.w20p {width: 20%;}
.w10p {width: 10%;}
.w5p  {width:  5%;}


.fz48{font-size:48px;}
.fz32{font-size:32px;}
.fz30{font-size:30px;}
.fz28{font-size:28px;}
.fz26{font-size:26px;}
.fz24{font-size:24px;}
.fz22{font-size:22px;}
.fz20{font-size:20px;}
.fz18{font-size:18px;}
.fz16{font-size:16px;}
.fz14{font-size:14px;}
.fz12{font-size:12px;}
.fz11{font-size:11px;}

.tar{text-align:right;}
.tal{text-align:left;}
.tac{text-align:center;}

.vat{vertical-align: top;}
.vam{vertical-align: middle;}
.vab{vertical-align: bottom;}

.fw800{font-weight:800;}
.fw600{font-weight:600;}

.dsn{display:none;}
.inline{display:inline;}
.inline-block{display:inline-block;}

.pre-wrap{
    white-space: pre-wrap;
}

/*===============================================
caret
===============================================*/
/*----- carrat -----*/
.caret_r,
.caret_rw,
.caret_l,
.caret_lw,
.caret_u,
.caret_uw,
.caret_d,
.caret_dw{
    width         : 0;
    height        : 0;
    font-size     : 12px;
    display       : inline-block; 
    border-style  : solid;
    vertical-align: middle;
}

.caret_r,
.caret_rw{
    margin-bottom: 0.3em;
    border-width: 0.5em 0 0.5em 0.86em;
    border-color: transparent transparent transparent #00375F;
}

.caret_rw{
    border-color: transparent transparent transparent #FFFFFF;
}


.caret_l,
.caret_lw{
    margin-bottom: 0.3em;
    border-width: 0.5em 0.86em 0.5em 0;
    border-color: transparent #00375F transparent transparent;
}

.caret_lw{
    border-color: transparent #FFFFFF transparent transparent;
}


.caret_u,
.caret_uw{
    border-width: 0 0.5em 0.86em 0.5em;
    border-color: transparent transparent #00375F transparent;
}

.caret_uw{
    border-width: 0 0.5em 0.86em 0.5em;
    border-color: transparent transparent #FFFFFF transparent;    
}

.caret_d,
.caret_dw{
    border-width: 0.86em 0.5em 0 0.5em;
    border-color: #00375F transparent transparent transparent;
}

.caret_dw{
    border-width: 0.86em 0.5em 0 0.5em;
    border-color: #FFF transparent transparent transparent;    
}


/*===============================================
ticket
===============================================*/

.ticket_5,
.ticket_10,
.ticket_15,
.ticket_20{
    color        : #FFF;
    background   : #00375F;
    width        : 100%;
    min-height   : 50px;
    position     : relative;
    
    display        :flex;
    justify-content:flex-start;
    align-items    :center;

    display: -webkit-flex;
    -webkit-justify-content:flex-start;
    -webkit-align-items:center;
}

.ticket_5  .cutout,
.ticket_10 .cutout,
.ticket_15 .cutout,
.ticket_20 .cutout{
    width      : 1em;
    height     : 30%;
    min-height : 20px;
    background : #FFF;
    border    :none;
    border-radius: 0 0.8em 0.8em 0 / 0 0.8em 0.8em 0;
}

.ticket_5  .ticket_info,
.ticket_10 .ticket_info,
.ticket_15 .ticket_info,
.ticket_20 .ticket_info{
    text-align: center;
}



.ticket_5{
    border-radius: 5px;
}

.ticket_5 .cutout{
    font-size: 5px;
}

.ticket_5 .ticket_info{
    width: calc(100% - 10px);
}


.ticket_10{
    border-radius: 10px;
}

.ticket_10 .cutout{
    font-size: 10px;
}

.ticket_10 .ticket_info{
    width: calc(100% - 20px);
}


.ticket_15{
    border-radius: 15px;
}

.ticket_15 .cutout{
    font-size: 15px;
}

.ticket_15 .ticket_info{
    width: calc(100% - 30px);
}


.ticket_20{
    border-radius: 20px;
}

.ticket_20 .cutout{
    font-size: 20px;
}

.ticket_20 .ticket_info{
    width: calc(100% - 40px);
}

.ticket_5 .ticket_del,
.ticket_10 .ticket_del,
.ticket_15 .ticket_del,
.ticket_20 .ticket_del{
    background: #FFF;
    height    : 20px;
    width     : 20px;
    border-radius: 50%;
    border    : 1px solid #00375F;
    position  : absolute;
    top       :-8px;
    right     :-8px;
    z-index   : 2;
    font-size:12px;
    text-align: center;
}

.ticket_5 .ticket_del i,
.ticket_10 .ticket_del i,
.ticket_15 .ticket_del i,
.ticket_20 .ticket_del i{
   color : #00375F;
}


/*===============================================
　oghers
===============================================*/
.float_clear{clear:both;}
.num_in{text-align:right;}
.alert{color:#F00    ; font-weight:800;}
.notice{color:#FF3B3B; font-weight:600; font-size:12pt;}

.dflx_cc{
	display        :flex;
	justify-content:center;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:center;
	-webkit-align-items:center;
}

.dflx_ce{
	display        :flex;
	justify-content:center;
	align-items    :end;
	
	display: -webkit-flex;
	-webkit-justify-content:center;
	-webkit-align-items:end;
}

.dflx_sbc{
	display        :flex;
	justify-content:space-between;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:center;
}

.dflx_sbb{
	display        :flex;
	justify-content:space-between;
	align-items    :baseline;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:baseline;
}

.dflx_sac{
	display        :flex;
	justify-content:space-around;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:space-around;
	-webkit-align-items:center;
}


.dflx_fsc{
	display        :flex;
	justify-content:flex-start;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:flex-start;
	-webkit-align-items:center;
}

.dflx_fec{
	display        :flex;
	justify-content:flex-end;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-justify-content:flex-end;
	-webkit-align-items:center;
}

.dflx_fscw{
        display        :flex;
        justify-content:flex-start;
        align-items    :center;
        flex-wrap      : wrap;

        display: -webkit-flex;
        -webkit-justify-content:flex-start;
        -webkit-align-items:center;
        -webkit-flex-wrap: wrap;
}

.dflx_sbfs{
	display        :flex;
	justify-content:space-between;
	align-items    :flex-start;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:flex-start;
}

.dflx_sbfe{
	display        :flex;
	justify-content:space-between;
	align-items    :flex-end;
	
	display: -webkit-flex;
	-webkit-justify-content:space-between;
	-webkit-align-items:flex-end;
}

.dflx_dc_cc{
	display        :flex;
	flex-direction :column;
	justify-content:center;
	align-items    :center;
	
	display: -webkit-flex;
	-webkit-flex-direction :column;
	-webkit-justify-content:center;
	-webkit-align-items    :center;
}