/********************************************************************************
    Base Tag
********************************************************************************/

body {
    font-size:      12px;
    line-height:    175%;
    margin:         0px;
}

select, td, th, textarea {
    font-size:      12px;
    line-height:    175%;
}

div {
    box-sizing:     border-box;
}

/*
table {
    border-collapse:collapse;
}
th, td {
    border:         1px solid #A0B6EA;
    padding:        2px 4px;
}

th {
    text-align:     center;
	background:     #DDE4F7;
}

table.nb th, table.nb td {
    border:         none !important;
    padding:        2px 4px;
}
*/

legend {
    padding:        0px 5px;
}

ul, ol, dl {
    list-style: none;
    padding:    0;
    margin:     0;
}

li, dt {
    text-align: left;
    margin:     0;
    margin:     0;
}

/*
 * 段組みに使用するテーブル (Paragraph)
 */
table.prg {
    box-sizing:     border-box !important;
    border:         none       !important;
    margin:         0          !important;
}
table.prg td {
    vertical-align: top         !important;
    padding:        0px 2px     !important;
    border:         none        !important;
}

/********************************************************************************
    Form Element
********************************************************************************/

input[type=text] {
    padding:            5px 10px;
    border:             1px solid #4169E1;
    border-radius:      5px;
    box-shadow:         none;
}

input[type=text]:focus {
    box-shadow:         1px 1px 2px 2px rgba(0, 0, 0, 0.2) inset;
}

input[type="checkbox"] {
        display: none;
    }

input[type="checkbox"] + span {
    content:            '';
    display:            inline-block;
    margin:             3px 5px 0px 0px;
    width:              12px;
    height:             12px;
    border:             1px solid #0000FF;
    border-radius:      3px;
    vertical-align:     top;
}

input[type="checkbox"]:checked + span {
    width:              5px;
    height:             11px;
    margin:             1px 8px 0px 2px;
    border-top:         1px solid transparent;
    border-right:       3px solid #FF0000;
    border-bottom:      3px solid #FF0000;
    border-left:        1px solid transparent;
    -webkit-transform:  rotate(45deg);
    transform:          rotate(45deg);
}

input[type="radio"] {
        display: none;
    }

input[type="radio"] {
        display: none;
    }

input[type="radio"] + span {
    display:            inline-block;
    margin:             3px 5px 0px 0px;
    width:              12px;
    height:             12px;
    border:             1px solid #4169E1;
    border-radius:      3px;
    background-color:   #FFFFFF;
    vertical-align:     top;
}

input[type="radio"]:checked + span {
}

input[type="radio"] + span:before {
    display:            inline-block;
    content:            '';
    margin:             1px 0px 0px 1px;
    width:              10px;
    height:             10px;
    border-radius:      2px;
    background-color:   #FFFFFF;
    vertical-align:     top;
}

input[type="radio"]:checked + span:before {
    background-color:   #4169E1;
}

select {
    padding:            5px 10px;
    border:             1px solid #CCCCCC;
    box-shadow:         none;
}

/********************************************************************************
    Button
********************************************************************************/

.btn {
    display:                inline-block;
    font-size:              12px;
    letter-spacing:         1px;
    padding:				3px 8px;
    border-radius:			3px;
    -moz-border-radius:		3px;
    -webkit-border-radius:	3px;
    cursor:					pointer;
    min-width:				50px;
    color:					#FFFFFF;
    text-align:             center;
    /* text-shadow:			1px 1px 1px rgba(0, 0, 0, 0.2); */
    -webkit-transition:     background-color 0.3s;
    -moz-transition:        background-color 0.3s;
    -ms-transition:         background-color 0.3s;
    -o-transition:          background-color 0.3s;
    transition:             background-color 0.3s;
    display:                inline-block;
}

.btn.small {
    font-size:              12px !important;
    letter-spacing:         1px  !important;
    padding:                2px 4px !important;
}

.btn.large {
    font-size:              14px !important;
    letter-spacing:         1px  !important;
    padding:                8px 16px !important;
}

.btn.gray         { background-color: #999999; border: 1px solid #888888; }
.btn.gray:hover   { background-color: #BCBCBC; }
.btn.cyan         { background-color: #26B7BC; border: 1px solid #28B9BE; }
.btn.cyan:hover   { background-color: #46C8CC; }
.btn.blue         { background-color: #1E8AE2; border: 1px solid #1CAED2; }
.btn.blue:hover   { background-color: #50B0FF; }
.btn.blue2        { background-color: #0068B3; border: 1px solid #007EDE; }
.btn.blue2:hover  { background-color: #0084F7; }
.btn.green        { background-color: #53A453; border: 1px solid #5CB75C; }
.btn.green:hover  { background-color: #66CC66; }
.btn.red          { background-color: #E9516F; border: 1px solid #D94C68; }
.btn.red:hover    { background-color: #EE6983; }
.btn.orange       { background-color: #FF6633; border: 1px solid #FC6330; }
.btn.orange:hover { background-color: #FF9966; }

.btn.close {
    font-size:  20px;
    padding:	3px !important;
    min-width:	0px !important;
}
.btn.close:before {
    content : '×';
}

/********************************************************************************
    Alignment
********************************************************************************/

.rel { position: relative; }
.fl  { float: left;  }
.fr  { float: right; }

.ib  { display: inline-block; vertical-align: top;    }
.ibt { display: inline-block; vertical-align: top;    }
.ibm { display: inline-block; vertical-align: middle; }
.ibb { display: inline-block; vertical-align: bottom; }

.al   { text-align: left;   }
.ac   { text-align: center; }
.ar   { text-align: right;  }
.nw   { white-space: nowrap; }

.vat { vertical-align: top;    }
.vam { vertical-align: middle; }
.vab { vertical-align: bottom; }

/********************************************************************************
    Size
********************************************************************************/

.w1p   { width:   1%; }
.w2p   { width:   2%; }
.w5p   { width:   5%; }
.w10p  { width:  10%; }
.w20p  { width:  20%; }
.w25p  { width:  25%; }
.w50p  { width:  50%; }
.w95p  { width:  95%; }
.w98p  { width:  98%; }
.w100p { width: 100%; }

.w20  { width:  20px; }
.w30  { width:  30px; }
.w40  { width:  40px; }
.w50  { width:  50px; }
.w60  { width:  60px; }
.w70  { width:  70px; }
.w80  { width:  80px; }
.w90  { width:  90px; }
.w100 { width: 100px; }
.w120 { width: 120px; }
.w140 { width: 140px; }
.w160 { width: 160px; }
.w180 { width: 180px; }
.w200 { width: 200px; }
.w240 { width: 240px; }
.w280 { width: 280px; }
.w320 { width: 320px; }
.w360 { width: 360px; }
.w400 { width: 400px; }
.w440 { width: 440px; }
.w480 { width: 480px; }
.w520 { width: 520px; }
.w560 { width: 560px; }
.w600 { width: 600px; }

.h20  { height:  20px; }
.h30  { height:  30px; }
.h40  { height:  40px; }
.h50  { height:  50px; }
.h60  { height:  60px; }
.h70  { height:  70px; }
.h80  { height:  80px; }
.h90  { height:  90px; }
.h100 { height: 100px; }
.h120 { height: 120px; }
.h140 { height: 140px; }
.h160 { height: 160px; }
.h180 { height: 180px; }
.h200 { height: 200px; }
.h240 { height: 240px; }
.h280 { height: 280px; }
.h320 { height: 320px; }
.h360 { height: 360px; }
.h400 { height: 400px; }
.h440 { height: 440px; }
.h480 { height: 480px; }
.h520 { height: 520px; }
.h560 { height: 560px; }
.h600 { height: 600px; }

/********************************************************************************
    Margin
********************************************************************************/

.mt5  { margin-top:  5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }

.mr5  { margin-right:  5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }

.mb5  { margin-bottom:  5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }

.ml5  { margin-left:  5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }

/********************************************************************************
    Misc
********************************************************************************/

.no-select{
   user-select:         none;
   -o-user-select:      none;
   -moz-user-select:    none;
   -khtml-user-select:  none;
   -webkit-user-select: none;
}

.white {
    color:  transparent;
}


label.char2  { display: inline-block; width:  2em; }
label.char3  { display: inline-block; width:  3em; }
label.char4  { display: inline-block; width:  4em; }
label.char5  { display: inline-block; width:  5em; }
label.char6  { display: inline-block; width:  6em; }
label.char7  { display: inline-block; width:  7em; }
label.char8  { display: inline-block; width:  8em; }
label.char9  { display: inline-block; width:  9em; }
label.char10 { display: inline-block; width: 10em; }
label.char12 { display: inline-block; width: 12em; }
label.char14 { display: inline-block; width: 14em; }
label.char16 { display: inline-block; width: 16em; }
label.char18 { display: inline-block; width: 18em; }
label.char20 { display: inline-block; width: 20em; }

/* Plus 0.5em */
label.char2p  { display: inline-block; width:  2.5em; }
label.char3p  { display: inline-block; width:  3.5em; }
label.char4p  { display: inline-block; width:  4.5em; }
label.char5p  { display: inline-block; width:  5.5em; }
label.char6p  { display: inline-block; width:  6.5em; }
label.char7p  { display: inline-block; width:  7.5em; }
label.char8p  { display: inline-block; width:  8.5em; }
label.char9p  { display: inline-block; width:  9.5em; }
label.char10p { display: inline-block; width: 10.5em; }
label.char12p { display: inline-block; width: 12.5em; }
label.char14p { display: inline-block; width: 14.5em; }
label.char16p { display: inline-block; width: 16.5em; }
label.char18p { display: inline-block; width: 18.5em; }
label.char20p { display: inline-block; width: 20.5em; }

label.ind2  { display: inline-block; margin-left:  2em; }
label.ind3  { display: inline-block; margin-left:  3em; }
label.ind4  { display: inline-block; margin-left:  4em; }
label.ind5  { display: inline-block; margin-left:  5em; }
label.ind6  { display: inline-block; margin-left:  6em; }
label.ind7  { display: inline-block; margin-left:  7em; }
label.ind8  { display: inline-block; margin-left:  8em; }
label.ind9  { display: inline-block; margin-left:  9em; }
label.ind10 { display: inline-block; margin-left: 10em; }
label.ind12 { display: inline-block; margin-left: 12em; }
label.ind14 { display: inline-block; margin-left: 14em; }
label.ind16 { display: inline-block; margin-left: 16em; }
label.ind18 { display: inline-block; margin-left: 18em; }
label.ind20 { display: inline-block; margin-left: 20em; }

/* Plus 0.5em */
label.ind2p  { display: inline-block; margin-left:  2.5em; }
label.ind3p  { display: inline-block; margin-left:  3.5em; }
label.ind4p  { display: inline-block; margin-left:  4.5em; }
label.ind5p  { display: inline-block; margin-left:  5.5em; }
label.ind6p  { display: inline-block; margin-left:  6.5em; }
label.ind7p  { display: inline-block; margin-left:  7.5em; }
label.ind8p  { display: inline-block; margin-left:  8.5em; }
label.ind9p  { display: inline-block; margin-left:  9.5em; }
label.ind10p { display: inline-block; margin-left: 10.5em; }
label.ind12p { display: inline-block; margin-left: 12.5em; }
label.ind14p { display: inline-block; margin-left: 14.5em; }
label.ind16p { display: inline-block; margin-left: 16.5em; }
label.ind18p { display: inline-block; margin-left: 18.5em; }
label.ind20p { display: inline-block; margin-left: 20.5em; }