/***SMART ASSIST****/
#yoso_sma, #yoso_sma_result{
	width: 430px;
	position: relative;
	color: #fff;
	padding-top: 6px;
	padding-bottom: 20px;
	display: none;
}
#yoso_sma.active, #yoso_sma_result.active{
	display: block;
}
#yoso_sma.all_down{
	pointer-events: none;
}
#yoso_sma.all_down .sma_form01 dt, #yoso_sma.all_down .sma_form01 dd{
	opacity: 0.3;
}
.sma_logo{
	width: 410px;
	height: 44px;
	margin: 0 auto;
	background: url("../../images/sma_logo.png") no-repeat 4px center / 100%;
	text-indent: -9999px;
}
#yoso_sma h6{
	width: 400px;
	height: 30px;
	background: rgba(190,11,124,0.9);
	border-radius: 15px;
	color: #fff;
	font-size: 15px;
	text-align: center;
	line-height: 30px;
	margin: 4px auto 0px;
}

.sma_body{
	width: 400px;
	height: 544px;
	margin: 0px auto;
	background: url("../images/sma_body.png") no-repeat center center / 100%;
	position: relative;
	padding-top: 80px;
}

.sma_body2{
	width: 390px;
	background: #fff;
	border: 5px #BE0B7C solid;
	border-radius: 10px;
	padding-bottom: 20px;
	margin: 40px auto 0;
}


.sma_body2 ul li{
	width: 360px;
	height: 110px;
	margin: 14px auto 0;
}

.sma_body2 .expl {
    color: #000;
    font-size: 14px;
    margin: 1em auto 0;
    padding: 0 14px;

    span {
        font-weight: bold;
    }
}

.sma_odds{
	width: 100%;
	height: 72px;
}
.sma_odds .sam_r_n{
	width: 58px;
	height: 24px;
	float: left;
	text-align: center;
	padding-top: 42px;
	margin-top: 4px;
}

.sma_odds .hantei{
	width: 52px;
	height: 20px;
	line-height: 20px;
	background: #002B8C;
	font-size: 16px;
	font-weight: 500;
}

#sma_body01 .sam_r_n{
	background: url("../images/sam_r_n01.png") no-repeat center 10px;
}
#sma_body02 .sam_r_n{
	background: url("../images/sam_r_n02.png") no-repeat center 10px;
}
#sma_body03 .sam_r_n{
	background: url("../images/sam_r_n03.png") no-repeat center 10px;
}
#sma_body04 .sam_r_n{
	background: url("../images/sam_r_n04.png") no-repeat center 10px;
}
#sma_body05 .sam_r_n{
	background: url("../images/sam_r_n05.png") no-repeat center 10px;
}
#sma_body06 .sam_r_n{
	background: url("../images/sam_r_n06.png") no-repeat center 10px;
}




.sma_odds .hantei.ren3::after {
  content: "3連単";
}
.sma_odds .hantei.ren2::after {
  content: "2連単";
}
.sma_odds .hantei.tan::after {
  content: "単勝";
}


.sma_odds dl{
	width: 200px;
	height: 60px;
	float: left;
	margin-left: 8px;
	margin-top: 12px;
}
.sma_odds dl dt, .sma_odds dl dd{
	float: left;
	text-align: center;
}
.sma_odds dl dt{
	width: 50px;
	height: 50px;
	line-height: 50px;
	font-family: 'Roboto', serif;
	font-weight: 700;
	font-size: 40px;
}
.sma_odds dl dt.sam_r_deme01{
	background: #fff;
	color: #000;
	border: 1px solid #999;
}
.sma_odds dl dt.sam_r_deme01::after{
	content: "1";
}
.sma_odds dl dt.sam_r_deme02{
	background: #222;
	color: #FFF;
}
.sma_odds dl dt.sam_r_deme02::after{
	content: "2";
}
.sma_odds dl dt.sam_r_deme03{
	background: #B40023;
	color: #FFF;
}
.sma_odds dl dt.sam_r_deme03::after{
	content: "3";
}
.sma_odds dl dt.sam_r_deme04{
	background: #0061D5;
	color: #FFF;
}
.sma_odds dl dt.sam_r_deme04::after{
	content: "4";
}
.sma_odds dl dt.sam_r_deme05{
	background: #F8D01F;
	color: #000;
}
.sma_odds dl dt.sam_r_deme05::after{
	content: "5";
}
.sma_odds dl dt.sam_r_deme06{
	background: #199F00;
	color: #FFF;
}
.sma_odds dl dt.sam_r_deme06::after{
	content: "6";
}
.sma_odds dl dd{
	width: 20px;
	height: 50px;
	line-height: 50px;
	color: #666;
	font-weight: 700;
	font-size: 24px;
}
.sma_odds dl dd::after {
  content: "-";
}


.sam_r_o{
	width: 80px;
	float: left;
	color: #FF6300;
	margin-left: 10px;
	padding-top: 11px;
}
.sam_r_o .sam_r_o_head{
	background: #FF6300;
	color: #fff;
	font-size: 15px;
	height: 20px;
	line-height: 20px;
	border-radius: 10px;
	font-weight: 600;
	text-align: center;
}
.sam_r_o .sam_r_o_head::after{
	content: "オッズ";
}
.sam_r_o .sam_r_o_body{
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 32px;
	line-height: 34px;
	text-align: center;
}


.no_odds .sam_r_o .sam_r_o_body{
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 20px;
	color: #999;
}
.no_odds .sam_r_o .sam_r_o_body::after{
	content: "--";
}


.race_num{
	width: 146px;
	height: 50px;
	line-height: 50px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	cursor: pointer;
	text-align: center;
	background: url("../images/sma_race_sel.png") no-repeat right center ;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 40px;
}
.race_num::after, #selcet_num ul li::after {
  content: "R";
  font-size: 32px;
}


#yoso_sma_result .race_num{
	width: 146px;
	height: 50px;
	line-height: 50px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 40px;
	text-align: center;
	color: #BB87ED;
	background: none;
	position: absolute;
	top: 42px;
	left: 0;
}

.sma_odd_time{
	width: 160px;
	height: 28px;
	line-height: 30px;
	background: url("../images/sma_odd_time.png") no-repeat right center / 100%;
	color: #BE0B7C;
	font-family: 'Roboto', sans-serif;
	text-align: right;
	font-weight: 600;
	padding-right: 11px;
	font-size: 20px;
	cursor: pointer;
	position: absolute;
	top: 54px;
	left:238px;
}

.sma_vp{
	width: 258px;
	height: 34px;
	margin-top: 2px;
	background: url("../images/vp_logo_b.png") no-repeat #60F8DB 22px 6px;
	background-size: 72px 20px;
	border-radius: 4px;
	position: relative;
	font-size: 16px;
	line-height: 38px;
	padding-left: 102px;
	font-weight: 600;
	color: #002B8D;
}
.sma_vp::after {
  content: "的中期待度";
}


.sma_vp .sma_vp_point{
	width: 150px;
	height: 26px;
	position: absolute;
	left: 194px;
	top: 2px;
}
.sma_vp .sma_vp_point.vp_point1{
	background: url("../images/vp_point1.png") no-repeat right center / 100%;
}
.sma_vp .sma_vp_point.vp_point2{
	background: url("../images/vp_point2.png") no-repeat right center / 100%;
}
.sma_vp .sma_vp_point.vp_point3{
	background: url("../images/vp_point3.png") no-repeat right center / 100%;
}
.sma_vp .sma_vp_point.vp_point4{
	background: url("../images/vp_point4.png") no-repeat right center / 100%;
}
.sma_vp .sma_vp_point.vp_point5{
	background: url("../images/vp_point5.png") no-repeat right center / 100%;
}




#selcet_num.hidden { display: none; }
#selcet_num{
	width: 400px;
	height: 148px;
	background: rgba(0,0,0,0.8);
	padding: 10px 0 10px 3px;
	position: absolute;
	top: 45px;
	left: 0px;
	z-index: 1001;
}
#selcet_num ul li{
	float: left;
	width: 94px;
	height: 46px;
	background: rgba(255,255,255,1);
	color: rgba(190,11,124,1);
	line-height: 46px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	cursor: pointer;
	font-size: 40px;
	text-align: center;
	margin-left: 4px;
	margin-bottom: 4px;
}
#selcet_num ul li.stop_race{
	opacity: 0.3;
	pointer-events: none;
}


.sma_body_input{
	list-style:none;
	padding:0;
	margin:0px 0;
	position:relative;
	width: 380px;
	padding-left: 14px;
	height: 71px;
}


 .sma_body_input li{
	  width: 68px;
	  float: left;
	 margin-left: 36px;
    height:62px;
    cursor:pointer;
	user-select:none;
	position:relative;
	  background: #333;
	  background: url("../../images/sma_btn.png") no-repeat;
	  background-size: 100%;
  }
.sma_body_input li:nth-child(1){
	margin-left: 79px;
}

.sma_body_input#input01{
	margin-top: 58px;
}


  .sma_body_input.tan {
	 background: url("../images/hantei_01.png") no-repeat;
	 background-size: 52px 20px;
	  background-position: 22px 34px;
}
  .sma_body_input.ren2{
	  background: url("../images/hantei_02.png") no-repeat;
	 background-size: 52px 20px;
	 background-position: 22px 34px;
}
  .sma_body_input.ren3{
	  background: url("../images/hantei_03.png") no-repeat;
	 background-size: 52px 20px;
	 background-position: 22px 34px;
}

  .sma_body_input li[class*="num"]::after{
    content: attr(data-num);
    display:inline-flex;align-items:center;justify-content:center;
    width:68px;height:62px;
    font-size:44px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
  }
.sma_body_input li.num1{
	background: #FFF;
	color: #000;
	border: 1px solid #666;
	width: 66px;
	height: 60px;
}
.sma_body_input li.num2{
	background: #222;
	color: #FFF;
}
.sma_body_input li.num3{
	background: #B40023;
	color: #FFF;
}
.sma_body_input li.num4{
	background: #0061D5;
	color: #FFF;
}
.sma_body_input li.num5{
	background: #F8D01F;
	color: #000;
}.sma_body_input li.num6{
	background: #199F00;
	color: #FFF;
}

  /* リセットボタン */
  .reset_ul{
    position:absolute;left:-9px;top:-2px;
    display:none;cursor:pointer;user-select:none;
  }
  .reset_ul div{
    width:40px;height:40px;border-radius:0px;
   background: url("../images/sma_clear.png") no-repeat center center /100%;
	  display:flex;align-items:center;justify-content:center;
  }
  .sma_body_input.has-input .reset_ul { display:block; }

  /* ピッカー */
  .num-picker {
		background:#fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
		border: 1px solid #ddd;
		border-radius: 10px;
		width: calc(100% - (6px * 2) - (1px * 2)); /* yui edit */
		padding: 6px;
    position: absolute;
		z-index: 1000;
  }
  .num-picker.hidden{ display:none; }
  .num-picker .grid{display:grid;grid-template-columns:repeat(6,auto);gap:6px;}
  .num-picker button {
		border: 1px solid #ddd;
		border-radius: 8px;
		font-size: 40px;
		font-weight: 700;
		width: calc((100% - (6px * 5)) / 6); /* yui edit */
    min-width: 58px;
		height: 58px;
		padding: 0;
    cursor: pointer;
  }
  .num-picker button:disabled{opacity:.35;cursor:not-allowed;}
  .num-picker .n1{background:#fff;color:#000;}
  .num-picker .n2{background:#222;color:#fff;border-color:#000;}
  .num-picker .n3{background:#B40023;color:#fff;border-color:#FA3632;}
  .num-picker .n4{background:#0061D5;color:#fff;border-color:#0F1643;}
  .num-picker .n5{background:#F8D01F;color:#000;border-color:#FDD835;}
  .num-picker .n6{background:#199F00;color:#fff;border-color:#1F9F41;}

.sma_form01,.sma_form02{
	width: 400px;
	height: 50px;
	margin: 20px auto;
}
.sma_form01 dl dt, .sma_form01 dl dd,.sma_form02 dl dt, .sma_form02 dl dd{
	float: left;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-weight: 700;
	font-size: 26px;
	border-radius: 20px;
	cursor: pointer;
}
.sma_form01 dl dt{
	background: #626262;
	color: #fff;
	border: 2px solid #fff;
	margin-left: 5px;
	width: 185px;
}
.sma_form01 dl dd{
	color: #000;
	border: 2px solid #BE0B7C;
	margin-left: 10px;
	background: url("../images/sma_arrow.png") no-repeat #fff;
	background-size: 16px 16px;
	background-position: 160px 12px;
	width: 175px;
	padding-right: 10px;
}
.sma_form01 dl dd a{
	text-decoration: none;
	color: #000;
	line-height: 40px;
	display: block;
}


.sma_form02 dl dt{
	color: #000;
	border: 2px solid #BE0B7C;
	margin-left: 5px;
	background: url("../images/sma_arrow2.png") no-repeat #fff;
	background-size: 16px 16px;
	background-position: 18px 12px;
	width: 175px;
	padding-left: 10px;
}
.sma_form02 dl dd{
	color: #FFF;
	border: 2px solid #FFF;
	margin-left: 10px;
	background: url("../images/sma_arrow3.png") no-repeat #BE007C;
	background-size: 16px 16px;
	background-position: 160px 12px;
	width: 175px;
	padding-right: 10px;
}

.sma_form02 dl dt a{
	text-decoration: none;
	color: #000;
	line-height: 40px;
	display: block;
}
.sma_form02 dl dd a{
	text-decoration: none;
	color: #FFF;
	line-height: 40px;
	display: block;
}

#yoso_sma.all_down{
	pointer-events: none;
}
#yoso_sma.all_down .sma_form01 dt, #yoso_sma.all_down .sma_form01 dd{
	opacity: 0.3;
}


