@media screen and (max-width: 1545px){
    .bank_title .img_title{width: calc(100vw*(265/1545)); height: calc(100vw*(80/1545)); top: calc(100vw*(-40/1545)); font-size: calc(100vw*(22/1545));}
    /* set */
    .container {width: calc(100vw*(1500/1545));}
    input:focus {box-shadow: 0 0 calc(100vw*(5/1545)) rgba(255,255,255,0.3);}


    /* ========================= login ========================= */
    /* 로그인 */

    .login_box {_width: calc(100vw*(563/1545));}
    .login_bg{height: 100%;}
    .login_bar_top{width: calc(100vw*(240/1545)); top: calc(100vw*(-85/1545));}
    .login_bar_bottom{width: calc(100vw*(264/1545)); bottom: calc(100vw*(-45/1545));}
    .row {width: calc(100vw*(330/1545));}
    .login_input {_height: calc(100vw*(50/1545)); padding: calc(100vw*(12/1545)) 0;}
    .login_input:first-child {margin-bottom: calc(100vw*(20/1545));}
    .login_input label {width: calc(100vw*(50/1545)); font-size: calc(100vw*(13/1545)); padding-left: calc(100vw*(20/1545));}
    /*.login_input input {width: calc(100% - calc(100vw*(58/1545))); font-size: calc(100vw*(14/1545));}*/
    .login_input input {width: calc(100% - calc(100vw*(58/1545))); font-size: calc(100vw*(25/1545));}

    .login_info {gap: calc(100vw*(5/1545)); margin: calc(100vw*(15/1545)) 0 calc(100vw*(30/1545));}

    .login_info span {font-size: calc(100vw*(13/1545));}

    .login_btn {width: calc(100vw*(250/1545)); _height: calc(100vw*(86/1545)); font-size: calc(100vw*(15/1545));}
    .login_box .btn_box {gap: calc(100vw*(25/1545)); margin-top: calc(100vw*(24/1545));}
    .login_box .btn_box li {font-size: calc(100vw*(16/1545));}
    .login_box .btn_box li::after {right: calc(100vw*(-14/1545)); height: calc(100vw*(12/1545));}
    .login_box .btn_box li:hover a {text-shadow: 0 0 calc(100vw*(5/1545)) rgba(255,255,255,0.5);}

    /* ========================= index ========================= */
    /* main banner */
    .main_banner {_margin-top: calc(100vw*(-50/1545));}
    .banner_contents {width: calc(100vw*(800/1545)); padding: calc(100vw*(30/1545)) 0;}
    .slide_banner p {font-size: calc(100vw*(24/1545)); margin-bottom: calc(100vw*(10/1545));}
    .slide_banner p span {font-size: calc(100vw*(24/1545));}
    .detail_btn {width: calc(100vw*(154/1545)); height: calc(100vw*(38/1545)); font-size: calc(100vw*(14/1545));}
    .gr_btn {box-shadow: calc(100vw*(0/1545)) calc(100vw*(4/1545)) calc(100vw*(5/1545)) rgba(0, 0, 0, 0.5); border-radius: calc(100vw*(30/1545));}
    .main_banner .banner_contents .swiper-pagination-bullet {width: calc(100vw*(8/1545)); height: calc(100vw*(8/1545)); margin: 0 calc(100vw*(7/1545));}
    .game_banner {margin-top: calc(100vw*(162/1545));}
    .tree_wrap{ justify-content: space-around;}
    /* game list */
    .map_img {width: calc(100% - calc(100vw*(20/1545))); margin-top: calc(100vw*(-50/1545));}
    .game_wrap {_padding-top: calc(100vw*(58/1545)); z-index: 1;}
    .game_wrap .tab_box {gap: calc(100vw*(46/1545));}
    .tab_box_wrap_logo{width: calc(100vw*(260/1545));}
    .tab_btn {gap: calc(100vw*(8/1545)); width: calc(100vw*(240/1545));}
    .tab_btn span {font-size: calc(100vw*(12/1545));}
    .tab_btn p {font-size: calc(100vw*(24/1545));}
    .tab_area {margin-top: calc(100vw*(60/1545)); min-height: calc(100vw*(780/1545));}
    .card_list {gap: calc(100vw*(21/1545));}
    .card_box {width: calc(100vw*(224/1545)); height: calc(100vw*(334/1545)); padding: calc(100vw*(15/1545)) calc(100vw*(10/1545));}
    .card_box::after {border-radius: calc(100vw*(17/1545));}
    .card_box .start {width: calc(100vw*(40/1545)); top: calc(100vw*(-18/1545));}
    .card_character {top: calc(100vw*(50/1545)); width: calc(100vw*(150/1545)); height: calc(100vw*(150/1545));}
    .game_logo {bottom: calc(100vw*(43/1545)); width: calc(100vw*(88/1545)); height: calc(100vw*(36/1545));}
    .card_box .name {font-size: calc(100vw*(16/1545)); _margin: calc(100vw*(52/1545)) 0 0;}

    /* bank */
    .bank_section {margin-top: calc(100vw*(138/1545));}
    .agency_box {width: calc(100vw*(570/1545));}
    .deposit_box, .withdraw_box {width: calc(100vw*(467/1545));}
    .bank_title {height: calc(100vw*(80/1545)); padding: 0 calc(100vw*(24/1545));}
    .bank_title p {font-size: calc(100vw*(12/1545));}
    .bank_title a {font-size: calc(100vw*(12/1545));}
    .bank_title span {font-size: calc(100vw*(24/1545));}
    .bank_list li {height: calc(100vw*(42/1545)); padding: 0 calc(100vw*(12/1545)) 0 calc(100vw*(24/1545));}
    .bank_list li * {font-size: calc(100vw*(14/1545));}
    .bank_list li span {width: calc(100vw*(128/1545));}
    .bank_list li p {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        word-break:break-all;
        width: calc(100% - calc(100vw*(300/1545))); }
    .bank_list li b {width: calc(100vw*(150/1545)); margin-right: calc(100vw*(20/1545));}
    .bank_list li span {width: calc(100vw*(130/1545));}
    .agency_box li p {width: calc(100% - calc(100vw*(85/1545)));}
    .bank_menu_list {height: calc(100vw*(80/1545)); margin-top: calc(100vw*(34/1545));}
    .bank_menu_box {width: calc(100vw*(440/1545));}
    .bank_menu_box p {font-size: calc(100vw*(20/1545));}
    .bank_menu_box p:hover {text-shadow: 0 0 calc(100vw*(5/1545)) rgba(255,255,255,.3);}
    .bank_menu_box img {width: calc(100vw*(44/1545)); margin-right: calc(100vw*(12/1545));}
    .bank_menu_box span {font-size: calc(100vw*(12/1545)); margin-top: calc(100vw*(8/1545));}
    .bank_submenu_box {width: calc(100% - calc(100vw*(880/1545)));}
    .submenu_box img {width: calc(100vw*(32/1545)); margin-right: calc(100vw*(12/1545));}
    .submenu_box p {font-size: calc(100vw*(16/1545));}
    .submenu_box p:hover {text-shadow: 0 0 calc(100vw*(5/1545)) rgba(255,255,255,.3);}
    .slide_banner button{width: calc(100vw*(310/1545)); height: calc(100vw*(86/1545));}
}

@media screen and (max-width: 1000px) {
    .popup.today {
        max-width: 500px !important;
        width: 90% !important;
        top: 50% !important;
        left: 50% !important;
        /*height: inherit !important;*/
    }

}

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

    .bank_title .img_title{width: calc(100vw*(200/360));
        height: calc(100vw*(65/360));
        top: calc(100vw*(-35/360));
        font-size: calc(100vw*(15/360));}

    /* set */
    .container {width: calc(100vw*(328/360));}
    input:focus {box-shadow: 0 0 calc(100vw*(5/360)) rgba(255,255,255,0.3);}


    /* ========================= login ========================= */
    /* 로그인 */
    #wrap_content.login {_background: url('/assets/img/troy/bg/login_bg.jpg') no-repeat center/cover; background-color: #261B10;}
    .login_bar_top{max-width: 208px; width: calc(100vw*(208/360)); top: calc(100vw*(-40/360));}
    .login_bar_bottom{max-width: 208px; width: calc(100vw*(208/360)); bottom: calc(100vw*(-20/360));}
    .login_section{max-width: 100%;}
    .login_wrap {max-width: 90%; margin: auto;}
    .login_bg {_display: none;}
    .login_bg_mb {display: block; width: 100%; height: 100%; object-fit: cover;}
    .login_box {width: 100%; padding-top: 95px;}
    .row {width: calc(100vw*(215/360));}
    .login_input {max-width: 85%; width: calc(100vw*(343/360)); height: calc(100vw*(38/360)); padding: calc(100vw*(12/360)) 0; margin: 0 auto;}
    .login_input:first-child {margin-bottom: calc(100vw*(8/360));}
    .login_input label {width: calc(100vw*(35/360)); font-size: calc(100vw*(10/360)); padding-left: calc(100vw*(20/360));}
    .login_input input {width: calc(100% - calc(100vw*(58/360))); font-size: calc(100vw*(13/360));}

    .login_info {gap: calc(100vw*(5/360)); margin: calc(100vw*(15/360)) auto calc(100vw*(24/360));}

    .login_info span {font-size: calc(100vw*(10/360));}

    .login_btn {display: block; width: calc(100vw*(160/360)); _height: calc(100vw*(54/360)); font-size: calc(100vw*(12/360)); margin: 44px auto 0;}
    .login_box .btn_box {gap: calc(100vw*(25/360)); justify-content: center; margin: calc(100vw*(28/360)) auto 0;}
    .login_box .btn_box li {font-size: calc(100vw*(11/360));}
    .login_box .btn_box li::after {right: calc(100vw*(-14/360)); height: calc(100vw*(12/360));}
    .login_box .btn_box li:hover a {text-shadow: 0 0 calc(100vw*(5/360)) rgba(255,255,255,0.5);}
    .login_logo{
        width: calc(100vw*(165/360));
    }
    /* ========================= index ========================= */
    /* main banner */


    .main_banner {margin-top: calc(100vw*(20/360));}
    .banner_contents {width: calc(100vw*(308/360)); padding: calc(100vw*(30/360)) 0; margin: auto;}
    .slide_banner p {font-size: calc(100vw*(17/360)); margin-bottom: calc(100vw*(10/360)); letter-spacing: -1px;}
    .slide_banner p span {font-size: calc(100vw*(17/360));}
    .detail_btn {width: calc(100vw*(110/360)); height: calc(100vw*(30/360)); font-size: calc(100vw*(12/360));}
    .gr_btn {box-shadow: calc(100vw*(0/360)) calc(100vw*(4/360)) calc(100vw*(5/360)) rgba(0, 0, 0, 0.5); border-radius: calc(100vw*(30/360)); margin-top: calc(100vw*(15/360));}
    .game_banner{margin-top: calc(100vw*(100/360));}
    /* game list */
    .map_img {display: none;}
    .tree_wrap{display: unset}
    .game_wrap .tab_box .wrap{
        display: flex;
        width: 50%;
        margin: auto;
        align-items: center;
    }
    .game_wrap {_padding-top: calc(100vw*(35/360)); z-index: 1;}
    .game_wrap .tab_box {gap: calc(100vw*(20/360)); margin-top: 30px;}
    .tab_box_wrap_logo{width: calc(100vw*(70/360)); margin: auto}
    .tab_btn {gap: calc(100vw*(3/360)); width: calc(100vw*(154/360));}
    .tab_btn span {font-size: calc(100vw*(8/360));}
    .tab_btn p {font-size: calc(100vw*(16/360));}
    .tab_area {margin-top: calc(100vw*(30/360)); min-height: calc(100vw*(780/360));}
    .card_list {gap: calc(100vw*(4/360));}
    .card_box {width: calc(100%/3 - calc(100vw*(3/360))); height: calc(100vw*(154/360)); padding: calc(100vw*(12/360)) calc(100vw*(10/360));}
    .card_box::after {border-radius: calc(100vw*(17/360));}
    .card_box .start {width: calc(100vw*(40/360)); top: calc(100vw*(-18/360));}
    .card_character {top: calc(100vw*(22/360)); width: calc(100vw*(70/360)); height: calc(100vw*(70/360));}
    .game_logo {bottom: calc(100vw*(18/360)); width: calc(100vw*(50/360)); height: calc(100vw*(20/360));}
    .card_box .name {font-size: calc(100vw*(8/360)); _margin: calc(100vw*(73/1545)) 0 0;}

    /* bank */
    .bank_section {margin-top: calc(100vw*(138/360));}
    .bank_box {flex-direction: column; gap: 70px;}
    
    .agency_box {width: 100%;}
    .deposit_box, .withdraw_box {width: 100%;}
    .bank_title {height: calc(100vw*(52/360)); padding: 0 calc(100vw*(15/360));}
    .bank_title p {font-size: calc(100vw*(12/360));}
    .bank_title a {font-size: calc(100vw*(12/360));}
    .bank_title span {font-size: calc(100vw*(12/360));}
    .bank_list li {height: calc(100vw*(42/360)); padding: 0 calc(100vw*(15/360)) 0 calc(100vw*(15/360));}
    .bank_list li * {font-size: calc(100vw*(12/360));}
    .bank_list li span {width: calc(100vw*(128/360));}
    .bank_list li p {_width: calc(100% - calc(100vw*(300/360)));}
    .bank_list li b {width: calc(100vw*(150/360)); margin-right: calc(100vw*(20/360));}
    .bank_list li span {width: calc(100vw*(130/360));}
    .agency_box li p {width: calc(100% - calc(100vw*(85/360)));}
    .bank_menu_list {flex-wrap: wrap; height: fit-content; margin-top: calc(100vw*(34/360));}
    .bank_menu_box {position: relative; justify-content: flex-start; width: 50%; height: calc(100vw*(63/360)); padding: 0 calc(100vw*(20/360)); border-right: none;}
    .bank_menu_box:first-child::after {content: ''; position: absolute; top: 50%; right: 0; width: 1px; height: calc(100vw*(24/360)); transform: translateY(-50%); background: rgba(255,255,255,0.1);}
    .bank_menu_box p {font-size: calc(100vw*(12/360));}
    .bank_menu_box p:hover {text-shadow: 0 0 calc(100vw*(5/360)) rgba(255,255,255,.3);}
    .bank_menu_box img {width: calc(100vw*(26/360)); margin-right: calc(100vw*(12/360));}
    .bank_menu_box span {display: none;}
    .bank_submenu_box {width: 100%;}
    .submenu_box {position: relative; justify-content: flex-start; width: 50%; height: calc(100vw*(63/360)); padding: 0 calc(100vw*(20/360));}
    .submenu_box:first-child::after {content: ''; position: absolute; top: 50%; right: 0; width: 1px; height: calc(100vw*(24/360)); transform: translateY(-50%); background: rgba(255,255,255,0.1);}
    .submenu_box img {width: calc(100vw*(26/360)); margin-right: calc(100vw*(12/360));}
    .submenu_box p {font-size: calc(100vw*(12/360));}
    .submenu_box p:hover {text-shadow: 0 0 calc(100vw*(5/360)) rgba(255,255,255,.3);}
    .slide_banner button{width: calc(100vw*(189/360)); height: calc(100vw*(52/360));}
}

@media screen and (max-width: 400px) {
    .popup.today .close_wrap span {
        font-size: calc(100vw * (15 / 360));
    }
}