@media (max-width: 1000px) {

     #gnav_rv .closeBtn, #mainArea .loginBox .closeBtn, #userBox .closeBtn, #bnrFloat .closeBtn {
      width: 3vw;
      height: 3vw;
      top: 2vw;
      right: 2vw; }
      
      #gnav_rv .closeBtn:before, #mainArea .loginBox .closeBtn:before, #userBox .closeBtn:before, #bnrFloat .closeBtn:before, #gnav_rv .closeBtn:after, #mainArea .loginBox .closeBtn:after, #userBox .closeBtn:after, #bnrFloat .closeBtn:after {
        height: 4vw; } 



#headerBox .pc,
.homeSection .pc,
#footer .pc {display: none !important;}

#headerBox .sp,
.homeSection .sp,
#footer .sp {display: block!important;}

.spboxMenu {
	display:block;}

  img.fit {
    width: 100%;
    height: auto;
  }

  /*-------------------------------------------------
      css Overwrite
  -------------------------------------------------*/
   body {
    overflow-y: scroll; }
 
  body.isFixed {
    width: 100%;
    height: 100%;
    position: fixed;
  }
body {
  -webkit-text-size-adjust: 100%;
}
  #container {
    min-width: 100%;
    width: 100%;
  }

  .slick-slider.slick-dotted {
    margin-bottom: 7vw;
  }

  .slick-next,
  .slick-prev {
    width: 6vw;
    height: 6vw;
  }
  .slick-next:before,
  .slick-prev:before {
    width: 6vw;
    height: 6vw;
    background-size: 6vw 6vw;
  }
  .slick-prev {
    left: -8vw;
  }
  .slick-next {
    right: -8vw;
  }

  .slick-dots {
    top:calc(100% + 2vw);
  }
  .slick-dots li {
    width: 3vw;
    height: 3vw;
    padding: 0;
    margin: 0 .5vw;
  }
  .slick-dots li button {
    width: 3vw;
    height: 3vw;
  }
  .slick-dots li button:before {
    width: 3vw;
    height: 3vw;
    font-size: 2.4vw;
    line-height: 1;
  }


 /*-------------------------------------------------
      COMMON
  -------------------------------------------------*/
  .homeSection {
    padding: 6vw 0;
  }
  .homeSection h2 {
    font-size: 4vw;
  }
.homeSection .inner,
.userpanel .inner,
#footer .inner {
    padding: 0 5vw;
    width: 100%;
  }

  .slideWrap {
    padding: 0 5vw;
  }

  .colorHr:after {
    height: .8vw;
  }
  .secBlock {
    margin-top: 3vw;
    padding: 0;
  }

  .secFlex.sec2BoxSP .secHalf,
  .secFlex.sec2BoxSP > li {
    width: 49%;
    margin-right: 2%;
    margin-bottom: 3vw;
  }
  .secFlex.sec2BoxSP .secHalf:nth-of-type(2n),
  .secFlex.sec2BoxSP > li:nth-of-type(2n) {
    margin-right: 0;
  }
  .secFlex.sec2BoxSP .secHalf:nth-last-of-type(-n+2),
  .secFlex.sec2BoxSP > li:nth-last-of-type(-n+2) {
    margin-bottom: 0;
  }
  .secFlex.sec2BoxSP > li:nth-child(odd) {
    margin-right: 2%;
    margin-bottom: 3vw;
  }
  .secFlex.sec3BoxSP > li {
    width: 32%;
    margin-right: 2%;
    margin-bottom: 3vw;
  }
  .secFlex.sec3BoxSP > li:nth-of-type(3n) {
    margin-right: 0;
  }
  .secFlex.sec3BoxSP > li:nth-last-of-type(-n+3) {
    margin-bottom: 0;
  }
  .secFlex.sec4BoxSP > li {
    width: 23.5%;
    margin-right: 2%;
    margin-bottom: 3vw;
  }
  .secFlex.sec4BoxSP > li:nth-of-type(4n) {
    margin-right: 0;
  }
  .secFlex.sec4BoxSP > li:nth-last-of-type(-n+4) {
    margin-bottom: 0;
  }
  .secFlex.sec5BoxSP > li {
    width: 18.4%;
    margin-right: 2%;
    margin-bottom: 3vw;
  }
  .secFlex.sec5BoxSP > li:nth-of-type(5n) {
    margin-right: 0;
  }
  .secFlex.sec5BoxSP > li:nth-last-of-type(-n+5) {
    margin-bottom: 0;
  }

  .secFlex.sec6Box > li,
  .secFlex.sec6Box > li a {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    padding: 4vw;
    display: flex;
    flex-wrap: wrap;
    background-color: rgba(229, 229, 229, 0.5);}
  .secFlex.sec6Box > li a {
    margin-bottom: 0px;
        padding: 0;
        background-color: rgba(229, 229, 229, 0);}

  
  .secFlex.secSpFull .secHalf,
  .secFlex.secSpFull > li {
    width: 100%;
    margin-right: 0;
    margin-bottom: 3vw;
  }
  .secFlex.spnoflex {
    display: block;
  }
  .secFlex.spnoflex li.slick-slide {
    width: 100%;
    margin-right: 0;
  }
  .secFlex .row2 li {
    margin-bottom: 3vw;
  }

  .arrowbtn {
    padding: 1.5vw 10vw;
    font-size: 3.4vw;
    min-width: 62%;
  }




  .tglBtn:after {
    width: 4vw;
    height: 4vw;
    background-size: 4vw 4vw;
  }

  .moreBtn {
    margin-top: 3vw;
  }
  .moreBtn a {
    font-size: 3vw;
  }


  /*-------------------------------------------------
      Header
  -------------------------------------------------*/
  .spAppBtn {
    background-color: #000;
    width: 100%;
    height: 12vw;
    padding: 2vw 5vw;
    margin: 0 auto;
    text-align: center;
    font-weight: bold;
  }
	body.iPhone .spAppBtn {
		display:none!important;
	}

  #headerBox,
  #headerBox2 {
    height: auto;
    width: 100%;
  }
	body.login.home.iPhone #headerBox,
	body.login.home.iPhone #headerBox2 {
		padding-top:10vw;
	}

  #header.rv {
    padding: 2vw 0 2vw 0;
    min-height: inherit;
    width: 100%;
  }

  #header.rv.colorHr:after {
    display: none;
  }

  #header.rv .headerInner {
    justify-content: space-between;
    width: 100%;
    padding: 0 12vw 0 3vw;
  }

  #header.rv #logo {
    width: 30%;
  }

  #header.rv #logo img {
    width: 100%;
    height: auto;
  }
  
  #header.rv #headerNavi {
    width: 68%;
    margin-left: 0;
  }

  #header.rv #headerNavi .logOutMenu ul li {
    width: 48%;
    margin-left: 2%;
  }

  #header.rv #headerNavi .logOutMenu ul li a {
    width: 100%;
    border-radius: 5px;
    font-size: 74%;
    padding: 1vw;
    line-height: 1.2;
  }
      
  #header.rv #headerNavi .logOutMenu ul li a.newspat {
    margin-right: 2%;
    background-image: none;
  }
  #header.rv #headerNavi .logOutMenu ul li a.newpp {
    background-image: none;
  }
  #header.rv #headerNavi .logInMenu {
    padding-right: 0;
  }
  #header.rv #headerNavi .logInMenu .todaysInfo {
    width: 30vw;
  }

#header.rv #headerNavi .logInMenu .todaysInfo dl {
	flex-wrap: wrap;
	max-width: inherit;
}
#header.rv #headerNavi .logInMenu .todaysInfo dl dt {
	width: 100%;
	padding: 1vw 2vw;
	font-size: 78%;
	justify-content: center;
	border-radius: 7px 7px 0 0;
}

#header.rv #headerNavi .logInMenu .todaysInfo dl dd {
	width: 100%;
	display: flex;
	justify-content: center;
	border-radius: 0 0 7px 7px;
	padding: 0 2vw;
	gap: 0 2vw;
}

#header.rv #headerNavi .logInMenu .todaysInfo dl dd a,
#header.rv #headerNavi .logInMenu .todaysInfo dl dd span {
	display: block;
}
#header.rv #headerNavi .logInMenu .todaysInfo dl dd img {
	width: 100%;
	height: 20px;
	margin: 0;
}
  #header.rv #headerNavi .logInMenu .userMenu ul li {
    margin-left: 0;
  }
  #header.rv #headerNavi .logInMenu .userMenu ul li a img {
    margin-right: 0;
  }
  #header.rv #headerNavi .logInMenu .userMenu ul li #userImgHead {
    width: 13vw;
    margin: 0 1vw;
  }

  #header.rv #headerNavi .logInMenu .userMenu ul li #userImgHead img {
    width: 100%;
    height: auto;
  }
  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead {
    width: 14vw;
    padding: 1vw;
    background-color: #0C3680;
    border-radius: 3px;
    text-align: center;
    position: relative;
  }

  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead span {
    display: block;
    font-size: 70%;
    color: #FFF;
  }
  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead img {
    width: 60%;
    height: auto;
  }
  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead.exc:before {
    content: "";
    display: inline-block;
    background-image: url("../img/top/ic_exclamation.svg");
    background-size: contain;
    background-repeat: no-repeat;
    width: 4vw;
    height: 4vw;
    position: absolute;
    top: -1vw;
    left: -1vw;
  }

  #header.rv .raceInfoAnchor {
    width: 18vw;
    height: 12vw;
    top: -12vw;
  }

  #header.rv .raceInfoAnchor a {
    background-color: #29A2D4;
    padding: 1vw .5vw;
  }

  #header.rv .raceInfoAnchor a img {
    height: 7vw;
    width: auto;
  }

  #header.rv .raceInfoAnchor a span {
    font-size: 1.6vw;
    margin-top: .5vw;
  }
  #header.rv .raceInfoAnchor a span:after {
    width: 2vw;
    height: 2vw;
    margin-left: .2vw;
  }
	body.iPhone:not(.home) #header.rv .raceInfoAnchor {
		display:none;
	}
	body.iPhone #header.rv .raceInfoAnchor {
		width:100%;
		padding: 1vw 3vw;
		height: 10vw;
		top: -10vw;
	}
	body.iPhone #header.rv .raceInfoAnchor a {
        background-color: #000;
		border-radius:9999px;
		text-decoration: none!important;
	}
	body.iPhone #header.rv .raceInfoAnchor a img {
	}
	body.iPhone #header.rv .raceInfoAnchor a span {
		font-size:3.2vw;
		width:auto;
		line-height:2;
	}
	body.iPhone #header.rv .raceInfoAnchor a span:after {
		width:3vw;
		height:3vw;
		vertical-align: middle;
	}

  .loginBtn {
    width: 100%;
    text-align: center;
    margin-top: 2vw;
  }

  .loginBtn a {
    min-width: 70%;
  }

  .spMenuBtn {
    position: absolute;
    top: 4vw;
    right: 2vw;
    width: 8vw;
    height: 10vw;
  }

  .spMenuBtn img {
    width: 100%;
    height: auto;
  }

  .validPointHead {
    padding: 0 3vw;
    margin-top: 2vw;
  }

  #gnav_rv {
    display: block;
    width: 100%;
    position: fixed;
	top: 0;
    left: 150vw;
    transform: translate3d(100%, 0, 0);
    background-color: #0C3680;
    padding: 10vw 0;
    z-index: 9999;
    height: 100vh;
    transition: all 0.2s ease-in;
	min-height: unset;
  }

  #gnav_rv.isOpen {
    left: 0;
    transform: translate3d(0, 0, 0);
  }
  #gnav_rv > ul {
    flex-wrap: wrap;
    width: 100%;
    justify-content: flex-start;
    padding: 0 5vw;
  }
  #gnav_rv > ul > li {
    padding: 0 3vw;
    width: 25%;
    margin-bottom: 3vw;
  }
  #gnav_rv > ul > li > a {
    padding: 0;
  }
  #gnav_rv > ul > li.current > a,
  #gnav_rv > ul > li:hover > a {
    text-decoration: none;
    background-color: transparent;
    color: #FFF;
  }
  #gnav_rv > ul > li span {
    display: block;
    font-size: 2.8vw;
    text-align: center;
  }
  #gnav_rv > ul > li span.img {
    background-color: #FFF;
    border-radius: 100%;
    padding: 3vw;
    margin-bottom: 2vw;
  }
  #gnav_rv > ul > li.exc > a {
    padding-left: 0;
  }
  #gnav_rv > ul > li.exc > a:before {
    top: 0;
    left: 0;
    transform: translateY(0);
  }
  .login #gnav_rv > ul > li.gmMypage > a, .login #gnav_rv > ul > li.gmCampaign > a {
    padding-right: 0;
  }
  .login #gnav_rv > ul > li.gmMypage > a:after, .login #gnav_rv > ul > li.gmCampaign > a:after {
    border-left: 1.5vw solid transparent;
    border-right: 1.5vw solid transparent;
    border-top: 1.5vw solid #0C3680;
    top: 14vw;
    left: 50%;
    transform: translateX(-50%);
  }
  #gnav_rv > ul > li.gmSns > a, #gnav_rv > ul > li.gmPoint > a {
    padding-right: 0;
  }
  #gnav_rv > ul > li.gmSns > a:after, #gnav_rv > ul > li.gmPoint > a:after {
    border-left: 1.5vw solid transparent;
    border-right: 1.5vw solid transparent;
    border-top: 1.5vw solid #0C3680;
    top: 14vw;
    left: 50%;
    transform: translateX(-50%);
  }
  #gnav_rv .subMenu {
    padding-bottom: 3vw;
    position: relative;
    padding-top: 0;
  }
  #gnav_rv .subMenu ul {
    padding: 5vw;
    border-radius: 0;
  }
 #gnav_rv .subMenu.subSns ul:before {
     display: none;
}

#gnav_rv .subMenu ul:before {
	border-width: 0 2.2vw 2.2vw 2.2vw;
	top: -2vw;
}
  #gnav_rv .subMenu ul li a {
    padding: 2vw;
    font-size: 2.2vw;
  }
  #gnav_rv .subMenu ul li a span.blank:after {
    width: 2.4vw;
    height: 2.4vw;
  }
  #gnav_rv .subMenu ul.type2col {
    width: 100%;
  }
  #gnav_rv .subMenu ul.type2col li {
    width: 49%;
    margin-right: 2%;
    margin-bottom: 2vw;
  }
  #gnav_rv .subMenu ul.type2col li a img {
    width: 5vw;
  }
  #gnav_rv .subMenu ul.type3col {
    width: 100%;
  }
  #gnav_rv .subMenu ul.type3col li {
    width: 32%;
    margin: 1% 0.6%;
  }
  #gnav_rv .subMenu ul.type3col li a img {
    width: 8vw;
    margin-bottom: 2vw;
  }
          #gnav_rv .subMenu ul.type3col li a span.red {
            color: #FF0000;
            font-size: 2.4vw;}

  /*-------------------------------------------------
      MAIN AREA
  -------------------------------------------------*/
#mainArea {
    padding: 0 0 3vw 0;
    background: #0c3680 url(../../common/img/topmainBg01_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;} 

body.iPhone #mainArea {
    padding: 0 0 3vw 0;
    background: none;
    position: relative;}
body.iPhone #mainArea::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg01_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}





  #mainArea .mainInner {
    display: block;
    width: 100%;
  }
  #mainArea .slideWrap {
    width: 100%;
    padding: 0;
    margin-right: 0;
  }
  #mainArea .slideWrap .slideBox {
    height: 86vw;
  }
  #mainArea .slideWrap .slick-slider.slick-dotted {
    margin-bottom: 16vw;
  }
  #mainArea .slideWrap .slick-list {
    height: 67vw;
  }
  #mainArea .slideWrap .slick-next,
  #mainArea .slideWrap .slick-prev {
    width: 8vw;
    height: 8vw;
  }
  #mainArea .slideWrap .slick-next:before,
  #mainArea .slideWrap .slick-prev:before {
    width: 8vw;
    height: 8vw;
    background-size: 8vw 8vw;
  }
  #mainArea .slideWrap .slick-next {
    right: 2vw;
  }
  #mainArea .slideWrap .slick-prev {
    left: 2vw;
  }
	#mainArea .slideWrap .slick-dots {
		top:calc(100% + 11vw);
		padding:0 10vw;
	}
  #mainArea .slideWrap .chengeBtn {
    bottom: 9vw;
  }
  #mainArea .slideWrap .chengeBtn span {
    font-size: 3vw;
    padding: 2vw 5vw;
    width: 40vw;
    margin: 0 2vw;
  }
  #mainArea .loginBox {
    display: none;
    width: 90%;
    position: fixed;
    top: 15vw;
    left: 5%;
    padding: 10vw 5vw 5vw 5vw;
    z-index: 9999;
  }
  #mainArea .loginBox.loginOpen {
    display: block;
  }

  body.login #mainArea .slideWrap {
    margin-top: 0;
  }
  body.login #mainArea .slideWrap .slick-next {
    right: 2vw;
  }
  body.login #mainArea .slideWrap .slick-prev {
    left: 2vw;
  }
  body.login #mainArea .slideWrap ul li.slick-slide {
    display: block;
    width: 100%;
    transform: scale(1);
    opacity: 1;
  }

  body.login .userpanel {
    display: none;
    position: fixed;
    width: 96%;
    background-color: #FFF;
    position: fixed;
    top: 2vw;
    left: 2%;
    padding: 10vw 0 5vw 0;
    z-index: 9999;
  }

  body.login .userpanel .inner {
    padding: 0 3vw;
  }
  body.login .userpanel.usermenuOpen {
    display: block;
  }

	body.login .spboxMenu * {
		box-sizing: border-box;
	}
  body.login .spboxMenu {
	  box-sizing: border-box;
    background-color: #000;
    color: #FFF;
  }
  body.login .spboxMenu ul {
    display: flex;
    flex-wrap: wrap;
  }
  body.login .spboxMenu ul li {
    width: 25%;
    text-align: center;
    padding: .5vw;
    border: 1px solid #333;
    background-color: #000;
  }
  body.login .spboxMenu ul li:nth-of-type(2), body.login .spboxMenu ul li:nth-of-type(4), body.login .spboxMenu ul li:nth-of-type(5), body.login .spboxMenu ul li:nth-of-type(7) {
    background-color: #333;
  }
  body.login .spboxMenu ul li a {
    display: block;
    color: #FFF;
  }
  body.login .spboxMenu ul li .img img {
    width: auto;
    height: 8vw;
  }
  body.login .spboxMenu ul li span:not(.img) {
    font-size: 2.6vw;
    display: block;
  }
  body.login .spboxMenu.box7 ul li {
    background-color: #000;
  }
  body.login .spboxMenu.box7 ul li:nth-of-type(2) {
    width: 50%;
  }
  
 body.login .spboxMenu ul li.exc a:before {
      content: "";
      display: inline-block;
      background-image: url("../img/top/ic_exclamation.svg");
      background-size: contain;
      background-repeat: no-repeat;
      width: 16px;
      height: 16px;}

  
  

  #userBox {
    padding: 0;
    border-radius: 0;
  }
  #userBox .userBoxInner {
    flex-wrap: wrap;
  }
  #userBox #userImg {
    width: 18%;
    margin-right: 0;
    position: absolute;
  }
  #userBox #userInfo {
    width: 100%;
    margin-right: 0;
  }
  #userBox #userInfo #userName {
    margin-left: 23%;
  }
  #userBox #userInfo .validPoint {
    margin-left: 23%;
  }
  #userBox #userInfo .pointInfo {
    margin-top: 7vw;
  }
  #userBox #userInfo .pointInfo dt {
    font-size: 3vw;
    width: 50%;
    padding: 2vw 0;
  }
  #userBox #userInfo .pointInfo dd {
    font-size: 3vw;
    width: 50%;
    padding: 2vw 0;
  }
  #userBox #userInfo .pointInfo dd .arrowbtn {
    min-width: inherit;
  }
#userBox #userInfo .pointInfo dt.comp {
    width:70%;}
#userBox #userInfo .pointInfo dt.comp + dd {
    width:30%;}
  #userBox #userOther {
    width: 100%;
  }
  #userBox #userOther .infoBox .infoTitle {
    padding: 1vw 3vw;
  }
  #userBox #userOther .infoBox .infoTitle a {
    min-width: inherit;
  }
  #userBox #userOther .infoBox .infoList {
    padding: 3vw;
  }
  #userBox #userOther .infoBox .infoList dl {
    font-size: 3vw;
  }
  #userBox #userOther .infoBox .infoList dl dt {
    width: 100%;
    padding: 1vw 0 .5vw 0;
    border-bottom: 0;
  }
  #userBox #userOther .infoBox .infoList dl dd {
    width: 100%;
    padding: .5vw 0 1vw 0;
    font-weight: bold;
  }
  #userBox #userOther .infoBox .infoList dl dd a.new:before {
    position: absolute;
    top: -5vw;
    left: 27vw;
    padding: .2vw 2vw;
    font-size: 2.2vw;
  }
  #userBox .userBoxSpMenu {
    width: 100%;
    margin-top: 3vw;
  }
  #userBox .userBoxSpMenu .arrowbtn {
    width: 100%;
    font-size: 3vw;
    text-align: center;
    padding: 1.5vw 6vw;
  }
  #userBox .closeBtn {
    top: 5vw;
    right: 5vw;
  }
  #userBox .closeBtn:before, #userBox .closeBtn:after {
    height: 7vw;
  }

  .validPoint dt {
    padding: 1vw 2vw;
    font-size: 84%;
  }

  .validPoint dd {
    padding: 1vw 2vw;
    font-size: 84%;
  }
  .validPoint dd strong {
    font-size: 112%;
  }

  /*-------------------------------------------------
      CONTENTS
  -------------------------------------------------*/
  #ppInfo .infoStep {
    margin-top: 5vw;
  }
  #ppInfo .infoStep ul li {
    width: 28%;
  }
  #ppInfo .infoStep ul li .img {
    min-height: inherit;
  }
  #ppInfo .infoStep ul li .img img {
    width: 100%;
    height: auto;
  }
  #ppInfo .infoStep ul li p {
    font-size: 3vw;
  }
  #ppInfo .infoStep ul li:nth-of-type(1), #ppInfo .infoStep ul li:nth-of-type(2) {
    margin-right: 8%;
    padding-right: 2vw;
  }

  #ppInfo .infoStep ul li:nth-of-type(1):before, #ppInfo .infoStep ul li:nth-of-type(2):before {
    width: 6vw;
    height: 6vw;
    right: -5vw;
    border-width: 1px;
  }
  #ppInfo .infoStep ul li:nth-of-type(1):after, #ppInfo .infoStep ul li:nth-of-type(2):after {
    width: 2.5vw;
    height: 2.5vw;
    right: -3vw;
    border-width: 2px;
  }
  #ppInfo .moreBtn {
    padding: 0;
  }
  #ppInfo .moreBtn a {
    min-width: inherit;
  }
  #ppInfo .infoEntryBtn a {
    padding: 3vw 14vw;
    font-size: 4vw;
  }
  #ppInfo .infoEntryBtn a.arrowbtn {
    border-radius: 1vw;
  }
  #ppInfo .infoEntryBtn a.arrowbtn:before {
    width: 3vw;
    height: 3vw;
    left: 3vw;
  }
  #ppInfo .infoEntryBtn a img {
    width: 100%;
    height: auto;
    margin-right: 0;
  }

  .infoPanel {
    padding: 0;
    margin-top: 5vw;
  }
  .infoPanel > ul > li {
    padding: 14vw 3vw 5vw 3vw;
    width: 100%;
    display: block;
  }

  .infoPanel > ul > li:nth-of-type(1) {
    margin-right: 0;
  }
  .infoPanel > ul > li .title {
    font-size: 4vw;
    padding: 1vw;
  }
  .infoPanel > ul > li p {
    font-size: 2.8vw;
  }
  .infoPanel > ul > li .img {
    padding: 0 10vw;
    margin: 3vw auto;
  }
  .infoPanel > ul > li .link a {
    min-width: 75%;
  }
  .login .infoPanel {
    padding: 0;
  }
  .login .infoPanel > ul > li {
    width: 100%;
    margin-right: 0 !important;
    margin-bottom: 3vw;
  }
  .login .infoPanel > ul > li .infoPanelBox .boxtop {
    margin-bottom: 3vw;
  }
  .login .infoPanel > ul > li .infoPanelBox .boxtop .infoEntryList {
    padding: 0 10vw;
  }
  .login .infoPanel > ul > li .infoPanelBox .boxtop .infoEntryList li {
    margin-bottom: 2vw;
  }
  .login .infoPanel > ul > li .infoPanelBox .boxtop .infoEntryList li .entried {
    border-radius: 2vw;
    padding: 2vw;
    font-size: 3.2vw;
  }
  .login .infoPanel > ul > li .infoPanelBox .boxtop .infoEntryList li:after {
    width: 5vw;
    height: 5vw;
  }
  .infoSlider {
    display: flex;
    width: 100%;
    overflow-x: scroll;
    padding-bottom: 7px;
  }

.infoPanel > ul > li .infoPanelBox .inSlider {
    padding: 0 !important;
}
  .infoSlider:not(.minimum)::-webkit-scrollbar {
    width: 4px;
  }
  .infoSlider:not(.minimum)::-webkit-scrollbar-track {
    background: #DBDBDB;
  }
  .infoSlider:not(.minimum)::-webkit-scrollbar:horizontal {
    height: 4px;
  }
  .infoSlider:not(.minimum)::-webkit-scrollbar-thumb {
    background: #5C5C5C;
    border-radius: 0;
    box-shadow: none;
  }
  .infoSlider:not(.minimum)::-webkit-scrollbar-thumb:horizontal {
    background: #5C5C5C;
    border-radius: 0;
  }
  .infoSlider li {
    width: 100px !important;
    position: relative;
    min-width: 100px;
    margin: 0 5px;
    padding-top: 27px;
  }

  #ppStep .inner {
    padding: 0;
  }
  #ppStep .stepWrap {
    margin-top: 6vw;
    overflow-x: scroll;
  }
  #ppStep .stepWrap::-webkit-scrollbar {
    width: 8px;
  }
  #ppStep .stepWrap::-webkit-scrollbar-track {
    background: #FFF;
  }
  #ppStep .stepWrap::-webkit-scrollbar:horizontal {
    height: 8px;
  }
  #ppStep .stepWrap::-webkit-scrollbar-thumb {
    background: #0C3680;
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #FFF;
  }
  #ppStep .stepWrap::-webkit-scrollbar-thumb:horizontal {
    background: #0C3680;
    border-radius: 0;
  }
  #ppStep .stepWrap ul {
    flex-wrap: nowrap;
    width: calc(45vw * 5);
    margin-bottom: 5vw;
  }
  #ppStep .stepWrap ul li {
    width: 45vw;
    padding: 15vw 3vw 3vw 3vw;
  }
  #ppStep .stepWrap ul li:nth-of-type(1) .imgbox .img img {
    height: 7vw;
    width: auto;
  }
  #ppStep .stepWrap ul li:nth-of-type(3) .label {
    padding: 3vw 2vw;
  }
  #ppStep .stepWrap ul li h3 {
    top: 3vw;
    padding: 2vw 2vw 2vw 2vw;
    font-size: 3.2vw;
    font-weight: normal;
  }
  #ppStep .stepWrap ul li h3:after {
    border-width: 4.6vw 0 4.6vw 2.2vw;
  }
  #ppStep .stepWrap ul li .imgbox {
    min-height: 26vw;
  }
#ppStep .stepWrap ul li .imgbox .img img {
    max-height: 15vw;
    width: auto;
  }
  #ppStep .stepWrap ul li p {
    font-size: 3vw;
  }
  #ppStep .stepWrap ul li .label {
    padding: 1vw 2vw;
    font-size: 2.8vw;
  }
  #ppStep .stepWrap ul li a {
    font-size: 3vw;
    padding: 1.5vw 7vw;
  }


#ppStep .faqWrap {
    padding: 0 5vw;
    margin-top: 3vw;
  }
  #ppStep .faqWrap .faqTitle {
    font-size: 4vw;
    padding: 3vw 10vw;
    width: 100%;
    height: inherit;
  }
  #ppStep .faqWrap .faqTitle:after {
    width: 4vw;
    height: 4vw;
    background-size: 4vw 4vw;
  }
  #ppStep .faqWrap .faqContents {
    padding: 3vw;
  }
  #ppStep .faqWrap .faqContents .closeBtn {
    padding-right: 5vw;
  }
  #ppStep .faqWrap .faqContents .closeBtn:before, #ppStep .faqWrap .faqContents .closeBtn:after {
    height: 4vw;
  }
  #ppStep .faqWrap .faqContents dl dt, #ppStep .faqWrap .faqContents dl dd {
    font-size: 3.6vw;
    padding: 2vw 2vw 2vw 10vw;
  }
  #ppStep .faqWrap .faqContents dl dt:before, #ppStep .faqWrap .faqContents dl dd:before {
    width: 7vw;
    height: 7vw;
    left: 2vw;
    top: 2.4vw;
    font-size: 4vw;
    line-height: 7vw;
  }

.raceInfoList {
    padding: 0 5vw;
  }
  .raceInfoList .slick-list {
    padding: 0 !important;
  }
  .raceInfoList ul.secFlex.sec3Box .slick-track {
    display: flex;
  }
  .raceInfoList ul.secFlex.sec3Box .slick-slide {
    background-color: #FFF;
    color: #333;
    padding: 5vw;
    border-radius: 2vw;
    border-right: 2vw solid #29A2D4;
    border-bottom: 2vw solid #29A2D4;
    position: relative;
    width: 80vw;
    height: auto !important;
  }
  .raceInfoList ul.secFlex.sec3Box .slick-slide img {
    width: 100%;
    height: auto;
  }
  .raceInfoList ul.secFlex.sec3Box .slick-slide h3, .raceInfoList ul.secFlex.sec3Box .slick-slide h4 {
    text-align: center;
    color: #0C1A5B;
    font-size: 3vw;
    font-weight: bold;
    margin-top: 3vw;
  }
  .raceInfoList ul.secFlex.sec3Box .slick-slide p {
    text-align: center;
    font-size: 2.4vw;
  }

  .videoWrap {
    margin: 5vw auto;
    padding: 0 5vw;
  }

  #memberContents .inner {
    padding: 0;
  }
  #memberContents .tglBtn {
    width: 100%;
    overflow: hidden;
    height: 14vw;
  }
  #memberContents .tglBtn img {
    transform: scale(1.5, 1.5) translateY(1.3vw);
  }
  #memberContents .contentList {
    padding: 3vw;
  }
  #memberContents .contentList h4 {
    font-size: 3vw;
    margin-bottom: 2vw;
  }
  #memberContents .contentList p {
    font-size: 2.8vw;
  }
#memberContents .contentList img {
    width: 80%;
    height: auto;
    margin: 0 auto 3vw auto;
}

#newsArea .newsBlock {
    margin-top: 5vw;
  }
  #newsArea .newsTab {
    width: 100%;
  }
  #newsArea .newsTab ul li {
    margin-right: .5vw;
    width: calc(calc(100% - 3vw) / 6);
    display: flex;
    align-items: stretch;
  }
  #newsArea .newsTab ul li a {
    border-radius: 2vw 2vw 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.4vw;
    padding: 1vw;
  }
  #newsArea .newsContent {
    background-image: none;
    background: #FFF;
  }
  #newsArea .newsContent .tabInner {
    width: 100%;
    padding: 3vw 0;
  }
  #newsArea .newsContent ul li {
    padding: 3vw;
  }
  #newsArea .newsContent ul li .thumb {
    width: 15vw;
    margin-right: 3vw;
  }
  #newsArea .newsContent ul li .thumb img {
    width: 100%;
    height: auto;
  }
  #newsArea .newsContent ul li .detail {
    width: calc(100% - 18vw);
  }
  #newsArea .newsContent ul li .detail .date {
    font-size: 2.8vw;
  }
  #newsArea .newsContent ul li .detail .label {
    font-size: 2.4vw;
    padding: 0 2vw;
    margin-left: .5vw;
    line-height: 1.4;
    vertical-align: text-top;
  }
  #newsArea .newsContent ul li .detail .text {
  font-size: unset;
    padding-right: 0;
  }

#newsArea .newsContent ul li .detail .text a { font-size: 3vw;}

#newsArea .newsContent .moreBtn {
    margin: 5vw auto;
    text-align: center;
  }

  .bnrSlider li {
    padding: 0;
  }

.bnrSection {
    background: #0c3680 url(../../common/img/topmainBg03_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;
    color: #FFF; }

body.iPhone .bnrSection {
    color: #FFF;
    background: none;
    position: relative;}
body.iPhone .bnrSection::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg03_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}

  .bnrSection .secSpFull .secHalf {
    margin-bottom: 3vw !important;
  }

  #nextGradeRace h2 img {
    width: 50%;
    height: auto;
  }
  #nextGradeRace .raceSlider li {
    padding: 0 2vw;
  }
  #nextGradeRace .raceSlider li .detail {
    font-size: 3.2vw;
    margin-top: 2vw;
  }

/*-------------------------------------------------
      FOOTER
  -------------------------------------------------*/
  #footer {
    padding: 5vw 0 !important;
    background:#000 url(../img/top/footerBg_sp.jpg) no-repeat center top;
    background-size: 100% auto;
  }
  .login #footer {
    padding-bottom: 22vw !important;
  }
  #footer .footerApp {
    display: block !important;
  }
  #footer .footerApp .oficialApp {
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  #footer .footerApp .oficialApp a {
    display: block;
    margin: auto;
    font-size: 3.4vw;
    width: 80%;
    padding: 2vw 10vw;
  }
  #footer .footerApp .sns {
    margin-top: 5vw;
  }
  #footer .footerApp .sns ul {
    justify-content: center;
  }
  #footer .footerApp .sns ul li {
    margin-left: 0;
    padding: 0 2vw;
  }
  #footer .footerApp .sns ul li img {
    width: 10vw;
    height: auto;
  }
  #footer .footerContactBtn {
    width: 100%;
    margin-top: 5vw;
  }
  #footer .footerContactBtn a {
    display: block;
    width: 100%;
    background-color: #29A2D4;
    color: #FFF;
    line-height: 1.2;
    padding: 3vw 10vw 3vw 3vw;
    border-radius: 5px;
    position: relative;
  }
  #footer .footerContactBtn a:after {
    content: "";
    width: 5px;
    height: 5px;
    border-top: solid 1px #FFF;
    border-right: solid 1px #FFF;
    position: absolute;
    right: 6vw;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
  }
  #footer .footerNaviBlock {
    display: flex;
    flex-wrap: wrap;
    margin-top: 3vw;
  }
  #footer .footerNaviBlock .sptglBtn {
    display: block;
    width: 100%;
    border: 1px solid #999;
    border-radius: 5px;
    line-height: 1;
    padding: 3vw;
    position: relative;
  }
  #footer .footerNaviBlock .sptglBtn:after {
    content: "";
    display: block;
    width: 4vw;
    height: 4vw;
    background-image: url("../img/top/ic_tgl_open.svg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 4vw 4vw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 4vw;
  }
  #footer .footerNaviBlock .sptglBtn.isOpen:after {
    background-image: url("../img/top/ic_tgl_close.svg");
  }
  #footer .footerNaviBlock .spTglContents {
    display: none;
  }
  #footer .footerNaviBlock .spTglContents ul {
    display: flex;
    justify-content: flex-start;
    background-color: #000;
  }
  #footer .footerNaviBlock .spTglContents ul li {
    width: 50%;
/*    border: 1px solid #333;*/
    border-right: 1px #333 solid;
    border-bottom: 1px #333 solid;
  }
 #footer .footerNaviBlock .spTglContents ul li:nth-child(odd) {
    border-left: 1px #333 solid;
} 
  #footer .footerNaviBlock .spTglContents ul li:nth-last-of-type(1) {
    border-right: 1px #333 solid;
}
  #footer .footerNaviBlock .spTglContents ul li a {
    display: block;
    width: 100%;
    color: #FFF;
    line-height: 1.2;
    text-align: center;
    font-size: 2.4vw;
    padding: 2vw;
  }
  
  
  #footer .footerNaviBtn {
    width: 100%;
    margin-bottom: 3vw;
  }
  #footer .footerNaviBtn ul {
    margin-top: 0;
  }
  #footer .footerNaviBtn ul li {
    margin-right: 0;
    width: 100%;
    background-color: transparent;
    border-radius: 0;
  }
  #footer .footerNaviBtn ul li a {
    display: block;
    padding: 0;
    font-size: 3.2vw;
    font-weight: normal;
    height: 100%;
  }
  #footer .footerNavi {
    width: 100%;
  }
  #footer .footerNavi ul {
    margin-top: 0;
  }
  #footer .footerNavi ul li {
    font-size: 16px;
    border-left: 0px;
    line-height: 1.6;
  }
  #footer .footerNavi ul li:nth-last-of-type(1) {
    border-right: 0px;
  }
  #footer .footerNavi ul li a {
    padding: 0 3vw;
  }
  #footer .footerNavi.innerlink {
    order: 3;
  }
  #footer .footerNavi.innerlink ul li {
    width: 50%;
    padding: 1vw;
  }
  #footer .footerNavi.innerlink ul li.fullWidth {
    width: 100%;
  }
  #footer .footerNavi.innerlink ul li a {
    display: block;
    border: 1px solid #FFF;
    border-radius: 9999px;
    text-align: center;
    padding: 1vw 5vw;
    font-size: 2.8vw;
    position: relative;
  }
  #footer .footerNavi.innerlink ul li a:before {
    content: "";
    width: 5px;
    height: 5px;
    border-top: solid 1px #FFF;
    border-right: solid 1px #FFF;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
  }
  #footer .footerNavi.blanklink {
    order: 2;
    margin-bottom: 3vw;
  }
  #footer #copyright {
    padding: 5vw 0;
    font-size: 2.4vw;
    text-align: center;
    line-height: 1.6;
  }

  /*-------------------------------------------------
      FLOATING
  -------------------------------------------------*/
  #whatsPP {
    top: 90vw;
    left: 20%;
    width: 60%;
    text-align: center;
    transform: translateX(0);
  }
  #whatsPP a {
    background-size: 3vw auto;
    padding: 3vw 3vw 3vw 5vw;
    font-size: 3vw;
    border-radius: 1vw;
  }

  #bnrFloat {
    padding: 2vw;
    bottom: 5VW;
    max-width: inherit;
  }
  #bnrFloat ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  #bnrFloat ul li {
    width: 24vw;
    margin-right: 2vw;
    margin-bottom: 0;
  }
  #bnrFloat ul li:nth-last-of-type(1) {
    margin-right: 0;
  }
  #bnrFloat .closeBtn {
    width: 5vw;
    height: 5vw;
    left: -5vw;
  }

  #pageToTop {
    position: fixed;
    bottom: 5vw;
    right: 5vw;
    width: 13vw;
  }
  .login #pageToTop {
    bottom: 25vw;
  }

  #pageToTop img {
    display: block;
    width: 100%;
    height: auto;
  }

  #spCover {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 9998;
  }
  #spCover.loginOpen, #spCover.usermenuOpen {
    display: block;
  }

#mainArea .slideWrap .chengeBtn {}
#mainArea .slideWrap .chengeBtn span:hover,
#mainArea .slideWrap .chengeBtn span,
#mainArea .slideWrap .chengeBtn span a,
#mainArea .slideWrap .chengeBtn span a:link,
#mainArea .slideWrap .chengeBtn span a:hover {color: #29A2D4; background-color: #fff;display: block;text-decoration: none;}
#mainArea .slideWrap .chengeBtn span.current,
#mainArea .slideWrap .chengeBtn span.current a{color: #fff; background-color: #29A2D4;}




/*　テンキーのリセットCSS　*/
.inputBox div.tenkey_container {height: auto !important; display: block !important;}
.inputBox .tenkey_container > .span.common_dispTenkey { display: block;}
.inputBox section.tenkey {height: auto !important; padding: 3vw 3vw; margin-top: 1vw; width: 100% !important;display: flex;
    justify-content: center;}
.inputBox section.tenkey div {display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start;}
.inputBox .section.tenkey a {float: none; width: 10vw; height: 10vw;}



#ppStep {
    background: #0c3680 url(../../common/img/topmainBg02_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;
    color: #FFF;}

body.iPhone #ppStep {
    color: #FFF;
    background: none;
    position: relative;}
body.iPhone #ppStep::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:10vh%;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg02_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}

.img2 {
    background: #0c3680 url(../../common/img/topmainBg02_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;}

body.iPhone .img2 {
    background: none;
    position: relative;}
body.iPhone .img2::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg02_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}

.img4 {
    background: #0c3680 url(../../common/img/topmainBg04_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;}

body.iPhone .img4 {
    background: none;
    position: relative;}
body.iPhone .img4::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100%;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg04_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}

#raceInfo {
    background: #0c3680 url(../../common/img/topmainBg03_sp.jpg) no-repeat center bottom;
    background-attachment: fixed;
    background-size: 100%;}

body.iPhone #raceInfo {
    background: none;
    position: relative;}
body.iPhone #raceInfo::before {
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
    width:100vw;
    height:100vh;
    background-color: #0c3680;
    background-image: url(../../common/img/topmainBg03_sp.jpg) ;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size:100%;
    content:"";}


    #news_box #newsArea .newsContent #news_list .date {
        align-items: flex-start;
    }
    #news_box #newsArea .newsContent #news_list .detail {
        width: calc(100% - 9em);
    }
    #news_box #newsArea .newsContent #news_list .detail .label {  /* add 2023.09.06 */
        font-size: 104%;
    }
    #news_box #newsArea .newsContent #news_list .detail a.label:last-child {
        padding: 0;
        margin-top: 3px;
        margin-left: -8em;
        width: calc(100% + 9em);
    }





}






@media (min-width: 644px) and (max-width: 1000px) {
.spAppBtn {
    height: 12vw !important;
}
.arrowbtn {
    padding: 1.5vw 10vw !important;
    font-size: 3.4vw !important;
    min-width: 62% !important;
}
/*
#header.rv .raceInfoAnchor {
    width: 18vw !important;
    height: 12vw !important;
    top: -12vw !important;
}
*/
  #header.rv .raceInfoAnchor a {
    padding: 1vw 0.5vw !important;
  }
#header.rv .raceInfoAnchor a img {
    height: 7vw !important;
    width: auto !important;
}

#header.rv #logo {
    width: 30% !important;
}
#header.rv .headerInner {
    justify-content: space-between !important;
    width: 100% !important;
}
 .validPointHead {
    position: static !important;
    padding: 0 3vw !important;
    margin-top: 2vw !important;
  }
#header.rv #headerNavi {
    width: 68% !important;
}

.loginBtn {
position: static !important;
margin-top: 2vw !important;

}

#header.rv #headerNavi .logOutMenu ul li {
    width: 48% !important;
    margin-left: 2%;
}


}













@media (max-width: 759px) and (orientation: landscape) {
  .arrowbtn {
    padding: 0.5vw 10vw;
    font-size: 86%;
  }

  .spAppBtn {
    height: auto;
    padding: 2vh 5vh;
  }

  #headerBox,
  #headerBox2 {
    height: auto;
  }

  #header.rv {
    padding: 1vw 0;
  }

  #header.rv .headerInner {
    justify-content: flex-start;
    padding: 0 12vh 0 3vh;
  }

  #header.rv #logo {
    width: 18%;
  }

  #header.rv #headerNavi {
    margin-left: 2%;
    width: auto;
  }

  #header.rv #headerNavi .logOutMenu ul li {
    width: inherit;
    white-space: nowrap;
  }

  #header.rv #headerNavi .logInMenu .todaysInfo {
    width: auto;
  }

  #header.rv #headerNavi .logInMenu .todaysInfo dl dt {
    padding: 1vh 2vh;
  }

  #header.rv #headerNavi .logInMenu .todaysInfo dl dd {
    padding: 1vh 2vh;
  }

  #header.rv #headerNavi .logInMenu .userMenu ul li #userImgHead {
    width: 13vh;
  }

  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead {
    width: 14vh;
    padding: 1vh;
  }

  #header.rv #headerNavi .logInMenu .userMenu ul li #userInfoHead.exc:before {
    width: 4vh;
    height: 4vh;
  }

/*
  #header.rv .raceInfoAnchor {
    width: 30vh;
    height: 12vh;
    top: -12vh;
  }
*/

  #header.rv .raceInfoAnchor a {
    padding: 3vh 1vh 1vh 1vh;
    height: 100%;
    align-items: center;
  }

  #header.rv .raceInfoAnchor a img {
    width: 8%;
    height: auto;
  }

  #header.rv .raceInfoAnchor a span {
    width: 70%;
    margin-top: 0;
  }
  #header.rv .raceInfoAnchor a span:after {
    width: 1.5vw;
    height: 1.5vw;
    margin-top: -.3vw;
  }

  .loginBtn {
    position: absolute;
    top: 5vh;
    right: 12vh;
    padding: 0;
    margin-top: 0;
    width: auto;
  }

  .loginBtn .arrowbtn {
    min-width: inherit;
  }

  .spMenuBtn {
    top: 4vh;
    right: 2vh;
    width: 8vh;
    height: 10vh;
  }



  .validPointHead {
    position: absolute;
    top: 2vh;
    right: 12vh;
    padding: 0;
    margin-top: 0;
  }

  #gnav_rv {
    height: 100vw;
    overflow-y: scroll;
  }

  body.login .userpanel {
    height: 92%;
    overflow-y: scroll;
  }
/*
  .validPoint {
    display: block;
    border: 0;
  }


  .validPoint dt {
    display: block;
    width: 100%;
    border-radius: 7px 7px 0 0;
    padding: 1.3vh 2vh;
    text-align: center;
    border: 2px solid #FFB21F;
    border-bottom: 0;
  }

  .validPoint dd {
    display: block;
    padding: 1.3vh 2vh;
    width: 100%;
    border: 2px solid #FFB21F;
    border-radius: 0 0 7px 7px;
  }
*/

  #bnrFloat {
    padding: 2vh;
    bottom: 5vh;
  }

  #bnrFloat ul li {
    width: 24vh;
    margin-right: 2vh;
  }

  #pageToTop {
    bottom: 5vh;
    right: 5vh;
    width: 13vh;
  }

  .login #pageToTop {
    bottom: 25vh;
  }
}