@charset "utf-8";

/*===================================
 CSS INFO
 Description : mypagestyle css
=====================================*/

/* レイアウト
==================================== */
#header{
	background-color: #FFF;
	-webkit-border-radius: 0 0 5px 5px;
	        border-radius: 0 0 5px 5px;
	padding: 10px 20px 15px;
	margin-bottom: 3rem;
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	-webkit-align-items: center;
	        align-items: center;
}
#header h1{
	font-weight: bold;
	font-size: 26px;
	margin-bottom: 0;
}
#header a{
	color: #425168;
}
#header h1 .logo{
	/*width: 65px;*/
	height: auto;
	margin-right: 20px;
}
#header h1 span{
	font-size: 1rem;
	display: inline-block;
	background-color: #0A64BB;
	color: #FFF;
	-webkit-border-radius: 4px;
	        border-radius: 4px;
	padding: 3px 8px;
	font-weight: bold;
	margin-left: 10px;
}
#footer{
	text-align: center;
	padding: 15px 0;
}
@media (max-width: 320px){
	#header .list-inline .list-inline-item{
		display: block;
	}
	#header .list-inline .list-inline-item.ml-3{
		margin-left: 0!important;
	}
}

.mypage-content{
	padding: 40px 20px;
}
.contact-form .form-label span{
	display: block;
	background-color: #F0F1F4;
	padding: 10px 15px;
	font-weight: bold;
	height: 100%;
}
.form-label.must span:after {
	content: "必須";
	background-color: #ff3a3a;
	padding: 2px 3px;
	font-size: 0.8rem;
	color: #FFF;
	margin-left: 5px;
	display: inline-block;
}
.mypage-content .submit input{
	width: 80%;
}

.input-clm .text-muted,
.input-clm .form-control,
.input-clm .custom-select,
.mypage .input-clm .text-muted,
.mypage .input-clm .form-control,
.mypage .input-clm .custom-select {
	display: inline-block;
}
.user-birth select{
	width: auto;
}
.contact-form .input-group-text{
	background-color: #fff;
	border: none;
}
.contact-form .input-group>.form-control:not(:last-child){
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}


.btn-primary{
background-color: #0A549E;
border-color: #0A549E;
}
.btn-primary:hover{
background-color: #0c70d4;
border-color: #0A549E;
}

@media (max-width: 575px){
	.user-birth select + .text-muted{
		font-size: 12px;
		padding-left: 0!important;
	}
	.use-flight .form-inline{
		display: block;
	}
	.use-flight .form-group{
		margin-bottom: 0;
	}
	.use-flight select{
		margin-bottom: 5px;
	}
}
@media (max-width: 767px){
	.contact-form .form-label{
		margin-bottom: 10px;
	}
}

/*ログイン*/
#login-wrap{
	height: 80vh;
}
#login-inner{
	-webkit-align-self: center;
	        align-self: center;
}
#login{
	width: 280px;
}
#login h1{
	font-size: 1.5rem;
	margin-bottom: 2rem;
	font-weight: bold;
}
#login .login-form-group{
	margin-bottom: 2rem;
}
#login .login-form-group input{
	padding: 1.5rem 1rem;
}
#login .login-form-group .login-id{
	-webkit-border-bottom-left-radius: 0;
	        border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	        border-bottom-right-radius: 0;
}
#login .login-form-group .login-pass{
	-webkit-border-top-left-radius: 0;
	        border-top-left-radius: 0;
	-webkit-border-top-right-radius: 0;
	        border-top-right-radius: 0;
	border-top: 0;
}

#login .placeholder_wrap .form-control{
	/*font-size: 0.77rem!important;*/
}

#login .card-header{
	background-color: #14b9d1;
	color: #FFF;
	font-weight: bold;
	text-align: center;
}
#login .card-body{
	padding: 1.5rem 2rem;
}
@media (min-width: 768px) {
	#login{
		width: 400px;
	}
}

@media (max-width: 575px){
	.contact-form .form-label span{
		margin-bottom: 5px;
	}
	#header{
		flex-wrap: wrap;
	}
	#header h1 span{
		display: none;
	}
	#header h1,#header ul.list-inline{
		width: 100%;
	}
	#header ul.list-inline{
		margin-top: 10px;
	}
}
@media (min-width: 576px){
	.mypage-content{
	padding: 40px 50px;
	}
	.contact-form .form-label span{
		/*padding: 15px;*/
	}
	.input-clm input.form-control {
		width: 80%;
	}
}


/*パーツ*/
.ttl-01 {
	font-size: 1.8rem;
	font-weight: bold;
	width: 100%;
	overflow: hidden;
	margin-bottom: 3rem;
}

.ttl-02 {
	font-size: 1.5rem;
	font-weight: bold;
	color: #FFF;
	margin-bottom: 3rem;
	background-color: #425168;
	-webkit-border-radius: 4px;
	        border-radius: 4px;
	padding: 0.3rem 0.5rem;
}

.ttl-03{
	font-size: 1.5rem;
	font-weight: bold;
}

.ttl-04{
	font-size: 1.25rem;
	font-weight: bold;
	color: #3a4f6e;
}
.ttl-04 span{
	border-bottom: 1px solid #7E92AF;
	display: block;
	padding: 5px 0;
}

.ttl-07 {
	color: #425168;
	font-size: 1.4rem;
	font-weight: bold;
	border-bottom: 1px solid #425168;
	padding-bottom: .5rem;
}

.myp-ttl01{
font-weight: bold;
color: #425168;
}

.table th {
	background-color: #eee;
}

.note{
	font-size: 13px;
	clear: both;
	padding-top: 10px;
}

@media (max-width: 767px) {
	.reserve-use-list .table th,.reserve-use-list  .table td {
		display: block;
	}
}
@media (min-width: 768px) {
	.reserve-use-list .table th{
	width: 20%;
	}
}

.reserve-use-list table td .r-user-price{
color: #e40011;
font-weight: bold;
}
.reserve-use-list table .toral-price + td .r-user-price{
font-size: 1.375rem;
}
.reserve-use-list table .toral-price{
background-color: #fff3cd;
color: #e40011;
}

/*予約一覧*/
.reseve-history{}
.rsv-history-thead{
	text-align: center;
	font-size: 0.75rem;
	font-weight: bold;
	border-bottom: 2px solid #446175;
	display: none;
}
.rsv-history-tbody{
	display: flex;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	border-bottom: 1px solid #CCC;
	border-top: 1px solid #CCC;
}
.rsv-history-tbody + .rsv-history-tbody{
	border-top: none;
}

.rsv-history-thead + .rsv-history-tbody div[class^="rsv-td-"]{
	border-top:none;
}
.rsv-history-tbody div[class^="rsv-td-"] dl,
.rsv-history-tbody div[class^="rsv-td-"] dd{
	margin-bottom: 0;
}
.rsv-td-05 dl dd{
	color: #FF0000;
	font-weight: bold;
}

.rsv-td-06 > a:first-child{
	margin-right: 0.3rem;
}

.reseve-history-sort{
	margin-bottom: 2rem;
}
.reseve-history-sort small{
	padding-right: 5px;
}

.reseve-history-sort select{
	width: auto;
}

@media (max-width: 767px) {
}
@media (max-width: 991px) {
	.rsv-td-06{
		text-align: center;
		margin-top: 10px;
	}
	.rsv-history-tbody{
		padding: 15px 0 20px;
	}
	.rsv-history-tbody div[class^="rsv-td-"] dl{
	}
	.rsv-history-tbody div[class^="rsv-td-"] dl dt{
		width: 100px;
		float: left;
	}
	.rsv-history-tbody div[class^="rsv-td-"] dl dd{
		overflow: hidden;
	}
	.rsv-td-02 dd span{
		display: inline-block;
		margin-left: 5px;
	}
	.rsv-td-03 dl dd span.rsv-start-day:after{
		content: "～";
		display: inline-block;
		margin-right: 3px;
		margin-left: 3px;
	}
}
@media (min-width: 992px) {
	.rsv-history-thead{
		display: flex;
	}
	.rsv-history-tbody{
		-webkit-flex-direction: row;
		    -ms-flex-direction: row;
		        flex-direction: row;
	}
	.rsv-history-tbody{
		border-bottom: 1px solid #CCC;
	}
	.rsv-history-tbody div[class^="rsv-td-"]{
		text-align: center;
	}
	.rsv-history-tbody div[class^="rsv-td-"] dt{
		display: none;
	}
	.rsv-th-01,.rsv-td-01{
		width: 10%;
	}
	.rsv-th-02,.rsv-td-02{
		width: 15%;
	}
	.rsv-th-03,.rsv-td-03{
		width: 20%;
	}
	.rsv-th-04,.rsv-td-04{
		width: 25%;
	}
	.rsv-th-05,.rsv-td-05{
		width: 10%;
	}
	.rsv-th-06,.rsv-td-06{
		width: 20%;
	}
	.rsv-td-02 dl dd span{
		display: block;
	}
	.rsv-td-03 dl dd span.rsv-start-day,
	.rsv-td-03 dl dd span.rsv-end-day{
		display: block;
	}
	.rsv-td-03 dl dd span.rsv-start-day:before,
	.rsv-td-03 dl dd span.rsv-end-day:before{
		font-size: 11px;
		font-weight: bold;
	}
	.rsv-td-03 dl dd span.rsv-start-day:before{
		content: "貸出日：";
	}
	.rsv-td-03 dl dd span.rsv-end-day:before{
		content: "返却日：";
	}
	.rsv-th-06,.rsv-td-06 a.btn{
		padding: .25rem .5rem;
		font-size: .875rem;
		line-height: 1.5;
		border-radius: .2rem;
	}
	.rsv-history-thead div[class^="rsv-th-"]{
		padding: 5px 8px;
	}
	.rsv-history-tbody div[class^="rsv-td-"]{
		padding: 10px 8px;
	}
}


.reseve-history-list{
	border: 1px solid #CCC;
	margin-bottom: 2rem;
}
.reseve-history-head{
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	background-color: #5e87a2;
	padding: 0.5rem 1rem;
	color: #FFF;
}
.reseve-history-head .reserve-number{
	font-weight: bold;
}
.reseve-history-body{
	padding: 1rem 1rem;
}
.reseve-history-col1{
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	font-size: 0.8rem;
}
.st-yoyaku,.st-cancel,.st-riyou,.st-riyouzumi{
	-webkit-border-radius: 2px;
	        border-radius: 2px;
	padding: 0.1rem 0.2rem;
	font-size: 0.75rem;
}
.st-yoyaku{
	background-color: #ffc2c2;
	color: #A03535;
}
.st-cancel{
	background-color: #ccc;
	color: #666;
}
.st-riyou{
	background-color: #a8ddf1;
	color: #286E88;
}
.st-riyouzumi{
	background-color: #d2f1a8;
	color: #515f3e;
}
.reseve-history-col2{
}
.reseve-history-col2 li{
	margin-bottom: 1rem;
}
.reseve-history-col2 li span{
	background-color: #EEE;
	display: block;
	margin-bottom: 0.5rem;
	-webkit-border-radius: 3px;
	        border-radius: 3px;
	padding: 0.3rem 0.5rem;
	font-size: 0.85rem;
}
.reseve-history-col3 a{
	display: block;
}

/*詳細*/
.reserve-id-box{
	margin-bottom: 30px;
	background-color: #E8F8FA;
	border: 3px solid #14B9D1;
	padding: 15px 20px;
	font-size: 18px;
	font-weight: bold;
}
.reserve-id-box span{
}

.m-info{
	margin-bottom: 15px;
}
.m-info dt {
	padding: 5px;
	margin-bottom: 10px;
	padding-left: 10px;
	/*font-size: 1.3rem;*/
	font-size: 14px;
	background-color: #eaedee;
	border-radius: 3px;
	color: #434A54;
}

.m-info dd {
	padding: 0 10px;
}
.m-info dd p{
	margin-bottom: 5px;
}
.m-info dd p > span{
	font-weight: bold;
	padding-right: 5px;
}

.m-info dd .cell-my-ttl{
	font-weight: bold;
	margin-right: 5px;
}

.m-info .price-sid-wp {
	text-align: right;
	margin-bottom: 10px;
	border-top: 1px dotted #C0C0C0;
	padding-top: 8px;
	margin-top: 8px;
}

.m-info.goukei {
	border: 3px solid #FF0000;
	overflow: hidden;
	padding: 10px;
	background-color: #FFECEC;
	margin-top: 15px;
}

.m-info.goukei dt {
	border: none;
	float: left;
	background-color: #FFECEC;
}

.m-info.goukei dd {
    float: right;
}

.m-info.goukei .price {
color: #FF0000;
font-size: 1.6rem;
font-weight: bold;
}

.page-item.active span,.page-item > a[action='news']{
position: relative;
display: block;
padding: .5rem .75rem;
margin-left: -1px;
line-height: 1.25;
color: #007bff;
background-color: #fff;
border: 1px solid #dee2e6;
}
.page-item.active span{
	background-color: #dee2e6;
	color: #FFF;
}

/*規約*/
.mypage-input-yakkan {
	border: 1px solid #dee2e6;
	height: 300px;
	overflow-y: scroll;
}

/*事前決済*/
.pay-type{margin: 0 0 30px 0;padding-bottom: 10px;
border-bottom: 1px dotted #CCC;}
.pay-type .pay-select input[type="radio"]{display: none;}
.pay-type .pay-select label{display: block;}
.pay-type .pay-select .pay-radio{display: block;background-color: #FFF;border: 1px solid #b3b3b3;-webkit-border-radius: 4px;border-radius: 4px;padding: 24px;/*width: 180px;*/cursor: pointer;/*font-size: 14px;*/text-align:center;font-weight: bold;}
.pay-type .pay-select .pay-radio:before{font-family: FontAwesome;content: "\f10c";color: #B3B3B3;margin-right: 5px;}
.pay-type .pay-select .pay-radio:hover{background-color: #DBF1FB;border: 1px solid #6ec7ef;}
.pay-type .pay-select label input[type="radio"]:checked + .pay-radio{background-color: #DBF1FB;border: 1px solid #6ec7ef;}
.pay-type .pay-select label input[type="radio"]:checked + .pay-radio:before{content: "\f192";color: #444;}
.pay-type-info-cards{
	list-style: none;
	padding: 0;
}
.pay-type-info-cards li{
	display: inline-block;
}

/*credit error*/
.credit-err{
	width: 100%;
	margin: 0 auto;
	padding: 15px;
	border: 5px solid #7E92AF;
}
.credit-err > .row{
	padding: 15px;
}
.credit-err button:after,
.pay-select-text > button:after{
	font-family: FontAwesome;
	content: "\f105";
	display: inline-block;
	margin-left: 15px;
}
@media (min-width: 768px) {
	.credit-err{
		width: 600px;
	}
}

.card-inputform label{
	font-size: 0.875rem;
	font-weight: bold;
}
.card-inputform #alert{
	display: none;
}



/*.pay-type{}
.pay-type label{
	display: block;
	border: 2px solid #CCC;
	-webkit-border-radius: 4px;
	        border-radius: 4px;
	text-align: center;
	padding: 20px;
	cursor: pointer;
}
.pay-type label:hover{

}
.pay-type .pay-type-ttl{
	font-weight: bold;
	display: block;
}*/