@font-face {
    font-family: "SBB";
    src: url("fonts/SBB.ttf");
}
@font-face {
    font-family: "SBL";
    src: url("fonts/SBL.ttf");
}
@font-face {
    font-family: "SBM";
    src: url("fonts/SBM.ttf");
}
body{
    max-width: 100vw;
    min-width: 90vw; 
    margin: 0;
    padding: 0;
    background-color: black;
    text-align: center;
    display: flex;
    justify-content: center;
}
.color-header{
    font-family: "SBB";
    color: white;
    position: fixed;
    top: 0px;
    display: flex;
    width: 100vw;
}
.top_header_button{
    font-size: 1vw;
    text-align: center;
    line-height: 2vw;
    margin-left: 1vw;
    margin-right: 1vw;
}
.selected_menu{
    width: 7.5vw;
    height: 2.864vw;
    background-image: url('/images/mtg/button_small.png');
    background-size: cover;
}
.unselected_menu{
    width: 7.5vw;
    height: 2.864vw;
}
.text-gray{
    color: #999999;
}
.section_top{
    width: 90vw;           
    height: 33vw; 
    min-height: 60vh;
    background-color: #2B2728;
    background-image: url('/images/mtg/sbxg_background_1.png');
    background-repeat: repeat-x;
    margin: 0 auto;
    padding-top: 180px;

}
.section_roadmap{
    background-color: #FBC417;
}
.top_content{            
    width: 60vw;
    height: 30vw;
    margin: 0 auto;            
}
.main_bi{
    font-family: "SBB";
    font-size: 5vw;
    color: #FBC417;            
}
.sub_bi{
    font-family: "SBB";
    font-size: 2.2vw;
    color: #FBC417;
}
.main_desc{

    font-family: "SBL";
    font-size: 1.0vw;
    color: #FFFFFF;
    margin-top: 10px;
    margin-bottom: 20px;
}
.logo_mtdz{
    width: 8vw;
    height: 4vw;
    background-image: url('/images/mtg/mtd_logo.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    display: inline-block;
    margin: 10px;            
}
.logo_sandbox{
    width: 8vw;
    height: 4vw;
    background-image: url('/images/mtg/sandbox_Wlogo.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    display: inline-block;
    margin: 10px;
}
.logo_sbxg{
    width: 8vw;
    height: 4vw;
    background-image: url('/images/mtg/horizontal_2_W.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    display: inline-block;
    margin: 10px;
}
.top_bottom_logo{

}
.bridge_1_2{
    width: 90vw;
    height: 36.75vw;            
    background-image: url('/images/mtg/Main_image.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    
}
.bridge_2_3{
    width: 90vw;
    height: 36.75vw;            
    background-image: url('/images/mtg/Team_Bg.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    margin-top: -10vw;
}
.link_icon{
    width:1.7vw;
}
.Roadmap{
    width: 90vw;
    min-height: 78vw;
    background-color: #FBC417;
    text-align: center;
}
.Roadmap_long{
    width: 90vw;
    min-height: 95vw;
    background-color: #FBC417;
    text-align: center;
    overflow-y: hidden;
}
.Team{
    width: 90vw;
    height: 90vw;
    background-color: #2B2728;
    text-align: center;
    margin-top: -6vw;
}
.title_roadmap{
    width:25vw;
    height: 10vw;
    background-image: url('/images/mtg/imagefont_roadmap.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    margin: 0 auto;
}
.catch_roadmap{
    font-size: 2.0vw;
    font-family: "SBB";
}
.roadmap_box{
    width: 50vw;
    margin: 0 auto;
}
.success_roadmap_top{
    width: 50vw;
    height: 3vw;
    background-image: url('/images/mtg/roadmap_clear_top.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
}
.success_roadmap_body{
    width: 50vw;
    height: 8vw;
    background-image: url('/images/mtg/roadmap_clear_mid.png');
    background-size: contain;
    background-repeat:  repeat-y;
    background-position: center;
}
.success_roadmap_bottom{
    width: 50vw;
    height: 3vw;
    background-image: url('/images/mtg/roadmap_clear_bottom.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
}
.notyet_roadmap_top{
    width: 50vw;
    height: 3vw;
    background-image: url('/images/mtg/roadmap_ing_top.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
}
.notyet_roadmap_body{
    width: 50vw;
    height: 12vw;
    background-image: url('/images/mtg/roadmap_ing_mid.png');
    background-size: contain;
    background-repeat:  repeat-y;
    background-position: center;
    display: block;
}
.notyet_roadmap_bottom{
    width: 50vw;
    height: 3vw;
    background-image: url('/images/mtg/roadmap_ing_bottom.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
}
.step_no{
    color:#2B2728;
    position: relative;
    top: 0;
    left:0;
    text-align: left;    
    display: inline-block;
    margin-right: 3vw;
}
.step_txt{
    font-size: 1.6vw;
    font-family: "SBB";
}
.btn_bonus{
    margin-top:2vw;
    font-size: 2.2vw;
    font-family: "SBB";
}
.step_bno{
    font-size: 3vw;
    font-family: "SBB";
}
.bonus_no{
    color:#2B2728;
    position: relative;
    top: 0;
    left:0;
    text-align: left;    
    display: inline-block;
    margin-right: 0vw;
    float: left;
    margin-left: 1vw;
}
.bonus_txt{
    font-size: 1.0vw;
    font-family: "SBB";
}
.bonus_bno{
    font-size: 1.5vw;
    font-family: "SBB";
}
.rm_list{    
    width: 38vw;
    min-height: 4vw;
    margin-right: 2vw;
    float: right;
}
.rm_list_item_checked{
    min-height: 2vw;
    width: 38vw;
    background-image: url('/images/mtg/check_box_clear.png');
    background-position: top left;
    background-size: 2vw 2vw;
    background-repeat: no-repeat;
    font-family: "SBM";
    font-size:1.4vw;
    color:#FFF4D1;
    text-align: left;
    padding-left:3vw;
}
.rm_list_item_title{
    min-height: 2.2vw;
    width: 38vw;   
    font-family: "SBM";
    font-size:1.4vw;
    color:#FFF4D1;
    text-align: left;
    padding-left:1vw;
}
.rm_list_item_bl{
    min-height: 2vw;
    width: 38vw;
    
    font-family: "SBM";
    font-size:1.4vw;
    color:#FFF4D1;
    text-align: left;
    padding-left:3vw;
}
.rm_list_item_unchecked{
    min-height: 2vw;
    width: 38vw;
    background-image: url('/images/mtg/check_box.png');
    background-position: top left;
    background-size: 2vw 2vw;
    background-repeat: no-repeat;
    font-family: "SBM";
    font-size:1.4vw;
    color:#FFF4D1;
    text-align: left;
    padding-left:3vw;  
    
}
.Team{
    width: 90vw;
    height: 81vw;
    background-color: #2B2728;
    text-align: center;
    margin-top: -6vw;
    background-image: url('/images/mtg/sbxg_background_2.png');
    background-repeat: repeat-x;
    
    background-position: bottom;
}
.title_team{
    width:25vw;
    height: 10vw;
    background-image: url('/images/mtg/imagefont_team.png');
    background-size: contain;
    background-repeat:  no-repeat;
    background-position: center;
    margin: 0 auto;
}
.team_box{
    width: 70vw;
    margin: 0 auto;
    margin-bottom:5vw;
}
.team_line{
    width:70vw;
    text-align: center;
    margin: 0 auto;
    
}
.team_item{
   
    width: 10vw;
    height: 15vw;
    display: inline-block;
    margin: 1.5vw;
    vertical-align: top;
}
.team_frame{
    width:10vw;
    height:10vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.role{
    font-family: "SBM";
    font-size: 1vw;
    color:#EDB918;
}
.nkname{
    font-family: "SBM";
    font-size: 1vw;
    color:#FFF4D1;
}
.footer_link_icons{
    
    width: 20vw;
    margin: 0 auto;
    margin-bottom: 3vw;
}
.footer_link_item{
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width:3vw;
    height: 3vw;
    margin:1vw;
    display: inline-block;
    opacity: 0.5;
}
.footer_copyright{
    font-family: "SBB";
    font-size: 1vw;
    color:#747474;
    margin-bottom: 3vw;
}
.footer_sandbox_logo{
    width:13vw;
    height:7.539vw;
    margin: 0 auto;
    background-image: url('/images/mtg/sandbox_biglogo.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-bottom: 3vw;
}
.footer_btn_top{
    width:10vw;
    height:4.392vw;
    margin: 0 auto;
    background-image: url('/images/mtg/top_bt.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}