@charset "utf-8";

/***                    ***/
/***     レイアウト     ***/
/***                    ***/

.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

html,
body{
	height:100%;
}

body {
	width: 100%;
	word-break: break-all;
}
.wrap {
	overflow:hidden;
	display:flex;
	flex-direction:column;
	min-height:100vh;
}

.breadcrumb-item + .breadcrumb-item::before {
	content: ">";
}

/* general */
#l_header,
#l_global_navi,
#l_footer {
}
#l_header {
	background-color: #FFF;
}

.header_inner,
.main_inner,
.footer_inner {
	margin: 0 auto;
	padding: 0 10px;
}
.main_inner {
	padding-top: 20px;
	padding-bottom: 100px;
}

/* header */
.head_wp {
	margin-bottom:30px;
}
#l_header {
	border-top: 10px solid #e9ecef;
}
.header_inner {
    position: relative;
    padding: 15px 0 10px;
    min-height: 65px;
}

/* footer */
.footer{
	margin-top:auto;
}
#l_footer {
	margin-top: 50px;
	padding-bottom: 50px;
	background-color: #e9ecef;
}
.footer_inner {
	background-color: #e9ecef;
	padding: 30px 0 10px;
}
.footer_inner .navi_list li {
	display: inline-block;
	padding: 0 16px;
	margin: 5px 0 4px;
}
.footer_inner .navi_list a {
	font-weight: bold;
	color: #333;
}
.footer_copy {
	padding:20px 0;
	text-align:center;
	font-size: 80%;
}
.footer_copy strong {
	font-size: 140%;
	padding-right: 15px;
}

/* nav */

.utility_nav {
    float: right;
    margin: 5px 20px 0 0;
}

/* Block Skip */
.block_skip {
	z-index: 9999;
	overflow: visible;
	margin: 0;
	padding: 0;
	width: 100%;
}
.block_skip a {
	display: block;
	width: 100%;
	color: #fff;
	text-align: center;
	text-decoration: none;
	font-size: 1px;
	cursor: default;
	height: 1px;
	margin-top: -1px;
	overflow: hidden;
	position: absolute;
}
.reader {
	font-size: 1px !important;
	position: absolute;
	height: 1px;
	width: 1px;
	text-indent: -9999px;
	overflow: hidden;
}
.ignore {
	display: none;
}
.analysis {
	display: none;
}



/***              ***/
/***     要素     ***/
/***              ***/

.xb-err{
	color:#dc3545;
	font-weight:bold;
}
.text_center{
	text-align: center !important;
}
.last-login{
	font-weight:bold;
	font-size:75%;
}
.logo{
	padding-left: 10%;
	background-color: #0558ad;
}
.logo img{
	width: 200px
}
.logo span{
	color:white;
	margin-left: 25px;
	text-decoration: underline;
}

/* サイト名 */
.headline_outer{
	width:100%;
	padding:20px;
	background-color:#e9ecef;
	display: table;
	text-align:center;
}
.headline_inner{
	display:table-cell;
	vertical-align: middle;
}

/* 見出し */
.main_contents h3{
	padding: 0.25em 0.5em;
	background: transparent;
	border-left: solid 5px #ff4500;
}
.main_contents h6 {
  border-bottom: dashed 2px #ff4500;
  font-weight: bold;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

/* フォーム */
input[type=text],
input[type=password]{
	width:60%;
}
input[type=email]{
	width:80%;
}

.btn_next,
.btn_back{
	min-width:100px;
	margin:10px;
}

/* テーブル */

.form_tbl table{
	width:100%;
}
.form_tbl th{
	width:25%;
}
.form_tbl td{
	width:75%;
}

.table1{
	float:left;
}
.table2{
	float:right;
}
.table1,
.table2{
	width:48%;
}

/* パネル */
.panel_head{
	display:inline-block;
	width:20%;
	font-weight:bold;
}
.panel_data{
	display:inline-block;
	width:60%;
	border:1px solid #e9ecef;
}
.panel-body1{
	float:left;
}
.panel-body2{
	float:right;
}
.panel-body1,
.panel-body2{
	width:48%;
}

/* 注釈 */
.alert-notice {
  font-size: 95%;
  line-height: 1.8em;
  background-color: rgba(0, 0, 0, 0.05);
  border-color: #d6d8db;
}

.alert-notice hr {
  border-top-color: #c8cbcf;
}

.alert-notice .alert-link {
  color: #202326;
}

/* 合格フラワー画像 */
.img-passing{
	background-image:url(/img/passing_back.gif);
	background-repeat:  no-repeat;
	background-position:center center;
	background-size:contain;
	width:300px;
	height:80px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color:red;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
body {
	height: 100vh;
}
}

@media screen and (max-width: 640px){
/***                    ***/
/***     レイアウト     ***/
/***                    ***/

html, 
body {
	min-width: 320px;
}

.pc_vis {
	display: none;
}
.sp_vis {
	display: block;
}

.reader,
.block_skip {
	display: none;
}

/* general */
#l_header,
#l_global_navi,
#l_footer {
	min-width: 320px;
}
.header_inner,
.main_inner,
.footer_inner {
	width: 95%;
	min-width: 95%;
}
.main_inner {
	padding-top: 10px;
	padding-bottom: 50px;
}

/* header */
.header_inner {
	width: auto;
    padding: 10px 0 10px;
}
.headline_inner{
	font-size: 1.8rem;
}

/* footer */
#l_footer {
	padding-bottom: 20px;
}
.footer_inner .navi_list li {
	display: block;
	padding: 0px;
	margin: 5px 0px;
}

/* nav */
.utility_nav {
    float: left;
}



/***              ***/
/***     要素     ***/
/***              ***/

.logo{
	clear:both;
}
.logo span{
	display:block;
}

/* フォーム */
input[type=text],
input[type=password]{
	width:100%;
}
input[type=email]{
	width:100%;
}

.btn_next,
.btn_back{
	min-width:100px;
	margin:10px;
}

/* テーブル */
.form_tbl table{
	width:100%;
}
.form_tbl th{
	width:100%;
	display:block;
}
.form_tbl td{
	width:100%;
	display:block;
}

.table1{
	clear:both;
}
.table2{
	clear:both;
}
.table1,
.table2{
	width:100%;
}

/* パネル */
.panel_head{
	display:inline-block;
	width:40%;
	font-weight:bold;
}
.panel_data{
	display:inline-block;
	width:50%;
	border:1px solid #ddd;
}

.panel-body1{
	clear:both;
}
.panel-body2{
	clear:both;
}
.panel-body1,
.panel-body2{
	width:100%;
}

}