/*** for PC Browser ***/
@media (min-width:401px)
{
#ContentPane
{
    font-size: 110%;
}

h2.hojo_h2
{
    background: url(../../../images/reskilling/h2_bg2.png) no-repeat right top #376092;
    background-size: 50px 100%;
    color: #ffffff;
    text-shadow: 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C;
    padding: 10px 150px 10px 20px;
    display: inline-block;
    box-sizing: border-box;
}

h2.hojo_h2::after
{
    contents:"";
}

#ContentPane h3
{
    color: #2F527C;
    padding: 10px 20px;
    border-bottom: 3px solid #376092;
    font-weight: bold;
}

#ContentPane ul,
#ContentPane ol
{
    list-style-position: inside;
}

table.hojo_table
{
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 0;
    max-width: 700px;
}

table.hojo_table th
{
    background: #F79646 !important;
    color: #ffffff;
    text-shadow: 3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25;
    padding: 10px 20px;
    font-size: large;
    vertical-align: top;
    border: 1px solid  #ffffff;
}

table.hojo_table td
{
    background: #FFFFCC;
    padding: 10px 20px;
    border: 1px solid  #ffffff;
}

.y_box
{
    width: 95%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 10px;
    background-color: #FFFFCC;
}

.g_box
{
    width: 95%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 10px;
    background-color: #EBF1DE;
}

.b_box
{
    background: #B9CDE5;
    display: flex;
    flex-wrap: wrap;
    padding: 5px;
    width: 98%;
    margin: 0 auto 20px;
}


.column_list
{
    list-style-position: inside;
    border: 1px solid #000000;
    padding: 10px;
    margin: 5px auto;
    background: #ffffff;
    display: flex;
    flex-wrap: wrap;
    width: 95%;
    box-sizing: border-box;
}

.column_list li
{
    width: 50%;
}

/*auto generated region*/

#BaseTable
{

}
#SystemMenu
{

}
#HeaderPane
{

}
#Middle
{

}
#LeftPane
{

}
#ContentPane
{

}
#RightPane
{

}
#FooterPane
{

}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
h2.hojo_h2
{
    background: url(../../../images/reskilling/h2_bg2.png) no-repeat right top #376092;
    background-size: 30px 100%;
    color: #ffffff;
    text-shadow: 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C, 0 0 3px #2F527C;
    padding: 10px 80px 10px 20px;
    display: inline-block;
    box-sizing: border-box;
}

#ContentPane h3
{
    color: #2F527C;
    padding: 10px 20px;
    border-bottom: 3px solid #376092;
    font-weight: bold;
}

#ContentPane ul,
#ContentPane ol
{
    list-style-position: inside;
}

table.hojo_table
{
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 0;
    max-width: 100%;
}

table.hojo_table tbody tr
{
    display: flex;
    flex-wrap: wrap;
}

table.hojo_table th
{
    background: #F79646 !important;
    color: #ffffff;
    text-shadow: 3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25,3px 3px 5px #814F25;
    padding: 10px 20px;
    vertical-align: top;
    border: 1px solid  #ffffff;
    width: 100%;
}

table.hojo_table td
{
    background: #FFFFCC;
    padding: 10px 20px;
    border: 1px solid  #ffffff;
    width: 100%;
}

.y_box
{
    width: 95%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 10px;
    background-color: #FFFFCC;
}

.g_box
{
    width: 95%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 10px;
    background-color: #EBF1DE;
}

.b_box
{
    background: #B9CDE5;
    display: flex;
    flex-wrap: wrap;
    padding: 5px;
    width: 98%;
    margin: 0 auto 20px;
}


.column_list
{
    list-style-position: inside;
    border: 1px solid #000000;
    padding: 10px;
    margin: 5px auto;
    background: #ffffff;
    display: flex;
    flex-wrap: wrap;
    width: 95%;
    box-sizing: border-box;
}

.column_list li
{
    width: 100%;
}
}