@charset "utf-8";

/*----------------------------------------------------------
　append.css
　Last Modified : 2019/06/10
------------------------------------------------------------*/


/*
	Universal
------------------------------------------------------------*/

#under_ttl_box {
	margin-top: 50px;
}

#form #under_ttl_box {
	margin-top: 0;
}


@media screen and (min-width:767px){
body {
	min-width: 100%;
}

}

@media only screen and (min-width: 481px) {

#under_ttl_box {
	margin-top: 0;
}

}


/*
	Top
------------------------------------------------------------*/

#login_form h2 {
	font-size: 18px;
}

#top #login_form .btn {
	height: 80px;
}

#top #login_form .btn .float-left,
#top #login_form .btn .text-left {
	display: block;
	height: 40px;
	padding: 0 10px;
}

#top #login_form .btn .float-left {
	line-height: 40px;
	padding-left: 15px;
}

#top #login_form .btn .float-left i {
	font-size: 20px;
}

#top #login_form .btn.ready {
	margin-bottom: 0;
}

#top #login_form .btn.ready a{
	background: #1eb22f;
}

#top #login_form .btn.ready a:hover{
  background: #42c752;
}


/* Login */

.col-sm-4 ,.col-sm-8{
	margin-bottom: 30px;
 max-width: 100%;
	flex: 100%;
}

@media screen and (min-width:767px){
section.top .col-sm-4 {
	padding-left: 0;
	padding-right: 10px;
	margin-bottom: 0;
}

section.top .col-sm-8 {
	padding-left: 10px;
	padding-right: 0;
}
}

#maypage aside {
	margin: 0;
	
}

#maypage aside .individual_info01 {
	width: 100%;
	margin: 0;
}

#maypage main {
	width: 100%;
	margin: 0;
}

@media screen and (min-width:767px){
#maypage aside{
	width: auto;
	float: none;
}

#maypage main{
	width: auto;
	float: none;
}
}


/*
	Form
------------------------------------------------------------*/

.field60 { width: 60px !important ;}
.field70 { width: 70px !important ;}
.field80 { width: 80px !important ;}
.field100 { width: 100px !important; }
.field120 { width: 130px !important; }
.field150 { width: 150px !important; }
.field180 { width: 180px !important; }
.field220 { width: 220px !important ;}
.field280 { width: 280px !important ;}
.field320 { width: 320px !important ;}
.field360 { width: 360px !important ;}

select{
	background-color: #FFF !important;
	padding: 5px 3%;
	border: 1px solid #ccc;
	background: none;
	margin-bottom: 8px;
}

input[type="submit"], input[type="reset"] {
	background-color: #e8e8e8;
	border: none;
	cursor: pointer;
}

input[disabled] {
	background-color: #ccc;
	cursor: not-allowed !important;
}

.form-group input::placeholder {
	color: #c5c5c8;
	font-size: 0.90em;
	font-weight: normal;
}

.form-group label .badge {
	font-weight: normal;
	color: #fff;
	background-color: #F79E00;
	margin-left: 7px;
	padding: 6px;
}

textarea.kiyaku {
	width: 100%;
	height: 200px;
	font-size: 12px;
}

.form-control{
	width: auto;
}
.agree-txt input[type=checkbox] {
	-ms-transform: scale(1.5, 1.5);
	-webkit-transform: scale(1.5, 1.5);
	transform: scale(1.5, 1.5);
	margin-right: 5px;
}

.birthday .form-control{ display:inline-block; width:auto; vertical-align:middle; }


/*
	#Form
------------------------------------------------------------*/

#form h3 > small {
	font-size: 14px;
}

#form .alert i {
	font-size: 20px;
}

#form #login_form .btn.ready {
	margin-bottom: 0;
}

#form #login_form .btn.ready a{
	background: #1eb22f;
}

#form #login_form .btn.ready a:hover{
  background: #42c752;
}

#form #login_form .field100 { 
	width: 100px !important ;
 flex: 100px !important;
 max-width: 120px !important;
}
#form #login_form .field300 { width: 300px !important ;}



/*
	Maypage
------------------------------------------------------------*/

.title {
	font-size: 16px;
	color: #505050;
	background-color: #f5f5f8;
	border-bottom: 2px solid #d5d5d8;
	width: 100%;
	height: 60px;
	text-align: left;
	padding-left: 30px;
	margin-top: 0px;
	line-height: 60px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.sub_title01 {
	width: 100%;
	color: #707070;
	background-color: #f5f5f8;
	font-size: 14px;
	text-align: left;
	padding: 15px;
	border-left: 5px solid #E90200;
	margin: 30px auto;
}


/*
	Guide
------------------------------------------------------------*/

#guide p.lead {
	font-size: 14px;
}

#guide h3.ttl {
	font-size: 16px;
	font-weight: bold;
}


/*
	Notice
----------------------------------------------------------- */

.sub_title01.notice {
	border-left: 5px solid #e5e5e8;
	vertical-align: middle;
}

ul.notice-list {
	margin: 15px;
}

ul.notice-list li {
	list-style-type: none;
	padding: 5px 0;
}

.notice-line {
	text-align: left;
	line-height: 180%;
	background-color: #f5f5f8;
	border-bottom: 2px solid #e5e5e8;
	margin: 15px 0;
	padding: 15px;
}

.notice-line .notice-date {
	margin-bottom: 15px;
}

.message-line {
	width: 100%;
	margin: 20px 0;
}

.message-line ol {
	list-style: none;
	float: left;
	width: 100%;
	padding-left: 0;
}

.message-line ol li {
	width: 100%;
	margin-left: 0;
	padding: 0;
	list-style-type: none;
}

.message-line li article {
	width: 100%;
	color: #707070;
	border-bottom: solid 1px #e4e4e4;
	background-color: #f5f5f8 !important;
	text-align: left;
	margin-bottom: 20px;
	padding: 10px;
}

.message-line .message-box {
	line-height: 180%;
	padding: 15px;
}

.message-header {
	padding: 0 15px;
}

.message-header .message-author,
.message-header .author-name,
.message-header .notice_date {
	float: left;
	text-align: center;
	margin-right: 10px;
}

.message-header .message-author {
	width: 30px;
	height: 30px;
	line-height: 33px;
	background-color: #fff;
	font-size: 18px;
	-ms-interpolation-mode: bicubic;
	-webkit-border-radius: 15px !important;
	-moz-border-radius: 15px !important;
	border-radius: 15px !important;
}

textarea#commentsArea{
	background: transparent;
	border: 1px solid #eee;
	box-shadow: 0 2px 0 0 #f1f1f1;
	width: 100%;
	height: 180px;
	padding: 15px;
}

.comment-btn {
	width: 230px;
	background: transparent;
	border: 1px solid #eee;
	padding: 5px;
	margin-bottom: 20px;
}

.comment-btn input[type=submit] {
	cursor: pointer;
	border-radius: 0;
	-webkit-appearance: none;
}

input[type=submit].comment-submit{
	width: 100%;
	height: 45px;
	border-radius: 0px;
	color: #fff;
	border: none;
	background-color: #505050;
}

input[type=submit].comment-submit:hover {
	background-color: #666;
}


/*
	Button
----------------------------------------------------------- */

input[type=submit] {
	color: #fff;
	background-color: #333;
}


/*
	Print
------------------------------------------------------------*/

body#print {
	counter-reset: sheet; /* カウンタの初期化 */
}

section.sheet {
	page-break-after: always;
	/*margin-top: 120px;*/
	padding-top: 0;
}

section.sheet:first-child {
	padding-top: 0;
}

section.sheet:last-child {
    page-break-after: auto; /* 最後のページの改ページを防ぐ */
}


/*
	Error text
----------------------------------------------------------- */

/*.error01 {
	font-size: 12px;
	color: #cc0000;
	line-height: 130%;
	padding-bottom: 0.5em;
}*/
.error01 {
	display: block;
	width: 100%;
	max-width: 400px;
	font-size: 11px;
	text-align: left;
	color: #cc0000;
	line-height: 145%;
	background-color: #F4DCE1;
	border: 1px solid #E8C4CB;
	border-radius: 5px;
	margin-bottom: 5px;
	padding: 7px 10px;
}

.alert-danger {
	color: #BC6868;
	background-color: #F4DCDC;
}


/*
	Font size
----------------------------------------------------------- */

.text-primary {
	font-size: 0.85em;
	color: #a0a0a0 !important;
}

.font-xl {
	font-size: 18px;
}

.font-lg {
	font-size: 16px;
}

.font-md {
	font-size: 14px;
}

.font-sm {
	font-size: 12px;
}

.font-xs {
	font-size: 11px;
}

.black14 {
	font-size: 14px;
	font-weight: bold;
}


/*
	Font Color
----------------------------------------------------------- */

.blue {
	color: #0000ff;
}

.w_blue {
	color: #34beed;
}

.green {
	color: #008800;
}

.red {
	color: #dd0000;
}

.orange {
	color: #FF6767;
}

.d_orange {
	color: #cc3333;
}

.gray {
	color: #999;
}