.modal-overlay {
    z-index: 4;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.75);
}


.main_board{
	width: 100%;
	height: 96%;
}


.body_board{
	padding: 0% 0%;
}



.errmsg{
    color: #f00;
    font-weight: 700;
    margin-bottom: 20px;
    display: inline-block;
}

.mymenu {
    color: #000;
    /* text-decoration: underline; */
    text-shadow: none;
    right: 0;
    text-align: right;
    position: absolute;
    font-size: 11pt;
    margin-right: 30px;
    margin-top: 12px;
    font-weight: normal;
    display: inline-block;
    /* margin-bottom: 0; */
    /* margin: auto; */
    width: 40%;
}

.mymenu a{
    text-decoration: underline;
    color: #004dff;
    font-size: 90%;
}

.mymenu a:hover{
	color: #f00;
	text-decoration: underline;
	font-weight: 700;
}




.mylist{
	background-color: #fff2a1;
}

.mylist_btn{
	display: none;
}

.subtitle{
	font-size: 110%;
    margin-bottom: 20px;
    font-weight: 700;
}


table.main td{
	vertical-align:middle;
	padding: 0% 0.4%;
	text-align: center;
}

table.main td.left{
	text-align: left;
	/*width: 50%;*/
}

table.main.end td.left{
	text-align: left;
	/*width: 50%;*/
}


table{
	border: solid 1px #000;
	border-collapse: collapse;
	color: #000;
	font-weight: normal;
	vertical-align:top;
}
table td {
    border: solid 1px #6b3c0f;
    padding: 6px 6px;
    font-size: 95%;
    vertical-align:top;
    /* background-color: rgba(255, 255, 255, 0.26); */
}
table td.z {
    background: #d8d8d8;
    vertical-align: top;
    color: #000;
    border: 1px solid #848484;
}


table.large td {
	padding: 4% 2%;
}

table.large2 td {
    padding: 8px 10px;
}





table td.y {
	background: #e0bc84;
	vertical-align:top;
	color: #000;
	border: 1px solid #bfbfbf;
}


.center{
	left: 0;
    right: 0;
    margin: auto;
    width: 97%;
}

.center td{
	border: 1px solid #e2e2e2;
}

.div_center{
	text-align: center;
}


.icon {
    /*width: 100%;*/
    border: 3px solid #656565;
    vertical-align: -15px;
    /* margin-right: 10px; */
    background-color: #fff;
    margin-left: 4%;
    border-radius: 16px;
        height: 100%;
}


.icon2{

    width: 20%;
    border: 2px solid #c7c7c7;
    /* vertical-align: -15px; */
    /* margin-left: 30px; */
    /* margin-right: 10px; */
}

.icon2:hover{
    opacity: 0.6;
    background-color: red;

}

.icon2_k{
    background-color: #c3ff00;
}


.icon3{
    width: 60%;
    border: 3px solid #b9b9b9;
    /* vertical-align: -15px; */
    /* margin-left: 30px; */
    margin-top: 7px;
    background-color: #fff;
}

.iconbig{
    width: 100px;
    border: 2px solid #b9b9b9;
    background-color: #fff;
}


.iconmini{
	width: 26px;
    border: 1px solid #c7c7c7;
    vertical-align: -11px;
    /* margin-left: 30px; */
    /* margin-right: 10px; */
    background-color: #fff;
}

.score td.score_last{
	border-right: 10px solid #333;
}


.no_border{
	border :none;
}

.team_icon.big{
	width: 62px;
}

.no_border td{
	border :none;
}


.on_border td{
	border: 1px solid #bfbfbf;
}

.level {
    text-shadow: none;
    font-size: 100%;
    margin-left: 0%;
    font-weight: 700;
    text-align: center;
    /* margin: auto; */
    display: inline-block;
    vertical-align: 0%;
}


.history_name{
	font-size: 80%;
    color: #bfbfbf;
    margin-left: 30px;
}


.list-group-item {
    border: 0px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
}


.memo_area{
    width: 85%;
    margin-top: 10px;
    font-size: 70%;
    background-color: #f9f9f9;
}

.del_btn{
	width: 20px;
    height: 20px;
    font-size: 10pt;
    padding: 0;
}


.tr_ng{
	background-color: #e0e0e0;
}

.tr_ng_lite{
	background-color: #efefef;
}


.tr_ok{
	background-color: #fbceff;
}

.tr_stay{
	background-color: #e8ffe7;
}


.sel_dis{
	background-color: #dedede;
}


.f_left{
	float:left;
	display: inline-block;
}

.f_right{
	float:right;
	display: inline-block;
}
.ui-tooltip-content {
    font-size:10pt;
    font-family:Calibri;
}

.gray{
    color: #717171;
    font-size: 75%;
}

.well2{
	    position: fixed;
    top: 0;
    opacity: 0.9;
    margin: auto;
    left: 0;
    right: 0;
    width: 70%;
        background-color: #ffe791;
    border: 1px solid #848484;
}

.site_suffix{
    font-size: 100%;
    color: #ff1212;
}

.exp_span{
    vertical-align: 14px;
    font-size: 100%;
    margin-right: 6px;
        color: #6266ea;
    font-weight: 700;
}

.exp_menu{
	display: inline-block;
    vertical-align: -5px;
    margin-left: 10px;
}

.ng_window{
	text-align:center;
}

.ng_window_btn{
	margin-bottom: 30px;
	width: 80%;
	height: 55px;
}

.modal_window{
    padding: 2%;
}



.subwin{
	z-index: 10;
	padding: 0px;
	width: 95%;
}


.subwin2{
	z-index:32;
	padding: 0px;
	width: 95%;
}


.subwin3{
	z-index:50;
	padding: 0px;
	width: 100%;
}

.subwin4{
	z-index:65;
	padding: 0px;
	width: 95%;
}


.subwin_full{
	z-index:501;
	padding: 0px;
	width: 100%
}



.subwin7{
	z-index:95;
	padding: 0px;
	width: 95%;
}


.subwin8{
	z-index:105;
	padding: 0px;
	width: 95%;
}






.modal-close {
    color: #636363;
    text-decoration: none;
}

.btn-lg{
	font-size: 100%;
	    padding: 25px 36px;
}


.game_main{
	height: 86%;
	position: relative;
}

.home_bg{
	object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
}

.game_bottom {
    height: 10%;
    background: -webkit-gradient(linear, left top, left bottom, from(#665545), to(#665545));
    text-align: center;
}


.menu_btn {
    height: 92%;
    font-size: 2.5vh;
    color: #faff18;
    border: 1px solid #1d1d1d;
    border-radius: 2px;
    margin: 0px;
    letter-spacing: 2px;
    font-weight: 700;
    text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffac71), color-stop(0.5, #c35d05), to(#ff822a));
}


.menu_btn:active{
	opacity:0.2;
}

.kai_btn{
    height: 100%;
    border-radius: 5px;
    font-size: 90%;
    padding: 5% 2%;
    width: 30%;
    overflow: hidden;

    border: 2px solid #848484;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d4d4d4));

	color: #191919;
    font-weight: 500;
    letter-spacing: 0;
}


.menu_btn_on{
    background: -webkit-gradient(linear, left top, left bottom, from(#fff2cc), to(#ffa500));
	color: #ff0000;
    border: 2px solid #e82121;
}



.game_apl {
    position: absolute;
    width: 95%;
    height: 39%;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.89)), to(rgba(255, 230, 109, 0.9)));
        margin: auto;
    left: 0;
    right: 0;
    padding: 2%;
    overflow: hidden;
    font-size: 85%;
    border: 5px solid #7d1c1c;
    color: #563816;
	/*text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;*/
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.71);
	background: -webkit-linear-gradient(top, #e6d388e3 0%, #ffeeabe3 50%, #eccb62eb 51%, #ffc200e8 100%);
}




.no_border2 td{
	padding: 3px 5px;
}


.no_border3 td{
	padding: 0px 2px;
}


.marque{
    background: linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,#fff), color-stop(80%,#ffc6fa));    font-size: 110%;
}
.marque2 {
    background: linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#ff6060));
    font-weight: 700;
    margin-bottom: 20px;
    display: inline-block;
    color: #fff;
    font-size: 2.8vh;
}

.marque2.bosyu {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#bd3400));
    color: #000;
}



.marque3 {

	background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#ff8100));
}

.marque4 {
	    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#5f88ff));
}

.marque5 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#ff5fd5));
}




.graph {
width: 100%;
    border: 2px solid #207870;
    padding: 2px;
    display: inline-block;
    background: rgba(0, 0, 0, 0.80);
    border-radius: 10px;
}


.graph .bar {
    display: inline-block;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(#4ae3ea), to(#5285e2));
    text-align: center;
    color: #f0ffff;
    height: 24px;
    line-height: 2em;
    width: 50%;
    border-radius: 10px;
}
.graph .bar span { position: absolute; left: 1em; }

.bar.s{
    background: -webkit-gradient(linear, left top, left bottom, from(#ffa0ec), to(#e60dad));
}
.bar.a{
    background: -webkit-gradient(linear, left top, left bottom, from(#ffb6b6), to(#e80a0a));
}
.bar.b{
	background: -webkit-gradient(linear, left top, left bottom, from(#ffb391), to(#ff6912));
}
.bar.c{
    background: -webkit-gradient(linear, left top, left bottom, from(#ccd883), to(#ffeb01));
}
.bar.d{
    background: -webkit-gradient(linear, left top, left bottom, from(#4ae3ea), to(#5285e2));
}
.bar.e{
	background: -webkit-gradient(linear, left top, left bottom, from(#9cdca3), to(#289414));
}
.bar.f{
	background: -webkit-gradient(linear, left top, left bottom, from(#d0d0d0), to(#1e2635));
}
.bar.g {
    background: -webkit-gradient(linear, left top, left bottom, from(#c1c1c1), to(#3e3e3e));
}



.graph.order_life{
    margin-top: 0px;
    height: 16px;
    margin-bottom: 0px;
    margin-left: 12%;
    width: 81%;
}

.graph.order_life .bar {
    display: inline-block;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff9f5b), to(#ff009c));
    text-align: center;
    color: #f0ffff;
    height: 100%;
    line-height: 2em;
    width: 50%;
    border-radius: 10px;
}

.graph2 {
width: 100%;
    border: 2px solid #207870;
    padding: 2px;
    display: inline-block;
    background: rgba(0, 0, 0, 0.56);
    border-radius: 10px;
    width: 60%;
        margin: 0 3%;
            vertical-align: middle;
}

.graph.order_life .bar.b2 {
    background: -webkit-gradient(linear, left top, left bottom, from(#00ff87), to(#35b700));
}


.graph2 .bar{
	display: inline-block;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(#e3ffda), to(#05d829));
    text-align: center;
    color: #f0ffff;
    height: 24px;
    line-height: 2em;
    width: 50%;
    border-radius: 10px;
}

.graph2 .bar span { position: absolute; left: 1em; }


.plamai{
	width: 15%;
}

.plamai_div{
	    margin-bottom: 5%;
}

.graph_life {
width: 100%;
    border: 2px solid #020000;
    padding: 2px;
    display: inline-block;
    background: rgba(0, 0, 0, 0.56);
    border-radius: 10px;
}


.graph_life .bar {
    display: inline-block;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffcc8d), to(#ff4700));
    text-align: center;
    color: #f0ffff;
    height: 14px;
    line-height: 2em;
    width: 50%;
    border-radius: 10px;
}
.graph_life .bar span { position: absolute; left: 1em; }


.graph_life .stress {
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ff0000));
}





.s_big{
	font-size: 170%;
	margin-right: 2px;
	font-weight: bold;
}

.s_rank{
color: #ff3100;
    font-weight: bold;
    text-shadow: 2px 2px 0 #737373, -2px 2px 0 #b1b1b1, 2px -2px 0 #ccc8c8, -2px -2px 0 #cacaca;
}


.s_small{
	font-size: 85%;
	margin-right: 2px;
}

.s_smallsmall{
	font-size: 85%;
	margin-right: 2px;
}


.obi {
    /* background: -webkit-gradient(linear, left top, left bottom, from(#bd9162), to(#884702)); */
    color: #fff;
    padding: 1% 2%;
    position: relative;
    background: #613200;
    font-size: 2.2vh;
    font-weight: bold;
        height: 17%;

}


.obi.end {
    background: -webkit-gradient(linear, left top, left bottom, from(#8c2a29), to(#9b3130));
}


.pad2{
	padding: 1% 2%;
	height: 84%;
}

.team_icon{
	border: 1px solid #000;
    width: 52px;
}

.team_icon_small{
    border: 1px solid #000;
    /* width: 48px; */
    vertical-align: -35%;
    height: 50%;
}

.team_icon_small.no{
	border: 0px solid #000;
    vertical-align: -61%;
    height: 50%;
}



.team_icon_small.sm{
    width: 30px;
    height: 30px;
    vertical-align: -7px;
}

.team_icon_small.sm2{
    width: 30px;
    vertical-align: -11px;
}


.pad0 td{
	padding: 0px 2px 1px 0px;
}

.btn_icon:active{
	opacity:0.2;
}

.btn_icon{
	position: absolute;
    top: 10px;
    right: 10px;
    height: 18%;
    border: 2px solid #000;
    border-radius: 10px;
    background-color: #fff;
}


.btn_icon2 {
    /* height: 18%; */
    border: 2px solid #000;
    border-radius: 15px;
    background-color: #fff;
}



.player_icon{
    width: 100%;
    border: solid 2px #000;
    background-color: #fff;
}



.player_div {
	width: 100%;
	position: relative;
}
.player_div .p_type{
    position: absolute;
    /* left: 0; */
    /* bottom: 0; */
    color: #fff;
    /* margin: 0; */
    padding: 0;
    width: 100%;
    filter: Alpha(opacity=70);
    opacity: 0.8;
    top: 0;
    height: 20%;
    font-size: 87%;
    border: 1px solid #000;
    text-align: center;
}

.player_div .pname{
	display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.player_div .p_type.pg{
	background: #0029ff;
}

.player_div .p_type.eigyo{
	background: #3ebb00;
}

.player_div .p_type.desiger{
    background: #f9ff00;
    color: #000;
}

.player_div .p_type.manager{
    background: #ff00a3;
    color: #f9f9f9;
}

.player_div .p_type.support{
    background: #ff6000;
    color: #f9f9f9;
}




.player_div .p_lv{
    position: absolute;
    /* left: 0; */
    bottom: 0;
    color: #fff;
    /* margin: 0; */
    padding: 1px 10px 1px 10px;
    /* width: 100%; */
    background: #ff0000;
    filter: Alpha(opacity=70);
    opacity: 0.9;
    /* height: 20%; */
    font-size: 90%;
        border-top: 1px solid #fff;
    border-right: 1px solid #fff;
        margin-bottom: 1px;
    margin-left: 1px;
}


.player_tbl td{
	font-size: 80%;
}



.takara{
	border: 7px solid #999;
    background-color: #eaeaea;
    margin-top: 60px;
    width: 50%;
}

.stone_img{
	width: 10%;
    border: 1px solid #848484;
    background-color: #a9c4ff;
        border-radius: 7px;
}


.menu_money{
text-align: right;
    font-size: 125%;
    padding: 0 6px;
}

.left_t{
	    width: 100%;
    font-size: 100%;
}
.left_t td{
	font-size: 100%;
	vertical-align: middle;
	    height: 0;
	    padding: 0;
}






.close_btn img {
    width: 100%;
    height: 100%;
    background-color: #fff;

}

.height_big{
	    height: 24px;
}

.width_100{
	width: 100%;
}

.w100{
	width: 100%;
}
.w90{
	width: 90%;
}


.week_holiday{
	color:red;
}

.height_90{
	height: 90%;
}



.modal-overlay2 {
    z-index: 30;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.15);
}

.modal-overlay2.no {
    background-color: rgba(0,0,0,0.0);
}



.modal-overlay_full{
	z-index: 500;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}


.modal-overlay3 {
    z-index: 40;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.68);
}

.modal-overlay3.no {
    background-color: rgba(0,0,0,0.0);
}


.modal-overlay4 {
    z-index: 60;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}


.modal-overlay5 {
    z-index: 70;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}

.modal-overlay6 {
    z-index: 80;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}


.modal-overlay7 {
    z-index: 90;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}


.modal-overlay8 {
    z-index: 100;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}



.subwin5 {
    z-index: 75;
    padding: 0px;
    width: 95%;
}
.subwin6 {
    z-index: 85;
    padding: 0px;
    width: 95%;
}


.modal-overlay15 {
    z-index: 12;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background-color: rgba(0,0,0,0.20);
}
.subwin15 {
    z-index: 13;
    padding: 0px;
    width: 95%;
}




option {
	font-size: 100%;
	min-height: 0;
}



td.rt{
	width: 40%;
    text-align: right;
}
select option{
	font-size:12pt;
	border:1px;
}

input[type=checkbox] {
	width:			24px;
	height:			24px;
	-moz-transform:		scale(1.4);
	-webkit-transform:	scale(1.4);
	transform:		scale(1.4);
	margin-right: 20px;
}





.no_prog{
	color: #6f6f6f;
}

.good_prog {

    color:  #ff6262;
}
.kaze{
	color: #0a5fff;
}

.pr_btn{
	width: 90%;
	border: 1px solid #888;
}

.pr_btn_txt{
    font-size: 90%;
    padding-right: 3%;
    width: 100%;
    text-align: right;
        margin-bottom: 5%;
        color: #757575;
}





.modal-content {
    background-color: #f2d7b6;
    overflow: hidden;
}

.modal-overlay {
    background-color: rgba(0, 0, 0, 0.43);
}

.modal-overlay_tough {
    background-color: rgba(0, 0, 0, 0.69);
}


.modal-content2 {
    /*background-color: rgba(255, 255, 255, 0.92);*/
    background-color: #f2d7b6;
    z-index: 20;
}





.graph_jyuku {
    width: 90%;
    border: 1px solid #212121;
    padding: 2px;
    /* display: block; */
    margin-top: 11%;
    background: rgba(0, 0, 0, 0.58);
    border-radius: 10px;
}


.graph_jyuku .bar {
display: inline-block;
    position: relative;
    background: -webkit-gradient(linear, left top, left bottom, from(#e4ff0d), to(#b4ff00));
    text-align: center;
    color: #f0ffff;
    height: 4px;
    line-height: 2em;
    width: 50%;
    border-radius: 10px;
}
.graph_jyuku .bar span { position: absolute; left: 1em; }

.graph_jyuku .stress {
    background: -webkit-gradient(linear, left top, left bottom, from(#ff7c7c), to(#ff0000));
}



.btn_mark{
    width: 30%;
    vertical-align: -13%;
    padding: 0 6% 0 0;
}
.dno{
	display: none !important;;
}

.don{
	display: inline-block;
}

.icon_b{
    width: 100%;
    background-color: #fff;
    border: 2px solid #000;
}

.f100{
	font-size: 100%;
}

.f90{
	font-size: 90%;
}


.icon_action{

}
.icon_action:active{
    opacity: 0.2;
}

.ib.icon_action:active{
	opacity: 0.2;
}



.life_t{
	width: 100%
}

.life_t .td1{
	    width: 15%;
    padding: 0;
}

.life_t .td2{
	padding: 0 3%;
    width: 60%;
    vertical-align: middle;
}






.status_div{
    width: 100%;
background-color: rgba(156, 136, 122, 0.66);
    color: #fff;
    border-radius: 10px;
    /* text-shadow: 1px 1px 0 #000, -1px -1px 0 #000; */
    /* font-weight: 700; */
    padding: 1% 7%;
}

.f130{
	    font-size: 130%;
}

.f80{
	    font-size: 80%;
}

.lh{
	line-height: 1;
}


.kai_btn_3{
	    height: 100%;
    border-radius: 4px;
    font-size: 90%;
    padding: 1% 2%;
    width: 30%;
    overflow: hidden;
    border: 2px solid #848484;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d4d4d4));

    color: #655353;
    font-weight: 500;
    letter-spacing: 0;
}



.per_num{
position: absolute;
    left: 16%;
    top: -20%;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -3px;
    font-size: 100%;
    text-shadow: 1px 1px 7px #ff0000, -1px -1px 7px #f00;
}

.apl_btn{
color: #fff;
    /* height: 0%; */
    padding: 8% 0;
    width: 100%;
    border: 1px solid #868686;
    margin-top: 2%;
}


.mem_sel{
	background: #efff00;
}



.head_tbl td {
    padding: 0 0% 0% 0;
    padding-top: 1%;
}



.yyyymmdd{
	display: inline-block;
    font-size: 100%;
    letter-spacing: 0px;
    color: #fff;
    font-weight: 700;
    transform: scale(1, 1.3);
}


.per_num_apl {
	text-shadow: 1px 1px 6px #000000, -1px -1px 6px #000104;
    left: 70px;
    top: 6%;
}


.per_num_apl2 {
    top: -8%;
    font-size: 114%;
}



.arrow_stay{
	width: 15%;
}
.arrow_up{
	width: 10%;
}


.arrow_td{
	text-align: right;
	width: 45%;
}

.arrow_tbl td{
	font-size: 105%;
	vertical-align: middle;
	padding: 3% 2%;
}

.arrow_tbl img{
	vertical-align: middle;
}






.tate_center{
	display: flex;
	align-items: center;
    justify-content: center;
    height: 100%;
}


.tab_v{
    border-top: 1px solid #9c9b9b;
    /* background-color: #fff; */
    padding: 3% 2%;
    background: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#d2d2d2));

    margin-bottom: 5%;
    border-bottom: 1px solid #9c9b9b;
    padding-left: 6%;
}

.tab_right{

	border-bottom: 1px solid #908e8e !important;
    border-top: 1px solid #908e8e !important;
    border-right: 1px solid #908e8e !important;
        padding-top: 5%;
    padding-left: 6%;
        height: 100%;
}

.tab_sel{
	    border-right: 11px solid #007eff;
    color: #4e85ea;
    font-weight: 700;
}

.cen{
	text-align:center;
	    /*height: 85%;
	    overflow: auto;*/
}

td.left{
	text-align:left;
	    /*height: 85%;
	    overflow: auto;*/
}


.cen2{
	height: 100%;
}

.tab_btn{
	width: 90%;
    margin-bottom: 5%;
    padding: 0;
    white-space: initial;
	height: 13%;
	border: 1px solid #908a8a;
}

.tab_right_title{
	    background-color: rgba(255, 201, 201, 0.33)
}

.tab_title{
	text-align: center;
    margin-bottom: 5%;
}



.present_div{
	top: 0%;
    position: absolute;
    width: 100%;
    height: 10%;
    font-size: 70%;
}

.present_div2 {
    color: #ffffff;
    vertical-align: middle;
    font-size: 2vh;
    border-radius: 0%;
    height: 80%;
    background: #3e3e3e;
    width: 100%;
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    padding: 0.2% 1%;
    background: -webkit-gradient(linear, left top, left bottom, from(#9a9a9a), to(#000000));
    border: 3px solid #a51106;
    background: -webkit-linear-gradient(top, #fff0cc 0%, #ffc370 50%, #ff970a 51%, #e87c0d 100%);
    border-left: 0;
    border-right: 0;
    text-shadow: 2px 2px 0 #000000, -2px 2px 0 #000000, 2px -2px 0 #000000, -2px -2px 0 #000000;
}


/*
@-webkit-keyframes bg-color {
  0% { background: rgba(239, 245, 208, 0.1); }
  10% { background: rgba(239, 245, 208, 0.3); }
  20% { background: rgba(239, 245, 208, 0.5); }
  30% { background: rgba(239, 245, 208, 0.7); }
  40% { background: rgba(239, 245, 208, 1.0); }
  50% { background: rgba(239, 245, 208, 1.0); }
  60% { background: rgba(239, 245, 208, 0.7); }
  70% { background: rgba(239, 245, 208, 0.5); }
  80% { background: rgba(239, 245, 208, 0.3); }
  90% { background: rgba(239, 245, 208, 0.1); }
  100% { background: rgba(239, 245, 208, 0.0); }


}
@keyframes bg-color {
  0% { background: rgba(239, 245, 208, 0.1); }
  10% { background: rgba(239, 245, 208, 0.3); }
  20% { background: rgba(239, 245, 208, 0.5); }
  30% { background: rgba(239, 245, 208, 0.7); }
  40% { background: rgba(239, 245, 208, 1.0); }
  50% { background: rgba(239, 245, 208, 1.0); }
  60% { background: rgba(239, 245, 208, 0.7); }
  70% { background: rgba(239, 245, 208, 0.5); }
  80% { background: rgba(239, 245, 208, 0.3); }
  90% { background: rgba(239, 245, 208, 0.1); }
  100% { background: rgba(239, 245, 208, 0.0); }
}
*/


.fred{
	color: #f00;
	margin: 0 2%;
}

.stone_plus_msg{
font-size: 90%;
    color: #5d5b5b;
    margin-top: 6%;
}

.parge{
    background-color: #de5b5b;
    border-color: #da4646;
}

.item_img_div{
	border: 1px solid #000;
	background-color: #fff;
}
.item_title{
    font-size: 80%;
    padding: 0 5% 5% 5%;
    line-height: 1.2;
}


.item_div{
    background-color: rgba(255, 255, 255, 0.93);
    border: 3px solid #949494;
    /* padding: 1%; */
    width: 100%;
    border-radius: 20px;
    text-align:center;
}


.input_box{
	    height: 60px;
    border: 1px solid #616161;
}


.vcenter td{
	vertical-align:middle;
}

.vcen td{
	vertical-align:middle;
}
.vc td{
	vertical-align:middle;
}
table td.vc{
	vertical-align:middle;
}


.t_middle{
	width: 100%;
	border: none;
}
.t_middle td{
	vertical-align: middle;
	text-align: center;
	    line-height: 1.5;
	    border: none;
}



table .apldl{
	font-size: 110%;
	width: 100%;
}


.apldl td{
    padding: 2% 0%;
    line-height: 31px;
}



.btn_icon_obi {
    height: 75%;
    top: 12%;
    padding: 0px 2%;
    width: 11%;
}

.btn_icon_obi:active{
	opacity: 0.2;
}


.waku {
    border: 1px solid #717171;
    border-radius: 3px;
    padding: 0 3px;
    font-size: 95%;
    vertical-align: 1px;
    margin-right: 2px;
}

.waku.white{
	margin-right: 0px;
    background: #fff;
    border: 2px solid #000;
}


.hr_small{
	margin-top: 0%; margin-bottom: 1%;
}


.bg_white{
	background-color: #fff;
}
.bg_black{
	background-color: #525252;
	color: #fff;
}

.bg_brawn{
	background-color: #981313;
	color: #fff;
}


.mark_gif{
	width: 10%;
}


.skill_box{
    font-size: 75%;
    display: inline-block;
    width: 45%;
    padding: 2% 0;
}



.waku.name{
    width: 100%;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffe8c7), to(#ffac46));
    font-size: 100%;
    color: #631717;
	padding: 7% 12px;
	font-weight: 700;
    border: 2px solid #3c3c3c;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.waku.name:active{
	opacity: 0.2;
}

.modal-close:active{
	opacity: 0.2;
}

.ib{
	display:inline-block;
}

.f70{
	font-size: 70%;
}

.f60{
	font-size: 60%;
}


.waku.sel{
	font-size: 80%;
	background-color: #fff;
	padding: 0 25px;
}

.waku.sel.on{

	background-color: #ffdc44;
    color: #a90606;
}


.waku.sel2{
	font-size: 80%;
	background-color: #fff;
	padding: 0 25px;
	padding: 4px 10px;
}

.waku.sel2.on{
	background-color: #ffc7c7;
}






.waku.selbox{
	font-size: 100%;
	background-color: rgba(236, 236, 236, 0.6);
	padding: 30px 27px;
	margin-right: 10px;

}

.waku.selbox.on{
	background-color: #fbff00;
    color: #f00;
    font-weight: 700;
}





.waku.w{
	background-color: #fff;
}

table.w{
	background-color: #fff;
}

.rote_on{
	background-color: #ffe53f;


}

.marque2.small{
	    font-size: 85%;
    margin-bottom: 5px;
}

.m0{
	margin-right: 0px;
}

.scroll{
	overflow: auto;
	height: 600px;
}

.nobr{
	border: none;
}
.nobr td{
	border: none;
}


.bord{
	border: none;
}
.bord td{
	border: 1px solid #000;
}





div.button_link {
    border: 2px solid #000;
    border-radius: 13px;
    padding: 2% 0px;
    margin: auto;
    font-size: 170%;
    vertical-align: 1px;
    /* margin-right: 2px; */
    background-color: #dc4e4e;
    width: 90%;
    text-align: center;
    color: #fff;
    background: -webkit-linear-gradient(top, #ffabab 0%, #fd5f5f 50%, #dc4e4e 51%, #dc4e4e 100%);
}

div.button_link:active{
	opacity:0.2;
}
div.button_link.info {
	    background: -webkit-linear-gradient(top, #ffa86b 0%, #ff9a51 50%, #ff6a00 51%, #ff6a00 100%);
    color: #f9ff00;
    font-weight: 700;
    /* text-shadow: 3px 3px 0 #000; */
    text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336;
    border: 3px solid #690000;
}
div.button_link.warning {
    background-color: rgb(206, 34, 34);
}



div.button_link_half {
    border: 0px solid #000;
    border-radius: 5px;
    padding: 1% 0px;
    margin: auto;
    font-size: 3.6vh;
    vertical-align: 1px;
    /* margin-right: 2px; */
    background-color: rgb(169, 70, 4);
    width: 90%;
    text-align: center;
    color: #fff;
    width: 45%;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff930), color-stop(0.5, #a78a00), to(#ffde3b));
    /*text-shadow: 1px 1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #020100, -1px -1px 0 #000000;*/
    font-weight: 700;
	border: 3px solid #250000;
}

div.button_link_half:active{
	background: #f0a80f;
}


div.button_link_half.pos{
    display: inline-block;
    position: absolute;
}




div.button_link.sm{

    border: 0px solid #000;
    border-radius: 13px;
    padding: 6px 0px;
    /* margin: auto; */
    font-size: 80%;
    vertical-align: 1px;
    /* margin-right: 2px; */
    background-color: rgb(243, 143, 75);
    width: 35%;
    text-align: center;
    color: #fff;
    margin: 10px 0;
    margin-right: 0px;
    display: inline-block;
}

div.button_link.sm.no {
    background-color: rgb(152, 152, 152);
    color: #484848;
}



div.br{
	margin-bottom: 10px;
}


.pad15 td{
	padding: 15px 13px;
}

div.br2{
	margin-bottom: 10px;
}


.semai td{
	padding-right: 5px;
	padding-left: 5px;
}


.order td{
	font-size: 100%;
    background-color: #e65b5b;
    padding: 0% 1px;
    color: #fff;
    border: 1px solid #fff;
}


.order_s td{
	font-size: 60%;
    background-color: #8e3737;
	background-color: #424242;
    padding: 4px 1px;
    color: #fff;
    border: 0px solid #fff;
    width: 5%;
	background: -webkit-linear-gradient(top, #555343 0%, #6d6b5f 50%, #191707 51%, #191707 100%);
}

.team_icon_small.sm.l40{
	width: 40px;
	height: 40px;
	    margin-right: 5px;
}




.score td{
	font-size:80%;
    padding: 1px;
    border-right: 0px;
    background: -webkit-linear-gradient(top, #f1f1f1 0%, #b7b6ae 50%, #bfbfb8 51%, #7b7b7b 100%);
	border: none;
	font-weight: 700;
}

.score_tema{
	color: #383838;
    /* text-shadow: 1px 1px 0 #000, -1px 1px 0 #000000, 1px -1px 0 #0c0100, -1px -1px 0 #000000; */
    /* text-shadow: 0px 1px 0 #f00, -1px 0px 0 #ff0000, 0 -1px 0 #ff1500, 0 -1px 0 #ff0000; */
    font-weight: 700;
    display: inline-block;

    word-wrap: unset;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tdleft > img{
	width: 40px;
	height: 40px;
}




.name_small td{
	padding: 0px 5px;
}



td.left_title{
	background-color: #eaeaea;
	width: 30%;
}

td.left_title2 {
    background-color: #eacfcf;
    width: 30%;
}


td.left_title3{
	background-color: #eacfcf;
	width: 20%;
}

td.left_title3_v{
	width: 30%;
	position: relative;
}




.tdleft{
	text-align:left;
}


.score_div{
    background-color: #fff;
    border: solid 1px #000;
    border-radius: 7px;
    padding: 2% 0;
    margin-bottom: 2%;
}


.score_pitch{
	margin-left: 2%;
    font-size: 75%;
}



.hr_small.m2{
	margin: 2%;
}

.score_obi{
    background: -webkit-gradient(linear, left top, left bottom, from(#aab4e4), to(#6066af));
    color: #fff;
    padding: 1% 2%;
    position: relative;
    font-size: 85%;
    margin-bottom: 1%;
    border-radius: 6px;
	background: -webkit-linear-gradient(top, #bcc1ff 0%, #6c7eff 50%, #536ce0 51%, #2348b3 100%);
}


.score_obi2{
    background: -webkit-gradient(linear, left top, left bottom, from(#a2a2a2), to(#000000));
    color: #fff;
    padding: 0% 2%;
    position: relative;
    /* font-size: 80%; */
    margin-bottom: 1%;
    border-radius: 1px;
}

.pad1_2{
	padding: 1% 2%;
}

.tf100{
	font-size: 100%;
}

.tf100 td{
	font-size: 100%;
	padding: 2px 0px;

}


.s_out{
	color: #0000ff;
}

.s_hit{
	color: #f00;
}

.s_error{
	color: #ad0909;
}

.s_shikyu{
	color: #027010;
}


.s_maru{
    border: solid 1px #000;
    padding: 0 5px;
    border-radius: 10px;
    background-color: #fff;
    color: #00f;
}

.s_okuri{
	margin-bottom: 15px;
}

.s_okuri2{
	margin-bottom: 30px;
}



.waku.name.s_name{
	display: inline-block;
    width: 35%;
    margin-right: 10px;
    margin-bottom: 5px;
}


.top_m10{
	margin-top: 10px;
}

.t_left{
	text-align: left;
}

.result_box{
	border: 1px solid #000;
    border-radius: 3px;
	padding: 1px 6px;
    font-size: 80%;
    vertical-align: 1px;
    margin-right: 2px;
    display: inline-block;
}

.result_box.hit{
	background-color: #ffbdf8;
}

.result_box.out{
	background-color: #90b8ff;
}

.result_box.err{
	background-color: #c3c3c3;
}

.result_box.banto{
	background-color: #fffba0;
}

.s_maru2{
	    border: solid 1px #000;
    padding: 0 5px;
    border-radius: 32px;
    background-color: #fff7a2;
    color: #00f;
    font-size: 70%;
}


a.noline{
	decoration:none:
}

.oukan{
	width: 30%;
    vertical-align: -16px;
    margin-right: 10px;
    margin-left: -10px;
}

.w70{
	width: 70%;
}
.w80{
	width: 80%;
}


.marubatsu{
	width: 50px;
	    display: inline-block;
}

.under{
    text-decoration: underline;
    color: #2886ff;
}


.param{
	font-size: 120%;
	font-weight: bold;
}
.param.s{
	color: #f00;
}



.waku.s{
	background-color: #ff36d6;
	color: #fff;
	vertical-align: 4px;
}
.waku.a{
	background-color: #ff3636;
	color: #fff;
	vertical-align: 4px;
}
.waku.b{
	background-color: #ffaf25;
	color: #fff;
	vertical-align: 4px;
}
.waku.c{
	background-color: #cfd044;
	color: #fff;
	vertical-align: 4px;
}
.waku.d{
	background-color: #688aff;
	color: #fff;
	vertical-align: 4px;
}
.waku.e{
	background-color: #6e9e5d;
	color: #fff;
	vertical-align: 4px;
}
.waku.f{
	background-color: #828680;
	color: #fff;
	vertical-align: 4px;
}
.waku.g{
	background-color: #2d2d2d;
	color: #fff;
	vertical-align: 4px;
}


.sign_button_p {
    display: inline-block;
    position: absolute;
    border: 1px solid #4a4949;
    width: 30%;
    border-radius: 10px;
    font-size: 70%;
    text-align: center;
    background-color: #b3b3b3;
    padding: 4% 0;
}

.sign_button_mini {
    background-color: #ffc357;
}

.sign_button_mini.no {
    background-color: #dedede;
}






td.left_title4 {
    background-color: #eaeaea;
    width: 30%;
}
td.left_title4_v{
	width: 70%;
	position: relative;
}

.logout {
	font-size: 90%;
    margin-left: 2%;
    color: #000;
    position: absolute;
    bottom: 2%;
    font-weight: 700;
}
.dn{
	display:none;
}


.top_top{
    display: block;
    top: 19%;
    position: absolute;
    height: 45%;
    width: 100%;
}

.top_middle{
    display: block;
    top: 46%;
    position: absolute;
    height: 45%;
    width: 100%;
}



table td.y {
    background: #e0bc84;
    color: #000;
    border: 1px solid #848484;
}

.top_team{
	    font-size: 80%;
    color: #fff;
}

















@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%;
  }
  to {
    margin-left: 0%;
    width: 100%;
  }
}

div.slidein {
  animation-duration: 0.5s;
  animation-name: slidein;
}

.big{
	font-size: 140%;
}




div.fadein {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


.logo_img{
    width: 100%;
    /*margin: 1px 8px;*/
    border: 1px solid;
}

a{
	text-decoration:none;
	outline:none;
}
a:hover{
	text-decoration:none;
	outline:none;
}

.tc{
	text-align: center;
}



.divlink:active{
	opacity:0.2;
}



.subwin {
    height: 90%;
}

.subwin_title {
        /* background: -webkit-gradient(linear, left top, left bottom, from(#d2a294), to(#923004)); */
    color: #ffc743;
    padding: 1% 1%;
    position: relative;
    font-size: 95%;
    text-align: center;
    font-weight: bold;
    background: #6d2727;
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(158, 75, 33)), to(rgb(105, 48, 0)));
    text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336;
	border: 1px solid #582f2f;
}

.close_btn {
    position: absolute;
    top: 0;
    right: 1%;
    /* width: 9%; */
    height: 100%;
}

.modal_window {
    padding: 2%;
    height: 94%;
    overflow:auto;
    position: relative;
	font-size: 2vh;
}

.tab-content .tab-box {
    width: 100%;
    height: 100%;
    padding: 5px;
    border: 1px solid #989696;
    border-radius: 0 5px 5px 5px;
    box-sizing: border-box;
    background-color: rgba(252, 255, 229, 0.69);
}


.tab-content label:hover, .tab-content input[type="radio"]:checked + label {
    color: #eeff0a;
    background-color: rgba(210, 6, 6, 0.88);
    font-weight: bold;
}

.tab-content label {
    display: inline-block;
    padding: 2%;
    font-weight: normal;
    font-size: 100%;
    color: #000000;
    background-color: rgb(255, 255, 255);
    cursor: pointer;
    box-shadow: inset -1px 1px 2px rgba(0, 0, 0, 0);
    border-radius: 5px 5px 0 0;
    box-sizing: border-box;
    border: 1px solid #949494;
    border-bottom: 0;
    text-align: center;
    margin-right: 2px;
    margin-left: 2px;
}

.tab-content .w25{
	width: 24%;
}

.tab-content{
	text-align: center;
}

.scroll_order{
	    overflow: auto;
    height: 93%;
    text-align: left;
}




.batter_cls.bn_1{
	background-color: #ffc4cb;
	    background: -webkit-gradient(linear, left top, left bottom, from(#ff76e1), color-stop(0.5, #ffb0f9), to(#f98ef6));
}

.batter_cls.bn_2{
background-color: #a0ebfa;
    background: -webkit-gradient(linear, left top, left bottom, from(#29d7ff), color-stop(0.5, #91f5ff), to(#33b4ff));
}

.batter_cls.bn_3{
background-color: #f8f37b;
    background: -webkit-gradient(linear, left top, left bottom, from(#f3ff33), color-stop(0.5, #ffffe5), to(#ffeb00));
}

.batter_cls.bn_7{
	background-color: #8efb8e;
    background: -webkit-gradient(linear, left top, left bottom, from(#56f343), color-stop(0.5, #baffad), to(#78ff33));
}

.batter_cls.bn_99 {
    background-color: #a0ebfa;
    background: -webkit-gradient(linear, left top, left bottom, from(#8e8e8e), color-stop(0.5, #d4d4d4), to(#565656));
    color: #f00;
}

.batter_cls.disable {
    background-color: #a0ebfa;
    background: -webkit-gradient(linear, left top, left bottom, from(#d6c6c6), color-stop(0.5, #d4d4d4), to(#656464));
}




.graph.order_life.mini {
	margin-left: 40px;
    width: 83%;
    margin-bottom: 10px;
    margin-top: 2px;
    text-align: left;
}

table.main td.vt{
	vertical-align:top;
}


.batter_cls.my{
    background-color: #eca101;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff901e), color-stop(0.5, #fff1ad), to(#ff8319));
    border: 5px solid #f00;
    font-weight: bold;
    padding: 6% 10px;
}



.marque2.pitcher{
	margin-top: 20px;
    display: inline-flex;
    background-color: #ffa8a8;
    width: 100%;
}

.waku.name:active{
	opacity:0.2;
}

div.button_link:active{
	opacity:0.2;
}



.waku.selbox.dv{
	display: inline-block;
}


tr.stamen td{
	background-color: #ffb3de;
}

.semai a{
	color: #fff;
	font-size: 90%;
}

span.span_win {
    color: #f00;
}

b.my{
	color: #f00;
}

.w120{
	font-size:120%;
}

.w130{
	font-size:130%;
}

.batter_cls.order_b.w130{
	font-size:130%;
}

div.name.w120{
	font-size:120%;
}




.modal-close:active{
	opacity: 0.3;
}

.close_btn:active{
	opacity: 0.3;
}


table.main.end td {
    vertical-align: middle;
    padding: 0.8% 0;
    text-align: center;
}


table.large3 td {
    padding: 48px 13px;
}


.waku.selbox:active{
	opacity: 0.2;
}




.top_table .name_bg {
    background: #840000;
    width: 96%;
    margin: auto;
    text-align: center;
    border: 4px solid #ffaa16;
    border-radius: 10px;

	color: #ffffff;
    font-size: 110%;
    font-weight: 700;
    letter-spacing: 0;
    overflow: hidden;
    display: inline;
    white-space: nowrap;
    transform: scale(1, 1.0);

    text-shadow: 2px 2px 1px #000000, -2px -2px 1px #fb984b;


}


/* 巨人 */
.top_table .name_bg.t1{
background: #f27900;
    color: #000;
    text-shadow: 2px 2px 1px #ffffff, -2px -2px 1px #ffffff;
    border: 4px solid #000000;
}

/* 中日 */
.top_table .name_bg.t2{
    background: #033c82;
    color: #fff;
    text-shadow: 2px 2px 1px #5f5f5f, -2px -2px 1px #000000;
    border: 4px solid #202f55;
}

/* ヤクルト */
.top_table .name_bg.t3{
    background: #112744;
    text-shadow: 2px 2px 1px #000000, -2px -2px 1px #ff005e;
    border: 4px solid #15b97c;
}

/* 阪神 */
.top_table .name_bg.t4{
	background: #fcff65;
    text-shadow: 2px 2px 0 #000, -2px 2px 0 #000000, 2px -2px 0 #0c0100, -2px -2px 0 #000000;
    border: 4px solid #000000;
    color: #fff;
}

/* 広島 */
.top_table .name_bg.t5{
    background: #ff0000;
    text-shadow: 2px 2px 1px #4a4a4a, -2px -2px 1px #2d2d2d;
    border: 4px solid #eaeaea;
    color: #fff;
}

/* 横浜 */
.top_table .name_bg.t6{
    background: #0061b7;
    text-shadow: 2px 2px 1px #4a4a4a, -2px -2px 1px #2d2d2d;
    border: 4px solid #007bbb;
    color: #fff;

}

/* ホークス */
.top_table .name_bg.t7{
    background: #ffffff;
    text-shadow: 2px 2px 1px #423200, -2px -2px 1px #4c3a00;
    border: 4px solid #f4c427;
    color: #f4c427;
}

/* 日ハム */
.top_table .name_bg.t8{
    background: #2c93ef;
    text-shadow: 2px 2px 1px #423200, -2px -2px 1px #777776;
    border: 4px solid #ffcc26;
    color: #ffffff;
}

/* ロッテ */
.top_table .name_bg.t9{
    background: #ffffff;
    text-shadow: 2px 2px 1px #afafaf, -2px -2px 1px #ffffff;
    border: 4px solid #000000;
    color: #000000;
}


/* 西武 */
.top_table .name_bg.t10{
    background: #002054;
    text-shadow: 2px 2px 1px #777777, -2px -2px 1px #565656;
    border: 4px solid #ffffff;
    color: #ffffff;
}

/* オリックス */
.top_table .name_bg.t11{
    background: #000023;
    text-shadow: 2px 2px 1px #777777, -2px -2px 1px #6b6b6b;
    border: 4px solid #fffa5d;
    color: #fffb63;
}


/* 楽天 */
.top_table .name_bg.t12{
	background: #840000;
	text-shadow: 2px 2px 1px #000000, -2px -2px 1px #fb984b;
	border: 4px solid #ffaa16;

}





.top_table .top_name {
    color: #ffffff;
    text-shadow: 2px 2px 1px #000000, -2px -2px 1px #fb984b;
    font-size: 110%;
    font-weight: 700;
    letter-spacing: 0;
    overflow: hidden;
    display: inline;
    white-space: nowrap;
    transform: scale(1, 1.3);
}


.top_table .name_bg2{
    background: #000;
    width: 90%;
    margin: auto;
    text-align: center;
    border: 0px solid #493a20;
    border-radius: 10px;
    margin-top: 5px;
    font-size: 70%;
    padding: 1%;
}


.top_table .name_bg3{
    width: 100%;
    margin: auto;
    text-align: center;
    border: 0px solid #493a20;
    border-radius: 10px;
    margin-top: 0;
    font-size: 2.2vh;
	bottom: 0%;
    position: absolute;
    padding: 0%;
    font-weight: bold;
    height: 80%;
    text-align: left;
    padding-left: 1%;
    line-height: 1;
}




.head_div {
    color: #000;
    border-radius: 10px;
    /* text-shadow: 1px 1px 0 #000, -1px -1px 0 #000; */
    /* font-weight: 700; */
    padding: 0% 10%;
    font-size: 100%;
    height: 90%;
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 247, 155)), to(rgb(247, 148, 0)));
}


.setting_btn {
    right: 0;
    position: absolute;
    margin-right: 2%;
    width: 7%;
    bottom: 9%;
}

.pad2 .under{
	color:#2915c7;
	font-size: 120%;
}

.score_point {
    font-size: 140%;
    font-weight: bold;
    color: #f00;
    text-shadow: 0px 1px 0 #000, 0 -1px 0 #000000;
}

.score_div.loss{
	background: #e0e0e0;;
	text-shadow: 0px 1px 0 #000, -1px 0px 0 #000000, 0 -1px 0 #0c0100, 0 -1px 0 #000000;

}

.first_big{
    text-align: center;
    margin-top: 5%;
    color: #8c2d2d;
}


div.jyunbi{
color: #ffd80e;
    font-weight: 700;
    text-align: center;
    font-size: 4vh;
    padding: 5% 0;
    text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336;
}

.f110{
	font-size:110%;
}
.f120{
	font-size:120%;
}

.present_div2:active{
	opacity:0.2;
}

.pad2 .bd{
    /* margin: auto; */
    top: 42%;
    /* bottom: 0; */
    position: relative;
    /* vertical-align: middle; */
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

div.dock{
	position: absolute;
}

.maru {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  flex-flow: column;
  vertical-align: top;
}
.size_normal {
    width: 26%;
    height: 35%;
}
.letter3 {
    font-size: 80%;
    /* line-height: 0.5em; */
}

.pink1 {
    color: white;
    /* border: 4px solid #ff002d; */
    background-color: #f00;
    position: absolute;
    margin-top: -8%;
    right: 4%;
    z-index: 4;
}

.pink1.plus{
	background-color: #0fc13e;
}


.infomation{
    display: inline-block;
    position: absolute;
    bottom: 14%;
    background-color: #fff;
    text-shadow: none;
    padding: 0% 3%;
    border-radius: 14px;
    font-size: 85%;
    color: #f00;
    font-weight: 700;
    border: 3px solid #f00;
}

.infomation:active{
	opacity: 0.2;
}

div.coach {
    position: absolute;
    font-size: 150%;
    bottom: 15%;
    height: 20%;
    width: 100%;
}







.tab-content_top .tab-box_top {
    width: 100%;
    height: 100%;
    padding: 5px;
    border: 0px solid #989696;
    border-radius: 0 5px 5px 5px;
    box-sizing: border-box;
    background-color: rgba(252, 255, 229, 0.69);
}


.tab-content_top label:hover, .tab-content_top input[type="radio"]:checked + label {
    color: #edff00;
    background-color: #ff310f;
    font-weight: bold;
    font-size: 100%;
}

.tab-content_top label {
    display: inline-block;
	padding: 2%;
    font-weight: normal;
    font-size: 100%;
    color: #000000;
    background-color: rgb(255, 255, 255);
    cursor: pointer;
    box-shadow: inset -1px 1px 2px rgba(0, 0, 0, 0);
    border-radius: 5px 5px 0 0;
    box-sizing: border-box;
    border: 1px solid #949494;
    border-bottom: 0;
    text-align: center;
    margin-right: 2px;
    margin-left: 2px;
}

.tab-content_top .w25{
	width: 24%;
}

.tab-content_top{
	text-align: center;
}



div.button_link.info.gacha_btn {
    bottom: 10%;
    margin: auto;
    left: 0;
    right: 0;
    font-size: 170%;
    padding: 5% 0;
    margin-bottom: 10%;
}


.coach_page{
	font-size: 90%;
    display: inline-block;
    text-align: right;
    right: 3%;
    position: absolute;
    bottom: 2%;
    z-index: 5;
    color: #005fff
}





.bord{
	border: none;
}
.bord td{
	border: 1px solid #848484;
}



.graph.order_life.mini.m2{
	margin-left: 2%;
    width: 70%;
    vertical-align: 10px;
        margin-bottom: 4%;
}

.graph.order_life.mini.m3{
    margin-left: -2px;
    width: 57%;
    vertical-align: 10px;
}




table.main.m2 td {
    padding: 1% 0px;
}

.cond_updown{
	width: 10%;
    position: absolute;
    bottom: 26%;
    right: 2%;
}

.stamen_tbl td{
	border:none;
}


.skill_box.no {
    background-color: #736f6f;
    color: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#171717), color-stop(0.5, #848484), to(#000000));
}



.skill_list_box {
    border: 1px solid #000;
    margin-bottom: 5%;
    padding: 2%;
    text-align: center;
    width: 45%;
    display: inline-block;
    margin-right: 2%;
    color: #0006ff;
    font-size: 80%;
	background: -webkit-gradient(linear, left top, left bottom, from(#29ff75), color-stop(0.5, #d2ffd1), to(#33ff8e));
}

.skill_box:active{
	opacity:0.2;
}

.skill_list_box .no{
	font-size: 70%;
}


div.subsub_win{
    background: #f9f9f9;
    height: 100%;
	padding: 2%;

}

div.subsub_win .title{
    color: #c10404;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 1%;
}

div.subsub_win .body{
	position: relative;
    height: 80%;
}



div.tact_div{

	    display: inline-block;
    width: 40%;
    border: 3px solid #5f5f5f;
    padding: 10% 0;
    margin: 5% 3%;
    background: #ffc357;
    border-radius: 10px;
}

div.tact_div:active{
	opacity: 0.1;
}

.td_act:active{
	background: #ffc357;
}

div.skill_ext{
    background: #fff0d5;
    padding: 5% 2%;
    color: #820000;
}


.waku.name.skill {
    width: 100%;
        background: -webkit-gradient(linear, left top, left bottom, from(#eaeaea), to(#ffffff));
    font-size: 100%;
    color: #0093ff;
    padding: 7% 12px;
}


div.score_result{
	font-weight: 700;
	font-size: 140%;
    margin-bottom: -3%;
}
div.score_result.win{
    color: #ff4646;
    text-shadow: 0px 1px 0 #000, -1px 0px 0 #000000, 0 -1px 0 #0c0100, 0 -1px 0 #000000;

}
div.score_result.loss{
    color: #4a4aff;
}
div.score_result.draw{
    color: #639300;
}


.batter_cls.order_tact{

	padding: 4% 4%;
    width: 70%;
    font-size: 2vh;
    text-align: left;

}

.batter_cls.order_tact_syubi{

	padding: 8% 12px;
    width: 100%;
    font-size: 100%;
    text-align: center;
    position: relative;
}

.order_tact_syubi_t{
position: absolute;
    font-size: 120%;
    color: #fff;
    font-weight: 700;
    margin-top: 1%;
}


.abs{
	position: absolute;
}
.rel{
	position: relative;
}

.ma{
	margin: auto;
}

.order_tact_syubi_d{
    width: 30%;
}

div.fire{
	position: absolute;
    top: 0;
    width: 100%;
    right: 5%;
	text-align: right;
	margin-top: -2%;
}

div.fire .item{
	height: 24%;
}



.batter_cls.order_b{
	width: 82%;
    font-size: 120%;
    padding: 4% 3%;
}

.batter_cls.b_chg{
	width: 82%;
    font-size: 100%;
    text-align: left;
    padding: 4% 2%;
}

div.fire.syubi{
	position: absolute;
    top: 0%;
    width: 13%;
    right: 5%;
    text-align: right;
}

div.fire .item.syubi{
	height: 6%;
}


div.kekka{
	right: 4%;
    position: absolute;
    font-weight: bold;
}


div.kekka.win{
	color: #ffb7b7;
}
div.kekka.loss{
    color: #43dbff;
}
div.kekka.draw{
    color: #ffffff;
}



span.magic{
	color: #f00;
	font-weight: bold;
}


.skill_list_box:action{
	opacity: 0.2;
}

a.a_sel{
	color:#0ff;
	    text-decoration: underline;
}

.pink2 {
    color: white;
    /* border: 4px solid #ff002d; */
    background-color: #b93c3c;
    position: absolute;
    margin-top: -8%;
    right: 8%;
}

.size_normal2 {
    width: 29%;
    height: 35%;
}

.btn_text:active{
	opacity: 0.2;
}

hr.nomargin{
	    margin-top: 0%;
    margin-bottom: 0%;
}

table.main td.tl{
	text-align:left;
}


.news_detail{
	margin-bottom: 4%;
	background: #fff8d2;
	padding: 1%;
}

.news_detail .title{
    background: linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-linear-gradient(transparent 80%, #ffc6fa 80%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(80%,rgba(255, 255, 255, 0)), color-stop(80%,#ca2424));
    font-weight: 700;
    margin-bottom: 20px;
    display: inline-block;
}

.news_detail .body{
	font-size: 90%;
}

.news_detail .date{
	font-size: 80%;
	text-align: right;
}

.news_detail hr{
	border-top: 1px solid #c5c5c5;
    margin-top: 1%;
    margin-bottom: 1%;
    order: 0;
}

.w200{
	width: 200%;
}

.w150{
	width: 150%;
}

.batter_cls.order_b.b100{
	width: 100%;
}


.waku.seiseki{
	width: 24%;
    background: #fff;
    font-size: 80%;
    display: inline-block;
    text-align: center;
}
.waku.seiseki.good{
	background: #e815b9;
    color: #fff;
}
.waku.seiseki.bad{
	background: #2346ce;
    color: #fff;
}
.waku.seiseki.error{
	background: #5c5b6f;
    color: #fff;
}
.waku.seiseki.gida{
	background: #f3ef75;
    color: #000;
}
.waku.seiseki.shikyu{
	background: #f5ed00;
    color: #000;
}

.tl{
	text-align:left;
}

.traning td{
	padding: 2% 1%;
	font-size: 80%;
}


.traning .order td{
	padding: 5px 13px;
}

.f110{
	font-size: 110%;
}


.traning .training{

}

.button_link.traning{
	margin:2% auto;
	margin-bottom: 8%;
	font-size: 3vh;
}

.training_name {
    padding: 3%;
    margin-bottom: 5%;
    font-size: 110%;
    color: #0064ff;
    background: -webkit-gradient(linear, left top, left bottom, from(#8affb4), color-stop(0.5, #ceffd1), to(#00d437));
    font-weight: 700;
    border: 3px solid #504f4f;
}

.team_power {
color: #ffffff;
    font-weight: 700;
    font-size: 130%;
    text-decoration: underline;
    /* background: #fcff66; */
    /* padding: 0 2%; */
    top: 0;
    left: 2%;
}


.gatch_info {
    width: 58%;
    bottom: 2%;
    position: absolute;
    height: 15%;
    color: #fff;
    font-size: 1.3vh;
    padding: 0% 1%;
    overflow: auto;
    right: 3%;
    border: 5px solid #400303;
    background: -webkit-gradient(linear, left top, left bottom, from(#ce8a8a), color-stop(0.5, #823b3b), to(#b76b6b));
}


.team_icon.mini {
    border: 1px solid #000;
    width: 26px;
    vertical-align: -7px;
    margin-right: 2px;
}


.banner_info{

	width: 35%;
    bottom: 2%;
    position: absolute;
    height: 12%;
    overflow: hidden;
    left: 2%;
	border: 4px solid #dedede;

}

.banner_info:active{
	opacity: 0.2;
}

.wh100{
	width: 100%;
    height: 100%;
}
.h100{
    height: 100%;
}


.bp_img{
	vertical-align: -3px;
    margin-right: 1%;
    background: #fff;
    border-radius: 2px;
    border: 1px solid;
    width: 100%;
}



.top_now_rank{
    width: 26%;
    color: #fff;
    font-size: 90%;
    padding: 1% 2%;
    position: absolute;
    left: 2%;
    border-radius: 10px;
    border: 2px solid #000;
    height: 100%;
    background: -webkit-linear-gradient(top, #555343 0%, #6d6b5f 50%, #191707 51%, #191707 100%);
}

.top_now_rank .rank {
    color: #edff00;
    font-weight: 700;
    font-size: 3.7vh;
    position: absolute;
    right: 12%;
    top: 0;
}


.top_now_rank.power{
    width: 38%;
    left: 30%;

}


.top_now_rank.power .rank{
    color: #f9ff0d;
	text-shadow: 3px 3px 0 #f00, -3px 3px 0 #F44336, 3px -3px 0 #F44336, -3px -3px 0 #F44336;
}



.top_icon1{
    width: 15%;
    vertical-align: -16px;
    position: absolute;
    left: 72%;
    font-size: 90%;
}

.top_icon1.i2{
    left: 86%;
}

.top_icon .text{
	position: absolute;
    bottom: -12%;
    font-weight: 700;
    color: #ffeed9;
    font-size: 90%;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336;

}

.top_icon img{
	width: auto;
    height: 100%;
    margin: auto;
    left: 0;
    right: 0;
    position: absolute;
}



.top_main_div{
	    top: 17%;
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    visibility: visible;
    animation-delay: 0.3s;
    animation-name: bounceInRight;
    height: 80%;
    width: 100%;
    background-color: rgba(252, 255, 229, 0);
    font-size: 1.8vh;
}



div.ato{
	    color: #fff900;
    font-size: 120%;
    font-weight: 700;
    vertical-align: -2%;
}

.game_msg{
	 color: #d61b1b;
    /* font-size: 110%; */
    line-height: 1.2;
    font-size: 2.4vh;
}







.balloon1 {
position: absolute;
    display: inline-block;
    margin: 0 1.5em;
    padding: 7px 10px;
    min-width: 120px;
    max-width: 100%;
    color: #555;
    font-size: 2.0vh;
    background: #ffffff;
    border-radius: 15px;
    height: 60%;
    width: 63%;
    line-height: 1.2;
    top: 20%;
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.71);
	/*overflow: auto;*/
}

.balloon1:before {
    content: "";
    position: absolute;
    top: 30%;
    left: -12%;
    margin-top: -12px;
    border: 12px solid transparent;
    border-right: 52px solid #FFF;
    z-index: 2;
    /* width: 50px; */
}

.balloon1 p {
	margin: 0;
	padding: 0;
}
.top_icon:active{
	opacity:0.2;
}


.sub_bg{
	    width: 100%;
    height: 100%;
    z-index: 3;
    position: absolute;
    top: 0;
    left: 0;
}

.sub_main{
	width: 100%;
    height: 100%;
    position: relative;
}




.modal-content {
    position: relative;
    background-color: rgba(255, 255, 255, 0);
    -webkit-background-clip: padding-box;
    /* background-clip: padding-box; */
    border: none;
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 0px 0px rgba(0,0,0,.5);
    box-shadow: 0 0px 0px rgba(0,0,0,.5);
}



div.title_left {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 193, 193, 0.89)), to(rgb(204, 0, 0)));
    display: inline-block;
    /* width: 30%; */
    /* padding-left: 2%; */
    padding: 1%;
    padding-right: 7%;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    border: 1px solid #a73939;
    font-size: 130%;
    font-weight: bold;
    padding-left: 2%;
}

.w50{
	width: 50%;
}
.w40{
	width: 40%;
}

.waku.white{
	background: #fff;
}

div.button_link_half.pos:active{
	opacity: 0.2;
	background:#000;
}



.white50 {
    background-color: rgba(255, 255, 255, 0.88);
}


table.main td.sema{
	padding: 0px;
}



.modal-content.white{
	background-color: #fdffe2;
}



div.cancel_btn{
	position: absolute;
    bottom: 20%;
    width: 100%;
    border: 0px solid #000;
    border-radius: 13px;
    padding: 3% 0px;
    margin: auto;
    font-size: 100%;
    width: 60%;
    text-align: center;
    color: #fff;
    left: 0;
    right: 0;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff930), color-stop(0.5, #a78a00), to(#ffde3b));
    text-shadow: 1px 1px 0 #000000, -1px 1px 0 #000000, 1px -1px 0 #020100, -1px -1px 0 #000000;
    font-weight: 700;
    border: 3px solid #250000;
    font-size: 2.7vh;
}

div.cancel_btn.l3{
    z-index: 45;
}


div.cancel_btn:active{
	opacity: 0.2;
}



table.white{
	background: rgba(255, 255, 255, 0.74);
}


.tra_start{
	margin: 3% 0;
    color: #f00;
    font-weight: 700;
    text-shadow: 1px 1px 0 #949393, -1px 1px 0 #7b7a7a, 1px -1px 0 #9c9c9c, -1px -1px 0 #c5c5c5;
    font-size: 100%;
}



div.sub_back {
    z-index: 19;
    position: absolute;
    bottom: 2%;
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.8901960784313725) 0%, rgba(195, 194, 188, 0.8901960784313725) 50%, rgba(148, 148, 148, 0.9215686274509803) 51%, rgba(169, 169, 169, 0.9098039215686274) 100%);
    display: inline-block;
    width: 24%;
    /* padding-left: 2%; */
    padding: 0% 0%;
    /* padding-right: 11%; */
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    border: 4px solid #3e3e3e;
    left: 0;
    text-align: center;
    border-radius: 0 0 47px 0;
    font-weight: bold;
    border-left: none;
    border-right: 6px solid #7d7d7d;
}



div.sub_back img{
	vertical-align: -15%;
	margin-right: 2%;
	height: 3%;
}

div.sub_back:active{
	opacity: 0.2;
	background:#000;
}


.f150{
	font-size:150%;
}

.f130{
	font-size:130%;
}



div.saisyu{
font-size: 3.4vh;
    color: #000;
    /* text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000; */
}



.batter_cls.rank{
	font-size: 2.5vh;
    padding: 2% 12px;
}
.score_td{
	width: 7%;
}

.score_td_p{
	width: 8%;
}

.text_right{
	text-align:right;
}


.pad2 .under:active{
	opacity: 0.2;
}




.now_bosyu{
	    color: #ff0000;
    font-size: 130%;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000;
    vertical-align: -12%;
    /* text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336; */
    text-shadow: 1px 1px 0 #f00, -1px 1px 0 #F44336, 1px -1px 0 #F44336, -1px -1px 0 #F44336;
}


.list_sel_range_flex{
	display: flex;
    align-items: center;
}

.list_sel_range_right{
    width: 13%;
    text-align: center;
    margin-right: 2%;
}

.list_sel_range_left{
    width: 87%;
    margin-right: 2%;
}


.delete_btn{

    background: -webkit-linear-gradient(top, #e6d388 0%, #e6d388 50%, #ce9f09 51%, #ce9f09 100%);
    color: #fff;
    border: 0;
    height: 33px;
    border-radius: 6px;
    width: 80px;
    font-size: 90%;
    outline: none;
}


.add_btn {
    background: -webkit-linear-gradient(top, #ffbfbf 0%, #ff9191 50%, #ff1f1f 51%, #f31010 100%);
    color: #fff;
    border: 0;
    height: 33px;
    border-radius: 6px;
    width: 280px;
    font-size: 90%;
    outline: none;
}


.delete_btn:hover, .place_btn:hover, .add_btn:hover{
	opacity: 0.8;
}


.place_btn{

    background: -webkit-linear-gradient(top, #70b6f2 0%, #54a3ee 50%, #3690f0 51%, #1a62db 100%);
    color: #fff;
    border: 0;
    height: 33px;
    border-radius: 6px;
    width: 80px;
    font-size: 90%;
    outline: none;
}




div.button_link.info.gacha_btn.btn_used {
    /* background-color: #cecccc; */
    color: #b1b1b1;
    background: hsla(0, 0%, 73%, 0.64);
    text-shadow: none;
    border: none;
}


.sweet-alert {
    width: 90%;
    left: 0;
    right: 0;
    font-size: 2.5vh;
    text-align: center;
    margin: auto;
}

.order_status td:nth-of-type(1){
	width: 10%;
}
.order_status td:nth-of-type(2){
	width: 50%;
}
.order_status td:nth-of-type(3){
	width: 20%;
}
.order_status td:nth-of-type(4){
	width: 10%;
}
.order_status td:nth-of-type(5){
	width: 10%;
}


td.d_order_status > div > div.order_tact{
	width: 80%;
}

td.d_order_status > div > div.graph.order_life.mini.m2{
	margin-left: 14%;
    width: 81%;
    vertical-align: 10px;
    margin-bottom: 0;
}





.modal_window_slim {
    padding: 1%;
    height: 100%;
    overflow: auto;
    /* position: absolute; */
    font-size: 2.8vh;
    background: rgba(255, 255, 255, 0.95);
    margin: auto;
    top: 0;
    bottom: 0;
    vertical-align: middle;
    width: 100%;
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 700;
    flex-flow: column nowrap;
}

.subwin.half {
    height: 40%;
    bottom: 0;
    margin: auto;
    width: 100%;
}

.subwin.half.h100 {
    background: rgba(255, 255, 255, 0.34);
}



div.menu-item .item_img {
    width: 23%;
    position: relative;
    margin: 3% 0;
    overflow: hidden;
}

div.menu-title {
    display: inline;
    width: 100%;
    background: #91a8ff;
    font-size: 80%;
    color: #fff;
    margin-bottom: -2%;
}

div.menu-item {
    justify-content: space-between;
}

.flex {
    display: flex;
}

div.item_img > div:last-child {
    color: #ec2c2c;
    font-size: 60%;
    line-height: 1.1;
    margin-top: 2%;
}

div.menu-item > div > img {
    width: 100%;
    border: 5px solid #8e8e8e;
}

.ribbon {
    display: inline-block;
    position: absolute;
    padding: 0% 0;
    left: -14%;
    top: 2%;
    width: 160px;
    text-align: center;
    font-size: 80%;
    /* line-height: 2; */
    background: #39c3d4;
    color: #fff;
    letter-spacing: 0.05em;
    -webkit-transform: rotate(320deg);
    -ms-transform: rotate(320deg);
    transform: rotate(320deg);
    box-shadow: 0 0 0 2px rgb(57, 195, 212);
    box-shadow: none;
    border-top: dashed 1px rgba(255, 255, 255, 0.65);
    border-bottom: dashed 1px rgba(255, 255, 255, 0.65);
}



div.ribbon.mini {
    left: -6vh;
    font-size: 76%;
    color: #fff;
    border: 2px solid #fff;
}

div.menu-item > input[type=button] {
    background: -webkit-linear-gradient(top, #87a1ff 0%, #91a4ff 50%, #5e99ff 51%, #106bf3 100%);
    color: #fff;
    border: 0;
    height: 93px;
    border-radius: 6px;
    width: 280px;
    font-size: 90%;
    outline: none;
}


.modal_window.bg-white{
	background: #fff;
	font-size: 3vh;
}

.batter_cls.order_b.w100{
	width: 100%;
}

.ha{
	height: auto;
}

.flex-center{
	display: flex;
    justify-content: center;
    align-items: center;
}


.score_box > div{
	width: 50%;
	height: 50%;
	padding: 0 2% 0 0;
	overflow: auto;
}

.score_box > div > span > div{
	margin-bottom: 0%;
}

#open_p_1, #open_p_2{
	width: 90%;
	margin: auto;
	margin-top: -9px;
}

.batter_cls.order_b.result{
width: 69%;
    margin-top: -10%;
    margin-left: 32%;
    font-size: 78%;
    padding: 2% 1%;
}


.multi_popup_d{
	height: 20%;
    z-index: 90;
    /*background: rgba(255, 101, 101, 0.83); */
    border-bottom: 9px solid;
    border-top: 9px solid;
    font-size: 100%;
    text-align: center;
}

.tr{
	text-align:right;
}

.score_popup_div{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
	flex-flow: column nowrap;
	line-height: 1.2;
}

.score_popup_div.p{
	background: rgba(255, 101, 101, 0.83);
}

.score_popup_div.info{
	background: rgba(19, 19, 19, 0.83);
    color: #fff;
    font-size: 4.5vh;
}

.score_popup_div.b{
	background: rgba(71, 117, 255, 0.83);
    color: #fff;
}

.score_popup_div.slogan{
	background: none;
    color: #fff;
}



.step_bar {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100;
    margin: auto;
    vertical-align: middle;
    font-size: 90%;
    font-weight: normal;
    position: absolute;
    bottom: 40px;
}
.step_pff{
	background: #e7e7e7;
    border: none;
    color: #898989;
    font-size: 84%;
    padding: 0% 4%;
    margin-bottom: 2%;
    border: 1px solid #545454;
}
.step_on{
	    background: #f0a80f;
    /* border: none; */
    color: #bd0000;
    border: 1px solid #ff2020;
}

div.step_run_btn{
	margin-bottom: 2%;
    padding: 0% 10%;
    display: inherit !important;
    position: initial !important;
    width: 60%;
    border-radius: 20px;
    margin-top: 1%;
}

div.step_run_btn.off{
    margin-bottom: 2%;
    padding: 0% 0%;
    display: inherit !important;
    position: initial !important;
    margin-top: 1%;
    border-radius: 20px;
    width: 60%;

	background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), color-stop(0.5, #8e8e8c), to(#63625f));
    color: #999;
    border-color: #969696;

}


div.kankyaku{
	font-size: 70%;
    text-align: right;
    right: 0;
    width: auto;
    font-weight: normal;
}


.team_icon_small.sm.logo-z{
	height: 130px;
    width: 100px;
}

.senpatsu{
width: 95%;
    height: 80px;
    font-size: 2.8vh;
    border: 1px solid #656464;
    background: #333333;
    color: #ffffff;
    border: 4px solid #fff;
    padding: 1%;
}



div.test-menu{

}


div.test-menu > div:nth-of-type(1){
	width: 10%;
	overflow: auto;
    height: 100%;
    min-width: 190px;
}
div.test-menu > div:nth-of-type(2){
	width: 90%;
}

div.test-menu > div{
	padding: 0 5px;
}


div.sel1 > div{
	padding: 0 30px 0 0;
}

div.sel2 > div{
	padding: 4px;
    margin: 0 15px 0 0;
    background: #fff;
    border: 1px solid #cacaca;
	background: #fff;
}
.f11{
	font-size: 11pt;
}

.f10{
	font-size: 10pt;
}

div.b{
	font-weight: 700;
}


div.open-0 > div{
	height: 10%;
    width: 50%;
}

div.open-1{
	margin-bottom: 0%;
}
div.open-1 > div{
    width: 50%;
    font-size: 66%;
    margin-top: 3%;
    color: #ffffff;
    text-shadow: 2px 2px 0 #000, -2px 2px 0 #000000, 2px -2px 0 #0c0100, -2px -2px 0 #000000;
}


div.open-2{
    font-size: 4vh;
    margin-bottom: 0%;
    color: #ffee00;
	text-shadow: 2px 2px 0 #000, -2px 2px 0 #000000, 2px -2px 0 #0c0100, -2px -2px 0 #000000;
	line-height: 1.1;
	margin-top: 1%;
}

div.open-2 > div:nth-of-type(1){
	width: 45%;
}
div.open-2 > div:nth-of-type(2){
	width: 10%;
    font-size: 150%;
    color: #f00;
}
div.open-2 > div:nth-of-type(3){
	width: 45%;
}
div.hear_come{
	color: #f00;
    font-size: 130%;
    margin-bottom: 5%;
    line-height: 1;
}


div.font-normal{
	font-size: 100%;
	font-weight: normal;
}

div.open_tact > div{
	text-align: left;
    padding-left: 5%;
    font-weight: 700;
    color: #fff;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000000, 1px -1px 0 #0c0100, -1px -1px 0 #000000;
}

.batter_cls.order_b.mini{
	font-size: 100%;
    padding: 0% 3%;
	align-items: center;
}

div.open_senpatsu{
	font-size: 80%;
}
div.open_senpatsu > div:nth-of-type(1){
	width: 50%;
}
div.open_senpatsu > div:nth-of-type(2){
	width: 50%;
}



div.gamestart{
	position: absolute;
    bottom: 2%;
    left: 0;
    right: 0;
}

div.button_link.disable {
    background: -webkit-linear-gradient(top, #e6e6e6 0%, #d2d0d0 35%, #a9a9a9 51%, #848484 100%);
    color: #4c4c4c;
    font-weight: 700;
    /* text-shadow: 3px 3px 0 #000; */
    /* text-shadow: 2px 2px 0 #f00, -2px 2px 0 #F44336, 2px -2px 0 #F44336, -2px -2px 0 #F44336; */
    border: 3px solid #777777;
    text-shadow: none;
}


div.studium_name{
	font-size: 80%;
    color: #a9a9a9;
    margin-top: -2%;
}

table.pos_right{
	position: absolute;
    right: 0;
    width: 60%;
	margin-right: 4%;
}
table.pos_left{
	position: absolute;
    left: 0;
    width: 60%;
	margin-left: 4%;
}

div.open_msg{
	position: absolute;
    bottom: 2%;
    text-align: left;
    right: 5%;
    color: #109c00;
    font-weight: bold;
    font-size: 120%;
    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #ffffff, 1px -1px 0 #ffffff, -1px -1px 0 #ffffff;
}

div.batter_cls.b_chg.farm{
	font-size: 2.4vh;
    padding: 2% 4%;
}

div.batter_cls.order_tact{
	font-size: 2.4vh;
    padding: 2% 4%;
}

div.batter_cls.order_tact_syubi{
	font-size: 2.0vh;
    padding: 7% 4%;
}

div.batter_cls.order_b{
	font-size: 2.4vh;
    padding: 3% 4%;
}

div.batter_cls.b_chg.farm{
    font-size: 2.4vh;
    padding: 2% 4%;
}

div.switch{
	z-index: 19;
    right: 1%;
    position: absolute;
    left: auto;
    background: no-repeat;
    width: 15%;
    height: 8%;
    border: 1px solid #000;
    background: rgba(232, 232, 232, 0.89);
    border-radius: 20px;
}

div.switch > img{
	width: 100%;
	height: 100%;

}
div.no-iphone{
	font-size: 70%;
}


.graph.order_life.mini.left{
	margin-left: 0;
}


.marque2.mini{
	color: #000;
    font-size: 110%;
}

div.graph.order_life.head_bar{
    margin-top: -3px;
}

div.top_money{
	font-size: 1.8vh;
}

div.bd.main-board{
	top: 41%;
	font-size: 2vh;
}

table.game-table{
	font-size: 2.2vh;
}

div.grand{
	font-size: 2.8vh !important;
}

div.team_info {
    width: 98%;
    height: 80%;
    margin: auto;
    margin-top: 1%;
    font-size: 2.6vh;
}



.semai2 {
    font-size: 1.7vh;
}

.order_b ma{
	font-size: 3.7vw;
}

div.sub_title{
    font-size: 2.8vh;
    font-weight: bold;
    text-align: center;
    margin: auto;
    left: 0;
    right: 0;
}


button.login-btn{
	width: 80%;
    padding: 3% 10%;
    background-color: #9a3330;
    font-size: 3.2vh;
}

table.reg{
	font-size: 120%;
}

button.reg-btn{
	width: 80%;
    padding: 2% 5%;
    background-color: #7b4141;
    font-size: 3.5vh;
}
div.welcome{
	font-weight: 700;
	color: #ab1010;
}

img.check{
    width: 30px;
    vertical-align: -5px;
}

img.check.rd{
    vertical-align: -8px;
}


div.now_count{
	position: absolute;
    right: 2%;
    top: 2%;
    color: #fff;
    font-size: 3.2vh;
    font-weight: 700;
    text-decoration: underline;
}


div.open-2 > div > div.power{
	font-size: 85%;
    color: #ff6b12;
	margin-top: 4%;
}





div.chara{
    /*border: 1px solid #000;*/
    padding: 0;
    position: relative;
    overflow: hidden;
    height: 100%;
}

div.chara > img{
	width: 100%;
	background: #fff;
}

div.player_now{
	width: 100%;
    margin-bottom: 2px;
    padding: 4px;
    height: 20%;
}

div.player_now.p2 > div:nth-of-type(1){
	width: 20%;
}
div.player_now.p2 > div:nth-of-type(2){
	width: 80%;
	position: relative;
}


div.player_now > div:nth-of-type(1){
	width: 10%;
}
div.player_now > div:nth-of-type(2){
	width: 20%;
}
div.player_now > div:nth-of-type(3){
	width: 70%;
}


div.player_now > div > div.order_life{
	margin-left: 0;
    width: 100%;
}

div.player_now > div > .graph.order_life.mini.m2{
	margin-left: 0;
    width: 100%;
    margin-bottom: 0;

}




div.player_now > div > div.order_b, div.player_now > div > div.order_tact{
	width: 100%;
    font-size: 2.2vh;
    padding: 2% 3%;
}

div.ribbon.mini {
	left: -64px;
    font-size: 86%;
    color: #fff;
    top: -3px;
    font-weight: 700;
}

div.ribbon.mini.mini2{
font-size: 52%;
    border: 1px solid #fff;
    padding: 0;
    left: -69px;
    top: -5px;
}


.ribbon.s{
    background: #e60dad;
}
.ribbon.a{
    background: #e80a0a;
}
.ribbon.b{
	background: #ff6912;
}
.ribbon.c{
    background: #afa20f;
}
.ribbon.d{
    background: #5285e2;
}
.ribbon.e{
	background: #289414;
}
.ribbon.f{
	background: #1e2635;
}
.ribbon.g {
    background: #3e3e3e;
}


.batter_cls.c_s{
	border: 5px solid #699a68;
}
.batter_cls.c_a{
	border: 5px solid #e80a0a;
}
.batter_cls.c_b{
	border: 5px solid #ff6912;
}
.batter_cls.c_c{
	border: 5px solid #afa20f;
}
.batter_cls.c_d{
	border: 5px solid #5285e2;
}
.batter_cls.c_e{
	border: 5px solid #289414;
}


div.dajyun{
	display: flex;
	padding: 1% 2%;
	height: 11%;
}


tr.order.rote > td:nth-of-type(1){
	width: 7%;
}
tr.order.rote > td:nth-of-type(2){
	width: 48%;
}
tr.order.rote > td:nth-of-type(3){
	width: 15%;
}
tr.order.rote > td:nth-of-type(4){
	width: 10%;
}
tr.order.rote > td:nth-of-type(5){
	width: 10%;
}
tr.order.rote > td:nth-of-type(6){
	width: 10%;
}



tr.order.rote.sts > td:nth-of-type(1){
	width: 7%;
}
tr.order.rote.sts > td:nth-of-type(2){
	width: 48%;
}
tr.order.rote.sts > td:nth-of-type(3){
	width: 15%;
}
tr.order.rote.sts > td:nth-of-type(4){
	width: 15%;
}
tr.order.rote.sts > td:nth-of-type(5){
	width: 15%;
}



label{
	font-weight: normal;
}


tr.order.rote2 > td:nth-of-type(1){
	width: 50%;
}
tr.order.rote2 > td:nth-of-type(2){
	width: 20%;
}
tr.order.rote2 > td:nth-of-type(3){
	width: 10%;
}
tr.order.rote2 > td:nth-of-type(4){
	width: 10%;
}
tr.order.rote2 > td:nth-of-type(5){
	width: 10%;
}





.top_table .name_bg.t0{
	height: 100%;
}
.name_bg.order{
	width: 100%;
    display: inline-block;
    height: 6.3vh;
    font-size: 3.0vh;
}

.name_bg > div.num{
	position: absolute;
	bottom: -5px;
    left: 0;
    right: 0;
    margin: auto;
}

div.lv{
    position: absolute;
    right: 1px;
    top: 1px;
    font-size: 50%;
	background: rgba(0, 0, 0, 0.8);
    padding: 2px;
    color: #fff;
    width: 26%;
    text-align: center;
}

.order_b{
	position: relative;
}

div.player_now.p2{
	height: 100%;
	text-align: left;
}

.h_1{
	height: 1;
}



div.player_now.p3{
	height: 100%;
}
div.player_now.p3 > div:nth-of-type(1){
	width: 20%;
}
div.player_now.p3 > div:nth-of-type(2){
	width: 80%;
	position: relative;
	padding-top: 6%;
    text-align: left;
}


.p3 > div > div > div{
	font-size: 100% !important;
}


div.dtable{
	display: table;
	margin-bottom: 5%;
	text-align: left;
}

div.dtable > div{
	display: inline-block;
}





div.rank_num{
	color: #999;
    font-size: 80%;
}

.nobg{
	background: none;
}

div.gameset{
	font-size: 6.3vh;
    color: #f00;
    margin-bottom: 7%;
    text-shadow: 2px 2px 0 #000, -2px 2px 0 #000000, 2px -2px 0 #0c0100, -2px -2px 0 #000000;

}

div.gameset_msg{
	margin-bottom: 3%;
    color: #fff;
    font-size: 3.2vh;
    text-shadow: 1px 1px 0 #000, -1px 1px 0 #000000, 1px -1px 0 #0c0100, -1px -1px 0 #000000;
}


.name_bg.order.od_mini{
	    font-size: 2.5vh;
}

input[type=button].kekka{
	    position: absolute;
    top: 1%;
    left: 1%;
    font-weight: normal;
    font-size: 70%;
    background: -webkit-linear-gradient(top, #dcb154 0%, #f0a80f 50%, #c19332 51%, #c1870b 100%);
    color: #fff;
    padding: 1% 5%;
    border: 1px solid #312e2e;
    text-shadow: 0px 1px 0 #000, -1px 0px 0 #000000, 0 -1px 0 #0c0100, 0 -1px 0 #000000;
    font-weight: 700;
    border-radius: 10px;
}


#score_speed{
	background: rgba(235, 235, 235, 0.46);
}

#v_box_2{
	padding-left: 2%;
    padding-right: 0;
}

#score_p_table td{
	background: #fff;
	text-align: right;
}

#score_p_table td:nth-child(odd){
	background: #b9411c;
    color: #fff;
	width: 70%;
	text-align: left;
}



div.step_bar > div > span{
	font-size: 80%;
}

#pit_etc{
	line-height: 1.2;
    color: #fff;
    text-shadow: 0px 1px 0 #000, -1px 0px 0 #000000, 0 -1px 0 #0c0100, 0 -1px 0 #000000;
    padding-left: 5%;

}

#pit_etc > div.tr{
	padding-right: 5%;
	padding-left: 0;
}

#score_box_bat > div > div{
	height: 13%;
}

#score_box_bat > div > div > .waku:nth-of-type(1){
font-size: 80%;
    padding: 0 2%;
    line-height: 1.1;
    border: 1px solid #333333;
    background: rgba(255, 255, 255, 0.78);
}

#score_box_bat > div.mrg{
    margin-bottom: 19%;
}




#score_box_pit_div > div > div#p_name {
	height: 13%;
}

#score_box_pit_div > div > div.waku:nth-of-type(1) {
    font-size: 80%;
    padding: 0 2%;
    line-height: 1.1;
    border: 1px solid #333333;
    background: rgba(255, 255, 255, 0.78);
    height: auto;
}


#pit_etc > div {
    padding-right: 5%;
    padding-left: 0;
    height: auto;
}

td.score_r{
	font-weight: bold;
    border-right: 2px solid #333;
    color: #ca0000;
    font-size: 107%;
    margin-right: -2%;
}



div.score_result.big{
	font-size: 200%;
}

div.score_msg{
	background: rgba(255, 72, 72, 0.74);
	padding: 1% 1%;
    color: #ffffff;
    font-size: 90%;
    line-height: 1.2;
    font-weight: 700;
    text-shadow: 0px 1px 0 #000, -1px 0px 0 #000000, 0 -1px 0 #0c0100, 0 -1px 0 #000000;

}

div.score_board{
	background: rgba(0, 0, 0, 0.58);
    color: #fff;
    padding: 2% 3%;
    border-radius: 20px;
	font-weight: normal;
    font-size: 90%;
	border: 2px solid #eaeaea;
}


.waku.win2{
    color: #000;
    background: #ffca14;
}

.waku.loss2{
    background-color: #737373;
}

.waku.bg_brawn2{
    background-color: #ca0000;
}

.team_icon_small.sm2.icon40{
    height: 40px;
    width: 40px;
}

div.releaf{
	line-height: 1;
}

div.releaf > div > div:nth-of-type(1){
	width: auto;
	margin-right: 5px;
}

div.releaf > div > div:nth-of-type(2){
	width: 20%;
}

div.releaf > .flex{
	align-items: center;
	margin-bottom: 1%;
}

div.flex.vc{
	align-items: center;
}


div.score_board > hr, div.score_board > div > hr{
	border: 1px solid #c3c3c3;
    width: 100%;
    margin: 0;
    margin-top: 2%;
	margin-bottom: 2%;
}

div.score_kansyu{
	 justify-content:space-between;
	 font-weight:normal;
	 font-size: 90%;
}





div.game_detail{
	font-size: 100%;
    width: 70%;
    margin-top: 4%;
}


div.releaf > div > div:nth-of-type(4){
	width: 70%;
}

div.skill_name{
    font-size: 4.5vh;
    font-weight: 700;
    color: #fff;
    text-shadow: 2px 2px 0 #000, -2px 2px 0 #000000, 2px -2px 0 #0c0100, -2px -2px 0 #000000;
	line-height: 1.2;
	    margin-top: 3%;
}

div.skill_hatsu{
    font-size: 3.5vh;
    width: 100%;
    text-align: right;
}


.menu_btn > div{
	position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 5%;
}

.menu_btn > div:nth-of-type(1){
	z-index: 2;
}
.menu_btn > div:nth-of-type(2){
    top: -5%;
}

.menu_btn > div > img{
    width: 70%;
    height: 100%;
}

table.debug-table{
	border: 1px solid #999;
	margin: 10px 0;
}

table.debug-table td{
    border: 1px solid #999;
    padding: 0 7px;
    font-size: 90%;
}

body.screen-lock{
	overflow: hidden;
	height: 100%;
}

img.google-icon{
    width: 24px;
}


div.sso-btn{
    height: 50px;
    background: #eb3c01;
    color: #fff;
    font-size: 14pt;
    width: 360px;
    box-shadow: 0px 6px 0px #cbcbcb;
    margin-bottom: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
div.sso-btn:hover{
    opacity: 0.9;
}

div.sso-btn:active{
    box-shadow: none;
    margin-top: 6px;
    margin-bottom: 14px;
}


img.g-icon{
    width: 25px;
    background: #fff;
    height: 24px;
    padding: 3px 0px;
    margin-right: 10px;
}

div.error-msg{
    color: #f00;
    padding-bottom: 10px;
    font-size: 130%;
}




.loader-b {
  width: 50px;
  aspect-ratio: 2;
  --_g: no-repeat radial-gradient(circle closest-side,#666 90%,#0000);
  background:
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: l3 1s infinite linear;
}
@keyframes l3 {
    20%{background-position:0%   0%, 50%  50%,100%  50%}
    40%{background-position:0% 100%, 50%   0%,100%  50%}
    60%{background-position:0%  50%, 50% 100%,100%   0%}
    80%{background-position:0%  50%, 50%  50%,100% 100%}
}

/* margin-top */
.mt-0 { margin-top: 0px; }
.mt-1 { margin-top: 0.25rem; }  /* 4px */
.mt-2 { margin-top: 0.5rem; }   /* 8px */
.mt-3 { margin-top: 0.75rem; }  /* 12px */
.mt-4 { margin-top: 1rem; }     /* 16px */
.mt-5 { margin-top: 1.25rem; }  /* 20px */
.mt-6 { margin-top: 1.5rem; }   /* 24px */
.mt-8 { margin-top: 2rem; }     /* 32px */
.mt-10 { margin-top: 2.5rem; }  /* 40px */
.mt-12 { margin-top: 3rem; }    /* 48px */
.mt-16 { margin-top: 4rem; }    /* 64px */

/* margin-bottom */
.mb-0 { margin-bottom: 0px; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-10 { margin-bottom: 2.5rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }

/* margin-left */
.ml-0 { margin-left: 0px; }
.ml-1 { margin-left: 0.25rem; }
.ml-2 { margin-left: 0.5rem; }
.ml-3 { margin-left: 0.75rem; }
.ml-4 { margin-left: 1rem; }
.ml-5 { margin-left: 1.25rem; }
.ml-6 { margin-left: 1.5rem; }
.ml-8 { margin-left: 2rem; }
.ml-10 { margin-left: 2.5rem; }
.ml-12 { margin-left: 3rem; }
.ml-16 { margin-left: 4rem; }

/* margin-right */
.mr-0 { margin-right: 0px; }
.mr-1 { margin-right: 0.25rem; }
.mr-2 { margin-right: 0.5rem; }
.mr-3 { margin-right: 0.75rem; }
.mr-4 { margin-right: 1rem; }
.mr-5 { margin-right: 1.25rem; }
.mr-6 { margin-right: 1.5rem; }
.mr-8 { margin-right: 2rem; }
.mr-10 { margin-right: 2.5rem; }
.mr-12 { margin-right: 3rem; }
.mr-16 { margin-right: 4rem; }

/* margin-x (left & right) */
.mx-0 { margin-left: 0px; margin-right: 0px; }
.mx-1 { margin-left: 0.25rem; margin-right: 0.25rem; }
.mx-2 { margin-left: 0.5rem; margin-right: 0.5rem; }
.mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; }
.mx-4 { margin-left: 1rem; margin-right: 1rem; }
.mx-5 { margin-left: 1.25rem; margin-right: 1.25rem; }
.mx-6 { margin-left: 1.5rem; margin-right: 1.5rem; }
.mx-8 { margin-left: 2rem; margin-right: 2rem; }
.mx-10 { margin-left: 2.5rem; margin-right: 2.5rem; }
.mx-12 { margin-left: 3rem; margin-right: 3rem; }
.mx-16 { margin-left: 4rem; margin-right: 4rem; }

/* margin-y (top & bottom) */
.my-0 { margin-top: 0px; margin-bottom: 0px; }
.my-1 { margin-top: 0.25rem; margin-bottom: 0.25rem; }
.my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; }
.my-3 { margin-top: 0.75rem; margin-bottom: 0.75rem; }
.my-4 { margin-top: 1rem; margin-bottom: 1rem; }
.my-5 { margin-top: 1.25rem; margin-bottom: 1.25rem; }
.my-6 { margin-top: 1.5rem; margin-bottom: 1.5rem; }
.my-8 { margin-top: 2rem; margin-bottom: 2rem; }
.my-10 { margin-top: 2.5rem; margin-bottom: 2.5rem; }
.my-12 { margin-top: 3rem; margin-bottom: 3rem; }
.my-16 { margin-top: 4rem; margin-bottom: 4rem; }

/* padding-top */
.pt-0 { padding-top: 0px; }
.pt-1 { padding-top: 0.25rem; }  /* 4px */
.pt-2 { padding-top: 0.5rem; }   /* 8px */
.pt-3 { padding-top: 0.75rem; }  /* 12px */
.pt-4 { padding-top: 1rem; }     /* 16px */
.pt-5 { padding-top: 1.25rem; }  /* 20px */
.pt-6 { padding-top: 1.5rem; }   /* 24px */
.pt-8 { padding-top: 2rem; }     /* 32px */
.pt-10 { padding-top: 2.5rem; }  /* 40px */
.pt-12 { padding-top: 3rem; }    /* 48px */
.pt-16 { padding-top: 4rem; }    /* 64px */

/* padding-bottom */
.pb-0 { padding-bottom: 0px; }
.pb-1 { padding-bottom: 0.25rem; }
.pb-2 { padding-bottom: 0.5rem; }
.pb-3 { padding-bottom: 0.75rem; }
.pb-4 { padding-bottom: 1rem; }
.pb-5 { padding-bottom: 1.25rem; }
.pb-6 { padding-bottom: 1.5rem; }
.pb-8 { padding-bottom: 2rem; }
.pb-10 { padding-bottom: 2.5rem; }
.pb-12 { padding-bottom: 3rem; }
.pb-16 { padding-bottom: 4rem; }

/* padding-left */
.pl-0 { padding-left: 0px; }
.pl-1 { padding-left: 0.25rem; }
.pl-2 { padding-left: 0.5rem; }
.pl-3 { padding-left: 0.75rem; }
.pl-4 { padding-left: 1rem; }
.pl-5 { padding-left: 1.25rem; }
.pl-6 { padding-left: 1.5rem; }
.pl-8 { padding-left: 2rem; }
.pl-10 { padding-left: 2.5rem; }
.pl-12 { padding-left: 3rem; }
.pl-16 { padding-left: 4rem; }

/* padding-right */
.pr-0 { padding-right: 0px; }
.pr-1 { padding-right: 0.25rem; }
.pr-2 { padding-right: 0.5rem; }
.pr-3 { padding-right: 0.75rem; }
.pr-4 { padding-right: 1rem; }
.pr-5 { padding-right: 1.25rem; }
.pr-6 { padding-right: 1.5rem; }
.pr-8 { padding-right: 2rem; }
.pr-10 { padding-right: 2.5rem; }
.pr-12 { padding-right: 3rem; }
.pr-16 { padding-right: 4rem; }

/* padding-x (left & right) */
.px-0 { padding-left: 0px; padding-right: 0px; }
.px-1 { padding-left: 0.25rem; padding-right: 0.25rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-8 { padding-left: 2rem; padding-right: 2rem; }
.px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
.px-12 { padding-left: 3rem; padding-right: 3rem; }
.px-16 { padding-left: 4rem; padding-right: 4rem; }

/* padding-y (top & bottom) */
.py-0 { padding-top: 0px; padding-bottom: 0px; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }



/* HTML: <div class="loader"></div> */
.loader-c {
  width: 50px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 8px solid #0000;
  border-right-color: #ffa50097;
  position: relative;
  animation: l24 1s infinite linear;
}
.loader-c:before,
.loader-c:after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: inherit;
  animation: inherit;
  animation-duration: 2s;
}
.loader-c:after {
  animation-duration: 4s;
}
@keyframes l24 {
  100% {transform: rotate(1turn)}
}