@charset "utf-8";

/* theme color
	yellow: #dcbd23, hsv(50,84,86) / light : #ebca26, hsv(50,84,92)
	red : #c82506, hsv(10,97,78) / light : #e62c07, hsv(10,97,90)
*/

/** login **/

#container.page-login {}

#container.page-login > .container-body {
	/*
	background:#dcbd23; 
	background:rgba(220,189,35,.75);
	*/
	padding: 15px;
}

#container.page-login > .container-body {	
	position:absolute;
	top:35%;
	margin-top:-140px;
	left:50%;
	width: 300px;
	margin-left:-150px;
	min-height:0;
}

#container.page-login #sns-login {
	font-size:32px;
	margin:30px 0;
}

@media (max-width:768px) {
	#container.page-login > .container-body {
		background:none;
	}
}

@media (max-width:300px) {
	#container.page-login > .container-body {
		left:0;
		margin-left:0;
		width:100%;
	}
}

/*
#container.page-login .alert p {
	font-size:12px;
	line-height:16px;
}
*/

#container.page-login .errorlist,
#container.page-login .alert {
	font-size:12px;
	line-height:16px;
	width:200px;
	margin:0 auto;

}
/** form **/

#container.page-login {
	text-align:center;
}

#container.page-login form {
	margin-top:3em;
}

#container.page-login .alert {
	text-align:left;
	margin:1em 0;
}

/*
#container.page-login .alert,
#container.page-login .err_msg {
	text-align:left;
	margin-bottom:10px;
	margin-top:4px;
	padding:8px;
}

#container.page-login ul.errorlist li {
	text-align:left;
	color:#b94a48;
	background-color:#f2dede;
	border-color:#eed3d7;
	padding:8px;
}

#container.page-login .errorlist {
	width:218px;
	display:block;
}

#container.page-login .errorlist,
#container.page-login .error_msg {
	margin-top:-9px;
	margin-bottom:9px;
}

#container.page-login .alert > p:last-child {
	margin-bottom:0;
}
*/

#container.page-login dt {
	display:none;
}
#container.page-login dd {
	margin-left:0;
}

#container.page-login .btn,
#container.page-login input,
#container.page-login button,
#container.page-login .alert {
	width:100%;
}

/*
#container.page-login .btn,
#container.page-login input[type="submit"],
#container.page-login .errorlist, #container.page-login .alert {
	width:220px;
}
#container.page-login form[name="f1"] input[type="submit"] {
	margin-top:-20px;
}

#container.page-login {
	max-width: none;
}

#container.page-login label { color:inherit; }
*/

@media (max-width:768px) {
	/* #container.page-login label { text-shadow:0 0 15px rgba(0,0,0,0.7), 0 0 15px rgba(0,0,0,0.7); } */
	/*
	#container.page-login input[type="submit"] {
		background:#ebca26 !important;
		color:black;
	}
	*/
}

/*
#container.page-login a {
	color:inherit;
}
*/

/*
#container.page-login a.btn {
	color:black;
	text-shadow:none;
	background-image:none;
}
*/

.fa-twitter { color:#55acee; }
.fa-facebook-square, .fa-facebook { color:#3b5998; }

#container.page-login input:focus { outline:none; -webkit-box-shadow:none; box-shadow:none; border-color:#444; }

#container.page-login #password-reminder {
	margin-top:20px;
}

/******************************/

/*
#container > .container-body { padding-top:15px; }
#page-body { padding-top:0; }

.menu-item ul.nav-list li.active,
.nav-list .active > a,
.nav-list .active > a:hover {
	background:transparent;
	color:black;
}

#page-menu { position:relative; }
#page-menu-mask {
	position:absolute;
	top:0;
	right:0;
	left:0;
	bottom:0;
	background:
	white;-moz-opacity:0.5;
	opacity:0.5;"
}

*/

.sp-info { font-size:85%; line-height:1.4em; }
#content-main .sp-info > p { margin:8px 0; }

/** sp guide **/
.webformat-guide-step { margin-top:20px; margin-bottom:20px; }
.webformat-guide-step * {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.webformat-guide-step:after {
	content: '.';
	position:relative;
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
}

.webformat-guide-step > img:first-child {
	display:block;
	position:relative;
	float:left;
	width:300px;
	margin-right:-300px;
}

.webformat-guide-step > ul { 
	display:block;
	padding-left:320px;
	margin-left:0;
	float:left;
	list-style:none;
}

.webformat-guide-step > ul > li {
	vertical-align:middle;
	line-height:1.5em;
	
	position:relative;
	clear:left;
}

.webformat-guide-step > ul > li + li {
	margin-top:8px;
}

/*
.webformat-guide-step > ul > li > span.guide-num {
	text-align:center;
	font-size:1em;
	border:1px solid black;
	
	display:block;
	
	position:relative;
	width:1.2em;
	height:1.2em;
	line-height:1.2em;
	
	float:left;
	margin-right:-1.2em;
}

.webformat-guide-step > ul > li > span.guide-body {
	display:block;
	
	position:relative;
	float:left;
	display:block;
	
	width:100%;
	padding-left:2em;
}
*/

.webformat-guide-step > ul > li {
	padding-left:1.5em;
	text-indent:-1.5em;
}

.webformat-guide-step > ul > li > span.guide-num {}

.webformat-guide-step > ul > li > span.guide-num:after {
	content:')';
}

.webformat-guide-step > ul > li:after {
	content: '.';
	position:relative;
	display:block;
	clear:both;
	visibility:hidden;
	height:0;
}

@media (max-width:767px) {
	.webformat-guide-step > img:first-child,
	.webformat-guide-step > ul {
		float:none;
		width:auto;
		margin:0;
		padding:0;
	}
	.webformat-guide-step > img:first-child {
		max-width:98%;
		display:block;
	}
	.webformat-guide-step > ul {
		margin-top:15px;
	}
	
}

/***** menu *********/

#page-menu #dino-index-profile-img { width:64px; height:auto; }

/*
#page-menu .menu-item a {
	display:block;
	padding: 5px 0;
	line-height:1.5em;
	color:#666;
}
#page-menu .menu-item a > .fa,
#page-menu .menu-item a > span {
	display:inline-block;
	vertical-align:middle;
}
#page-menu .menu-item a > .fa {
	vertical-align:middle;
	font-size:1.5em;
	margin-right:0.25em;
}

.page-index #page-menu .menu-item a {
	display:inline-block;
	vertical-align:top;
	text-align:center;
	padding:15px;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
	
	width:100%;
	
	text-decoration:none;
	color:#666;
}

.page-index #page-menu .menu-item a > .fa-fw {
	width:auto;
	margin-right:0;
}

.page-index #page-menu .menu-item a:hover,
.page-index #page-menu .menu-item a.active {
	color:black;
}

#page-menu .menu-item a:first-child {
	padding-top:0;
	width:100%;
}
*/

.page-index > .container-body { padding:0; }

.page-index #page-menu {
	display:block;
	margin:0 auto;
}

.page-index #page-menu .menu-item > .nav-list {
	display:inline;
}
.page-index #page-menu .menu-item > .nav-list > li:not(.divider) {
	display:inline-block;
	vertical-align:top;
	text-align:center;
	padding:15px;
	width:160px;
	margin:0;
}
.page-index #page-menu .menu-item > .nav-list > li > a {
	
}
.page-index #page-menu .menu-item > .nav-list-ops > li:first-child {
	width:100%;
}

.page-index #page-menu .menu-item a {
	display:inline-block;
	text-decoration:none;
	background:none;
	border:none;
}
.page-index #page-menu .menu-item a:hover {
	box-shadow:none;
	background:#eee;
}


.page-index #page-menu .menu-item a > .fa:first-child {
	font-size:32px;
	display:block;
	margin:10px auto;
}

@media (max-width:767px) {
	#page-menu .menu-item > .av-list > li:first-child {
		width:100% !important;
	}
	.page-index #page-menu .menu-item > .nav-list-ops > li:not(.divider):not(:first-child),
	.page-index #page-menu .menu-item > .nav-list:not(.nav-list-ops) > li:not(.divider) {
		width:50% !important;
		display:inline-block;
	}
	#page-menu .menu-item { border-bottom:none; }
}

.page-index #page-menu {
	width:100%;
	max-width:640px;
	margin-left:auto;
	margin-right:auto;
	float:none;
	display:block;
}

.page-index #content-main {
	display:none;
}

.page-index #page-menu .menu-item a {
	width:100%;
}

.page-index #page-menu .menu-item a > .fa:first-child {
	font-size:64px;
}

.page-index #page-menu .nav-list-ops > li:first-child > a {
	width:100%;
}

.page-index #page-menu .nav-list:last-child:after {
	content:'';
	display:inline-block;
	width:160px;
	height:10px;
}



.page-index #page-menu .nav-list > li.divider {
	display:none;
}

/* menu */
#page-menu-home {
	display:none;
}

@media (max-width:767px) {
	#page-menu-home { display:block; }
	#page-menu { display:none; }
	.page-index #page-menu { display:block; }
	.page-index #page-menu-home { display:none; }
}


/* */
#dino-header {
	display:flex;
	justify-content:space-between;
}

#dino-header > * {
	margin:10px; /* .container-body */
}


