@charset "utf-8";

@media screen and (max-width : 768px) {
    #contents_area {
        padding-top: 142px;
        color: #666;
        font-family: "HondaGlobalFontJP-Regular", sans-serif;
    }

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

    .left{
        text-align: left;
    }

    br.only_sp {
        display: block !important;
    }


    /* ------------------------------------------------------------
    *
        #lnav_wrap
    *
    ------------------------------------------------------------ */
    #lnav_wrap {
        position: absolute;
        top: 56px;
        padding: 23px 0;
        width: 100%;
        height: 85px;
        box-sizing: border-box;
        background-color: #fff;
        z-index: 3;
    }

    #lnav_wrap.open {
        background-color: #ebebeb;
        z-index: 9991;
    }

    #lnav_wrap.fixed {
        position: fixed;
    }

    #lnav_wrap .logo {
        text-align: center;
    }

    #lnav_wrap .logo img {
        width: 160px;
    }

    #lnav_wrap .lnav_ico {
        display: block;
        position: absolute;
        top: 25px;
        left: 0;
        width: 55px;
        height: 55px;
        cursor: pointer;
    }

    #lnav_wrap .lnav_ico.on {
        z-index: 10000;
    }

    #lnav_wrap .lnav_ico span {
        transition: all .4s ease;
    }


    #lnav_wrap .lnav_ico span.top {
        position: absolute;
        top: 22px;
        left: 13px;
        width: 20px;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        border-top: 2px solid #444;
    }


    #lnav_wrap .lnav_ico span.btm {
        content: '';
        display: block;
        position: absolute;
        top: 22px;
        left: 26px;
        width: 20px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        border-top: 2px solid #444;

    }

    #lnav_wrap .lnav_ico.on span.top {
        transform: rotate(135deg);
        -webkit-transform: rotate(135deg);
        left: 15px;
    }

    #lnav_wrap .lnav_ico.on span.btm {
        transform: rotate(-135deg);
        -webkit-transform: rotate(-135deg);
        left: 15px;
    }

    #lnav {
        width: 100%;
        height: auto !important;
        float: none;
        visibility: hidden;
        position: absolute;
        top: 104px;
        left: 0;
        z-index: 9990;
    }

    #lnav .lnav_inner {
        display: none;
        overflow-y: scroll;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        position: relative;
        z-index: 10000;
    }

    #lnav .lnav_inner ul {
        padding-bottom: 170px;
    }

    #lnav .lnav_inner li a {
        height: 51px;
        margin: 0 15px 0 35px;
        display: block;
        line-height: 51px;
        color: #444;
        font-size: 14px;
    }

    #lnav .lnav_inner li.spbd a {
        border-bottom: 1px solid #666;
    }

    #lnav .lnav_inner li a:after {
        content: '';
        width: 7px;
        height: 51px;
        display: block;
        background-image: url(../../top/common/image_common/parts_ico_btm_global_nav_arrow.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 7px;
        position: absolute;
        top: 0;
        right: 5px;
        transition: all .1s ease;
        -webkit-transition: all .1s ease;
    }

    #lnav .lnav_inner li a:hover:after {
        right: 0px;
    }

    #lnav .lnav_inner li p a:after {
        width: 11px;
        background-image: url(../../top/common/image_common/parts_ico_btm_global_nav_plus.png);
        background-size: 11px;
        right: 5px;
    }

    #lnav .lnav_inner li p.on a:after {
        background-image: url(../../top/common/image_common/parts_ico_btm_global_nav_minus.png);
        transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
    }

    #lnav .lnav_inner li ul {
        padding-bottom: 0;
        display: none;
    }

    #lnav .lnav_inner li ul a {
        height: 51px;
        margin: 0 15px 0 90px;
        display: block;
        line-height: 51px;
        color: #444;
        font-size: 12px;
        font-family: var(--font-light);
        position: relative;
    }

    #lnav .lnav_inner li ul .course_name {
        position: relative;
        padding: 0 0 0 60px;
        font-size: 14px;
        height: 33px;
        line-height: 33px;
    }

    #lnav .lnav_inner li ul .course_name:after {
        content: "";
        display: block;
        position: absolute;
        top: 15px;
        right: 15px;
        width: calc(100% - 150px);
        border-top: 1px solid #666;
    }

    #lnav .lnav_inner li ul .course_name.last {
        margin-top: 20px;
    }

    #lnav_wrap .overlay {
        width: 100%;
        height: 100%;
        background-color: #ebebeb;
        position: fixed;
        top: 192px;
        left: 0;
        z-index: 1;
    }

    #lnav_wrap.fixed .overlay {
        top: 140px;
    }

    .c-floating-banner .c-floating-banner-img img {
        display: none;
    }

     /* ------------------------------------------------------------
    *
        #top_mov
    *
    ------------------------------------------------------------ */

    #top_mov {
        margin-bottom: 30px;
        width: 100%;
        border-top: 1px solid #ccc;
    }

    .htc-embed-movie {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
    }

    .htc-embed-movie iframe, .htc-embed-movie .video-js {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        margin: auto;
    }

    .pg_copy {
        padding: 20px 0 15px;
        font-size: 16px;
        text-align: center;
    }

    .pg_title {
        padding-bottom: 20px;
        color: #595757;
        font-size: 30px;
        font-family: var(--font-bold);
        text-align: center;
    }

    .pg_title span {
        padding-right: 30px;
        display: inline-block;
        font-size: 24px;
        font-weight: normal;
        vertical-align: middle;
    }



    #lnav_sp {
        height: 39px;
        min-height: 39px;
        text-align: center;
        box-sizing: border-box;
    }

    #lnav_sp ul {
        margin: 0 auto;
        display: inline-block;
        vertical-align: middle;
    }

    #lnav_sp ul li {
        font-family: var(--font-bold);
        float: left;
        padding: 10px 10px;
    }

    #lnav_sp a {
        color: #fff;
        font-size: 13px;
    }

    /* -------------------------------------------------
    *
        scroll animation
    *
    --------------------------------------------------- */

    [data-scroll^=fade]{
        opacity: 0;
        transition-property: opacity,transform;
        transition-duration: 1s;
        transition-timing-function: cubic-bezier(.25,.25,.75,.75);
    }

    [data-scroll=fade-up] {
        transform: translate3d(0,50px,0);
    }

    [data-scroll=fade-left] {
        transform: translate3d(100px,0,0);
    }

    [data-scroll^=fade][data-scroll^=fade].animated {
        opacity: 1;
        transform: translateZ(0);
    }

    [data-scroll^=fade-left][data-scroll^=fade-left].animated {
        opacity: 1;
        transform: translate3d(0);
    }

    /* ------------------------------------------------------------
    *
        .section
    *
    ------------------------------------------------------------ */

    .mb_0 {
        margin-bottom: 0 !important;
    }
    .section {
        color: #444;
    }
    .section .detail {
        text-align: left;
    }
    .section .detail a {
        color: #16B7CF !important;
        font-size: 15px;
        font-family: var(--font-bold);
    }

    .section .caution {
        font-size: 12px;
        font-family: var(--font-light);
    }



    .section_column {
        margin-bottom: 60px;
        padding: 0 30px;
        font-size: 15px;
    }

    .section_column .caution {
        font-size: 10px;
        font-family: var(--font-light);
        padding: 4px 4px 0;
        text-align: left;
        line-height: 1.7;
    }

    .section_column .msg_col {
        margin-bottom: 10px;
        padding-top: 16px;
        text-align: center;
    }

    .section_column .msg_col .img {
        margin-bottom: 3px;
    }

    .section_column .msg_col .img img {
        max-width: 240px;
    }

    .section_column .msg_col .img_hondacars img {
        max-width: 152px;
    }

    .section_column .pic_col {
        text-align: center;
    }


    .section_column .pic_col .img img {
        max-width: 315px;
    }


    /* -------------------------------------------------
    *
        pick_up
    *
    --------------------------------------------------- */

    #pick_up{
        margin: 0 20px 40px;
        padding-bottom: 20px;
    }

    #pick_up .title{
        margin: 20px auto 10px;
        padding: 0;
        width: 304px;
    }

    #pick_up .pick_up_row{
        margin-bottom: 30px;
        display: block;
        padding: 0 17px 0 13px;
    }

    #pick_up .pick_up_row .pick_up_col{
        width: 100%;
    }

    #pick_up .pick_up_row .pick_up_01{
        margin-bottom: 24px;
    }



    #pick_up .detail{
        margin-bottom: 0;
        text-align: center;
        color: #16B7CF;
        font-size: 13px;
        font-family: var(--font-bold);
    }

    #pick_up .detail:before {
        content: "";
        position: absolute;
        left: 0;
        top: 53%;
        width: 100%;
        height: 2px;
        border-bottom: 2px solid #16B7CF;
        transform: translateY(-50%);
    }

    #pick_up .detail span {
        position: relative;
        display: inline-block;
        padding: 0 13px 0 16px;
        background-color: #fff;
    }

    #pick_up .detail .icon{
        color:  #16B7CF;
        padding: 0 0 0 6px;
        width: 15px;
    }

    /* #pick_up .detail span::after {
        content: "";
        width: 30px;
        height: 30px;
        background: url(../image/pick_up_icon_arrow.png);
        background-size: 30px auto;
         display: block;
    } */

    /* -------------------------------------------------
    *
        trouble
    *
    --------------------------------------------------- */

    .bd_box {
        position: relative;
        margin: 0 20px 58px;
        padding: 48px 10px 32px;
        border: 1px solid #16B7CF;
        border-radius: 35px;
        box-sizing: border-box;
    }

    .bd_box .float_msg {
        margin: 0 auto;
        display: inline-flex;
        position: absolute;
        top: -38px;
        left: 0;
        right: 0;
        max-width: 238px;
        height: 53px;
        border: 3.8px solid #fff;
        background-color: #DF4735;
        border-radius: 24px;
        color: #fff;
        font-size: 23px;
        font-family: var(--font-bold);
        align-items: center;
        justify-content: center;
    }

    .bd_box .float_msg:after {
        position: absolute;
        left: 38px;
        bottom: -13px;
        content: "";
        width: 19px;
        height: 16px;
        background: url(../image/float_msg_icn.png);
        background-size: 19px auto;
    }

    .box_01 {
        padding-top: 35px;
    }

    .box_copy {
        position: relative;
        margin-bottom: 25px;
        padding-left: 15px;
        font-size: 22px;
        font-family: var(--font-bold);
        letter-spacing: -1px;
        text-align: left;
        line-height: 1.6;
    }

    .box_copy.copy_truck::after {
        content: "";
        position: absolute;
        top: -15px;
        right: 0;
        width: 96px;
        height: 53px;
        background: url(../image/img_truck.jpg);
        background-size: 96px auto;
        opacity: 0;
        transform: translate3d(100px,0,0);
        transition-property: opacity,transform;
        transition-duration: 1s;
        transition-timing-function: cubic-bezier(.25,.25,.75,.75);
    }

    .box_copy.copy_truck.animated:after {
        opacity:1;
        transform: translate3d(0px,0,0);
    }

    .bd_box .sv_row {
        padding-left: 15px;
    }

    .bd_box .sv_row .sv_col {
        margin-bottom: 29px;
    }

    .bd_box .caution {
        text-align: center;
        color: #444;
        font-size: 12px;
        font-family: var(--font-light);
    }

    .trouble_list {
        margin-bottom: 50px;
    }

    .trouble_list li {
        text-align: center;
        margin-bottom: 30px;
        padding-left: 0;
    }

    .trouble_list li img {
        max-width: 270px;
    }

    .tr_row .col_left  {
        margin-bottom: 23px;
        text-align: center;
        padding-left: 30px;
    }

    .tr_row .col_left img {
        margin: 0 auto;
        max-width: 224px;
    }

    .tr_row .col_right {
        margin-bottom: 20px;
    }

    .tr_row .col_right {
        text-align: center;
    }

    .tr_row .col_right .txt {
        margin-bottom: 15px;
    }

    .tr_row .col_right .txt img {
        max-width: 292px;
    }

    .tr_row .tire_icn {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 11px;
    }

    .tr_row .tire_icn li{
        max-width: 106px;
    }

    .bg_box {
        position: relative;
        margin: 121px 20px 24px;
        padding: 54px 10px 53px;
        background-color: #16B7CF;
        border-radius: 52px;
        color: #fff;
    }

    .bg_box::before {
        display: block;
        margin: 0 auto;
        content: "";
        width: 114px;
        height: 113px;
        background: url(../image/tire_sad.png);
        background-size: 114px auto;
    }

    .bubble_message {
        padding: 0 22px;
        position: absolute;
        left: 0;
        top: -8vw;
    }


    .section .box_tit {
        margin: 29px 0 30px;
        padding: 0 8px;
    }

    .section .box_tit img {
      margin: 0 auto
    }

    .btn {
        position: relative;
        display: flex;
        margin: 0 auto;
        padding-top: 1px;
        max-width: 130px;
        height: 24px;
        background-color: #fff;
        border: 1px solid #fff;
        border-radius: 15px;
        color: #16B7CF;
        font-size: 16px;
        font-family: var(--font-bold);
        justify-content: center;
        align-items: center;
    }

    a.btn {
        color: #16B7CF !important;
    }

    .btn a {
        display: inline-flex;
        width: 100%;
        height: 100%;
        text-align: center;
        color: #16B7CF !important;
        align-items: center;
        justify-content: center;
    }

    .btn_lg {
        margin: 40px auto 0;
        max-width: 310px;
        height: 45px;
        font-size: 15px;
    }

    .bg_box .step_block:not(.n_arrow):after {
        margin: 0 auto 33px;
        content: "";
        display:block;
        width: 41px;
        height: 42px;
        background: url(../image/step_arrow.png) no-repeat;
        background-size: 41px auto;
    }

    .bg_box .copy {
        margin: 15px 0 20px;
        text-align: center;
        font-size: 17.5px;
        line-height: 1.6;
        white-space: nowrap;
    }

    .bg_box .step_block.n_arrow {
        margin-top: 27px;
    }

    #tire_punk .step_block .img {
        margin-bottom: 32px;
    }

    #tire_punk .step_block .img img {
        vertical-align: middle;
    }

    #tire_punk .step_block.step02 .img {
        margin-bottom: 17px;
    }

    #tire_punk .step_block.step03 .img01 {
        padding: 0 18px;
    }

    #tire_punk .step_block.step03 .img02 {
        margin-bottom: 28px;
        padding: 0 8px;
    }

    .step_block .ac_content {
      margin-top: 12px;

    }

    .step_block .ac_content .copy {
      margin: 0
    }

    .step_block .ac_content .caution {
        margin: 10px auto 0;
        font-size: 12px;
        font-family: var(--font-light);
        line-height: 1.5;
    }

    .bg_box .step_block.step_03 .copy{
        margin-bottom: 10px;
    }

    .bg_box .step_block.step_03 .caution{
        margin-bottom: 20px;
    }

    .bg_w_box {
        margin: 42px auto 0;
        padding: 20px 0 12px;
        border: 2px solid #fff;
        border-radius: 14px;
        text-align: center;
    }

    .bg_w_box .acordian_btn {
        position: relative;
        cursor: pointer;
        font-size: 12px;
        font-family: var(--font-light);
        line-height: 1.4;
    }


    .bg_w_box .acordian_btn:after {
        content: "";
        display: block;
        margin: 8px auto 0;
        width: 12px;
        height: 13px;
        background: url(../image/parts_ico_btn_detail_arrow_top.png) no-repeat;
        background-size: 12px auto;
        transform: rotate(0deg);
        transition: all .5s;
    }

    .bg_w_box .acordian_btn.active:after {
        transform: rotate(180deg);
    }


    .bg_box .bg_w_box .caution {
        margin-bottom: 30px;
        line-height: 1.4;
    }

    .bg_box .bg_w_box .caution.caution_left{
        padding: 0 .7rem;
        text-align: left;
    }

    .bg_box .bg_w_box .caution.left{
        padding: 0 .5rem;
        text-align: left;
    }

    .bg_w_box .btn {
        background-color: #16B7CF;
        border-color: #fff;
        border-radius: 9px;
        color: #fff;
    }

    .bg_w_box .copy {
        margin-bottom: 15px;
    }

    .bg_w_box .step_block.n_arrow {
        margin-top: 0;
    }

    .sec_totalcare{
        padding-bottom: 45px;
        background-color: #eaeaea;
    }

    .sec_totalcare .tolcare_title{
        position: relative;
        padding: 28px 0;
        font-size: 17px;
        line-height: 1.7;
        text-align: center;
        color: #fff;
    }

    .sec_totalcare .tolcare_title:after {
        position: absolute;
        content: "";
        background: #df4735;
        width: 0px;
        height: 100%;
        top: 0;
        left: 0;
        right: 0;
        opacity: 0;
        width: 0px;
        transition-property: opacity,width;
        transition-duration: 1s;
        transition-timing-function: cubic-bezier(.25,.25,.75,.75);
    }

    .sec_totalcare .tolcare_title.animated:after {
        opacity: 1;
        width: 100%;
    }

    .tolcare_title span {
        position: relative;
        opacity: 0;
        transition-property: opacity,transform;
        transition-duration: 1s;
        transition-delay: 1s;
        z-index: 1;
    }

    .sec_totalcare .tolcare_title.animated span{
        opacity: 1;
    }

    .totalcare_logo{
        margin: 34px 0 0;
    }

    .totalcare_column {
        margin-top: 28px;
        padding: 0 20px;
    }

    .totalcare_column .col_left {
        padding-left: 5px;
        padding-right: 15px;
    }

    .totalcare_column .col_right{
        position: relative;
        padding: 0 24px;
        font-size: 17px;
        line-height: 1.8;
        color: #444;
    }


    .totalcare_column .col_right .cyon_line{
        position: relative;
        display: inline-block;
        font-family: var(--font-bold);
        z-index: 1;
    }

    .totalcare_column .col_right .cyon_line:before {
        position: absolute;
        left: 0;
        bottom: 7px;
        content: "";
        width: 100%;
        border-bottom: 3.5px solid #16B7CF;
        z-index: -1;
    }

    .totalcare_column .detail a::after {
        top: 2px;
        width: 16px;
        height: 16px;
        background: url(../image/icn_arrow.png);
        background-size: 16px auto;
    }

    /* -------------------------------------------------
    *
        sec_discount
    *
    --------------------------------------------------- */

    #sec_discount .disc_wrap{
        margin: 25px auto 0;
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }

    /* -------------------------------------------------
    *
        price
    *
    --------------------------------------------------- */
    .sec_join {
        padding: 0 20px;
    }

    .sec_join .block {
        margin-bottom: 50px;
    }

    .section .tit{
        position: relative;
        margin-bottom: 21px;
        font-size: 23px;
        line-height: 1.2;
        font-family: var(--font-bold);
        color: #16B7CF;
    }
    .section .tit span {
        position: relative;
        display: inline-block;
        padding-right: 18px;
        background-color: #fff;
    }

    .section .tit:before {
        content: "";
        position: absolute;
        left: 0;
        top: 53%;
        width: 100%;
        height: 1px;
        background-color: #16B7CF;
        transform: translateY(-50%);
    }

    .join_time .tim_list{
        margin-top: 23px;
        padding-left: 20px;
        display: flex;
        flex-wrap: wrap;
        max-width: 335px;
    }

    .join_time .tim_list li{
        float: left;
        width: 50%;
        padding-bottom: 15px;
        font-size: 21px;
        font-family: var(--font-bold);
    }
    .join_time .tim_list li.tires{
        width: 65%;
    }

    .join_time .tim_list li.inspection{
        width: 35%;
    }

    .join_time .tit_copy{
        position: relative;
        min-height: 24px;
        font-size: 14px;
        font-family: var(--font-bold);
        color: #16B7CF;
        background-color: #fff;
        border: 1px solid #16B7CF;
        vertical-align: middle;
        text-align: center;
    }

    .join_time .tit_copy span{
        display: inline-block;
        margin: -3px 0;
        padding: 11px 0 11px 5px;
        width: calc(100% - 30px);
        background-color: #fff;
        box-sizing: border-box;

    }

    .price_plan .price_col{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
    }

    .price_plan .section_column {
        width: 100%;
        margin-bottom: 10px;
        padding: 0;
    }

    .section_column .price_col.col_02 {
        margin-top: 20px;
    }

    .section_column .price_col .w_period{
        display: flex;
        width: 15.5%;
        border: 1px solid #16b7cf;
        border-radius: 10px;
        box-sizing: border-box;
        background: #16b7cf;
        text-align: center;
        color: #fff;
        font-size: 18px;
        line-height: 1.6;
        justify-content: center;
        align-items: center;
    }

    .price_col .w_period,.price_col .w_period_in {
        margin-bottom: 0 !important;
    }

    .w_period p {
        margin-bottom: 0;
    }

    .w_period .txt{
        font-size: 9px;
    }

    .w_period .month{
        font-size: 15px;
        letter-spacing: -1px;
    }

    .w_period .month span{
        font-size: 12px;
        font-family: var(--font-light);
    }

    .w_period .yrs{
        font-size: 13px;
        white-space: nowrap;
    }

    .section_column .price_col .tbl_col{
        margin-left: 6px;
        width: 82%;
    }

    .tbl_col table {
        width: 100%;
    }

    .price_col td,.price_col th{
        font-size: 8px;
        text-align: center;
        font-family: var(--font-bold);
    }

    .price_col th{
        background: #16b7cf;
        color: #fff;
        font-size: 8px;
        width: 36%;
    }

    .price_col th:first-child{
        width: 25%;
        position: relative;
        border-radius: 5px 0 0 5px;
    }

    .price_col th:first-child::after{
        content: "";
        display: inline-block;
        top: 3px;
        position: absolute;
        right: 0;
        border-right: 1.5px solid #fff;
        height: 20px;
    }

    .price_col th .bg_white{
        padding-top: 1px;
        margin: 0 4px;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #fff;
        background: #fff;
        color: #19B8D0;
        font-size: 8px;
        line-height: 1.1;
        height: 10px;
    }

    .price_col th:last-child{
        width: 43%;
        border-radius: 0 5px 5px 0;
        position: relative;
    }

    .price_col th:last-child::before{
        content: "";
        display: inline-block;
        border-right: 1px solid #fff;
        height: 20px;
        position: absolute;
        top: 3px;
        left: -1px;
        z-index: 1;
    }

    .price_col th span{
        font-size: 12px;
        font-family: var(--font-light);
    }
    .price_col td{
        position: relative;
        padding: 0;
        text-align: center;
        border-right: 1.5px solid #16b7cf;
        border-bottom: 1.5px solid #16B7CF;
        color: #444444;
        font-size: 14px;
    }

    /* .tbl_col tr:nth-child(2) td{
        padding-top: 7px;
    } */

    .price_col td span:not(.sup) {
        font-size: 80%;
    }

    .price_col td .sup {
        position: absolute;
        top: 8px;
    }

    .price_col td:last-child{
        border-right: none;
        background: rgba(25, 184, 208, 0.2);
    }

    .price_plan .caution{
        text-align: left;
        line-height: 1.5;
    }

    .sec_store .section_column {
        margin-top: 30px;
        padding: 0;
    }

    .sec_store .store_col  {
        text-align: center;
    }

    .sec_store .store_col .img img {
        max-width: 233px;
    }

    .store_col .caution{
        margin-top: 16px;
        text-align: center;
    }

    .btn_download {
        margin: 18px auto 0 !important;
        max-width: 275px;
        width: 100%;
        height: 68px;
        font-size: 16px;
    }

    .btn_download a {
        position: relative;
        background-color: #16b7cf;
        border-color: #16b7cf;
        width: 100%;
        border-radius: 26px;
        color: #fff !important;
        line-height: 1.4;
    }

    .btn_download a::after{
        position: absolute;
        top: 50%;
        right: 36px;
        content: "";
        width: 20px;
        height: 21px;
        background: url(../image/icn_download.png) no-repeat;
        background-size: 20px auto;
        transform: translateY(-50%);
    }

    .btn_download a span{
        position: relative;
        left: -.7rem;
    }

    .sec_store .store_pic_col{
        position: relative;
        margin: 30px 0 0;
        width: 100%;
    }

    .sec_store .store_pic_col .img {
        margin-bottom: 0;
    }
    .sec_store .store_pic_col .caution {
        margin-top: -5px;
        padding-top: 0;
        text-align: right;
    }

   .tit_gr{
        text-align: center;
        color: #444;
    }
    .section .tit_gr span{
        padding: 0 8px;
    }

    .section .tit_gr:before {
        background-color: #949495;
    }

    .sec_condition .tit{
        color: #444;
    }

    .sec_condition .copy{
        margin-top: 15px;
        font-size: 12px;
        font-family: var(--font-light);
        line-height: 1.4;
    }

    .sec_condition .condition_list{
        position: relative;
        margin: 15px 0;
        min-height: 24px;
        font-size: 12px;
        font-family: var(--font-light);
        font-family: var(--font-bold);
        color: #444;
        background-color: #fff;
        border: 1px solid #444;
        vertical-align: middle;
        text-align: center;
    }

    .sec_condition .condition_list p{
        display: inline-block;
        margin: -3px 0;
        padding: 7px 0 8px 4px;
        width: calc(100% - 24px);
        background-color: #fff;
        box-sizing: border-box;
        line-height: 1.4;
        text-align: left;
    }

    .section .title {
        margin-bottom: 15px;
        text-align: center;
        font-size: 26px;
        font-family: var(--font-bold);
        line-height: 1.35;
    }

    .sec_agreement {
      margin-bottom: 0 !important;
    }

    .sec_agreement .desc{
        margin-bottom: 25px;
        text-align: center;
        font-family: var(--font-bold);
    }
    .sec_agreement .desc p{
        font-size: 17px;
        line-height: 1.7;
        margin-bottom: 15px;
    }

    .sec_agreement .desc a{
        color: #444 !important;
        text-decoration: underline;
    }

    .sec_agreement .section_column .col{
        margin-bottom: 47px !important;
        text-align: center;
        font-size: 14px;
        font-family: var(--font-bold);
    }

    .sec_agreement .section_column .col:last-child{
        margin-bottom: 0 !important;
    }

    .sec_agreement .section_column .col .btn_download {
        margin-bottom: 10px !important;
    }


    /* -------------------------------------------------
    *
        security
    *
    --------------------------------------------------- */
    .sec_security{
        margin: 54px auto 0;
        text-align: center;
    }

    .sec_security .title{
        margin-bottom: 13px;
        font-size: 24px;
        color: #16B7CF;
    }
    .sec_security .copy{
        margin-bottom: 20px;
        font-size: 17px;
        line-height: 1.6;
    }

    .sec_security .img{
        margin: 0 auto 27px;
        width: 100%;
    }

    .sec_security .btn{
        margin-bottom: 8px;
    }


    .sec_service{
        margin-bottom: 0;
        padding: 38px 0;
        background: #dcdcdc;
    }

    .service_column {
        list-style-type: none;
    }

    .service_column li  {
        margin-bottom: 15px;
        width: 100%;
        text-align: center;
    }

    .service_column li:last-child {
        margin-bottom: 0;
    }

    .service_column li img{
        max-width: 257px;
    }


}


@media screen and (max-width : 320px) {

    #lnav_sp a {
        font-size: 11px;
        font-family: var(--font-light);
    }

    .box_copy {
        padding-left: 10px;
        font-size: 18px;
    }

    .trouble_list li {
        padding-left: 8px;
    }
    .bg_box .copy {
        white-space: inherit;
    }

    .btn_lg {
        font-size: 12px;
        font-family: var(--font-light);
    }



}