/*----------------------------------
共通
------------------------------------*/
@media screen and (max-width:599px){
    .f16{font-size: 12px;}
    .f20{font-size: 14px;}
    .f24{font-size: 16px;}
    .f30{font-size: 20px;}
    .sectionTitleFlat{padding: 50px 0;}
    .spBtnWidth{padding: 0 30px; width: 100%;}
    .spBtnWidth .btnRed{padding: .8em 1em;}
    .subHeader{
        background: url(/img/up/r32/sub_headerback_sp.webp) no-repeat;
        background-size: contain;
        height: 48.31vw;
    }
    .subHeaderTitle img {height: 16.91vw;}
    .subHeaderTitle.long img{width: 76.33vw;}
    .contentTransparent{margin: 50px 0;}
    .contentFlex{flex-direction: column; align-items: center;}
}
/*--------初心者ガイド----------------*/
@media screen and (max-width:599px){
.greenNo{width: 20px;height: 20px;}
.stepImg{width: 122px;}
.beginnerImg{width: 100%;}
.bankFlex .buyBtn.sold{width: 100%;}
.bankFlex .buyBtn.sold::after{width: 14px;height: 14px;}
}
/*-----------------------------------------
テーブル
------------------------------------------*/
@media screen and (max-width:599px){
    /* table tr,table th,table td{display: block;}
    table tr th{width: 100%;} */
}
/*--------------------------------------
ページネーション
----------------------------------------*/
@media screen and (max-width:599px){
.pagination{
    /* justify-content: flex-start; */
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 0px;

}
.pager_link,
.pager_current{
    width: 30px;
    height: 30px;
    font-size: 14px;
}
}
/*----------------------------------
フォーム
------------------------------------*/
@media screen and (max-width:599px){
    .form.column .formBox,
    .textarea{
        border: 2px solid #2F3034;
        font-size: 14px;
    }
    .supportLabel{
        font-size: 20px;
    }
    #contactEmail,
    #contactMessage{font-size: 14px;}
}

/*--------------------------------
ハンバーガー
-----------------------------------*/
@media screen and (max-width:599px){
.topMenu{right: 15px;}
.drawerOpen{
    height: 13.29vw;
    width: 13.29vw;
    border-radius: 5px;
}
.drawerOpen span,
.drawerOpen span::before,
.drawerOpen span::after{
    height: 1.13vw;
    width: 9.08vw;
}
.drawerOpen span::before {bottom: 2.83vw;}
.drawerOpen span::after {top: 2.83vw;}
.topMenuContent{
    width: 100%;
}
.topMenuContent ul{
    margin: 25vw auto 20vw;
    display: flex;
    align-items: center;
    gap: 1em;
}

#drawerInput:checked ~ .topMenuContent{
    left: 0%;
  }

}
/*--------------------------------
メインビュー
-----------------------------------*/
@media screen and (max-width:599px){
.headerLogo {
    width: 49.16vw !important;
}
.indexTop{
    height: 100vh;
    min-height: 100vh;
    position: relative;
}
.indexTopAlea{
    height: 100%;
    width: 100%;
    background: url(/img/up/r32/index_top_sp.webp)no-repeat;
    background-size: cover;
    background-position: bottom;
    min-height: 100vh;
}
#mainvisual{
    width: 100%;
    height: 100vh;
}
.btnRed.entryBtn{
    font-size: 5.5vw;
    padding: 0.5em;
    width: 90%;
}
.lineBtn,.lineLogin{width: 90%;}
.topCopy {
    font-size: 10.88vw;
    margin-left: auto;
    margin-right: 4.83vw;
}
.marquee {
    font-size: 12.08vw;
    width: 100%;
    transform: none;
    bottom: 13.33vw;
}
.topLoginLink{font-size: 14px;}
}
/*-------------------------------------------
特典スライダー
---------------------------------------------*/
@media screen and (max-width:599px){
    .spTokuten li img{
        width:69.57vw;
        margin: 0 1em;
    }
}
/*---------------------------------------------
featherlight
-----------------------------------------------*/
@media screen and (max-width:1024px){
    .popLogo{width: 31.4vw;}
    .popTitle{width: 78.26vw;}
}
@media screen and (max-width:599px){
    .popinner{padding: 40px 1em 100px;}
    .featherlight .featherlight-close-icon {
        width: 12.52vw !important;
        line-height: 12.52vw !important;
    }
}
/*--------------------------------
最近の的中実績
-----------------------------------*/
@media screen and (max-width:599px){
    .indexResult::before{
        width: 82.13vw;
        height: 24.02vw;
        top: -20.03vw;
    }
    .sectionTitle.topresult{
        width: 53.14vw;
        top: -13.73vw;
    }
    .indexResult{
        height: 830px;
        background-position: center;
        background-size: cover;
    }
}
/*--------------------------------
TOP実績スライダー
-----------------------------------*/
@media screen and (max-width:599px){
    .resultCard{
        width: 280px;
        height: 642px;
        background: url(/img/up/r32/topjisseki_card_sp.webp) no-repeat;
        background-size: contain;
        background-position: center;
        position: relative;
        margin: 15% 10px;
    }
    .resultLabel{
        width: 263px;
        top:-3%;
    }
    .r_l_label{
        font-size: 18px;
    }
    .resultCard{
        display: flex;
        flex-direction: column;
    }
    .resultL{
        left: 3%;
        top: 2%;
    }
    .resultL img{
        width: 248px;
        margin-bottom: 10px;
    }
    .resultR p{
        font-size: 12px;
    }
    .resultR{
        top: 56%;
        right: 25%;
    }
    .r_l_plan,.r_l_day{
        font-size: 12px;
        margin-bottom: 15px;
    }
    .r_l_race{
        font-size: 14px;
    }
    .r_l_money{
        font-size: 40px;
        text-shadow:
        2px 2px 0 #000,
        -1px 1px 0 #000,
        1px -1px 0 #000,
        -1px -1px 0 #000;
        -webkit-text-stroke: 1px #FFF;
        margin-bottom: 13px;
    }
}
/*---------------------------------
お知らせ
-----------------------------------*/
@media screen and (max-width:599px){
    .sectionTitleFlat.newstitle{width: 135px;}
    .newsTitle{font-size: 20px;}
    .newsDay,.newsText{font-size: 12px;}
    .newsBox{
        box-shadow: none;
        border-radius: 20px;
        padding: 20px;
    }
    .news{background-size: inherit; background-position: left;}
}
/*---------------------------------
R32とは
-----------------------------------*/
@media screen and (max-width:599px){
    .aboutNo{margin-bottom: 20px;}
    .aboutNo.reverse{}
    .aboutBox,.aboutBox.reverse{flex-direction: column-reverse;margin-bottom: 50px;}
    .aboutInner2{width: 100%; height: 76.55vw;}
    .aboutTitle{font-size: 30px;margin-bottom: .5em;}
    .aboutText1{font-size: 14px;}
    .aboutText1.sub{font-size: 12px;}
    .aboutText2{font-size: 16px;}
    .aboutText2.sub{font-size: 20px;}
    .sectionTitleFlat.abouttitle{width: 210px;}
}
/*--------------------------------
口コミ
-----------------------------------*/
@media screen and (max-width:599px){
    .sectionTitleFlat.voiceTitle{width: 197px;}
    .voiceCard{width: 100%;margin-bottom: 50px;border:.2em solid #2F3034;}
    .voiceText,.voiceDay{font-size: 16px;}
    .voicePush{font-size: 12px;}
    .voiceCard::after{width: 30px;height:35px;top:-15px;}
    .voiceCard::before{bottom: -8vw;}
    .voicePush img{width: 20px;}
    .voiceCard.login{padding: 1em; margin-top: 1em;}
    .voicePlan span:nth-child(1){width:20px;height: 20px;line-height: 20px;}
}
/*--------------------------------
フッター(フォームエリア)
-----------------------------------*/
@media screen and (max-width:599px){
.footerAlea{
    background: url(/img/up/r32/footer_back.jpeg)no-repeat;
    background-position: center;
    background-size: cover;
    height: 166.67vw;
    padding-top: 40px;
}
.footerLogo{width: 181px;}
/* .footerTitle{transform: scale(1);} */
.footerTokuten.slider1{display: block !important;}
.footerTokuten img{width: 280px; margin: 0 10px;}
footer::before{height: 40px;background-size: contain;}
}
/*-----------------------------------------
フッターメニューエリア
------------------------------------------*/
@media screen and (max-width:599px){
    .footerMenuBox{
        width: 100%;
        flex-direction: column;
        align-items: center;
        gap: 3.13vw;
    }
    .footerMenu{
        width: 100%;
        display: flex !important;
        flex-direction: column;
    }
    .footerMenuItem{
        width: 100%;
        height: 57px;
        font-size: 16px;
        border-radius: 32px;
    }
    .footerLogoArea{width: 250px;}
    .btnRed.footer,.footerLink{font-size: 20px !important; padding: .5em;}
}
/*-----------------------------------------
的中実績ページ
------------------------------------------*/
@media screen and (max-width:599px){
    .hitCard{width: 70.53vw;height: 78.02vw;margin-bottom: 40px;}
    .hitCardLabel{width: 69.57vw;height: 10.14vw;}
    .hitLabel{font-size: 4.83vw;}
    .hitPlan{font-size: 3.86vw; margin-top: 2.17vw; margin-bottom: 1.78vw;}
    .hitMoney{font-size: 10.15vw;margin-bottom: 2.78vw;}
    .hitDay{font-size: 2.9vw;margin-bottom: 2.56vw;}
    .hitRace{font-size: 3.86vw;}
}

/*---------------------------ここからログイン後----------------------------------------*/
/*-------------------------------------
ログイン後フッター
--------------------------------------*/
@media screen and (max-width:599px){
.footerMenuArea{background-size: inherit;}
.footerRogo{width: 260px; margin: 0 auto 50px;}
.footerMenu.login .footerMenuItem{
    width: 44.93vw;
    font-size: 2.9vw;
    font-weight: bold;
    height: 40px;
}
.footerMenu.login{flex-direction: row !important;}
.footerLine{height: 40px;}
.footerLine::after{height: 30px; background-size: cover; background-position: center;}
.spfooterspace{height: 90px;}
}
/*----------------------------------------
ヘッダー１
------------------------------------------*/
@media screen and (max-width:599px){
    .loginLogo{width: 42.29vw;}
    .hed1text{font-size: 12px;}
    .header1Inner.mainWidthContent,
    .header2Menu.mainWidthContent{padding: 0px 3.33vw !important;}
}
/*--------------------------------
ハンバーガー(ログイン後)
-----------------------------------*/
@media screen and (max-width:599px){
    .menuOpen{
        width:55px;
        height: 55px;
    }
    .menuOpen span,
    .menuOpen span::before,
    .menuOpen span::after {
        height: 5px;
        width: 35px;
    }
    .menuOpen span::before {bottom: 10px;}
    .menuOpen span::after {top: 10px;}
    #menuInput:checked ~ .loginMenuContent{
        left: 0 !important;
    }
    .menuList{margin: 120px 30px; width: auto; gap: 1em;}
    .MenuItem img{width: 20vw; !important;}
    .MenuItem{font-size: 3.38vw;}
    .subMenuList{font-size: 5.38vw; gap: 1em; margin: 30px 0;}
}
/*-------------------------------------
的中実績
--------------------------------------*/
@media screen and (max-width:599px){
    .resultTitle{
        width: 53.14vw;
        margin: 20px auto 0;
    }
    .login.resultCard,
    .login.resultCard .resultLabel{
    transform: scale(1);
    }
    .loginResult{background-size:cover;}
    .loginResult::after{
        border-right: 20px solid transparent;
        border-left: 20px solid transparent;
        border-top: 30px solid #ebce46;
    }
}
/*-------------------------------------
おすすめ情報
--------------------------------------*/
@media screen and (max-width:599px){
.pushTop{
    background-size: inherit;
    background-position: top;
}
.pushBanner a img{width: 60%; width: 70vw; margin: 0;}
.pushTop::after{
    height: 20px;
    background:url(/img/up/r32/rainbow.png);
    background-repeat: repeat-x;
    background-size: inherit;
    background-position: center;
}
}
/*-------------------------------------
プラン一覧メイン
--------------------------------------*/
@media screen and (max-width:599px){
.loginMainPlan::before{
    width: 72.46vw;
    height: 19.32vw;
    top: -16.91vw;
}
.sectionTitle1{width: 40.27vw;top: -10vw;}
}
/*-------------------------------------
プラン一覧タブ
--------------------------------------*/
@media screen and (max-width:599px){
    .tab_area{gap: .5em;}
    .btnRed.tab{
        font-size: 1.4rem;
        padding: 1em .5em;
    }
}
/*-------------------------------------
プランカード
--------------------------------------*/
@media screen and (max-width:599px){
    .planCard.row .planCardTop{flex-direction: column;}
    .planCard.row .planCardTop .planBanner{width: 100%;}
    .planCard{width: 100%;}
    .planCardUser div img{width: 5.19vw;}
    .good{width: 5.19vw;height:5.19vw;}
    .planLabel span,
    .planLabel.tousen::before,
    .planLabel.gentei::before,
    .planLabel.tihou::before{font-size: 2.82vw; border-radius: 3px;}
    .planCardMoney{font-size: 7.25vw;}
    .planCardMoney img{width: 6.67vw;}
    .discount{font-size: 4.13vw;}
    .buyBtn{font-size: 3.38vw;}
    .planCardTop.check::after{width: 20.49vw;height:20.49vw;}
    .planCardTop.sold::after{width: 14.49vw;height:14.49vw;}
    .planCard.row .planCardTop.check::after{top: -3%; left: -3%;}
    .planCardsummary{line-height: 2.5;}
    .planCardLine{height: 2px; margin: 1em 0;}
    .planBanner.BannerOnly{width: 100%;}
    .soldLabel img{width:20px;}
}
/*---------------------------------------------
ポイント、無料情報
-----------------------------------------------*/
@media screen and (max-width:599px){
    .sectionTitle2{padding: 14.15vw 0;}
    .sectionTitle2 span.point,
    .sectionTitle2 span.free{
        width: 51.69vw;
        height: 16.91vw;
    }
    .sectionTitle2 span:nth-child(1),
    .sectionTitle2 span:nth-child(3){
        margin-top: 12.08vw;
    }
}
/*-------------------------------------
メッセージ
---------------------------------------*/
@media screen and (max-width:599px){
    .messageList{padding: 5.15vw 0;}
    .meesageBox{flex-direction: column;}
    .meesageInner{border-radius: 10px 10px 0 0;}
    .messaLink{width: 100%;height: 50px; border-radius: 0 0 10px 10px;}
}
/*-------------------------------------
プラン詳細
---------------------------------------*/
@media screen and (max-width:599px){
    .detailCard{
        width: 54.26vw;
        height: 35.89vw;
        margin: 0;
     }
    .detailCard .hitAlea .hitLabel{
        top: 0%;
        font-size: 3.83vw;
     }
    .detailCard .hitAlea .hitPlan{
        margin-top: 6.5vw;
        margin-bottom: 0.78vw;
     }
    .detailCard .hitMoney {
        font-size: 7.15vw;
        margin-bottom: 0.98vw;
    }
    .detailCard.hitDay {
        margin-bottom: 1.56vw;
    }
    .detailCard .hitRace {
        font-size: 3.36vw;
    }
    .detailCard::after{width: 50px;height: 50px;}
    .dcMonye{font-size: 3rem;}
    .detailSliderImg{width: 300px; margin: 30px 10px 0;}
}