@charset "utf-8";

html {
	height: 100%;
}

body {
	background: #e4f0f1;
    height: 100%;
}

/************************************************
	
	Header

*************************************************/
#header {
	width: 100%;
    background: #FFF; 
	margin: 0, 18px 0;
	padding: 5px 18px 0;
	box-sizing: border-box;
    border-bottom: 1px solid #B6C0C1;
    overflow : hidden;
}

	#header #logo {
		float: left;
        margin-right: 20px;
	}
    #header nav {
	    float: left;
        margin-top: 11px;
    }
        #header nav li {
            float: left;
            width: 90px;
            margin-right: 20px;
        }
            #header nav li a {
                display: block;
                padding: 22px 0 3px;
                text-align: center;
                color: #333;
                font-weight: bold;
            }
            #header nav li a:hover {
                color: #38B7AA;
            }
            
            #header nav li.facility a {
                background: url(../images/ico/ico_facility01.png) no-repeat top center;
            }
            #header nav li.alert a {
                position: relative;
                background: url(../images/ico/ico_alert01.png) no-repeat top center;
            }
            #header nav li.facility a:hover,
            #header nav li.facility.crr a {
                background: url(../images/ico/ico_facility02.png) no-repeat top center;
            }
            #header nav li.alert a:hover,
            #header nav li.alert.crr a {
                background: url(../images/ico/ico_alert02.png) no-repeat top center;
            }
            #header nav li.crr a {
                border-bottom: 2px solid #38B7AA;
                color: #38B7AA;
            }
                #header nav li.alert a span {
                    position: absolute;
                    top: -2px;
                    right: 4px;
                    background: #F5485A;
                    padding: 4px 8px;
                    border-radius: 8px;
                    color: #FFF;
                    line-height: 1.0;
                    font-size: 95%;
                    font-weight: normal;
                }
        #header p {
            float: right;
            margin-top: 20px;
        }
            #header p span {
                background-color: #F5485A;
                padding: 3px 12px;
                margin-right: 10px;
                border-radius: 5px;
                position: relative;
                color: #FFF;
                cursor: pointer;
            }
            #header p span:after {
                border-top: 6px solid #F5485A;
                border-right: 8px solid transparent;
                border-left: 1px solid transparent;
                content: '';
                margin-left: -1px;
                position: absolute;
                bottom: -6px;
                left: 50%;
            }

#header02 {
	width: 100%;
    background: #38B7AA;
	margin: 0;
	padding: 10px 18px 0;
	box-sizing: border-box;
    border-bottom: 1px solid #B6C0C1;
    color: #FFF;
}

	#header02 h1 {
		float: left;
        display: flex;
        align-items: center;
        margin: 3px 20px 0 0;
        font-size: 160%;
        min-height: 45px;
	}
    #header02 h1.btn_popup01 {
        cursor: pointer;
    }
    #header02 h1.btn_popup01:hover {
        opacity: 0.8;
    }
        #header02 h1 img {
        }
        #header02 h1 span {
            padding: 0 0 0 10px;
            color: #FFF;
        }
    #header02 nav {
	    float: left;
        margin-top: 11px;
    }
        #header02 nav li {
            float: left;
            width: 90px;
            margin-right: 20px;
        }
            #header02 nav li a {
                display: block;
                padding: 22px 0 3px;
                text-align: center;
                color: #FFF;
                font-weight: bold;
            }
            #header02 nav li a:hover {
                color: #E0FF8C;
            }
            
            #header02 nav li.demand a {
                background: url(../images/ico/ico_demand01.png) no-repeat top center;
            }
            #header02 nav li.demand a:hover,
            #header02 nav li.demand.crr a {
                background: url(../images/ico/ico_demand02.png) no-repeat top center;
            }
            #header02 nav li.warning a {
                background: url(../images/ico/ico_warning01.png) no-repeat top center;
            }
            #header02 nav li.warning a:hover,
            #header02 nav li.warning.crr a {
                background: url(../images/ico/ico_warning02.png) no-repeat top center;
            }
            
            #header02 nav li.data a {
                background: url(../images/ico/ico_data01.png) no-repeat top center;
            }
            #header02 nav li.data a:hover,
            #header02 nav li.data.crr a {
                background: url(../images/ico/ico_data02.png) no-repeat top center;
            }
            

			#header02 nav li.facility a {
                background: url(../images/ico/ico_facility01.png) no-repeat top center;
            }
            #header02 nav li.facility a:hover,
            #header02 nav li.facility.crr a {
                background: url(../images/ico/ico_facility02.png) no-repeat top center;
            }
 
 			#header02 nav li.list a {
                background: url(../images/ico/ico_list01.png) no-repeat top center;
            }
            #header02 nav li.list a:hover,
            #header02 nav li.list.crr a {
                background: url(../images/ico/ico_list02.png) no-repeat top center;
            }
 
 			#header02 nav li.place a {
                background: url(../images/ico/ico_place01.png) no-repeat top center;
            }
            #header02 nav li.place a:hover,
            #header02 nav li.place.crr a {
                background: url(../images/ico/ico_place02.png) no-repeat top center;
            }
            
 			#header02 nav li.mainte a {
                background: url(../images/ico/ico_mainte01.png) no-repeat top center;
            }
            #header02 nav li.mainte a:hover,
            #header02 nav li.mainte.crr a {
                background: url(../images/ico/ico_mainte02.png) no-repeat top center;
            }

            #header02 nav li.joge a {
                background: url(../images/ico/ico_joge01.png) no-repeat top center;
            }
            #header02 nav li.joge a:hover,
            #header02 nav li.joge.crr a {
                background: url(../images/ico/ico_joge02.png) no-repeat top center;
            }
            
            #header02 nav li.mail a {
                background: url(../images/ico/ico_mail01.png) no-repeat top center;
            }
            #header02 nav li.mail a:hover,
            #header02 nav li.mail.crr a {
                background: url(../images/ico/ico_mail02.png) no-repeat top center;
            }
            
            #header02 nav li.csv a {
                background: url(../images/ico/ico_csv01.png) no-repeat top center;
            }
            #header02 nav li.csv a:hover,
            #header02 nav li.csv.crr a {
                background: url(../images/ico/ico_csv02.png) no-repeat top center;
            }
            
            #header02 nav li.portal a {
                background: url(../images/ico/ico_portal01.png) no-repeat top center;
            }
            #header02 nav li.portal a:hover,
            #header02 nav li.portal.crr a {
                background: url(../images/ico/ico_portal02.png) no-repeat top center;
            }
                       
            #header02 nav li.crr a {
                border-bottom: 2px solid #E0FF8C;
                color: #E0FF8C;
            }
            

        #header02 p {
            float: right;
            margin-top: 20px;
        }



/************************************************
	
	contents
	
*************************************************/
#wrapper {
	min-height: 100%;
	overflow: hidden;
}

#contents {
}

#main {
	width: 100%;
	text-align: left;
	float: right;
	margin-left: -81px;
}
#main_inner {
	margin-left: 81px;
	padding: 0;
}
#main_contents {
	margin-right: 10px;
}

#side {
	width: 80px;
	float: left;
	background: #FFF;
    border-right: solid 1px #B6C0C1;
	/*padding-bottom: 32768px;*/
	margin-bottom: -32768px;
    z-index: 10;
    position: absolute;
}


/************************************************

	lnav:nav.jspで設定されたメニュー

*************************************************/
#lnav a {
    display: block;
    padding: 48px 10px 18px;
    text-align: center;
    color: #333;
    font-size: 95%;
    line-height: 1.2;
}
#lnav a:hover,
#lnav li.crr a {
    color: #E0FF8C;
}
    #lnav li.diagram a {
        background: url(../images/ico/ico_diagram01.png) no-repeat center 18px;
    }
    #lnav li.diagram a:hover,
    #lnav li.diagram.crr a {
        background: #38B7AA url(../images/ico/ico_diagram02.png) no-repeat center 18px;
    }

    #lnav li.sitelist a {
        background: url(../images/ico/ico_sitelist01.png) no-repeat center 18px;
    }
    #lnav li.sitelist a:hover,
    #lnav li.sitelist.crr a {
        background: #38B7AA url(../images/ico/ico_sitelist02.png) no-repeat center 18px;
    }
    
    #lnav li.current a {
        background: url(../images/ico/ico_current01.png) no-repeat center 18px;
    }
    #lnav li.current a:hover,
    #lnav li.current.crr a {
        background: #38B7AA url(../images/ico/ico_current02.png) no-repeat center 18px;
    }
    #lnav li.history a {
        background: url(../images/ico/ico_history01.png) no-repeat center 18px;
    }
    #lnav li.history a:hover,
    #lnav li.history.crr a {
        background: #38B7AA url(../images/ico/ico_history02.png) no-repeat center 18px;
    }
    #lnav li.valhist a {
        background: url(../images/ico/ico_val_hist01.png) no-repeat center 18px;
    }
    #lnav li.valhist a:hover,
    #lnav li.valhist.crr a {
        background: #38B7AA url(../images/ico/ico_val_hist02.png) no-repeat center 18px;
    }
    #lnav li.statehist a {
        background: url(../images/ico/ico_state_hist01.png) no-repeat center 18px;
    }
    #lnav li.statehist a:hover,
    #lnav li.statehist.crr a {
        background: #38B7AA url(../images/ico/ico_state_hist02.png) no-repeat center 18px;
    }
    #lnav li.state a {
        background: url(../images/ico/ico_state01.png) no-repeat center 18px;
    }
    #lnav li.state a:hover,
    #lnav li.state.crr a {
        background: #38B7AA url(../images/ico/ico_state02.png) no-repeat center 18px;
    }
    #lnav li.graph a {
        background: url(../images/ico/ico_graph01.png) no-repeat center 18px;
    }
    #lnav li.graph a:hover,
    #lnav li.graph.crr a {
        background: #38B7AA url(../images/ico/ico_graph02.png) no-repeat center 18px;
    }
    #lnav li.remote a {
        background: url(../images/ico/ico_remote01.png) no-repeat center 18px;
    }
    #lnav li.remote a:hover,
    #lnav li.remote.crr a {
        background: #38B7AA url(../images/ico/ico_remote02.png) no-repeat center 18px;
    }
    #lnav li.terminal a {
        background: url(../images/ico/ico_terminal01.png) no-repeat center 18px;
    }
    #lnav li.terminal a:hover,
    #lnav li.terminal.crr a {
        background: #38B7AA url(../images/ico/ico_terminal02.png) no-repeat center 18px;
    }

    #lnav li.setting a {
        background: url(../images/ico/ico_setting01.png) no-repeat center 18px;
    }
    #lnav li.setting a:hover,
    #lnav li.setting.crr a {
        background: #38B7AA url(../images/ico/ico_setting02.png) no-repeat center 18px;
    }

    #lnav li.facility_setting a {
        background: url(../images/ico/ico_facility_setting01.png) no-repeat center 18px;
    }
    #lnav li.facility_setting a:hover,
    #lnav li.facility_setting.crr a {
        background: #38B7AA url(../images/ico/ico_facility_setting02.png) no-repeat center 18px;
    }
  	/* 20170218 SAYURI KADO　追加  */
    #lnav li.warning a {
        background: url(../images/ico/ico_warning01.png) no-repeat center 18px;
    }
    #lnav li.warning a:hover,
    #lnav li.warning.crr a {
        background: #38B7AA url(../images/ico/ico_warning02.png) no-repeat center 18px;
    }
    
    #lnav li.csv a {
        background: url(../images/ico/ico_csv01.png) no-repeat center 18px;
    }
    #lnav li.csv a:hover,
    #lnav li.csv.crr a {
        background: #38B7AA url(../images/ico/ico_csv02.png) no-repeat center 18px;
    }
    
    #lnav li.dgraph a {
        background: url(../images/ico/ico_demando01.png) no-repeat center 18px;
    }
    #lnav li.dgraph a:hover,
    #lnav li.dgraph.crr a {
        background: #38B7AA url(../images/ico/ico_demando02.png) no-repeat center 18px;
    }

    #lnav li.remote a {
        background: url(../images/ico/ico_remote01.png) no-repeat center 18px;
    }
    #lnav li.remote a:hover,
    #lnav li.remote.crr a {
        background: #38B7AA url(../images/ico/ico_remote02.png) no-repeat center 18px;
    }
    
    #lnav li.portal a {
        background: url(../images/ico/ico_portal01.png) no-repeat center 10px;
    }
    #lnav li.portal a:hover,
    #lnav li.portal.crr a {
        background: #38B7AA url(../images/ico/ico_portal02.png) no-repeat center 10px;
    }

/************************************************

	lnavNoIcon:nav.jspで設定されたメニュー

*************************************************/
#lnavNoIcon li {
    border-bottom: solid 1px gainsboro;
}
#lnavNoIcon li:hover {
    background: gainsboro;
}
#lnavNoIcon a {
    display: block;
    padding: 24px 10px 18px;
    text-align: center;
    color: #333;
    font-size: 95%;
    line-height: 1.2;
}
#lnavNoIcon a:hover,
#lnavNoIcon li.crr a {
    color: #0acb4e;
    font-weight:bold;
}
    #lnavNoIcon li.diagram a {
    }
    #lnavNoIcon li.diagram a:hover,
    #lnavNoIcon li.diagram.crr a {
    }

    #lnavNoIcon li.sitelist a {
    }
    #lnavNoIcon li.sitelist a:hover,
    #lnavNoIcon li.sitelist.crr a {
    }
    
    #lnavNoIcon li.current a {
    }
    #lnavNoIcon li.current a:hover,
    #lnavNoIcon li.current.crr a {
    }
    #lnavNoIcon li.history a {
	}
    #lnavNoIcon li.history a:hover,
    #lnavNoIcon li.history.crr a {
    }
    #lnavNoIcon li.valhist a {
    }
    #lnavNoIcon li.valhist a:hover,
    #lnavNoIcon li.valhist.crr a {
    }
    #lnavNoIcon li.statehist a {
    }
    #lnavNoIcon li.statehist a:hover,
    #lnavNoIcon li.statehist.crr a {
    }
    #lnavNoIcon li.state a {
    }
    #lnavNoIcon li.state a:hover,
    #lnavNoIcon li.state.crr a {
    }
    #lnavNoIcon li.graph a {
    }
    #lnavNoIcon li.graph a:hover,
    #lnavNoIcon li.graph.crr a {
    }
    #lnavNoIcon li.remote a {
    }
    #lnavNoIcon li.remote a:hover,
    #lnavNoIcon li.remote.crr a {
    }
    #lnavNoIcon li.terminal a {
    }
    #lnavNoIcon li.terminal a:hover,
    #lnavNoIcon li.terminal.crr a {
    }

    #lnavNoIcon li.setting a {
    }
    #lnavNoIcon li.setting a:hover,
    #lnavNoIcon li.setting.crr a {
    }

    #lnavNoIcon li.facility_setting a {
    }
    #lnavNoIcon li.facility_setting a:hover,
    #lnavNoIcon li.facility_setting.crr a {
    }
  	/* 20170218 SAYURI KADO　追加  */
    #lnavNoIcon li.warning a {
    }
    #lnavNoIcon li.warning a:hover,
    #lnavNoIcon li.warning.crr a {
    }
    
    #lnavNoIcon li.csv a {
    }
    #lnavNoIcon li.csv a:hover,
    #lnavNoIcon li.csv.crr a {
    }
    
    #lnavNoIcon li.dgraph a {
    }
    #lnavNoIcon li.dgraph a:hover,
    #lnavNoIcon li.dgraph.crr a {
    }

    #lnavNoIcon li.remote a {
    }
    #lnavNoIcon li.remote a:hover,
    #lnavNoIcon li.remote.crr a {
    }
    
    #lnavNoIcon li.portal a {
    }
    #lnavNoIcon li.portal a:hover,
    #lnavNoIcon li.portal.crr a {
    }
    
/************************************************

	popup

*************************************************/
.popup {
    display: none;
    position: relative;
    width: 100%;
    /*height: 100%;*/
}
    .popup .popup-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 120%;
        background-color: rgba( 255,255,255, 0.0 );
    }

.popup-content {
	height: 85%;
	margin: 0;
	background: #fff;
	position: fixed;
	z-index: 10001;
	box-sizing: border-box;
}
.popup-content-inner-box {
	height: 100%;
    overflow: hidden;
    padding: 20px;
	box-sizing: border-box;
}
.popup-content-inner {
	height: 95%;
	overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.popup-close-btn {
	display: block;
	position: absolute;
	top: 20px;
	right: 20px;
	cursor: pointer;
	overflow: visible;
}



/************************************************

	List

*************************************************/
.li_none01 li {
	margin: 0 0 5px 0;
}

.li_disc01 li {
	list-style: disc;
	margin: 0 0 5px 18px;
}

.li_circle01 li {
	list-style: circle;
	margin: 0 0 5px 18px;
}

.li_decimal01 li {
	list-style: decimal;
	margin: 0 0 5px 20px;
}

	.li_decimal01 li ol {
		margin: 5px 0 0 0;
	}

.li_float01 li {
    float: left;
    margin: 0 20px 0 0;
}
.li_float01 li:last-child {
     margin: 0;
}


/************************************************

	Box

*************************************************/
section {
	margin-bottom: 30px;
}

.inner {
	margin: 18px;
}

.inner02 {
	margin: 8px 18px;
}
	



/************************************************

	Title

*************************************************/
.h2_ttl01 {
	padding: 10px 18px;
    font-size: 180%;
    color: #38B7AA;
}
.h2_ttl02 {
    font-size: 180%;
}


/************************************************

	accordion

*************************************************/
.btn_accordion01 {
    width: 40px;
    height: 23px;
    position: relative;
    z-index: 10;
    background: #FFF url(../images/ico/ico_arrow_t01.png) no-repeat center;
    margin: -23px auto -1px;
    border-top: 1px solid #B6C0C1;
    border-left: 1px solid #B6C0C1;
    border-right: 1px solid #B6C0C1;
    border-radius: 5px 5px 0 0;
    cursor: pointer;
}
.btn_accordion01.selected {
    background: #FFF url(../images/ico/ico_arrow_b01.png) no-repeat center;
}


/************************************************

	Btn

*************************************************/
.btn01 {
    background: -moz-linear-gradient(top, #FFF, #E2E2E2);
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E2E2E2));
    background: -ms-linear-gradient(top, #FFF 0%, #E2E2E2 100%); 
    border: 1px solid #AAA;
    border-radius: 5px;
    padding: 3px 10px 2px;
    color: #333;
}

.btn02 {
    display: inline-block;
    box-sizing: border-box;
    box-shadow: inset 0px 2px 1px 0px #57C2B7;
    background: -moz-linear-gradient(top, #41BAAE, #2CA899);
    background: -webkit-gradient(linear, left top, left bottom, from(#41BAAE), to(#2CA899));
    background: -ms-linear-gradient(top, #41BAAE 0%, #2CA899 100%); 
    border: 1px solid #207E7D;
    border-radius: 6px;
    padding: 6px 20px;
    text-align: center;
    cursor: pointer;
    outline: none;
    color: #FFF;
    font-weight: bold;
    font-size: 110%;
}
.btn01:hover,
.btn02:hover {
    opacity: 0.8;
}

.indication_btn01 li {
    width: 40px;
    float: left;
}
.indication_btn02 li {
    width: 115px;
    float: left;
}
    .indication_btn01 li a {
        display: block;
        background: #D5E1E2;
        padding: 15px 0;
        box-shadow: inset 0 -1px 2px -1px #999;
    }
    .indication_btn02 li a {
        display: block;
        background: #D5E1E2;
        padding: 4px 0;
        box-shadow: inset 0 -1px 2px -1px #999;
        text-align: center;
        font-weight: bold;
        font-size: 120%;
        color: #666;
    }
    .indication_btn01 li:first-child a,
    .indication_btn02 li:first-child a {
        border-top: 1px solid #CDD7D7;
        border-left: 1px solid #CDD7D7;
        border-bottom: 1px solid #CDD7D7;
        border-radius: 5px 0 0 5px;
    }
    .indication_btn01 li:last-child a,
    .indication_btn02 li:last-child a {
        border-top: 1px solid #CDD7D7;
        border-right: 1px solid #CDD7D7;
        border-bottom: 1px solid #CDD7D7;
        border-radius: 0 5px 5px 0;   
    }
    .indication_btn01 li.place a {
        background: #D5E1E2 url(../images/ico/ico_place01.png) no-repeat center;
    }
    .indication_btn01 li.list a {
        background: #D5E1E2 url(../images/ico/ico_list01.png) no-repeat center;
    }
    .indication_btn01 li a:hover,
    .indication_btn01 li.crr a,
    .indication_btn02 li a:hover,
    .indication_btn02 li.crr a {
        background: #308F8E;
        box-shadow: inset 3px 3px 6px #156662;
    }
    .indication_btn02 li a:hover,
    .indication_btn02 li.crr a {
        color: #FFF;
    }
    .indication_btn01 li:first-child a:hover,
    .indication_btn01 li.crr:first-child a,
    .indication_btn02 li:first-child a:hover,
    .indication_btn02 li.crr:first-child a {
        border-top: 1px solid #1D7A75;
        border-left: 1px solid #1D7A75;
        border-bottom: 1px solid #1D7A75;
    }
    .indication_btn01 li:last-child a:hover,
    .indication_btn01 li.crr:last-child a,
    .indication_btn02 li:last-child a:hover,
    .indication_btn02 li.crr:last-child a {
        border-top: 1px solid #1D7A75;
        border-right: 1px solid #1D7A75;
        border-bottom: 1px solid #1D7A75;
    }
    .indication_btn01 li.place a:hover,
    .indication_btn01 li.place.crr a {
        background: #308F8E url(../images/ico/ico_place02.png) no-repeat center;
    }
    .indication_btn01 li.list a:hover,
    .indication_btn01 li.list.crr a {
        background: #308F8E url(../images/ico/ico_list02.png) no-repeat center;
    }


/************************************************

	table

************************************************/
.table01 {
	border-top: 1px solid #B6C0C1;
	width: 100%;		/* SAYURI KADO モチE��対応中 20170126 */
}
	.table01 th,
	.table01 td {
	white-space: nowrap;
		padding: 10px;
		/*text-align: center;*/
		vertical-align: middle;
	}
	.table01 th {
	white-space: nowrap;
		background: #B6E0E3;
		border-bottom: 1px solid #B6C0C1;
        font-weight: normal;
	}
    .table01 td {
		background: #FFF;
	}

.zebra tbody tr:nth-child(odd) td {
    background: #F5F5F5;
}

.attention td {
    background: #FFFAB8 !important;
}
    .attention td .ico {
        background: #FFB80C;
        border-radius: 5px;
        padding: 3px 10px 2px;
        font-size: 90%;
    }
.warning td {
    background: #FFDCE0 !important;
    color: #F5485A !important;
}
.warning td .ico {
    background: #F5485A;
    border-radius: 5px;
    padding: 3px 10px 2px;
    font-size: 90%;
    color: #FFF;
}
.validoff td {
	background: #c3c7c7 !important;
}

div.scroll_div { 
    overflow: auto;
    width: 100%;
}


/************************************************

	text

*************************************************/
.cpt {
	text-align: center;
	font-size: 85%;
}

.must {
	color: #F00;
	font-weight: bold;
}

.notes {
	padding-left: 1em;
	text-indent: -1em;
	font-size: 90%;
	color: #999;
}


/************************************************

	border

*************************************************/
.border_top01 {
	border-top: 1px solid #CCC;
	padding-top: 10px;
}


/************************************************

	img

*************************************************/
figure {
	margin: 0;
}

.pht01 {
	padding: 4px;
	border: 1px solid #CCC;
}

.img_mid {
	vertical-align: middle;
}


/************************************************

	form

*************************************************/
input[type="button"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="submit"],
textarea {
   -webkit-appearance: none;
   border-radius: 5px;
}

input[type="text"],
input[type="email"],
input[type="password"],
select,
textarea {
	padding: 5px;
	font-size: 100%;
	font-family: 'メイリオ',Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "�E��E� �E�ゴシチE��", "MS PGothic", sans-serif;
	border: 1px solid #AAA;
}
	::-webkit-input-placeholder {
		color: #999;
	}
	::-moz-placeholder {
		color: #999;
		opacity: 1.0;
	}
	:-moz-placeholder {
		color: #999;
	}

input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    box-shadow: inset 1px 1px 2px #CCC;
}

input[type="text"].w100,
textarea.w100 {
	width: 97%;
}

input[type="text"].w50,
textarea.w100 {
	width: 50%;
}

input[type="text"].w30 {
	width: 30%;
}

input[type="radio"],
input[type="checkbox"] {
	margin: 2px;
}

.check01,
.radio01 {
    position: relative;
    /*display: inline-block;*/
}
    .check01 input,
    .radio01 input {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        margin: 0;
        width: 100%;  
        height: 100%;
    }
    .check01 input[type="checkbox"] + label,
    .radio01 input[type="radio"] + label {
        display: block;
        background-position: left center;
        background-repeat: no-repeat;
        padding: 3px 0 0 25px;
    }
    .check01 input[type="checkbox"] + label {
        background-image: url(../images/ico/ico_check01_off.png);
    }
    .radio01 input[type="radio"] + label {
        background-image: url(../images/ico/ico_radio01_off.png);
    }
    .check01 input[type="checkbox"]:checked + label {
        background-image: url(../images/ico/ico_check01_on.png);
    }
    .radio01 input[type="radio"]:checked + label {
        background-image: url(../images/ico/ico_radio01_on.png);
    }

select::-ms-expand {
	display: none;
}
select {
	padding: 5px 30px 5px 5px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #AAA;
    border-radius: 5px;
	background: #eee;
	background: url(../images/ico/ico_arrow_b02.png) 96% 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#DDD 100%);
	background: url(../images/ico/ico_arrow_b02.png) 96% 50% no-repeat, linear-gradient(to bottom, #fff 0%,#DDD 100%);
}
    select option {
        background: #FFF;
    }

.easy-select-box {
    background: url(../images/ico/ico_arrow_b02.png) 96% 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#DDD 100%);
    background: url(../images/ico/ico_arrow_b02.png) 96% 50% no-repeat, linear-gradient(to bottom, #fff 0%,#DDD 100%);
    border: 1px solid #AAA;
    border-radius: 5px;
    padding: 5px 30px 5px 5px;
    cursor: default;
}
.easy-select-box.focused {
    background: url(../images/ico/ico_arrow_b03.png) 96% 50% no-repeat, -webkit-linear-gradient(top, #fff 0%,#DDD 100%);
    background: url(../images/ico/ico_arrow_b03.png) 96% 50% no-repeat, linear-gradient(to bottom, #fff 0%,#DDD 100%);
}
    .easy-select-box .esb-dropdown {
        background: #FFF;
        border-radius: 5px;
        box-shadow: 0 0 5px #555;
        display: none;
        overflow: auto;
        position: absolute;
        z-index: 100;
        min-width: 220px;
        margin: 10px 0 0 -5px;
    }
    .easy-select-box .esb-item {
        padding: 10px;
        border-bottom: 1px solid #CCC;
        cursor: default;
    }
    .easy-select-box .esb-item:last-child {
        border-bottom: none;
    }
    .easy-select-box .esb-item:hover {
        background: #D7F1EE;
    }

.datepicker {
    background: url(../images/ico/ico_calendar01.png) no-repeat 96% 50%;
    font-size: 105% !important;
}

.btn_input01 {
    width: 100%;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 130%;
    box-shadow: inset 0px 2px 1px 0px #57C2B7, 0px 2px 3px #999;
    background: -moz-linear-gradient(top, #41BAAE, #2CA899);
    background: -webkit-gradient(linear, left top, left bottom, from(#41BAAE), to(#2CA899));
    background: -ms-linear-gradient(top, #41BAAE 0%, #2CA899 100%); 
    border: 1px solid #2EA79B;
    border-radius: 6px;
    padding: 13px 7px 10px;
    text-align: center;
    cursor: pointer;
    outline: none;
    color: #FFF;
}
.btn_input02 {
    box-sizing: border-box;
    box-shadow: inset 0px 2px 1px 0px #57C2B7;
    background: -moz-linear-gradient(top, #41BAAE, #2CA899);
    background: -webkit-gradient(linear, left top, left bottom, from(#41BAAE), to(#2CA899));
    background: -ms-linear-gradient(top, #41BAAE 0%, #2CA899 100%); 
    border: 1px solid #207E7D;
    border-radius: 6px;
    padding: 6px 20px;
    text-align: center;
    cursor: pointer;
    outline: none;
    color: #FFF;
    font-weight: bold;
    font-size: 110%;
}
.btn_input01:hover,
.btn_input02:hover {
    opacity: 0.8;
}




/************************************************

	Margin Padding

*************************************************/
.m_auto {margin: 0 auto;}
.m10 {margin: 10px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}
.mt5 {margin-top: 5px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.ml5 {margin-left: 5px !important;}
.ml10 {margin-left: 10px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.ml30 {margin-left: 30px !important;}
.ml40 {margin-left: 40px !important;}
.mr5 {margin-right: 5px !important;}
.mr10 {margin-right: 10px !important;}
.mr20 {margin-right: 20px !important;}
.mr30 {margin-right: 30px !important;}
.p10 {padding: 10px !important;}
.p20 {padding: 20px !important;}
.pt10 {padding-top: 10px !important;}
.pb10 {padding-bottom: 10px !important;}
.pl40 {padding-left: 40px !important;}

/************************************************

	Width

*************************************************/
.w40 {width: 40px;}
.w50 {width: 50px;}
.w60 {width: 60px;}
.w80 {width: 80px;}
.w100 {width: 100px;}
.w150 {width: 150px;}
.w200 {width: 200px;}
.w220 {width: 220px;}
.w300 {width: 300px;}
.w350 {width: 350px;}
.w450 {width: 450px;}
.w700 {width: 700px;}
.w750 {width: 750px;}
.w_full { 
	width: 100%;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
	box-sizing: border-box;
}


/************************************************

	Float Align

*************************************************/
.f_left {float: left;}
.f_right {float: right;}

.center {text-align: center !important;}
.left {text-align: left !important;}
.right {text-align: right !important;}


/************************************************

	clearfix

*************************************************/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.displayNone {
	display: none;
}

.initDisplayNone {
	display: none;
}

.preFont  {
	font-family: 'メイリオ', Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.5;
	color: #333;
	-webkit-text-size-adjust: none;
}

.preFontNoneColor  {
	font-family: 'メイリオ', Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1.5;
	-webkit-text-size-adjust: none;
}

.menuPre  {
	font-family: 'メイリオ', Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	overflow: visible;
	margin:0;
	-webkit-text-size-adjust: none;
}
