body {
    background: url(/image/jp/register/tiny_grid.png);
    padding-top: 0;
    padding-bottom: 40px;
}
.container-narrow {
    margin: 0 auto;
    max-width: 700px;
}
header {
    padding: 20px 0 7px 0;
    background: url(/image/jp/oesys/bg_head_oesys2.png) repeat-x #FFF;
    margin-bottom: 30px;
    border-bottom: 1px solid #ddd;
}
img {
    max-height: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}
.box {
    position: relative;
    padding: 10px;
    background-color: #fff;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 30px;
}
h1 {
    position: relative;
    color: #fff;
    line-height: 1;
    margin: 0 -20px 20px -20px;
    padding: 10px 5px 10px 20px;
    box-shadow: 0 1px 3px #777;
    background: #59d559;
    *text-shadow: -1px -1px #999999;
    font-size:20px;
    /*角丸フォントサイズ追記*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#d5d5d5', endColorstr = '#d5d5d5');
    /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
    /*Element must have a height (not auto)*/
    /*All filters must be placed together*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#d5d5d5', endColorstr = '#d5d5d5')";
    /*Element must have a height (not auto)*/
    /*All filters must be placed together*/
    background-image: -moz-linear-gradient(top, #a2a2a2, #d5d5d5);
    background-image: -ms-linear-gradient(top, #a2a2a2, #d5d5d5);
    background-image: -o-linear-gradient(top, #a2a2a2, #d5d5d5);
    background-image: -webkit-gradient(linear, center top, center bottom, from(#a2a2a2), to(#d5d5d5));
    background-image: -webkit-linear-gradient(top, #a2a2a2, #d5d5d5);
    background-image: linear-gradient(top, #a2a2a2, #d5d5d5);
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border:none;
    border-bottom:2px solid #59d559;
    /*Use "background-clip: padding-box" when using rounded corners to avoid the gradient bleeding through the corners*/
    /*--IE9 WILL PLACE THE FILTER ON TOP OF THE ROUNDED CORNERS--*/
    color:#ffffff;
}
h1:after, h1:before {
    content: "";
    position: absolute;
    top: 100%;
    height: 0;
    width: 0;
    border: 5px solid transparent;
    border-top: 5px solid #59d559;
}
h1:after {
    left: 0;
    border-right: 5px solid #59d559;
}
h1:before {
    right: 0;
    border-left: 5px solid #59d559;
}
h2 {
    display: inline-block;
    font-size: 16px;
    position: relative;
    text-shadow: -1px -1px #777;
    line-height: 30px;
    margin: 0 -20px 10px -20px;
    padding: 0 10px 0 20px!important;
    box-shadow: 0 1px 3px #777;
    background-color:#969696;
    border-bottom:1px solid #666666;
    text-align:center;
    color:#FFF;
}
h2:after {
    content: "";
    position: absolute;
    top: 100%;
    height: 0;
    width: 0;
    border: 5px solid transparent;
    border-top: 5px solid #59d559;
}
h2:after {
    left: 0;
    border-right: 5px solid #59d559;
}
h3{
    font-size:17.5px;
    line-height:20px;
    text-shadow:1px 1px 1px rgba(0,0,0,.1);
}
.control-label {
    position: relative;
    text-shadow: -1px -1px #777;
    line-height: 30px;
    margin: 0 -20px 10px -20px;
    padding: 0 5px 0 20px!important;
    box-shadow: 0 1px 3px #777;

    font-size:12px;
    background-color:#5fbc56;
    border-bottom:1px solid #59d559;
    color:#FFF;
}
.control-label:after {
    content: "";
    position: absolute;
    top: 100%;
    height: 0;
    width: 0;
    border: 5px solid transparent;
    border-top: 5px solid #59d559;
}
.control-label:after {
    left: 0;
    border-right: 5px solid #59d559;
}
table {
    table-layout:fixed;
    word-wrap:break-word;
}
#table_categories{
    table-layout:auto;
}
.table td {
    vertical-align:middle;
}
.cell-center {
    text-align: center!important;
}
.cell-right {
    text-align: right!important;
}
.list_event_td_1 {
    background-color: #e1f8fb;
}
.list_event_td_2 {
    text-align: center!important;
}
.list_event_td_3 {
    text-align: center!important;
    font-weight: bold;
}
.list_event_td_4 {
    text-align: center!important;
}
.list_event_td_5 {
    background-color: #ec780f;
    color: #ffffff;
    font-weight: bold;
    text-align: center!important;
}
.list_event_td_6 {
    background-color: #ffffcc;
}

@media screen and (max-width: 767px) {
    header {
        margin-left: -20px;
        margin-right: -20px;
        padding-left: 20px;
    }
    img {
        max-width: 50%;
        height: auto;
    }
    table {
        table-layout:fixed;
    }
}

/* en/entry */
th{
    background:#ededed;
    font-weight:normal!important;
    /*	width:15%;*/
}

.hol th{
    width:auto;
    white-space:nowrap;
}

.radiotd{
    text-align:center!important;
    background:#dff0d8;
}

.categoryName{
    font-weight:bold;
    width:55%;
}

.text-center{
    text-align:center !important;
}

.box-center {
    display: flex;
    justify-content: center;
}

.article img{
    margin:0 10px 10px 0;
}

/*=================================alba用=====================================*/


/*承諾ボタンクリック時*/


.btn-primary {
    background-color: #59d559;
    border-color: #59d559;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #59d559;
    background-image: -moz-linear-gradient(top,#5fbc56,#59d559);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#5fbc56),to(#59d559));
    background-image: -webkit-linear-gradient(top,#5fbc56,#59d559);
    background-image: -o-linear-gradient(top,#5fbc56,#59d559);
    background-image: linear-gradient(to bottom,#5fbc56,#59d559);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5fbc56', endColorstr='#bb3a3a', GradientType=0);
    border-color: #5fbc56 #5fbc56 #59d559;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    margin-top:10px;
}
.btn-primary:hover,
.btn-primary:focus {
    text-decoration: none;
    background-position: 0 -15px;
    -webkit-transition: background-position .1s linear;
    -moz-transition: background-position .1s linear;
    -o-transition: background-position .1s linear;
    transition: background-position .1s linear;
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: #5fbc56;
}
.btn-primary:active,
.btn-primary.active,
.btn-primary.active:hover {
    background-color: #5fbc56;
    border-color: #5fbc56;
}
.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled:active,
.btn-primary.disabled.active,
.btn-primary[disabled] .btn-primary:hover,
.btn-primary[disabled] .btn-primary:focus,
.btn-primary[disabled] .btn-primary:active,
.btn-primary[disabled] .btn-primary.active {
    background-color: #5fbc56;
    border-color: #5fbc56;
}

.btn-primary{
    font-family: Helvetica, Arial, sans-serif;
    text-decoration: none;}

.btn-other{
    margin-top:10px;}

.btn-other_b{
    margin-bottom:10px;}

/*ラジオボタン*/
.event_radio{-webkit-transform: scale(1.3);
    transform: scale(1.3);
    margin-right: 0.5em;}

/*リンク*/

a:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
a:hover,a:active{outline:0;}
a,a:visited{text-decoration:underline;}
a{color:#5fbc56;text-decoration:none;}
a:hover,a:focus{color:#59d559;text-decoration:underline;}



/*支払確認時の注意書き*/
.input-xxlarge{width:665px;}


/*支払の参加者情報確認用テーブル*/
table.naiyou{margin-bottom:20px;
    table-layout: auto;
    width:100%;}
.table-bordered td {border-top: 1px solid #dddddd;}
.wide{ width:300px;}
.middle{ width:100px;}
table.naiyou td{padding:10px;}


/*支払の選択用テーブル*/
table.siharai{margin-bottom:20px;}
.right{ width:525px;}
.left{ width:130px;}
.choice{ width:200px;text-align: left; padding-left:10px;}
.choice_img{ width:300px;}
.checkbox{ width:33px;padding-right:19px;}
.price{ width:100px;}

/*種目*/
.event_note_header{background-color: #FFE7BF;}
.event_note{background-color: #FFFFEF;}
.event_lab{background-color: #F0F9E0;width: 100px;}
.event_border{ border-style:solid; border-width: 1px; border-color: #dddddd;}

/*手続きの流れのナビゲーション(process)*/
.process{
    height:60px;
}
.process >div {
    display:inline-block;
    float:left;
    margin:0px 5px 5px 0;
    padding:10px;
    color:rgba(51,51,51,1.00);
    background-color:#ededed;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: 1px solid #dddddd;     }
.process >div.here {
    color:#ffffff;
    font-weight:bold;
    background-color:#5fbc56;
    border: 1px solid #59d559;     }

div.arrow {
    background-image:url(/image/jp/alba/arrow.png);
    background-repeat:no-repeat;
    color:rgba(255,255,255,1.00);
    background-color:rgba(255,255,255,1.00);
    border-style:none;
    margin:10px 0px 0 0;
    width:20px;
}

/*コンビニ支払手順*/

.number{list-style-type:decimal;}

.info{background-color:#ededed;
    padding:5px 20px;}

.gototop_btn{
    width:100%;
    height:100%;
    text-align:center;
    margin:0 auto;}

.gototop_btn > input{
    width:500px;
    height:50px;
    display:inline-block;
    border:0px;
    background-image:url(/image/jp/alba/gototop.png);
    cursor:pointer;
    margin-bottom:10px;}

/* 支払の"選択"ボタン */
.btn-primary-mini {
    background-color: #5fbc56;
    border-color: #5fbc56;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #5fbc56;
    background-image: -moz-linear-gradient(top,#5fbc56,#59d559);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#5fbc56),to(#59d559));
    background-image: -webkit-linear-gradient(top,#5fbc56,#59d559);
    background-image: -o-linear-gradient(top,#5fbc56,#59d559);
    background-image: linear-gradient(to bottom,#5fbc56,#59d559);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cc5d5d', endColorstr='#bb3a3a', GradientType=0);
    border-color: #5fbc56 #5fbc56 #59d559;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
}
.btn-primary-mini:hover,
.btn-primary-mini:focus {
    text-decoration: none;
    background-position: 0 -15px;
    -webkit-transition: background-position .1s linear;
    -moz-transition: background-position .1s linear;
    -o-transition: background-position .1s linear;
    transition: background-position .1s linear;
}
.btn-primary-mini:hover,
.btn-primary-mini:focus {
    background-color: #59d559;
}
.btn-primary-mini:active,
.btn-primary-mini.active,
.btn-primary-mini.active:hover {
    background-color: #59d559;
    border-color: #59d559;
}
.btn-primary-mini.disabled:hover,
.btn-primary-mini.disabled:focus,
.btn-primary-mini.disabled:active,
.btn-primary-mini.disabled.active,
.btn-primary-mini[disabled] .btn-primary-mini:hover,
.btn-primary-mini[disabled] .btn-primary-mini:focus,
.btn-primary-mini[disabled] .btn-primary-mini:active,
.btn-primary-mini[disabled] .btn-primary-mini.active {
    background-color: #5fbc56;
    border-color: #5fbc56;
}

.btn-primary-mini{
    font-family: Helvetica, Arial, sans-serif;
    text-decoration: none;}

@media(max-width:767px)
{
    .input-xxlarge{display:block;width:100%;min-height:30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
}

td.oesys_checkbox_td:has(input.check-event:disabled) {
    background-color: #999999; /* 無効時用のグレーなど */
    opacity: 0.8;             /* 少し薄くすると「触れない感」が出ます */
}