@CHARSET "Shift_JIS";

@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@font-face{font-family:"IonIcons";src:url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.1");src:url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.ttf?v=2.0.1") format("truetype"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.woff?v=2.0.1") format("woff"),url("//code.ionicframework.com/ionicons/2.0.1/fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg");font-weight:normal;font-style:normal}

body, h1, h2, h3, p, div, ul, ol, li, dl, dd, dt, table, form, blockquote, pre, address{
  margin : 0;           
  padding : 0;          
}

html, body {
	color: #555;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 13px;
	/*font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	/*font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;*/
	/*font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;*/
	/*font-family: "YuGothic", "游ゴシック体", "Yu Gothic", "游ゴシック";*/
	/*font-family:"ヒラギノ角ゴ Pro W3",メイリオ,Osaka,Arial,Verdana,"ＭＳ Ｐゴシック",sans-serif;*/
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Helvetica, Arial, Verdana, sans-serif
}

textarea {
	border-color: #ddd;
}

td.center {
	text-align: center;
}

/* リンク */
a { color: #02bad6; text-decoration: none;}
a:hover { color: #f7a207; }


/* コンテンツタイトル */
.contents_title {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
}


/* 警告テキスト */
.alert {
	color: red;
}

/* 非アクティブテキスト */
.inactive {
	color: #aaa;
}

/* 特殊入力フォーム */
input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea {
	padding: 0.8em;
	outline: none;
	border: 1px solid #DDD;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 16px;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	/*width: 200px;*/
}

/* セレクタ */
.select-wrap {
    position: relative;
}
.select-wrap:before {
    z-index: 1;
    position: absolute;
    right: 15px;
    top: 0;
    content: "\f123";
    font-family: "IonIcons";
    line-height: 43px;
    color: #7F878C;
    pointer-events: none;
}
select{
    outline:none;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    background: none transparent;
    vertical-align: middle;
    font-size: inherit;
    color: inherit;
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 40px;
    padding: 8px 12px;
    border:1px solid #ddd;
    color:#828c9a;
    width:100%;
    border-radius:3px;
}
select option{
  background-color: #fff;
  color: #333;
}
select::-ms-expand {
  display: none;
}
select:-moz-focusring { 
  color: transparent; 
  text-shadow: 0 0 0 #828c9a;
}

/* カスタムチェックボックス */
.custom_checkbox-input{
	display: none;
}
.custom_checkbox-parts{
	position: relative;
	padding: 10px 20px 10px 53px;
	transition:.3s;
	color: #999;
	border-radius: 8px;
	border: 1px solid #ddd;
	display:inline-block;
	cursor : pointer;
}
.custom_checkbox-input:checked + .custom_checkbox-parts{
	background: #02bad6;
	color: #fff;
	border: 1px solid #02bad6;
}
.custom_checkbox-parts::before{
	content: "";
	display: block;
	position: absolute;
	top: 9px;
	left: 9px;
	width: 30px;
	height: 15px;
	border-radius: 15px;
	border: 1px solid #aaa;
	background: #fff;
	display: block;
}
.custom_checkbox-parts::after{
	content: "";
	display: block;
	position: absolute;
	top: 11px;
	left: 11px;
	width: 13px;
	height: 13px;
	background: #aaa;
	border-radius: 50%;
	transition:.2s;
	display: block;
}
.custom_checkbox-input:checked + .custom_checkbox-parts::before {
 	border: 1px solid #02bad6;
}
.custom_checkbox-input:checked + .custom_checkbox-parts::after {
	left: 26px;
	background: #02bad6;
}

/* カスタムチェックボックス */
.custom_radio-parts{
	padding-left: 20px;
	position:relative;
	margin-right: 20px;
	transition:.4s;
	cursor : pointer;
	color: #999;
}
.custom_radio-parts:hover{
	padding-left: 20px;
	position:relative;
	margin-right: 20px;
	transition:.4s;
	cursor : pointer;
	color: #444;
}
.custom_radio-input{
	display: none;
}
.custom_radio-input:checked + .custom_radio-parts{
	color: rgba(2,186,214,1);
}
.custom_radio-parts::before{
	content: "";
	display: block;
	position: absolute;
	top: 1px;
	left: 1px;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	z-index:-1;
	transform: scale(0,0);
	background: rgba(2,186,214,.3);
}
.custom_radio-parts::after{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 17px;
	height: 17px;
	border-radius: 50%;
	background: rgba(2,186,214,1);
	transition:.4s;
	transform: scale(0,0);
}

.custom_radio-input:checked + .custom_radio-parts::after{
	transform: scale(1,1);
	border-radius: 50%;
	background: #02bad6;
}
.custom_radio-input:checked + .custom_radio-parts:before {
	animation: pulsate .8s ease-out;  /* スピードなど */
}

/* 全体枠 */
.flame_header {
	color: #fff;
	width : 100%;
	height : 30px;
	background-color: #222;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #000), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #000),color-stop(.75, #000), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 7px 7px;
		display: flex;
		justify-content: left;
		align-items: center;	
}

.flame_main {
	overflow: hidden;
}

.flame_sidemenu {
	width : 220px;
	float : left;
}

.flame_contents {
	float: right;
	width: 100%;
	margin: 0 0 0 -250px;
}

.flame_content {
	margin: 10px 20px 10px 240px;
}

.flame_footer {
	width : 700px;
	clear : both;
}

.flame_sidemenu ul {
	list-style-type : none;
}

/* ヘッダ */
.header_area {
	width: 100%;
}

.header_site_name {
	margin-left: 10px;
	font-size: 13px;
	text-align: left;
	float: left;
}

.header_login_user {
	text-align: right;
	margin-right: 10px;
}


/* ボタン */
.button {
	display: inline-block;
	width: 25%;
	height: 45px;
	text-align: center;
	text-decoration: none;
	line-height: 45px;
	outline: none;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.button {
	background-color: #333;
	color: #fff;
}
.button:hover {
	background-color: #59b1eb;
	color: #fff;
	cursor : pointer;
}


/* ボタン2 */
.button2 {
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #dcdcdc;
	padding:3px 13px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	background:-ms-linear-gradient( top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ededed), color-stop(100%, #dfdfdf) );
	background-color:#ededed;
	color:#777777;
	display:inline-block;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	-moz-box-shadow:inset 1px 1px 0px 0px #ffffff;
 	box-shadow:inset 1px 1px 0px 0px #ffffff;
 	cursor: pointer;
}.button2:hover {
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background:-ms-linear-gradient( top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #dfdfdf), color-stop(100%, #ededed) );
	background-color:#dfdfdf;
 	cursor: pointer;
 	color: #777777;
}.button2:active {
	position:relative;
	top:1px;
 	cursor: pointer;
}

.tag_button {

	margin-top: 10px;

}

/* ログイン */
.login_form {
	background-color: #222;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #000), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #000),color-stop(.75, #000), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 7px 7px;
		display: flex;
		justify-content: center;
		align-items: center;
	height: 100%;
}

.login_form section {
	width: 450px;
	margin: 10px;
	/*border-radius: 5px;*/
	background: #fff;
	padding: 15px;
}
.login_form h1 {
	color: #666;
	font-size: 1.5rem;
}
.login_form p {
	margin-top: 10px;
}

.login_id {
	margin-left: 20px;
	width: 300px;
}

.login_password {
	margin-left: 20px;
	width: 300px;
}


/* メニュー(アコーディオン) */
div.accordion {
	width: 100%;
}
div.accordion > ul > li > a {
	display: block;
	color: #fff;
	/*font-size: 16px;*/
	text-decoration: none;
	background-color: #666;
	border-bottom: 1px solid #777;
	cursor: pointer;
	padding: 10px 12px;
	position: relative;
}
div.accordion > ul > li > a:hover {
  background-color: #777;
}
div.accordion > ul > li > a:after, div.accordion > ul > li > a.active:after {
	/*font-size: 12px;*/
	position: absolute;
	right: 12px;
	/*top: 12px;*/
	color: #555;
}
div.accordion > ul > li > a:after {
	content: "▼";
}
div.accordion > ul > li > a.active:after {
	content: "▲";
}
div.accordion > ul > li > ul {
	display: none;
}
div.accordion > ul > li > ul > li > a{
	display: block;
	color: #fff;
	/*font-size: 14px;*/
	background-color: #888;
	border-bottom: 1px solid #999;
	padding: 6px 35px;
	position: relative;
}
div.accordion > ul > li > ul > li > a:hover {
	background-color: #999;
}


/* テーブル一覧 */
table.list {
	width: 100%;
	border-spacing: 0;
	/*font-size:14px;*/
}
table.list th {
	color: #fff;
	padding: 8px 15px;
	background: #258;
	background:-moz-linear-gradient(rgba(88,88,88,0.7), rgba(88,88,88,0.9) 50%);
	background:-webkit-gradient(linear, 100% 0%, 100% 50%, from(rgba(88,88,88,0.7)), to(rgba(99,99,99,0.9)));
	font-weight: bold;
	border-left:1px solid #999;
	border-top:1px solid #999;
	border-bottom:1px solid #999;
	line-height: 120%;
	text-align: center;
	/*text-shadow:0 -1px 0 rgba(34,85,136,0.9);*/
	/*box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;*/
}
table.list th:first-child {
	/*border-radius: 5px 0 0 0;	*/
}
table.list th:last-child {
	/*border-radius:0 5px 0 0;*/
	border-right:1px solid #bbb;
	/*box-shadow: 2px 2px 1px rgba(0,0,0,0.1),0px 1px 1px rgba(255,255,255,0.3) inset;*/
}
table.list tr td {
	padding: 8px 15px;
	border-bottom: 1px solid #bbb;
	border-left: 1px solid #bbb;
	/*text-align: left;*/
}
table.list tr td:last-child {
	border-right: 1px solid #bbb;
	/*box-shadow: 2px 2px 1px rgba(0,0,0,0.1);*/
}
table.list tr {
	background: #fff;
}
table.list tr:nth-child(2n+1) {
	background: #f1f6fc;
}
table.list tr:last-child td {
	/*box-shadow: 2px 2px 1px rgba(0,0,0,0.1);*/
}
table.list tr:last-child td:first-child {
	/*border-radius: 0 0 0 5px;*/
}
table.list tr:last-child td:last-child {
	/*border-radius: 0 0 5px 0;*/
}
table.list tr:hover {
	background: #ddd;
	cursor:pointer;
}


/* テーブル(入力フォーム)*/
table.input_form {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	text-align: left;
	line-height: 1.5;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}
table.input_form th {
	width: 30%;
	padding: 10px;
	font-weight: bold;
	vertical-align: middle;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	background: #eee;
}
table.input_form td {
	width: 70%;
	padding: 10px;
	/*vertical-align: middle;*/
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/* テーブル(検索フォーム)*/
table.search_form {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	text-align: left;
	line-height: 1.5;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}
table.search_form th {
	width: 15%;
	padding: 10px;
	font-weight: bold;
	vertical-align: middle;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	background: #eee;
}
table.search_form td {
	width: 35%;
	padding: 10px;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}