@charset "UTF-8";

/* ベース */

#jitensyarule {
    width: 100%;
    margin: 30px 0 0 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Kiwi Maru", -apple-system, BlinkMacSystemFont,
    "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", sans-serif;
    overflow: hidden;
    line-height: 1.6;
    background: url(../images/bg.jpg) center center repeat ;
}

@media screen and (max-width: 768px) {
    #jitensyarule {
        margin: min(30px, 3.9%) 0 0 0;
        background: url(../images/bg.jpg) center center / 12.5px 12.5px repeat ;
    }
}

@media screen and (max-width: 480px) {
    #jitensyarule {
        margin: min(40px, 12.5%) 0 0 0;
    }
}

#jitensyarule a {
    transition: ease-in-out .5s;
}

#jitensyarule a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 768px) {
    #jitensyarule a:hover {
        opacity: 1;
    }
}

#jitensyarule * {
    box-sizing: border-box;
}

#jitensyarule img {
    display: block;
    width: 100%;
    max-width: 100%;
}

#jitensyarule a img {
    opacity: 1;
    filter: alpha(opacity=100);
    transition: 0.5s ease-in-out;
}

#jitensyarule a:hover {
    text-decoration: none;
}

#jitensyarule a:hover img {
    opacity: 0.7;
    transition: 0.5s ease-in-out;
}

@media screen and (max-width: 768px) {
    #jitensyarule a:hover img {
        opacity: 1;
    }
}

#jitensyarule ul, #jitensyarule li {
    list-style: none;
}

#jitensyarule .pc {display: block;}
#jitensyarule .sp {display: none;}

@media screen and (max-width: 768px) {
    #jitensyarule .pc {display: none;}
    #jitensyarule .sp {display: block;}
}

/*--------------
レイアウト
--------------*/

#jitensyarule .l_container {
    max-width: 1520px;/*1440px*/
    width: calc(1520/1920*100%);
    margin: 0 auto;
    padding: 0 calc(40/1520*100%);
    position: relative;
}

@media screen and (max-width: 1280px) {
    #jitensyarule .l_container {
        max-width: 1520px;/*1440px*/
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .l_container {
        padding: 0 calc(37/390*100%);
    }
}

/*--------------
メソッド
--------------*/

/* 変数 */
:root {
    --base: #000;
    --white: #fff;
    --blue:#003E80;
    --red:#DC0823;
    --yellow: #FFD900;
    --font_mplus: "M PLUS Rounded 1c", sans-serif;
    --font_noto: "Noto Sans JP", sans-serif;
}

/* テキスト */
#jitensyarule .lead35 {
    font-size: 35px;
    font-weight: 500;
    color: #fff;
    text-align: center;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .lead35 {
        font-size: 1.8vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .lead35 {
        font-size: 2.7vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .lead35 {
        font-size: 16px;
        font-size: 4.1vw;
        text-align: left;
    }
}

#jitensyarule section p {
    margin: 0;
    padding: 0;
}


/* ▽ シャドウ --------------*/

.shadow {
    filter:drop-shadow(8px 8px 8px rgba(119, 185, 205, .3));
    will-change: filter;
}

/*--------------
キービジュアル
--------------*/  

#jitensyarule .kv_ttl {
    width: calc(910/1440*100%);
    margin: 0 auto;
    padding-top: calc(65/1400*100%);
}

@media screen and (max-width: 1280px) {
    #jitensyarule .kv_ttl {
        width: calc(910/1280*100%);
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .kv_ttl {
        width: 100%;
        padding-top: calc(40/390*100%);
    }
}

#jitensyarule .kv_image {
    width: calc(910/1440*100%);
    margin: calc(32/1400*100%) auto 0;
}

@media screen and (max-width: 1280px) {
    #jitensyarule .kv_image {
        width: calc(910/1280*100%);
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .kv_image {
        width: 100%;
        margin: calc(18/316*100%) auto 0;
    }
}

#jitensyarule .kv_lead {
    margin: calc(32/1440*100%) auto 0;
    font-size: 35px;
    line-height: 1.2;
    text-align: center;
    color: var(--white);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .kv_lead {
        font-size: 1.8vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .kv_lead {
        font-size: 2.7vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .kv_lead {
        margin: calc(16/316*100%) auto 0;
        font-size: 3.7vw;
        line-height: 1.5;
    }
}

#jitensyarule .kv_nav {
    width: calc(1280/1440*100%);
    margin: calc(40/1440*100%) auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap:calc(20/1440*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .kv_nav {
        width: 100%;
        margin: calc(32/316*100%) auto 0;
        flex-direction: column;
        gap:5.1vw;
    }
}

#jitensyarule .kv_nav li {
    display: block;
    filter:drop-shadow(4px 6px 0px rgba(26, 19, 17, 1));
    will-change: filter;
}

@media screen and (max-width: 768px) {
    #jitensyarule .kv_nav li {
        filter:drop-shadow(.5vw .76vw 0px rgba(26, 19, 17, 1));
        will-change: filter;
    }
}


/*--------------
セクション
--------------*/ 

#sec01,
#sec02 {
    padding-top: 130px;
}

@media screen and (max-width: 1280px) {
    #sec01,
#sec02{
        padding-top: calc(130/1280*100%);
    }
}

@media screen and (max-width: 768px) {
    #sec01,
    #sec02 {
        padding-top: calc(55/390*100%);
    }
}

#jitensyarule .section_ttl_wrap {
    width: 100%;
    background-color: var(--white);
}

#jitensyarule .section_ttl_wrap h2 {
    font-family: var(--font_mplus);
    font-size: 56px;
    font-weight: 800;
    color: var(--blue);
    text-align: center;
    line-height: 1;
    padding: 1.5em 0 1.0em;
}

#jitensyarule .section_ttl_wrap h2 span {
    color: var(--red);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .section_ttl_wrap h2 {
        font-size: 2.9vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .section_ttl_wrap h2 {
        font-size: 3.7vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .section_ttl_wrap h2 {
        font-size: 5.6vw;
        line-height: 1.3;
    }
}

#jitensyarule .section_ttl_point {
    position: absolute;
    width: 8em;
    display: flex;
    align-items: center;
    justify-content: center;
    top:0;
    left: 0;
    right: 0;
    margin: calc(-50/1440*100%) auto 0;
    background-color: #FFD900;
    border: 4px solid var(--blue);
    border-radius: 9999px;
    font-size: 32px;
    font-family: var(--font_mplus);
    font-weight: 800;
    text-align: center;
    color: #003E80;
    padding: .3em 0;
    line-height: 1;
}

#jitensyarule .section_ttl_point span {
    font-size: 165%;
    font-weight: 500;
}

@media screen and (max-width: 1280px) {
    #jitensyarule .section_ttl_point {
        border: .3vw solid var(--blue);
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .section_ttl_point {
        border: .5vw solid var(--blue);
        font-size: 3vw;
        padding: .3em 0;
        margin: calc(-20/390*100%) auto 0;
    }

    #jitensyarule .section_ttl_point span {
        font-size: 266%;
        font-weight: 500;
    }
}

#jitensyarule .sec01_tenken_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap:calc(40/1440*100%);
    margin: calc(40/1440*100%) auto 0;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_tenken_wrap {
        flex-direction: column;
        gap:5.1vw;
        margin: calc(20/316*100%) auto 0;
    }
}

#jitensyarule .sec01_tenken_text {
    font-family: var(--font_mplus);
    font-size: 32px;
    color: var(--white);
    line-height: 1.7;
    font-weight: 500;
    text-align: left;
    flex: 1;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_tenken_text {
        font-size: 1.6vw;
    } 
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_tenken_text {
        font-size: 2.5vw;
    } 
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_tenken_text {
        font-size: 3.5vw;
        line-height: 1.6;
    } 
}

#jitensyarule .sec01_tenken_text .notes {
    margin-top: 1em;
    font-size: 75%;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_tenken_text .notes {
        font-size: 85%;
    }
}

#jitensyarule .sec01_tenken_image {
    width: calc(390/1440*100%);
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_tenken_image {
        width: calc(390/1280*100%);
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_tenken_image {
        width: 100%;
    }
}

#jitensyarule .sec01_container {
    border-radius: 30px;
    background-color: var(--white);
    margin: calc(80/1440*100%) auto 0;
    overflow: hidden;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_container {
        border-radius: 10px;
        margin: calc(25/316*100%) auto 0;
    }
}


#jitensyarule .sec01_ttl_container {
    width: 100%;
    background-color: #CCD8E6;
    padding: calc(100/1440*100%) calc(80/1440*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_ttl_container {
        padding: calc(36/316*100%);
    }
}

#jitensyarule .sec01_ttl_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap:calc(50/1280*100%);
}

#jitensyarule .sec01_ttl {
    width: calc(900/1280*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_ttl {
        width: 100%;
        margin: 0;
    }
}

#jitensyarule .sec01_ttl_image {
    width: calc(330/1280*100%);
}

#jitensyarule .sec01_ttl_image02 {
    display: none;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_ttl_image {
        display: none;
    }

    #jitensyarule .sec01_ttl_image02 {
        display: block;
        width: 100%;
        margin-top: 1em;
    }
}

#jitensyarule .sec01_ttl_lead {
    font-size: 64px;
    font-weight: 700;
    color: var(--blue);
    text-align: center;
    font-family: var(--font_noto);
    line-height: 1.7;
    margin-top: calc(70/1280*100%);
}

#jitensyarule .sec01_ttl_lead span {
    border-bottom: 8px solid var(--red);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_ttl_lead {
        font-size: 3.3vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_ttl_lead {
        font-size: 4.2vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_ttl_lead {
        font-size: 3.2vw;
        text-align: left;
        margin-top: calc(15/244*100%);
    }

    #jitensyarule .sec01_ttl_lead span {
        border-bottom: 2px solid var(--red);
    }
}

#jitensyarule .sec01_contents_container {
    padding: calc(110/1440*100%) calc(132/1440*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_contents_container {
        padding: calc(36/316*100%) calc(36/316*100%) calc(40/316*100%);
    }
}

#jitensyarule .sec01_fee {
    width: 100%;
}

#jitensyarule .sec01_mente_wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: calc(60/1175*100%);
    font-family: var(--font_noto);
}

#jitensyarule .sec01_mente_ttl {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5em;
    background-color: var(--blue);
    padding: 1em 0;
}

#jitensyarule .sec01_mente_ttl_no {
    width: calc(60/1175*100%);
}

.sec01_mente_ttl_text {
    font-size: 43px;
    line-height: 1;
    font-weight: 900;
    color: var(--white);
}

#jitensyarule .sec01_mente_ttl_text sub {
    font-size: 50%;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_mente_ttl_text {
        font-size: 2.2vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_mente_ttl_text {
        font-size: 3.3vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_mente_ttl_text {
        font-size: 4.6vw;
    }
}

#jitensyarule .sec01_mente_naiyou {
    background-color: #CCD8E6;
    padding: 1em 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 64px;
    font-weight: 900;
    color: var(--blue);
    text-align: center;
}

#jitensyarule .sec01_mente_naiyou span {
    color: var(--red);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_mente_naiyou {
        font-size: 3.3vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_mente_naiyou {
        font-size: 4.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_mente_naiyou {
        font-size: 4.1vw;
    }
}

#jitensyarule .sec01_notes {
    font-family: var(--font_mplus);
    font-size: 32px;
    color: var(--blue);
    font-weight: 500;
    margin-top: calc(80/1175*100%);
    text-align: center;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_notes {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_notes {
        font-size: 2.1vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_notes {
        font-size: 3.2vw;
        text-align: left;
    }
}

#jitensyarule .sec01_flex_btn {
    width: calc(856/1175*100%);
    background-color: var(--red);
    border-radius: 9999px;
    margin: calc(70/1175*100%) auto 0;
    padding: .5em;
    font-size: 46px;
    font-family: var(--font_mplus);
    font-weight: 800;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_flex_btn {
        font-size: 2.3vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_flex_btn {
        font-size: 3.3vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_flex_btn {
        width: 100%;
        margin: calc(30/244*100%) auto 0;
        padding: .5em;
        font-size: 16px;
        font-size: 4.1vw;
    }
}

#jitensyarule .sec01_flex_btn::after {
    content: '';
    background: url(../images/arrow.png) center center / cover no-repeat;
    width: 41px;
    height: 41px;
    position: absolute;
    top: 50%;
    right: 4%;
    transform: translateY(-50%);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec01_flex_btn::after {
        width: 2.1vw;
        height: 2.1vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec01_flex_btn::after {
        width: 3.2vw;
        height: 3.2vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec01_flex_btn::after {
        width: 5.1vw;
        height: 5.1vw;
        right: 4%;
    }
}

#jitensyarule .sec01_flex_btn:hover {
    color: var(--white);
}

/* セクション02 */

#jitensyarule .sec02_lead {
    font-family: var(--font_mplus);
    font-size: 32px;
    line-height: 1.7;
    font-weight: 500;
    text-align: center;
    color: var(--white);
    margin: calc(45/1440*100%) auto 0;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_lead {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_lead {
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_lead {
        font-family: var(--font_mplus);
        font-size: 3.58vw;
        line-height: 1.6;
        text-align: left;
        margin: calc(20/316*100%) auto 0;
    }
}

#jitensyarule .sec02_rule_ttl {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1em;
    line-height: 1;
    margin: calc(60/1440*100%) auto 0;
}

#jitensyarule .sec02_rule_ttl01 {
    font-size: 32px;
    font-weight: 500;
    color: var(--white);
    border: 2px solid var(--white);
    border-radius: 9999px;
    padding: .3em 1em;
}

#jitensyarule .sec02_rule_ttl02 {
    font-size: 56px;
    font-weight: 500;
    color: #FFD900;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_rule_ttl01 {
        font-size: 1.6vw;
    }

    #jitensyarule .sec02_rule_ttl02 {
        font-size: 2.9vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_rule_ttl01 {
        font-size: 2.5vw;
    }

    #jitensyarule .sec02_rule_ttl02 {
        font-size: 4.3vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule_ttl {
        flex-direction: column;
        gap: 1.3vw;
        line-height: 1;
        margin: calc(20/316*100%) auto 0;
    }

    #jitensyarule .sec02_rule_ttl01 {
        font-size: 4.1vw;
        padding: .3em 1.7em;
    }

    #jitensyarule .sec02_rule_ttl02 {
        font-size: 8.2vw;
    }
}

#jitensyarule .sec02_rule_wrap {
    margin: calc(50/1440*100%) auto 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap:80px calc(60/1440*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule_wrap {
        margin: calc(25/316*100%) auto 0;
        flex-direction: column;
        gap:5.1vw;
    }
}

#jitensyarule .sec02_rule_box {
    width: calc(440/1440*100%);
    display: flex;
    flex-direction: column;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule_box {
        width: 100%;
    }
}

#jitensyarule .sec02_rule_box p {
    font-size: 32px;
    font-weight: 500;
    font-family: var(--font_mplus);
    line-height: 1.7;
    color: var(--white);
    margin-top: 1em;
    flex: 1;
    text-align: justify;
}

#jitensyarule .sec02_rule_box p span {
    color: #FFD900;
    display: block;
}

#jitensyarule .sec02_rule_box p span.notes {
    color: #AADDF8;
    font-weight: 900;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_rule_box p {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_rule_box p {
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule_box p {
        font-size: 3.58vw;
        text-align: left;
    }

    #jitensyarule .sec02_rule_box p span {
    color: #FFD900;
    display: inline;
}

    #jitensyarule .sec02_rule_box p span.notes {
        color: #AADDF8;
        font-weight: 900;
        display: block;
    }
}

#jitensyarule .btn_rule {
    margin-top: 1em;
    display: block;
    filter:drop-shadow(4px 6px 0px rgba(26, 19, 17, 1));
    will-change: filter;
}

@media screen and (max-width: 768px) {
    #jitensyarule .btn_rule {
        margin-top: 1em;
        display: block;
        filter:drop-shadow(.5vw .7vw 0px rgba(26, 19, 17, 1));
        will-change: filter;
    }
}

#jitensyarule .sec02_met_wrap {
    border-radius: 30px;
    background-color: var(--white);
    padding: calc(80/1440*100%) calc(130/1440*100%);
    margin: calc(80/1440*100%) auto 0;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_met_wrap {
        border-radius: 10px;
        padding: calc(35/316*100%);
        margin: calc(25/316*100%) auto 0;
    }
}

#jitensyarule .met_ttl {
    font-size: 44px;
    font-weight: 800;
    color: var(--white);
    text-align: center;
    font-family: var(--font_mplus);
    background-color: var(--blue);
    line-height: 1.3;
    padding: .5em 0;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .met_ttl {
        font-size: 2.0vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .met_ttl {
        font-size: 3.0vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .met_ttl {
        font-size: 4.1vw;
    }
}

#jitensyarule .sec02_met_banner {
    width: 100%;
    margin: calc(40/1175*100%) auto 0;
    display: block;
    filter: drop-shadow(6px 6px 6px rgba(0 0 0 / .1));
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_met_banner {
        width: 100%;
        margin: calc(15/244*100%) auto 0;
        display: block;
        filter: drop-shadow(6px 6px 6px rgba(0 0 0 / .1));
    }
}

#jitensyarule .met_btn_notes {
    font-family: var(--font_mplus);
    font-size: 32px;
    font-weight: 500;
    color: var(--blue);
    text-align: center;
    margin-top: calc(80/1175*100%);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .met_btn_notes {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .met_btn_notes {
        font-size: 2.2vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .met_btn_notes {
        font-size: 3.5vw;
        margin-top: calc(20/244*100%);
    }
}

#jitensyarule .sec02_caution_ttl {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: calc(105/1440*100%) auto 0;
    gap: 1em;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_caution_ttl {
        display: flex;
        flex-direction: column;
        margin: calc(35/316*100%) auto 0;
    }
}

#jitensyarule .sec02_caution_icon {
    width: calc(170/1440*100%);
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_caution_icon {
        width: calc(130/316*100%);
        margin: 0 auto;
    }
}

#jitensyarule .sec02_caution_text {
    font-family: var(--font_mplus);
    font-size: 32px;
    font-weight: 500;
    line-height: 1.7;
    text-align: left;
    color: var(--white);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_caution_text {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_caution_text {
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_caution_text {
        font-size: 3.58vw;
        text-align: center;
    }
}

#jitensyarule .sec02_caution_text span {
    color: #FFD900;
    font-weight: 900;
}

#jitensyarule .sec02_rule02_ttl {
    margin: calc(35/1440*100%) auto 0;
}

#jitensyarule .sec02_rule02_ttl02 {
    margin: calc(110/1440*100%) auto 0;
}

#jitensyarule .sec02_rule02_ttl03 {
    margin: calc(80/1440*100%) auto 0;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule02_ttl {
        margin: calc(20/316*100%) auto 0;
    }

    #jitensyarule .sec02_rule02_ttl02 {
        margin: calc(25/316*100%) auto 0;
    }

    #jitensyarule .sec02_rule02_ttl03 {
        margin: calc(25/316*100%) auto 0;
    }
}

#jitensyarule .sec02_rule02_wrap {
    width: calc(910/1440*100%);
    margin: calc(30/1440*100%) auto 0;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule02_wrap {
        width: 100%;
    }
}

#jitensyarule .sec02_rule02_wrap p {
    font-size: 32px;
    font-weight: 500;
    line-height: 1.7;
    color: var(--white);
    font-family: var(--font_mplus);
    margin-top: calc(30/1440*100%);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_rule02_wrap p {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_rule02_wrap p {
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule02_wrap p {
        font-size: 3.58vw;
        margin-top: calc(10/316*100%);
    }
}

#jitensyarule .sec02_rule02_wrap p span.yellow {
    color: #FFD900;
    font-weight: 900;
}

#jitensyarule .sec02_rule02_wrap p span.lb {
    color: #AADDF8;
    font-weight: 900;
}

#jitensyarule .sec02_rule02_box01 {
    display: flex;
    align-items: center;
    gap: calc(60/1440*100%);
    margin: calc(40/1440*100%) auto 0;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule02_box01 {
        flex-direction: column;
        gap: 3.8vw;
        margin: calc(15/316*100%) auto 0;
    }
}

#jitensyarule .sec02_rule02_box_text {
    font-size: 32px;
    color: #FFD900;
    font-weight: 900;
    font-family: var(--font_mplus);
    text-align: center;
    margin: calc(40/1440*100%) auto 0;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_rule02_box_text {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_rule02_box_text {
        font-size: 2.5vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_rule02_box_text {
        font-size: 3.58vw;
        margin-top: calc(20/316*100%);
        text-align: left;
        line-height: 1.6;
    }
}

#jitensyarule .btn_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5em;
    margin: calc(40/910*100%) auto;
}

@media screen and (max-width: 768px) {
    #jitensyarule .btn_wrap {
        display: flex;
        flex-direction: column;
        gap: .2em;
        margin: calc(20/316*100%) auto;
    }
}

#jitensyarule .btn_wrap .btn_text {
    font-size: 32px;
    font-weight: 900;
    font-family: var(--font_mplus);
    color: var(--white);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .btn_wrap .btn_text {
        font-size: 1.6vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .btn_wrap .btn_text {
        font-size: 3.0vw;
    }
}

#jitensyarule .btn_wrap .btn_rainwear {
    width: calc(542/910*100%);
    filter:drop-shadow(4px 6px 0px rgba(26, 19, 17, 1));
    will-change: filter;
    display: block;
}

@media screen and (max-width: 768px) {
    #jitensyarule .btn_wrap .btn_rainwear {
        width: 100%;
        filter:drop-shadow(.5vw .7vw 0px rgba(26, 19, 17, 1));
    }
}

#jitensyarule .sec02_flex_btn_lead {
    font-family: var(--font_mplus);
    font-weight: 500;
    text-align: center;
    font-size: 36px;
    line-height: 1.7;
    color: var(--blue);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_flex_btn_lead {
        font-size: 1.8vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_flex_btn_lead {
        font-size: 2.4vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_flex_btn_lead {
        font-size: 3.3vw;
        line-height: 1.6;
    }
}

#jitensyarule .sec02_flex_btn_lead span {
    color: var(--red);
    font-weight: 900;
}

#jitensyarule .sec02_flex_btn {
    width: 100%;
    background-color: var(--red);
    border-radius: 20px;
    margin: calc(50/1175*100%) auto 0;
    padding: .7em 0;
    font-size: 46px;
    font-family: var(--font_mplus);
    font-weight: 800;
    line-height: 1.2;
    color: var(--white);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_flex_btn {
        font-size: 2.3vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_flex_btn {
        font-size: 3.3vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_flex_btn {
        width: 100%;
        margin: calc(20/244*100%) auto 0;
        padding: 1em .5em;
        font-size: 3vw;
        border-radius: 9999px;
    }
}

#jitensyarule .sec02_flex_btn::after {
    content: '';
    background: url(../images/arrow.png) center center / cover no-repeat;
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    right: 4%;
    transform: translateY(-50%);
}

@media screen and (max-width: 1920px) {
    #jitensyarule .sec02_flex_btn::after {
        width: 3.1vw;
        height: 3.1vw;
    }
}

@media screen and (max-width: 1280px) {
    #jitensyarule .sec02_flex_btn::after {
        width: 4.2vw;
        height: 4.2vw;
    }
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_flex_btn::after {
        width: 4.1vw;
        height: 4.1vw;
        right: 4%;
    }
}

#jitensyarule .sec02_flex_btn:hover {
    color: var(--white);
}

#jitensyarule .sec02_bnr {
    width: calc(910/1440*100%);
    margin: calc(120/1440*100%) auto calc(30/1440*100%);
    display: block;
}

@media screen and (max-width: 768px) {
    #jitensyarule .sec02_bnr {
        width: calc(296/316*100%);
        margin: calc(50/316*100%) auto calc(30/316*100%);
    }
}


/* other
---------------------------------------------------------*/
.clearfix:after {  
    content: ".";   
    display: block;   
    height: 0;   
    clear: both;   
    visibility: hidden;  
}  
    
.clearfix { display: inline-table; }  
    
/* Hides from IE-mac \*/  
* html .clearfix { height: 1%; }  

.clearfix { display: block; }