@media screen and (min-width: 640px) {

    .pc-only{
        display: block;
    }
    .sp-only{
        display: none;
    }

    .regular-overseas-study{
        position: relative;
        margin: 40px 0 41px;
        padding: 0 0 40px;
        background: #c6ffff;
        border-radius: 20px;
        border: 3px solid #0a97ac;
    }

    .ros-top{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        overflow: hidden;
        margin: 0 0 40px;
        background: #0a97ac;
        border-radius: 15px 15px 0 0;
    }

    .ros-top-student{
        width: 120px;
        margin: 0 0 -8px;
    }

    .ros-top-student img{
        width: 100%;
        vertical-align: text-top;
    }

    .ros-top-balloon{
        position: absolute;
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        width: 242px;
        background: #f0e91f;
        border-radius: 50px;
        color: #333333;
        font-weight: bold;
        font-size: 14px;
        text-align: center;
    }

    .ros-top-balloon span{
        font-size: 18px;
    }

    .ros-top-balloon::before{
        content: '';
        position: absolute;
        bottom: -8px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        width: 10px;
        height: 10px;
        background: url(../img/page/types/2512/ros-top-balloon-arrow.png) no-repeat center / cover;
    }

    .ros-top-title{
        margin: 27px 7px 0 22px;
        font-size: 44px;
        color: #ffffff;
        font-weight: bold;
        text-align: center;
        line-height: 1;
    }

    .ros-top-earth{
        width: 120px;
        margin: 10px 0 0;
    }

    .ros-top-earth img{
        width: 100%;
    }

    .ros-txt01{
        margin: 0 0 20px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        letter-spacing: .02em;
        line-height: 1;
    }

    .ros-txt02{
        margin: 0 44px 35px;
        color: #333333;
        font-size: 16px;
        line-height: 1.5;
    }

    .ros-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 20px;
    }

    .ros-wrap01-title{
        display: inline-block;
        margin: 0 0 0 -10px;
        padding: 5px 20px;
        background: #f0e921;
        border-radius: 0 50px 50px 0;
        color: #333333;
        font-weight: bold;
        font-size: 18px;
    }

    .ros-wrap01-img{
        width: 440px;
        margin: 0 31px 0 25px;
    }

    .ros-wrap01-img img{
        width: 100%;
    }

    .ros-wrap01-price{
        margin: 10px 0 0;
        color: #333333;
        font-weight: bold;
        font-size: 20px;
        line-height: 1;
    }

    .ros-wrap01-price span{
        font-size: 36px;
    }

    .ros-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 16px 45px 0;
    }

    .ros-wrap02-item{
        width: 360px;
        padding: 16px 30px;
        background: #0a97ac;
        border-radius: 10px;
    }

    .ros-wrap02-item-title{
        margin: 0 0 16px;
        color: #ffffff;
        font-weight: bold;
        font-size: 20px;
        line-height: 1;
        text-align: center;
    }

    .ros-wrap02-item-img{
        width: 100%;
        margin: 0 0 10px;
    }

    .ros-wrap02-item-img img{
        width: 100%;
    }

    .ros-wrap02-item-text{
        color: #ffffff;
        font-size: 14px;
        line-height: 1.5;
    }    

    .short-term-overseas-study{
        margin: 0 0 40px;
        padding: 0 0 40px;
        background: #eafbfb;
        border-radius: 20px;
        border: 3px solid #0a97ac;
    }

    .stos-top{
        margin: 0 0 40px;
        padding: 16px 0;
        background: #0a97ac;
        color: #ffffff;
        font-weight: bold;
        font-size: 36px;
        text-align: center;
        line-height: 1;
        border-radius: 15px 15px 0 0;
    }
    
    .stos-txt01{
        margin: 0 0 20px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        line-height: 1;
    }

    .stos-txt02{
        margin: 0 44px 40px;
        color: #333333;
        font-size: 16px;
        line-height: 1.5;
    }

    .stos-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 40px;
    }

    .stos-img{
        width: 520px;
        margin: 0 0 0 74px;
    }

    .stos-img img{
        width: 100%;
    }

    .stos-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 40px;
    }

    .stos-wrap02-item{
        width: 360px;
    }

    .stos-wrap02-item img{
        width: 100%;
    }

    .foreign_exchange{
        margin: 0 0 50px;
        padding: 0 0 15px;
        background: #eafbfb;
        border-radius: 20px;
        border: 3px solid #0a97ac;
    }

    .fe-top{
        margin: 0 0 40px;
        padding: 16px 0;
        background: #0a97ac;
        color: #ffffff;
        font-weight: bold;
        font-size: 36px;
        text-align: center;
        line-height: 1;
        border-radius: 15px 15px 0 0;
    }

    .fe-txt01{
        margin: 0 0 20px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        line-height: 1;
    }

    .fe-txt02{
        margin: 0 44px 40px;
        color: #333333;
        font-size: 16px;
        line-height: 1.5;
    }

    .fe-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 28px;
    }

    .fe-wrap01-title{
        display: inline-block;
        margin: 0 0 0 -10px;
        padding: 5px 20px;
        background: #f0e921;
        border-radius: 0 50px 50px 0;
        color: #333333;
        font-weight: bold;
        font-size: 18px;
    }
    
    .fe-wrap01-img{
        width: 65px;
        margin: 0 45px;
    }

    .fe-wrap01-img img{
        width: 100%;
    }
    
    .fe-wrap01-price{
        margin: 10px 0 0;
        color: #333333;
        font-weight: bold;
        font-size: 20px;
        line-height: 1;
    }

    .fe-wrap01-price span{
        font-size: 36px;
    }

    .fe-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 16px 44px 25px;
    }

    .fe-wrap02-img{
        width: 360px;
    }

    .fe-wrap02-img img{
        width: 100%;
    }

    .fe-wrap02-text{
        width: 360px;
        color: #333333;
        font-size: 16px;
        line-height: 1.5;
    }

    .ros-support{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 35px;
        margin: 0 0 32px;
    }

    .ros-support-deco{
        width: 35px;
    }

    .ros-support-deco img{
        width: 100%;
    }

    .ros-support-deco.reverse{
        transform: scale(-1, 1);
    }

    .ros-support-title{
        margin: 10px 0 0;
        color: #222222;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        letter-spacing: -.02em;
        line-height: 1.3;
    }

    .ros-support-title span{
        background: linear-gradient(transparent 60%, #f0e922 30%);
        font-size: 36px;
    }

    .ros-support-text{
        margin: 0 0 40px;
        color: #333333;
        font-size: 14px;
        line-height: 1.8;
    }

    .ros-efe-wrap{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        gap: 16px;
        margin: 0 0 24px;
    }

    .ros-efe-icon{
        width: 25px;
    }

    .ros-efe-icon img{
        width: 100%;
    }

    .ros-efe-title{
        margin: 1px 0 0;
        color: #333333;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        line-height: 1;
    }

    .ros-efe-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 0 40px;
    }

    .ros-efe-wrap02-item{
        width: 405px;
        padding: 30px 0 40px;
        border-radius: 10px;
        background: #0f99ae;
    }

    .ros-efe-wrap02-item-title{
        margin: 0 0 15px;
        color: #ffffff;
        font-weight: bold;
        font-size: 18px;
        text-align: center;
        line-height: 1;
    }

    .ros-efe-wrap02-item-wrap{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 0 0 0 44px;
    }

    .ros-efe-wrap02-item-text{
        margin: 0 20px 0 0;
        color: #ffffff;
        font-size: 14px;
    }

    .ros-efe-wrap02-item-text02{
        margin: 0 55px 0 0;
        color: #ffffff;
        font-size: 14px;
    }
}

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

    .pc-only{
        display: none;
    }
    .sp-only{
        display: block;
    }

    .ros_page_box{
        padding: 30px 10px;
    }

    .ros_pg_title_02{
        padding: 0 20px;
    }

    .ros_mt_s{
        padding: 0 20px;
    }

    .regular-overseas-study{
        position: relative;
        margin: 60px 0 35px;
        padding: 0 0 40px;
        background: #c6ffff;
        border-radius: 10px;
        border: 3px solid #0a97ac;
    }

    .ros-top{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        overflow: hidden;
        margin: 0 0 22px;
        padding: 12px 0 0;
        background: #0a97ac;
        border-radius: 5px 5px 0 0;
    }

    .ros-top-student{
        width: 24%;
        margin: 0 0 -8px;
    }

    .ros-top-student img{
        width: 100%;
        vertical-align: text-top;
    }

    .ros-top-balloon{
        position: absolute;
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        width: 66%;
        background: #f0e91f;
        border-radius: 50px;
        color: #333333;
        font-weight: bold;
        font-size: 13px;
        text-align: center;
    }

    .ros-top-balloon span{
        font-size: 17px;
    }

    .ros-top-balloon::before{
        content: '';
        position: absolute;
        bottom: -8px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        width: 10px;
        height: 10px;
        background: url(../img/page/types/2512/ros-top-balloon-arrow.png) no-repeat center / cover;
    }

    .ros-top-title{
        margin: 18px 0 0;
        font-size: 40px;
        color: #ffffff;
        font-weight: bold;
        text-align: center;
        line-height: 1;
    }

    .ros-top-earth{
        width: 20%;
        margin: 10px 0 0;
    }

    .ros-top-earth img{
        width: 100%;
    }

    .ros-txt01{
        margin: 0 0 15px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 21px;
        text-align: center;
        letter-spacing: .02em;
        line-height: 1.31;
    }

    .ros-txt02{
        margin: 0 10px 25px;
        color: #333333;
        font-size: 15px;
        line-height: 1.71;
    }

    .ros-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 25px;
    }

    .ros-wrap01-title{
        display: inline-block;
        margin: 0 0 0 -8px;
        padding: 5px 15px;
        background: #f0e921;
        border-radius: 0 10px 10px 0;
        color: #333333;
        font-weight: bold;
        font-size: 15px;
    }

    .ros-wrap01-img{
        width: 183px;
        margin: 0 0 0 35px;
    }

    .ros-wrap01-img img{
        width: 100%;
    }

    .ros-wrap01-price{
        margin: 0 0 0 20px;
        color: #333333;
        font-weight: bold;
        font-size: 18px;
        line-height: 1;
    }

    .ros-wrap01-price span{
        font-size: 33px;
    }

    .ros-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 16px 10px 0;
    }

    .ros-wrap02-item{
        width: 48%;
        padding: 16px 15px;
        background: #0a97ac;
        border-radius: 10px;
    }

    .ros-wrap02-item-title{
        margin: 0 0 10px;
        color: #ffffff;
        font-weight: bold;
        font-size: 15px;
        line-height: 1;
        text-align: center;
    }

    .ros-wrap02-item-img{
        width: 100%;
        margin: 0 0 10px;
    }

    .ros-wrap02-item-img img{
        width: 100%;
    }

    .ros-wrap02-item-text{
        color: #ffffff;
        font-size: 13px;
        line-height: 1.38;
    }    

    .short-term-overseas-study{
        margin: 0 0 30px;
        padding: 0 0 40px;
        background: #eafbfb;
        border-radius: 10px;
        border: 3px solid #0a97ac;
    }

    .stos-top{
        margin: 0 0 25px;
        padding: 20px 0;
        background: #0a97ac;
        color: #ffffff;
        font-weight: bold;
        font-size: 28px;
        text-align: center;
        line-height: 1;
        border-radius: 5px 5px 0 0;
        letter-spacing: .06em;
    }
    
    .stos-txt01{
        margin: 0 0 20px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 20px;
        text-align: center;
        line-height: 1.2;
    }

    .stos-txt02{
        margin: 0 10px 40px;
        color: #333333;
        font-size: 15px;
        line-height: 1.71;
    }

    .stos-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 25px;
    }

    .stos-img{
        width: 220px;
        margin: 0 0 0 15px;
    }

    .stos-img img{
        width: 100%;
    }

    .stos-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 15px;
    }

    .stos-wrap02-item{
        width: 48%;
    }

    .stos-wrap02-item img{
        width: 100%;
    }

    .foreign_exchange{
        margin: 0 0 50px;
        padding: 0 0 15px;
        background: #eafbfb;
        border-radius: 10px;
        border: 3px solid #0a97ac;
    }

    .fe-top{
        margin: 0 0 25px;
        padding: 20px 0;
        background: #0a97ac;
        color: #ffffff;
        font-weight: bold;
        font-size: 28px;
        text-align: center;
        line-height: 1;
        border-radius: 5px 5px 0 0;
        letter-spacing: .06em;
    }

    .fe-txt01{
        margin: 0 0 20px;
        color: #0a97ac;
        font-weight: bold;
        font-size: 20px;
        text-align: center;
        line-height: 1.2;
    }

    .fe-txt02{
        margin: 0 10px 40px;
        color: #333333;
        font-size: 14px;
        line-height: 1.71;
    }

    .fe-wrap01{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
        margin: 0 0 28px;
    }

    .fe-wrap01-title{
        display: inline-block;
        margin: 0 0 0 -8px;
        padding: 5px 15px;
        background: #f0e921;
        border-radius: 0 10px 10px 0;
        color: #333333;
        font-weight: bold;
        font-size: 15px;
    }
    
    .fe-wrap01-img{
        width: 60px;
        margin: 0 0 0 45px;
    }

    .fe-wrap01-img img{
        width: 100%;
    }
    
    .fe-wrap01-price{
        margin: 0 0 0 29px;
        color: #333333;
        font-weight: bold;
        font-size: 18px;
        line-height: 1;
    }

    .fe-wrap01-price span{
        font-size: 33px;
    }

    .fe-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 15px 15px 35px;
    }

    .fe-wrap02-img{
        width: 48%;
    }

    .fe-wrap02-img img{
        width: 100%;
    }

    .fe-wrap02-text{
        width: 48%;
        color: #333333;
        font-size: 14px;
        line-height: 1.71;
    }

    .ros-support{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 0 15px;
    }

    .ros-support-deco{
        width: 25px;
    }

    .ros-support-deco img{
        width: 100%;
    }

    .ros-support-deco.reverse{
        transform: scale(-1, 1);
    }

    .ros-support-title{
        color: #222222;
        font-weight: bold;
        font-size: 20px;
        text-align: center;
        letter-spacing: -.02em;
        line-height: 1.3;
    }

    .ros-support-title span{
        background: linear-gradient(transparent 60%, #f0e922 30%);
        font-size: 26px;
    }

    .ros-support-text{
        margin: 0 20px 40px;
        color: #333333;
        font-size: 15px;
        line-height: 1.71;
    }

    .ros-relative{
        margin: 0 20px;
    }

    .ros-efe-wrap{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        gap: 16px;
        margin: 0 0 20px;
    }

    .ros-efe-icon{
        width: 25px;
    }

    .ros-efe-icon img{
        width: 100%;
    }

    .ros-efe-title{
        margin: 1px 0 0;
        color: #333333;
        font-weight: bold;
        font-size: 22px;
        text-align: center;
        line-height: 1;
    }

    .ros-efe-wrap02{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: 0 20px 40px;
    }

    .ros-efe-wrap02-item{
        width: 48%;
        padding: 30px 0 40px;
        border-radius: 10px;
        background: #0f99ae;
    }

    .ros-efe-wrap02-item-title{
        margin: 0 0 15px;
        color: #ffffff;
        font-weight: bold;
        font-size: 18px;
        text-align: center;
        line-height: 1;
    }

    .ros-efe-wrap02-item-wrap{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 0 0 0 13px;
    }

    .ros-efe-wrap02-item-text{
        margin: 0 20px 0 0;
        color: #ffffff;
        font-size: 13px;
    }

    .ros-efe-wrap02-item-text02{
        color: #ffffff;
        font-size: 14px;
    }
}