﻿@media only screen and (min-width: 769px) and (max-width:1366px) {
    .content_In_Banner_left {
        width: calc(100% - 310px);
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        flex-direction: column;
        gap: 5px;
    }

    .content_In_Banner_right {
        width: 300px;
        height: 200px;
        background-image: url('../images/offer-tag.png');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: 0 auto;
    }

    .content_In_Banner_left span.sp01 {
        color: #333;
        position: relative;
        font-size: 28px;
        line-height: 23px;
        font-weight: 900;
        letter-spacing: .25rem;
    }

    .content_In_Banner_left span.sp02 {
        color: #e6007e;
        background-color: #ffc13f;
        padding: 5px 20px;
        border-radius: 5px;
        font-size: 15px;
        letter-spacing: .03rem;
        font-weight: 600;
    }

    .pager {
        width: calc(100%);
        height: 90px;
        bottom: 0;
        font-size: .85rem;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row;
        gap: 11px;
    }
}



@media only screen and (min-width: 1px) and (max-width:768px) {

    .content_In_Banner {
        background: url('../images/package_mobile_bg.jpg') no-repeat;
    }

    .content_In_Banner_Main {
        flex-direction: column;
    }
    .content_In_Banner_left {
        width: calc(100%);
        padding-top:25px;
    }
    .content_In_Banner_right {
        width: calc(100%);
        right:-30px;
        height:170px;
    }

    .content_In_Banner_left span.sp01 {
        font-size: 28px;
    }

    .content_In_Banner_right .spandiv {
        margin-top: 40px;
    }

    #trOrderList {
        display: none;
        position: absolute;
        z-index: 100000;
        width: calc(100% - 120px);
        height: calc(100% - 120px);
        overflow: hidden;
        background-color: rgba(240,244,255,.98);
        padding: 50px;
        margin: 0 10px 0 10px;
        justify-content: flex-start;
        align-items: center;
        flex-direction: column;
    }


    .bgMain {
        margin: 10px;
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-direction: column;
    }

    .panel_left {
        width: calc(((100% / 1) * 1) - 20px);
        height: auto;
        flex-direction: column;
    }

        .panel_left .bgLogo img {
            width: calc(100% - 75px);
        }

        .panel_left .bgLogo i {
            display: block;
            margin-left: 30px;
        }

        .panel_left .menuMobile {
            display: none;
            width: 100%;
        }

    .bgItem {
        height: 45px;
        align-items: center;
    }

    .panel_left span {
        font-size: 14px;
    }

    .panel_Right {
        width: calc(((100% / 1) * 1) - 20px);
    }

        .panel_Right .content {
            width: calc(100% - 20px);
            margin: 10px 10px 10px 10px;
        }

            .panel_Right .content .content_In {
                width: 100%;
                display: flex;
                flex-direction: column;
                flex-wrap: wrap;
                margin-bottom: 35px;
            }

    .payment_information {
        flex-direction: column;
    }

        .payment_information .voice_information {
            width: calc(100% - 0px);
            padding: 10px 10px 10px 10px;
        }

        .payment_information .Dahsboard_right {
            width: calc(100% - 0px);
            height: auto;
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: flex-start;
            font-size: .80rem;
            font-weight: 400;
            padding: 2.5px 10px 10px 10px;
            gap: 10px;
            flex-wrap: wrap;
        }

    .panel_Right .content .textbox-wrapper {
        width: 100%;
    }

        .panel_Right .content .textbox-wrapper span.tbTitle2 {
            min-width: 0px;
        }

    .bt01 {
        width: calc(100%);
        min-width: 100px;
        margin-top: -25px;
    }

    .btn01Default {
        width: calc(100% - 100px);
        margin-top: 0px;
    }

    .payment_information .Dahsboard_right a {
        width: calc((100% / 2) - 25px);
        padding: 5px;
        display: flex;
        flex-wrap: wrap;
    }

        .payment_information .Dahsboard_right a .drItem {
            width: calc(100%);
        }

    .packageMain .pItem .card_middle .pcm_item {
        padding: 5px 15px 0px 15px;
    }

        .packageMain .pItem .card_middle .pcm_item .pLeft {
            width: calc(30%);
        }

        .packageMain .pItem .card_middle .pcm_item .pRight {
            width: calc(70%);
        }

    #panelBilgilerim {
        width: 100%;
    }

    .tbMargin1 {
        margin-top: 5px !important;
    }

    .packageMain .pItem {
        width: calc((100% / 1) - 12px);
        margin: 5px;
        padding: 20px 5px 20px 5px;
    }

    .cardbottomPriceMain {
        width: 70%;
    }

        .packageMain .pItem .card_bottom .card_price {
            font-size: 1.30rem;
            font-weight: 700;
            color: #1eada1;
            padding-left: 15px;
            padding-right: 15px;
            width: calc(100% - 30px);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
        }

    .packageMain .pItem .card_bottom .card_price01 {
        justify-content: flex-start;
        text-decoration: line-through;
        font-size: .80rem;
    }

    .packageMain .pItem .card_bottom .card_buy {
        width: calc(30%);
    }

    .packageMain .menuDefine {
        display: none;
    }

    .btnDefineOpen {
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .btnDefineOpen span {
            font-size: 13px;
            font-weight: 500;
        }

        .btnDefineOpen i {
            font-size: 13px;
            margin-left: 5px;
        }

    .content_In1 {
        flex-direction: row !important;
    }

    .cb04 {
        display: flex;
        justify-content: flex-start;
        width: 100%;
        height: auto;
        margin: 20px 0 10px 0;
    }

    .cbArea {
        width: 100% !important;
        display: flex;
        margin: 0 0 50px 0;
    }

    .cbArea1 {
        flex-direction: column;
    }

    .cbArea1A {
        margin-bottom: 20px;
    }

    .bt011 {
        margin-top: 0px;
        margin-bottom: 10px;
    }



    .table .bt01 {
        flex-direction: row;
        font-size: 11px;
    }

    .pager {
        width: calc(100%);
        height: 90px;
        bottom: 0;
        font-size: .85rem;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row;
        gap: 11px;
    }

    .SearchArea .saItem {
        display: flex;
        flex-direction: column;
        width: calc(50% - 5px);
        align-items: flex-start;
        justify-content: flex-start;
        margin-left: 5px;
    }
}





