/* ==========================================================================
   Public 2018-12-17
============================================================================= */
@import url('https://use.fontawesome.com/releases/v5.0.13/css/all.css');
body, html { width:100%; height:100%; }

body { 
	font:13px/1.5 Verdana, Meiryo, "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", sans-serif;
	letter-spacing:0.06em;
	color:#222;
    background: #009e93; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #009e93 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#009e93 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, #ffffff 0%,#009e93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#009e93',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

img {
	border:none;
	vertical-align:middle;
}


*, *:after, *:before {
  -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
          box-sizing:border-box;
}


a {
	color:#FFF;
	text-decoration:none;
}
a:hover { color:#FAFF63; }


.clearfix {
    clear: both;
    display: table;
}


#login {
	position: relative;
    top:50%;
    transform:translateY(30%);
	margin:0 auto;
	width:550px;
	color:#FFF;
	background:#5799a0;
	border-radius:10px;
	padding:30px 60px;
	text-align:center;
}

#login input {
	width:100%;
	font-size:15px;
	color:#333;
	background:#FFF;
	border-radius:6px;
	border:#FFF 1px solid;
	-webkit-box-shadow: inset 1px 1px 6px rgba(133,133,133,0.54);
    -moz-box-shadow: inset 1px 1px 6px rgba(133,133,133,0.54);
    box-shadow: inset 1px 1px 6px rgba(133,133,133,0.54);
	padding:15px;
	margin-bottom:20px;
}

.p_line {
	width:100%;
	height:1px;
	border-bottom:#ddd 1px dashed;
	margin:20px 0;
}




/* btn
----------------------------------------------------------------------------- */
.btn_r, .btn_g {
	display:inline-block;	
	border-radius:8px;	
	padding:10px 20px;
	margin: 0 5px;
}
.btn_r i, .btn_g i { padding-right:5px; }

.btn_r {
	font-size:16px;
	color:#FFF;
    background: #ff5659; /* Old browsers */
    background: -moz-linear-gradient(top, #ff5659 0%, #a5359c 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ff5659 0%,#a5359c 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ff5659 0%,#a5359c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5659', endColorstr='#a5359c',GradientType=0 ); /* IE6-9 */
}

.btn_g {
	font-size:16px;
	color:#FFF;
    background: #42c4b5; /* Old browsers */
    background: -moz-linear-gradient(top, #42c4b5 0%, #3f78c1 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #42c4b5 0%,#3f78c1 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #42c4b5 0%,#3f78c1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42c4b5', endColorstr='#3f78c1',GradientType=0 ); /* IE6-9 */
}

.btn_r:hover { color:#FFF500; }
.btn_g:hover { color:#00FFAB; }