@charset "UTF-8";

/* ================================================ */

/* RESET */
/*
YUI 3.16.0 (build 76f0e08)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/

cssreset-min.css 一部改変 */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;font-size:100%}legend{color:#000}

/* ================================================ */

/* CLEAR */
.clr_box{clear:both;}
.clr_both{clear:both;font-size:2px;line-height:1}
.clr{clear:both;overflow:hidden;width:1px;height:1px;margin:0-1px-1px0;border:0;padding:0;font-size:0;line-height:0;}

.clearfix:after{visibility:hidden;display:block;font-size:0;content:"";clear:both;height:0;}
*html.clearfix{zoom:1;} /* IE6 */
*:first-child+html.clearfix{zoom:1;} /* IE7 */

/* ================================================ */

/* ICON */
@font-face {
	font-family: 'bindcloud';
	src:url('fonts/bindcloud.eot?7lhupl');
	src:url('fonts/bindcloud.eot?#iefix7lhupl') format('embedded-opentype'),
		url('fonts/bindcloud.woff?7lhupl') format('woff'),
		url('fonts/bindcloud.ttf?7lhupl') format('truetype'),
		url('fonts/bindcloud.svg?7lhupl#bindcloud') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*
STYLE
	font-family: 'bindcloud';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

CODE
	bindcloud		\e600
	setting			\e601
	up				\e602
	pc				\e603
	info			\e604
	notice			\e605
	help			\e606
	mail			\e607
	search			\e608
	pencil			\e609
	login			\e60a
	logout			\e60b
	circle			\e60c
	cross			\e60d
	plus			\e60e
	minus			\e60f
	arrow_left		\e610
	arrow_right		\e611
	arrow_up		\e612
	arrow_down		\e613
	arrow_left2		\e614
	arrow_right2	\e615
	arrow_up2		\e616
	arrow_down2		\e617
*/

/* ================================================ */

/*
FONT SIZE
	 6px	0.500em	50.00%
	 7px	0.583em	58.30%
	 8px	0.667em	66.70%
	 9px	0.750em	75.00%
	10px	0.833em	83.30%
	11px	0.917em	91.70%
	12px	1.000em	100.00%
	13px	1.083em	108.30%
	14px	1.167em	116.70%
	15px	1.250em	125.00%
	16px	1.333em	133.30%
	17px	1.417em	141.70%
	18px	1.500em	150.00%
	19px	1.583em	158.30%
	20px	1.667em	166.70%
	21px	1.750em	175.00%
	22px	1.833em	183.30%
	23px	1.917em	191.70%
	24px	2.000em	200.00%
*/

/* ================================================ */

html {
	background: #444 url(../img/bg.gif) fixed;
}
body {
	font-family: Helvetica,"Hiragino Kaku Gothic Pro","Meiryo","Yu Gothic",sans-serif;
	font-size: 12px;
	line-height: 1.8;
	color: #333;
}
a {
	/*color: #2daa96;*/
	color: #18a790;
	text-decoration: none;
	transition: all .3s ease-out;
}
a:visited,
a:focus,
a:hover {
	text-decoration: underline;
}
img {
	vertical-align: middle;
}
strong {
	font-weight: bold;
}
em {
	color: #c00;
	font-weight: bold;
}
sup {
	vertical-align: top;
	line-height: 1;
}
sub {
	vertical-align: bottom;
	line-height: 1;
}
small {
	font-size: .917em;
}

/* ================================================ */

#betaVer {
	padding: 4px 16px 3px;
	background-color: #ffd;
	text-align: center;
	box-shadow: inset 0 -1px 2px rgba(0,0,0,.2);
}

#head-area {
	position: relative;
	background-color: #222;
	padding-left: 16px;
	height: 48px;
	line-height: 48px;
	-webkit-font-smoothing: subpixel-antialiased;
}
#head-area > p:first-child {
	float: left;
}
#head-area2 {
	position: relative;
	background-color: #222;
	padding-left: 16px;
	height: 48px;
	line-height: 48px;
	-webkit-font-smoothing: subpixel-antialiased;
}
#head-area2 > p:first-child {
	float: left;
}

/* ロゴ */
#head-area > p:first-child {
	height: 48px;
	background: url(../img/head_logo.png) left center no-repeat;
}
/* ロゴ */
#head-area2 > p:first-child {
	height: 48px;
	background: url(../img/head_logo_codex.png) left center no-repeat;
}

/*#head-area > p:first-child:before {
	content: "BiND Cloud";
	font-size: 24px;
	color: #fff;
}*/
#head-area > p:first-child:after {
	content: "control panel";
	margin-left: 162px;
	padding: 4px 8px;
	font-size: 14px;
	color: #ccc;
	letter-spacing: 1px;
	border: 1px solid #444;
	border-radius: 2px;
}
#head-area2 > p:first-child:after {
	content: "control panel";
	margin-left: 162px;
	padding: 4px 8px;
	font-size: 14px;
	color: #ccc;
	letter-spacing: 1px;
	border: 1px solid #444;
	border-radius: 2px;
}
#head-area > p:first-child > img {
	display: none;
}
#head-area2 > p:first-child > img {
	display: none;
}
#head-area #logout-button,
#head-area #launch-button {
	float: right;
	border-left: 1px solid #111;
}
#head-area #logout-button a,
#head-area #launch-button a {
	display: inline-block;
	padding: 0 1.5em;
	border-left: 1px solid #333;
	color: #fff;
	text-align: center;
	text-decoration: none;
}
#head-area #logout-button a:hover,
#head-area #logout-button a:focus,
#head-area #logout-button a:active {
	background-color: #111;
}
#head-area #logout-button a:before {
	/* icon */
	content: "\e60b";
	font-family: 'bindcloud';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	padding-right: 4px;
	font-size: 1.2em;
	color: #bbb;
	vertical-align: -1px;
}
#head-area #launch-button a {
	border-radius: 1px;
	text-shadow: 0 -1px rgba(0,0,0,.2);

	/* IE8 */
	background: #2DAA96;

	/* modern */
	background: -webkit-linear-gradient(rgba(45,170,150,0) 0%,rgba(20,145,125,1) 100%);
	background: linear-gradient(rgba(45,170,150,0) 0%,rgba(20,145,125,1) 100%);
	background-color: rgba(45,170,150,1);
}
#head-area #launch-button a:hover,
#head-area #launch-button a:focus,
#head-area #launch-button a:active {
	text-shadow: none;

	/* IE8 */
	background: #14917D;

	/* modern */
	background: rgba(0,119,99,1);
}
#head-area #launch-button a:before {
	/* icon */
	content: "\e600";
	font-family: 'bindcloud';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	padding-right: 4px;
	font-size: 1.2em;
	vertical-align: -1px;
}

/* ================================================ */

#login-area {
	margin-bottom: 32px;
	padding: 8px 16px;
	background: #444;
	background: -webkit-linear-gradient(#555 0%,#444 100%);
	background: linear-gradient(#555 0%,#444 100%);
	box-shadow: 0 0 4px rgba(0,0,0,.8), 0 1px 1px rgba(0,0,0,.2) inset;
	line-height: 24px;
	text-shadow: 1px 1px rgba(0,0,0,.6);
	color: #fff;
	-webkit-font-smoothing: subpixel-antialiased;
}
#login {
	margin-right: 8px;
}
#login-area #manual,
#login-area #user-info,
#login-area #login {
	float: right;
}

#login-area #manual img {
	display: none;
}
#login-area #manual a {
	display: block;
	margin-top: -1px;
	padding: 6px 5px 4px;
	width: 14px;
	height: 14px;
	border-radius: 12px;
	background-color: #888;
	box-shadow: 0 0 3px rgba(0,0,0,.6) inset;
	line-height: 14px;
	font-size: 14px;
	line-height: 12px;
	text-align: center;
	text-shadow: none;
	color: #fff;
}
#login-area #manual a:hover,
#login-area #manual a:focus,
#login-area #manual a:active {
	background-color: #444;
	box-shadow: none;
	text-decoration: none;
}

#login-area #user-info a {
	display: block;
	margin-top: -1px;
	padding: 6px 5px 4px;
	width: 14px;
	height: 14px;
	border-radius: 12px;
	background-color: #888;
	box-shadow: 0 0 3px rgba(0,0,0,.6) inset;
	line-height: 14px;
	font-size: 14px;
	line-height: 12px;
	text-align: center;
	text-shadow: none;
	color: #fff;
}
#login-area #user-info a:hover,
#login-area #user-info a:focus,
#login-area #user-info a:active {
	background-color: #444;
	box-shadow: none;
	text-decoration: none;
}
#login-area p {
	margin-left: 4px;
}


#login-area #manual a:before {
	content: "?";
}
#login-area #user-info a:before {
	font-family: 'bindcloud';
	content: "\e601";
}
#backtotoppage {
	float:left;
}
#backtotoppage a {
	display: inline-block;
	margin-top: -1px;
	margin-right: 8px;
	padding: 7px 12px 5px;
	height: 12px;
	border-radius: 12px;
	background-color: #888;
	box-shadow: 0 0 3px rgba(0,0,0,.6) inset;
	font-size: 12px;
	line-height: 12px;
	text-shadow: none;
	color: #fff;
}
#backtotoppage a:hover,
#backtotoppage a:focus,
#backtotoppage a:active {
	background-color: #444;
	box-shadow: none;
	text-decoration: none;
}

/* ================================================ */

#copy {
	clear: both;
	margin: .5em auto;
	text-align: center;
}
#copy,
#copy font {
	color: #e0e0e0;
}
#copy:first-of-type {
	margin-top: 1.8em;
}
#copy:last-of-type {
	margin-bottom: 1.8em;
}

/* ================================================ */

a.button.btnSecondary {
	/* IE8 */
	border-right: 1px solid #004b7b;
	border-bottom: 1px solid #004b7b;
	background: #3597c7;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: -webkit-linear-gradient(rgba(53,151,199,0) 0%,rgba(28,126,174,1) 100%);
	background: linear-gradient(rgba(53,151,199,0) 0%,rgba(28,126,174,1) 100%);
	background-color: rgba(53,151,199,1);
}
a.button.btnSecondary:hover, a.button.btnSecondary:focus, a.button.btnSecondary:active {
	/* IE8 */
	border: 1px solid #004b7b;
	border-right: none;
	border-bottom: none;
	background: #1c7eAe;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: rgba(2,100,148,1);
}

a.button.btnWarning {
	/* IE8 */
	border-right: 1px solid #810000;
	border-bottom: 1px solid #810000;
	background: #cd4533;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: -webkit-linear-gradient(rgba(205,69,51,0) 0%,rgba(180,44,26,1) 100%);
	background: linear-gradient(rgba(205,69,51,0) 0%,rgba(180,44,26,1) 100%);
	background-color: rgba(205,69,51,1);
}
a.button.btnWarning:hover, a.button.btnWarning:focus, a.button.btnWarning:active {
	/* IE8 */
	border: 1px solid #810000;
	border-right: none;
	border-bottom: none;
	background: #b42c1a;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: rgba(154,18,0,1);
}

a.button.btnTertiary {
	/* IE8 */
	border-right: 1px solid #1a1a1a;
	border-bottom: 1px solid #1a1a1a;
	background: #666;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: -webkit-linear-gradient(rgba(102,102,102,0) 0%,rgba(77,77,77,1) 100%);
	background: linear-gradient(rgba(102,102,102,0) 0%,rgba(77,77,77,1) 100%);
	background-color: rgba(102,102,102,1);
}
a.button.btnTertiary:hover, a.button.btnTertiary:focus, a.button.btnTertiary:active {
	/* IE8 */
	border: 1px solid #1a1a1a;
	border-right: none;
	border-bottom: none;
	background: #4d4d4d;

	/* modern */
	border: 1px solid rgba(255,255,255,.3);
	background: rgba(51,51,51,1);
}

/* ================================================ */