@charset "utf-8";
html{
	font-size: 80%;
}
body{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 1rem;
	vertical-align: baseline;
	background: transparent;
	-webkit-text-size-adjust: 100%;
}
ul, li{
	margin: 0;
	padding: 0;
	list-style: none;
}

button,
input,
select,
textarea{
	line-height: normal;
	vertical-align: middle;
	text-transform: none;
}
input[type="text"],
input[type="email"],
input[type="password"],
textarea{
	padding: 0.2rem;
	font-size: 1.0rem;
	border: solid 1px #ccc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
button,
input[type="submit"]{
	border: solid 1px #999; 
	padding: 0.3rem 1rem; 
	font-size: 1.0rem;
	line-height: 1.5rem;
	text-transform: uppercase;
	font-weight: bold;
	color: #333;
	cursor: pointer;	
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px; 
	border-radius: 3px;
	background-color: #ddd;
	letter-spacing: 1px;
}
button:active,
input[type="submit"]:active{
	background-color: #eee;
}
button:hover,
input[type="submit"]:hover{
	background-color: #eee;
}
button:disabled,
input[type="submit"]:disabled{
	color: #aaa;
	cursor: default;
}

select{
	margin: 0;
	padding: 0.2rem;
	font-size: 1.0rem;
	border: solid 1px #ccc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}


.clearfix {
	*zoom: 1;
}
.clearfix:after {
	content: '';
	display: table;
	clear: both;
}

.fleft-group,
.fright-group{
	*zoom: 1;
	list-style: none;
}
.fleft-group:after,
.fright-group:after{
	content: '';
	display: table;
	clear: both;
}
.fleft,
.fleft-group > *{
	float: left;
}

.fright,
.fright-group > *{
	float: right;
}


.button-group-l a,
.button-group-m a,
.button-group-s a,
a.button-l,
a.button-m,
a.button-s{
	color: #000;
	display: block;
	text-decoration: none;
	background-color: #eee;
	background-color: #fff;
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	cursor: pointer;
	border: 1px solid #ddd;
	box-shadow: 0.2px 0.3px rgba(0, 0, 0, 0.2);
	outline: none;
	/*text-shadow:0 -1px rgba(0, 0, 0, 0.5);*/
}

.button-group-l span,
.button-group-m span,
.button-group-s span,
span.button-l,
span.button-m,
span.button-s{
	color: #555;
	display: block;
	text-decoration: none;
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
}

.button-group-l a:hover,
.button-group-m a:hover,
.button-group-s a:hover,
a.button-l:hover,
a.button-m:hover,
a.button-s:hover{
	/*background-color:#ccf0ff;*/
	background-color: #ffff55;
	color: #000;
}
.button-group-l a.active,
.button-group-m a.active,
.button-group-s a.active,
a.button-l.active,
a.button-m.active,
a.button-s.active{
	background-color: #ffff55;
}
.button-group-m a.disable{
	cursor: default;
	background-color: #f0f0f0;
}

.button-group-l a,
a.button-l,
.button-group-l span,
span.button-l{
	padding: 1.2rem;
	font-weight: bold;
	font-size: 1rem;
}
.button-group-m a,
a.button-m,
.button-group-m span,
span.button-m{
	padding: 0.5rem;
	font-size: 1rem;
}
.button-group-m select{
	border: 1px solid #ddd;
	color: #555;
	padding: 0.5rem;
	font-size: 1.1rem;
}

.button-group-s a,
a.button-s,
.button-group-s span,
span.button-s{
	padding: 0.2rem;
	font-size: 0.6rem;
}

a.button-l.button-none,
a.button-m.button-none,
a.button-s.button-none{
	background-color:#ffff55;
	color: #666666;
}

.button-group-l .label{
}
.button-group-m .label{
	padding: 0.5rem 0rem 0.5rem 0rem;
	font-size: 1rem;
}
.button-group-s .label{
}

.button-group-w a{
	padding-left: 1rem;
	padding-right: 1rem;
}
/*
.mobile-show .button-group-w a{
	padding-left: 0.7rem;
	padding-right: 0.7rem;
}*/

/* button red */
.red{
	background-color: #ea2b72 !important;
	border-color: #d6266b !important;
	color: #fff !important;
}
.red:hover{
	background-color: #ea6393 !important;
}


/* button white */
.white{
	background-color: #fff !important;
	border-colo: #ccc !important;
	color: #000 !important;
}
/* button gray */
.gray{
	background-color: #eee !important;
	border-colo: #ccc !important;
	color: #000 !important;
}
.gray:hover{
	background-color:#fafafa !important;
	color: #555 !important;
}


/* button blue */
.blue{
	background-color: #47b5db !important;
	border: 1px solid #3384a0 !important;
	color: #fff !important;
}
.blue:hover{
	background-color: #4fc6ef !important;
}


/* button green */
.green{
	background-color: #05b5a5 !important;
	border: 1px solid #029b8e !important;
	color: #fff !important;
}
.green:hover{
	background-color: #26ccbf !important;
}

.active.toggle{
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3) inset;
}

.checkbox-list li{
	padding-right: 2rem;
	padding-bottom: 0.5rem;
}
.checkbox-list input{
	margin-right: 0.5rem;
	vertical-align: middle;
}
.checkbox-list label{
}

hr{
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	margin-bottom: 1rem;
}

dl{
	margin: 0;
	padding: 0;
	padding-left: 1rem;
}

/*
	table
*/
table.type01{
	border-collapse: collapse;
}
table.type01 td,
table.type01 th{
	padding: 0 0 0.5rem 1rem;
	vertical-align: top;
	line-height: 150%;
}
table.type01 th{
	white-space: nowrap;
	color: #555;
	font-weight: normal;
	text-align: right;
}


table.type02{
	border-collapse: collapse;
}
table.type02 td,
table.type02 th{
	padding: 8px 8px;
	vertical-align: top;
	line-height: 120%;
	border-bottom: solid 1px #999;
	border-right: solid 1px #ccc;
	word-wrap: break-word;
}
table.type02 td:last-child,
table.type02 th:last-child{
	border-right: none;
}
table.type02 th{
	/*white-space: nowrap;*/
	color: #555;
	font-weight: normal;
	border-bottom: solid 1px #333;
}
table.type02 tr:last-child td{
	border-bottom: solid 1px #333;
}
table.type02 tr:hover td{
	background-color: #ddf;
}


table.type03{
	border-collapse: collapse;
}
table.type03 td,
table.type03 th{
	padding: 0.5rem 1rem;
	vertical-align: top;
	border-bottom: solid 1px #999;
	border-right: solid 1px #ccc;
	word-wrap: break-word;
}
table.type03 th{
	color: #555;
	font-weight: normal;
	white-space: nowrap;
}
table.type03 td:last-child,
table.type03 th:last-child{
	border-right: none;
}
table.type03 tr:last-child td,
table.type03 tr:last-child th{
	border-bottom: none;
}


.clickable-children{
	cursor: pointer;
}


/* fleft-group と合わせて利用 */
ul.breadcrumbs{
}
ul.breadcrumbs li{
	padding-right: 1rem;
	white-space: nowrap;
	line-height: 120%;
	color: #999;
}
ul.breadcrumbs li:after{
	content: "\003000\00bb";
	color: #999;
	font-weight: bold;
}
ul.breadcrumbs li.last:after{
	content: "";
}


ul.list{
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: solid 1px #ddd;
}
ul.list > li{
	border-bottom: solid 1px #ddd;
	padding: 0.5rem;
}
ul.list a{
	text-decoration: none;
}



/*
	tab
*/
.tab-group-simple ul{
	border-bottom: solid 1px #000;
	margin-bottom: 1rem;
}
.tab-group-simple li:first-child{
	margin-left: 1rem;
}
.tab-group-simple li{
	border: 1px solid #000;
	background-color: #aaa;
	padding: 0.2rem 0.5rem;
	margin-right: 0.5rem;
	margin-bottom: -1px;
	cursor: pointer;
}
.tab-group-simple li.active{
	border-bottom: 1px solid #fff;
	background-color: #fff;
	cursor: auto;
}


.children-bottom-space > *{
	margin-bottom: 1rem;
}


/* balloon */
.balloon-bottom{
	position: relative;
	display: inline-block;
	padding: 0 10px !important;
	/*background: #19283C;*/
	background: #fff;
	z-index: 0;
}
.balloon-bottom:after{
	content: "";
	position: absolute;
	bottom: 0px; left: 50%;
	margin-left: -12.5px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 15px 15px 0 15px;
	/*border-color: #19283C transparent transparent transparent;*/
	border-color: #fff transparent transparent transparent;
}

.balloon-top{
	position: relative;
	display: inline-block;
	padding: 0 10px !important;
	/*background: #19283C;*/
	background: #000;
	z-index: 0;
}
.balloon-top:after{
	content: "";
	position: absolute;
	bottom: 0px; left: 10%;
	/*margin-left: -12.5px;*/
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0px 10px 15px 10px;
	/*border-color: #19283C transparent transparent transparent;*/
	border-color: transparent transparent #000 transparent;
}

.balloon-arrow-top{
	background-color: #fff;
	border: 1px solid #666;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	position: relative;
}
.balloon-arrow-top:before{
	border:10px solid transparent;
	border-bottom-color:#fff;
	border-top-width:0;
	top:-9px;
	left: 45%;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	z-index: 1;
}
.balloon-arrow-top:after{
	border: 10px solid transparent;
	border-bottom-color: #666;
	border-top-width: 0;
	top: -10px;
	left: 45%;
	content: "";
	display: block;
	position: absolute;
	width: 0;
}

/*
	Form
*/
.base-form > div{
	margin-bottom: 1.5rem;
}
.base-form label{
	display: block;
	margin-left: 0.5rem;
}
.base-form label.req:after{
	content: " *必須";
	color: #ea2b72;
	font-size: 0.9rem;
	vertical-align: top;
}
.base-form input[type="text"],
.base-form input[type="email"],
.base-form input[type="password"]{
	width: 20rem;
	max-width: 90%;
}
.base-form textarea{
	width: 40rem;
	height: 10rem;
	max-width: 90%;
}
.base-form button{
}

.form-l input[type="text"],
.form-l input[type="password"],
.form-l select{
	padding: 0.5rem;
	font-size: 1rem;
}

.white-popup{
	position: relative;
	background: #FFF;
	padding: 20px;
	width: auto;
	max-width: 400px;
	margin: 20px auto;
	border-radius: 0.5rem;
	-webkit-border-radius: 0.5rem;
	-moz-border-radius: 0.5rem;
}


/*
	screen
*/
@media screen and (max-width: 580px) {
	.mobile-width-auto{
		width: auto !important;
	}
	.mobile-width-auto-child > *{
		width: auto !important;
	}
}
