@media screen and (min-width: 1500px) {
    #home-section {
        min-height: 850px;
    }
    
    #home-section-campaign {
        min-height: 693px;
    }
}

@media screen and (min-width: 1920px) {
    #home-section {
        min-height: 980px;
    }
    
    #home-section-campaign {
        min-height: 796px;
    }
}

@media screen and (min-width: 2560px) {
    
    /*=== HOME SECTION ===*/
    #home-section {
        min-height: 1600px;
    }
    
    #home-section-campaign {
        min-height: 1052px;
    }
}

@media screen and (min-width: 1280px) {
    #intro, #function, #registration-flow, #price-plan, #contact-form {
        padding-top: 70px;
    }
}

@media screen and (max-width: 1024px) {
    
    /*=== HOME SECTION ===*/
    #home-section {
        min-height: 550px;
    }
    
    #home-section-campaign {
        min-height: 416px;
    }
    
    /*=== SECTION FUNCTION ===*/
    .flex3-wrapper2 {
        height: 430px;
    }
    
    /*=== SECTION SALES 3 ===*/
    .table-chart {
        column-gap: 20px;
    }
    
    /*=== HOME HEAD ===*/
    .myrow {
        padding: 0 10px;
    }
    .col50 {
        width: 50%;
        padding: 5px;
    }
    
    .head-item {
/*        padding: 30px 0;*/
        padding: 10px 0;
        font-size: 12px;
        height: 90px;
    }
    
    .head-item .left-item img {
        width: 25px;
        margin-left: 5px;
    }
    
    .head-item .middle-item {
        font-size: 14px;
        line-height: 1.2em;
        padding-left: 0;
        padding-top: 10px;
    }
    
    .head-item .middle-item.middle-item-last {
        padding-top: 10px;
    }
    
    .head-item .right-item {
        padding-left: 0;
    }
    
    /*=== COMPARE SECTION TABLE ===*/  
    .no1 {
        padding: 40px 10px 40px 10px;
    }
    
    .no1 span:first-child {
        display: block;
        width: 14%;
        float: left;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .no1 span:last-child {
        display: block;
        width: 86%;
        float: left;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .no3 {
        padding: 40px 10px 40px 10px;
    }
    
    .no3 span:first-child {
        display: block;
        width: 14%;
        float: left;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .no3 span:last-child {
        display: block;
        width: 86%;
        float: left;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }
    
    /*=== PRICE PLAN SECTION ===*/
    .price-table table tbody th {
        font-size: 14px;
        text-align: left;
        padding: 1em 10px 1em 10px;
    }
    
    .price-table table td {
        font-size: 14px;
        padding: 1em 10px 1em 10px;
    }
    
    /*=== SECTION NEWS ===*/
    .news-imp {
        flex-basis: 20%;
    }
    
    .news-date {
        flex-basis: 20%;
    }
    
    .news-title {
        flex-basis: 80%;
    }
    
    .show-1024 {
        display: inline-block;
    }
    
    .sec-img2 img {
        height: auto;
    }
    
    .my-no {
        line-height: normal;
    }
    
    /*=== CAMPAIGN SECTION ===*/
    .txt-camp-wrap::before {       
        left: 9%;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }

    .txt-camp-wrap::after {     
        right: 9%;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }
    
    .txt-campagin-banner {
        right: 2%;
        top: 7%;
    }
    
    .txt-camp1 {
        font-size: 41px;
    }
    
    .txt-camp2 {
        font-size: 22px;
    }
    
    .txt-camp {
        font-size: 40px;
    }
    
    #intro, #function, #registration-flow, #price-plan, #contact-form {
        padding-top: 55px;
    }
}


@media screen and (max-width: 834px) {
    
    /*=== HOME SECTION ===*/
    #home-section {
        min-height: 480px;
    }    
    
    #home-section-campaign {
        min-height: 350px;
    }
    
    .head-item .middle-item2 {
        margin-top: 0;
    }
    
    /*=== SECTION FUNCTION ===*/
    .flex3-wrapper2 {
        height: 500px;
    }

    /*=== SECTION FLOW 1 ===*/
    .flow-txt-wrap {
        padding: 0 20px;
    }
    
    /*=== SECTION SALES 2 ===*/
    .img-sec-banner3 {
        min-height: 105px;
    }
    
    .img-sec-banner4 {
        min-height: 105px;
    }
    
    /*=== HOME HEAD ===*/
    .myrow {
        padding: 0 10px;
    }
    .col50 {
        width: 50%;
        padding: 5px;
    }
    
    .head-item {
/*        padding: 30px 0;*/
        padding: 10px 0;
        font-size: 12px;
/*        height: 90px;*/
        height: 80px;
    }
    
    .head-item .left-item {
        padding-top: 8px;
    }
    
    .head-item .left-item img {
        width: 25px;
        margin-left: 5px;
    }
    
    .head-item .middle-item {
        font-size: 11px;
        line-height: 1.2em;
        padding-left: 0;
        padding-top: 5px;
    }
    
    .head-item .right-item {
        padding-left: 0;
        padding-top: 5px;
    }
    
    /*=== COMPARE SECTION TABLE ===*/  
    .no1 {
        padding: 40px 10px 40px 10px;
        font-size: 14px;
    }
    
    .no1 span:first-child {
        display: block;
        width: 12%;
        float: left;
    }
    
    .no1 span:last-child {
        display: block;
        width: 88%;
        float: left;
    }
    
    .no1 img {
        height: 30px;
    }
    
    .no3 {
        padding: 40px 10px 40px 10px;
        font-size: 14px;
    }
    
    .no3 span:first-child {
        display: block;
        width: 12%;
        float: left;
    }
    
    .no3 span:last-child {
        display: block;
        width: 88%;
        float: left;
    }
    
    .no3 img {
        height: 30px;
    }
    
    .row2-item {
        font-size: 14px;
    }
    
    .chart-round {
        margin-right: 30px;
    }
    
    /*=== CAMPAIGN SECTION ===*/
    .txt-camp-wrap::before {       
        left: 0;
        top: 10%;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }

    .txt-camp-wrap::after {     
        right: 0;
        top: 10%;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }
    
    .br-834 {
        display: inline-block;
    }
    
    .txt-camp {
        font-size: 40px;
    }
    
    .font-18 {
        font-size: 17px;
    }
    
    .img-music {
        top: 57px;
        left: 29.5%;
    }
    
    .txt-end-flow-wrap {
        padding-bottom: 40px;
    }
    
    .txt-campagin-banner {
        right: 2%;
        top: 1%;
    }
    
    .txt-camp1 {
        font-size: 34px;
    }
    
    .txt-camp2 {
        margin-top: 10px;
        font-size: 20px;
    }
    
    .txt-camp {
        font-size: 32px;
    }
    
    .flow-item2 {
        min-height: 190px;
    }
    
    .flow-num2::after {
        height: 227px;
    }
    
    .img-camp-wrap {
        left: 8%;
    }
}

@media screen and (max-width: 768px) {
    
    /*=== HOME SECTION ===*/
    #home-section {
        min-height: 446px;
    }  
    
    #home-section-campaign {
        min-height: 325px;
    }  
    
    /*=== SECTION FUNCTION ===*/
    .flex3-wrapper2 {
        height: 500px;
    }
    
    .img-sec-banner3 {
        min-height: 105px;
    }
    
    .img-sec-banner4 {
        min-height: 105px;
    }
    
    /*=== CAMPAIGN SECTION ===*/
    .txt-camp-wrap::before {       
        left: 0;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }

    .txt-camp-wrap::after {     
        right: 0;
        background-size: 27px 80px;       
        width: 27px;
        height: 80px;
    }
    
    .br-none-768 {
/*        display: none;*/
    }
    
    .txt-campagin-banner {
        right: 7%;
        top: 1%;
    }
    
    .txt-camp1 {
        font-size: 26px;
    }
    
    .txt-camp {
        font-size: 24px;
    }
    
}


@media screen and (max-width: 767px) {
    /*=== NAVBAR ===*/
    #main-nav {
        padding-left: 0;
        padding-right: 0;
    }
    #main-nav .container-fluid {
        text-align: center;
    }
     #main-nav .navbar-brand {
         margin: 0 auto;
         padding-left: 70px;
    }
    
    #main-nav .navbar-toggler {
        margin-right: 15px;
    }
    
    .nav-item {
        text-align: center;
        position: relative;   
        padding: 10px 0;
        font-size: 14px;
    }
    
    .nav-item:not(:last-child) {
        border-bottom: 1px solid #e7e7e7;
    }
    
    .nav-item:not(:last-child)::before {
        height: 0;
        width: 0;
        background: none;
        top: 26px;
        right: 30px;
    }
    
    .nav-item::before {
        content: "";       
        position: absolute;
        right: 30px;
        top: 26px;
        border: solid #4b4b4b;
        border-width: 0 3px 3px 0;
        display: inline-block;
        padding: 3px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
    }  

    /*=== HOME SECTION ===*/
    #home-section {
        background: url(../images/top-banner.jpg);
        background-repeat: no-repeat;
/*        background-size: contain;*/
        background-size: cover;
        background-position: center center;
/*        min-height: 195px;*/
        min-height: 217px;
    }
    
    #home-section-campaign {
        background: url(../images/campaign-top-banner.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        min-height: 150px;
    }
    
    
    #home-section-lower {
        background: url(../images/top-banner-lower.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        min-height: 180px;
        display: none;
    }
    
    /*=== HOME HEAD ===*/
    .myrow {
        padding: 0 10px;
    }
    .col50 {
        width: 50%;
        padding: 5px;
    }
    
    .head-item {
/*        padding: 30px 0;*/
        padding: 10px 0;
        font-size: 12px;
/*        height: 90px;*/
/*        height: 76px;*/
        height: 64px;
    }
    
    .head-item .left-item {
        padding-top: 0;
    }
    
    .head-item .left-item img {
        width: 25px;
        margin-left: 5px;
    }
    
    .head-item .middle-item {
        font-size: 11px;
        line-height: 1.2em;
        padding-left: 0;
        padding-top: 0;
    }
    
    .head-item .middle-item.middle-item-last {
        padding-top: 0;
        margin-top: -5px;
    }
    
    .head-item .right-item {
        padding-left: 0;
        padding-top: 0;
        margin-top: -5px;
    }
    
    /*=== COMPARE SECTION ===*/
    #compare-section {
        background: url(../images/compare-bg.png);
        background-repeat: no-repeat;
        background-size: contain;   
        background-position: top center;
        min-height: 100px;
    }
    
    .compare-wrap {
        padding-top: 40px;
    }
    
    .compare-header {
        font-size: 22px;
    }
    
    .compare-desc {
        font-size: 10px;
        background: rgba(255,255,255,0.9);
    }
    
    .compare-wrap2 {
        margin-bottom: 40px;
    }
    
     /*=== COMPARE SECTION TABLE ===*/   
    .compare-item {
        margin-left: 5px;
        margin-right: 5px;
    }
    
    .col3 {
        font-size: 12px;
    }
    
    .col3 img {
        width: 30px;
        height: auto;
    }
    
    .no1 {
        width: 35%;
        padding: 10px;
        font-size: 12px;
        line-height: 1.2em;
    }
    
    .no2 {
        width: 30%;
        padding: 10px;
        font-size: 12px;
        line-height: 1.2em;
    }
    
    .no3 {
        width: 35%;
        padding: 10px;
        font-size: 12px;
        line-height: 1.2em;
    }
    
    .no1 img {
        width: 20px;
        height: auto;
    }
    
    .no2 img {
        height: 22px;
        width: auto;
    }
    
    .no3 img {
        width: 24px;
        height: auto;
    }
    
    .no1 span:first-child {
/*        display: inline-block;*/
        margin-bottom: 5px;
        text-align: center;
/*        width: 5%;*/
/*        float: left;*/
        display: block;
        width: 100%;
        clear: both;
        top: 0;
        transform: none;
    }
    
    .no1 span:last-child {
/*        display: inline-block;*/
        margin-bottom: 5px;
        text-align: center;
/*        width: 90%;*/
/*        float: left;*/
        text-align: left;
/*        padding-left: 20px;*/
        display: block;
        width: 100%;
        clear: both;
        top: 0;
        transform: none;
    }
    
    .no3 span:first-child {
/*        display: inline-block;*/
        margin-bottom: 5px;
        text-align: center;
/*
        width: 5%;
        float: left;
*/
        display: block;
        width: 100%;
        clear: both;
        top: 0;
        transform: none;
    }
    
    .no3 span:last-child {
/*        display: inline-block;*/
        margin-bottom: 5px;
        text-align: center;
/*
        width: 90%;
        float: left;
*/
        text-align: left;
/*        padding-left: 20px;*/
        display: block;
        width: 100%;
        clear: both;
        top: 0;
        transform: none;
    }
    
    .sp-none {
        display: none;
    }
    
    .sp-show {
        display: inline-block;
    }
    
    /*=== SECTION MERIT1 ===*/
    .title-head {
        padding: 0 40px;
        font-size: 19px;
    }
    
    .title-head:before, .title-head:after {
        width: 30px;
    }
    
    .img-sec-banner {
        background: url(../images/sec-banner1.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        min-height: 100px;
        position: relative;
    }
    
    .img-sec-banner2 {
        background: url(../images/sec-banner2.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        min-height: 100px;
        position: relative;
    }
    
    .mywrap {
        flex-wrap: wrap;
    }
    
    .flex3 {
        flex-basis: 100%;        
    }
    
    .flex2 {
        flex-basis: 100%;        
    }
    
    /*=== SECTION MERIT2 ===*/
    .flex3-wrapper {   
        flex-wrap: nowrap;
    }
    
    .sec-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
/*        object-fit: contain;*/
    }
    
    .sec-desc-title {
        font-size: 15px;
    }
    
    .sec-desc {
        padding: 20px 15px;
        font-size: 13px;
    }
    
    /*=== SECTION MERIT4 ===*/    
    #sec-merit4 {
        padding: 0 0 40px 0;
/*        min-height: 400px;*/
/*        margin-bottom: -50px;*/
    }
    
    /*=== SECTION FUNCTION ===*/
    .mywrap2 {
        flex-wrap: wrap;
        column-gap: 0;
    }

    .flex3a {
        flex-basis: 50%;       
    }   
    
    .flex3-wrapper2 {
        height: auto;
        margin-bottom: 0;
    }
    
    .sm-50 {
        width: 50%;
        margin-bottom: 10px;
    }
    
    .sec-desc4 {
/*        height: 330px;*/
/*        height: 326px;*/
        height: 355px;
    }
    
    .sec-desc-title img {
        height: 18px;
        width: auto;
        margin-right: 2px;
    }

    .sec-desc-title .icon-food {
        height: auto;
        width: 28px;
        margin-right: 2px;
    }
    
    .no-pdr {
        padding-right: 5px;
    }
    
    .no-pdl {
        padding-left: 5px;
    }
    
    .sec-img2 {
        height: 90px;
    }
    
    .sec-img2 img {
        width: 100%;
/*        height: 90px;*/
        height: auto;
        object-fit: cover;
    }
    
    /*=== SECTION FLOW 1 ===*/
    .flow-chart {
/*        min-height: 800px;*/
    }
    
    .flow-txt-wrap {
        position: static;
        padding: 20px 10px 20px 10px;
    }
    
    .flow-num-txt {       
        height: 50px;
        width: 50px;        
/*        padding-top:0;*/
        padding-top: 5px;
        position: absolute;
        top: 50%;
        left: 10%;
        transform: translateY(-50%);
        font-size: 8px;
    }

    .flow-num-txt span {
        font-size: 14px;    
/*        top: -5px;*/
        top: -10px;
    }
    
    .flow-num-txt span.flow-line::after {
        height: 240px;
        top: 128%;
    }
    
    .flow-txt-wrap {
        top: 0;
        transform: none;
        padding-left: 10px;
    }
    
    .flow-txt-head {
        padding-top: 5px;
        font-size: 18px;
    }
    
    .flow-img {
        align-self: center;
    }
    
    .flow-img img {
        width: 100%;
        height: auto;
/*        padding-right: 10px;*/
    }
    
    /*=== SECTION FLOW 2 ===*/
    .box-wrap {
        flex-wrap: wrap;
    }
    
    .box50 {
        flex-basis: 100%;
        padding: 30px 15px 10px;
        margin-bottom: 10px;
    }
        
    .box-title {
        font-size: 22px;
    }
    
    .box-title span {
        font-size: 18px;
    }
    
    .box-title2 {
        margin: 10px 20px 30px;
    }
    
    .box-price1 {
        padding-left: 15px;
        flex-basis: 40%;
    }
    
    .arrow-right {
        flex-basis: 15%;
    }
    
    .arrow-right img {
        width: 70%;
    }
    
    .price-big {
        font-size: 28px;
    }
    
    .box-img1 img {
        width: 45%;
        margin-bottom: 5%;
    }
    
    /*=== SECTION FLOW 3 ===*/
    .mywrap3 {
        flex-wrap: wrap;       
    }
    
    .mywrap3 .flex3 {
        margin-bottom: 20px;
    }   
    
    .mywrap3 .flex3 .flex3-wrapper .sec-img {
        flex-basis: 40%;
    }
    
    .mywrap3 .flex3 .flex3-wrapper .sec-desc {
        flex-basis: 60%;
    }
    
    /*=== SECTION NEWS ===*/
    .news-item {
        column-gap: 10px;
    }
    .news-imp {
        font-size: 13px;       
        flex-basis: 30%;       
    }
    
    .news-date {
        font-size: 13px;      
        flex-basis: 30%;       
    }
    
    .news-title {
        flex-basis: 70%;
        font-size: 13px;
    }
    
    .icon-pdf {
        margin-left: 0;
        width: 80px;
        display: block;
    }
    
    /*=== SECTION SALES 1 ===*/    
    .img-sec-banner3 {
        background: url(../images/img-sales1-sp.png);
        background-repeat: no-repeat;
        background-size: contain;
        min-height: 60px;
        position: relative;
        background-color: #f0f0f0;     
    }
    
    .img-sec-banner4 {
        background: url(../images/img-sales2-sp.png);
        background-repeat: no-repeat;
        background-size: contain;
        min-height: 60px;
        position: relative;
        background-color: #f0f0f0;
    }
    
    .sec-title3 {
        font-size: 14px;         
    }
    
    .title-head2 {
/*        font-size: 18px;*/
        font-size: 16px;
    }
    
    .tbl-sales {
        height: 222px;
    }
    
    .row1-wrap {       
        flex-wrap: wrap;
        margin: 0;
        width: 50%;
        height: 100%;
        float: left;
    }
    
    .row1-item {
        flex-basis: 100%;   
        padding: 20px 2px;
        font-size: 11px;   
        border: 1px solid #b3b3b3;
        height: calc(100%/3);
    }
    
    .row2-wrap {       
        flex-wrap: wrap;
        margin: 0;
        width: 50%;   
        height: 100%;
        float: left;
    }
    
    .row2-item {
        flex-basis: 100%; 
        padding: 20px 2px;
        font-size: 11px;     
        height: calc(100%/3);       
    }
    
    .row2-item:last-child {
        padding: 10px 2px;
    }
    
    .chart-round {
        margin: 0 auto;
    }
    
    /*=== SECTION SALES 2 ===*/
    .table-chart {
        column-gap: 20px;
    }
    .chart-img {
        align-self: flex-start;
    }
    
    .chart-desc {
        padding: 0 0 10px 0;        
    }
    
    /*=== CONTACT SECTION ===*/
    table.list tbody tr td.ttd1 {
        width: 100%;
        display: block;
    }
    
    table.list tbody tr td.ttd1a {
        padding: 40px 0 20px 0;
    }


    table.list tbody tr td.ttd2 {
        width: 100%;
        display: block;
    }
    
    table.list tbody tr {
/*        border-bottom: 1px solid #9e9e9e;*/
    }
    
    .no-border {
        margin-bottom: 60px;
    }
        
    .wpcf7-list-item {
        display: block!important;
        margin-left: 0!important;
    }
    
    .ttd1 span.req {
        float: none;
        margin-left: 15px;
    }
    
    .ttd1 span.noreq {
        float: none;
        margin-left: 15px;
    }
    
    /*=== FOOTER SECTION ===*/
    .ft-logo {
        width: 10.5%;        
    }
    
    .bubble {
        left: 50px;
    }
    
    #sec-merit4 .title-head {
/*        font-size: 15px;*/
        font-size: 13px;
    }
    
    .head-item .middle-item2 {
        margin-top: -10px;
    }
    
    /*=== ADDITION CONTENTS ===*/
    .my-add-wrap {
        flex-wrap: wrap;
/*        column-gap: 10px;*/
        column-gap: 0;
    }
    
    .add-box {
/*        flex-basis: 90%;*/
        flex-basis: 47%;
        margin: 0 auto 50px;
    }
    
    .add-box::after {
/*
        content: "▼";
        position: absolute;
        font-size: 30px;
        top: unset;
        left: 50%;
        transform: translateX(-50%);
        right: unset;
        bottom: -40px;
        color: #fcabb6;
*/
    }
    
    .add-box img {
        width: 100%;
    }
	
	.img-add-box {
        width: 100%;
    }
    
    .add-note {
        padding: 10px 0;
/*        font-size: 18px;*/
    }
    
    #sec-merit4 .txt-desc {
        padding: 10px 0;
    }
    
    .title-jp {
        font-size: 22px;
    }
    
    #sec-thanks {
        padding: 60px 0 0 0;
        height: 70vh;
    }
    
    #top-space {
/*        height: 40vh;*/
        height: 20vh;
    }
    
    .flow-desc {
        padding: 0 34px;
        text-align: justify;
    }
    
    .my-txt-wrap {
        text-align: left;
    }
    
    .my-txt-wrap2 {
        text-align: left;
    }
    
    .txt-underline {      
/*    background: linear-gradient(transparent 50%, #f3a719 50%);*/
/*
        text-decoration: underline;
        text-decoration-color: #f3a719;
        text-decoration-thickness: 50%;
        text-underline-offset: -0.7em;
*/
        background: linear-gradient(transparent 70%, #f3a719 50%);
    }
    
    .flex3:nth-child(2) {
        border-left: 1px solid #999;
        border-right: 1px solid #999;
    }
    
    /*=== CAMPAIGN SECTION ===*/
    .bg-gray3 {
        flex-wrap: wrap;
    }
    
    .gray-left {
        flex-basis: 100%;
        margin-bottom: 20px;
    }
    
    .gray-right {
        flex-basis: 100%;
        padding: 0 15px;
    }
    
    .txt-camp-desc2 {
        flex-wrap: wrap;
    }
    
    .txt-camp-left {
        flex-basis: 100%;
        margin-bottom: 20px;
    }
    
    .txt-camp-right {
        flex-basis: 100%;
    }
    
    .btn-goto {
        font-size: 22px;
    }
    
    .title-jp2 {
        font-size: 30px;
    }
    
    .title-flow-round2 {
        font-size: 18px;
    }
    
    .flow-num2::after {
        height: 440px;
    }
    
    .txt-camp {
        font-size: 30px;
    }
    
    .img-hand-qr {
        width: 65%;
        margin: 0 auto;     
        display: block;
        margin-top: 10px;
    }
    
    .icon-apple {
        margin-bottom: 10px;
    }
    
    .img-camp-ft {
        width: 70%;
    }
    
    
    #home-section-campaign {
        background: url(../images/campaign-top-banner-sp.png);
        min-height: 240px;
    }
    
    .txt-camp1 {
        font-size: 19px;
    }
    
    .txt-camp2 {
        font-size: 16px;
        margin-top: 5px;
    }
    
    .txt-camp-sm {
        font-size: 10px;       
    }
    
    .txt-campagin-banner {
        right: 6%;
        top: 5%;
        padding: 25px 0 10px;
        
    }
    
    .less-mt {
        margin-top: -10px!important;
    }
    
    .txt-normal {
        margin-top: -10px!important;
    }
    
    .img-wifi {
        width: 13px;        
        margin-top: -14px;       
    }
    
    .flow-item2a {
        min-height: 359px;
    }
    
    .flow-txt-wrap2 {
        padding-left: 10px;
    }
    
    .txt-camp-top-wrap {
        left: 0;
    }
    
    .img-camp-wrap {
        left: 0;
    }
    
    .img-music {
        top: 57px;
        left: 13.5%;
    }
    
    .txt-qr {
        margin: 0 auto 30px;
    }
    
    .sec-desc2::before {       
        left: 9px;       
    }
    
    .sec-desc3::before {
        left: 9px;
    }
    
    .log-in-note {
        margin-left: 10%;
    }
    
}

@media screen and (max-width: 390px) {
    .flow-desc {
        padding: 0 41px;
        text-align: justify;
    }
}

@media screen and (max-width: 375px) {
    .box-bubble {
        padding: 5px 15px;
        font-size: 14px;
    }
    
    .flow-desc {
        padding: 0 34px;
        text-align: justify;
    }
    
    .txt-campagin-banner {      
        padding: 25px 0 10px;
    }
}


@media screen and (min-width: 321px) and (max-width: 374px) {
    #home-section {
        min-height: 200px;
        background-size: contain;
    }
    
    .sec-title3 {
        font-size: 12px;
    }
    
    #home-section-campaign {
        min-height: 240px;
    }
    
    .txt-campagin-banner {
        top: 10%;
        right: 3%;
        padding: 10px 0 10px;
    }
    
    .same-height {
        min-height: 120px !important;
    }
    
    .same-height2 {
        min-height: 175px !important;
    }
    
    .my-add-wrap {
        column-gap: 0;
    }
    
    .head-item2 {
        font-size: 14px;
    }
    
    #intro, #function, #registration-flow, #price-plan, #contact-form {
        padding-top: 30px;
    }
}

@media screen and (max-width: 320px) {
    .title-flow-round {
        font-size: 16px;
    }
    
    .box-bubble {
        padding: 5px 10px;
        font-size: 14px;
    }
    
    #home-section {
        min-height: 166px;
        background-size: contain;
    }
    
    .sec-title3 {
        font-size: 12px;
    }
    
    .same-height {
        min-height: 130px!important;
    }
    
    .same-height3 {
        min-height: 192px!important;
    }
    
    .same-height4 {
        min-height: 222px!important;
    }
    
    .head-item2 {
        font-size: 13px;
    }
    
    .title-jp2 {
        font-size: 26px;
    }
    
    .flow-num2::after {
        height: 555px;
    }
    
    .title-flow-round2 {
        padding: 10px 50px;
    }
    
    .btn-goto a {
        font-size: 19px;
    }
    
    .txt-camp-wrap::before {
        left: -8px;
        background-size: 22px 80px;
        width: 22px;
        height: 80px;
    }
    
    .txt-camp-wrap::after {
        right: -8px;
        background-size: 22px 80px;
        width: 22px;
        height: 80px;
    }
    
    .txt-camp-emp {
        font-size: 30px;
    }
    
    .txt-bold {
        font-size: 15px;
    }
    
    .txt-camp {
        font-size: 26px;
    }
    
    #home-section-campaign {
        min-height: 240px;
    }
    
    .txt-camp1 {
        font-size: 18px;
    }
    
    .txt-camp2 {
        font-size: 13px;      
    }
    
    .txt-campagin-banner {
        top: 6%;
        right: 3%;
    }
    
    .flow-item2 {
        min-height: 230px;
    }
    
    .flow-item2a {
        min-height: 480px;
    }
    
    .sec-desc4 {
        height: 381px;
    }
    
    .txt-end-flow-wrap {
        padding-left: 40px;
    }
    
    .sfr-fix .sec-img img {       
        max-height: 350px!important;
    }
}

@media screen and (max-width: 300px) {
    #home-section {
        min-height: 146px!important;
        background-size: contain;
    }
    
    .same-height {
        min-height: 154px!important;
    }
    
    .same-height2 {
        min-height: 199px!important;
    }
    
    .same-height3 {
        min-height: 202px!important;
    }
    
    .same-height4 {
        min-height: 248px!important;
    }
}