@charset "utf-8";

/**
 *
 *  Order　- お申込み（下層ページ共通）
 *
 */

/*--------------------------------------------------------------------------
   overwrite
---------------------------------------------------------------------------*/


/*----------------------------------------------------------------------
	Sec01
----------------------------------------------------------------------*/
#Sec01{
	padding:0 0 70px;
}


/* #FlowNavi
--------------------------------------------------*/
#FlowNavi{
	width: 760px;
	height: 50px;
	margin: 40px auto;
}

#FlowNavi li{
	width: 340px;
}
#FlowNavi li a{
	display: block;
	padding: 15px 0 13px;
	border-radius: 5px;
	border: 2px solid #83b3d1;
	line-height: 1.5;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	color: #444;
}
#FlowNavi li span{
	padding-left: 20px;
	background: url(/rentalserver/shared/images/ico_arw03.png) no-repeat 0 5px;
}
#FlowNavi li a:hover{
	background: #D2E3EE;
}


/* .flow-box
--------------------------------------------------*/
.flow-box{
	margin:50px 0;
	font-size:15px;
	font-size:1.5rem;
}
.flow-box:last-child{
	margin-bottom:0;
}
.flow-box h3{
	background: #004381;
	padding: 22px 0 16px;
	color: #fff;
	text-align: center;
	font-size:22px;
	font-size:2.2rem;
}

.step-wrap{
	padding: 40px 34px 45px 39px;
	border: 1px solid #d8dfe2;
	background: #fcfefe;
}
.step-box{
	background: url("/rentalserver/order/images/step_bg.png") repeat-y;
}
.step-box.last{
	background: none;
}

.step-inner{
	padding: 0 0 50px 115px;
}
.step-box.last .step-inner{
	padding-bottom: 20px;
}
.step01 .step-inner{ background: url("/rentalserver/order/images/ico_step01.png") no-repeat;}
.step02 .step-inner{ background: url("/rentalserver/order/images/ico_step02.png") no-repeat;}
.step03 .step-inner{ background: url("/rentalserver/order/images/ico_step03.png") no-repeat;}
.step04 .step-inner{ background: url("/rentalserver/order/images/ico_step04.png") no-repeat;}

.step01.other .step-inner{ background: url("/rentalserver/order/images/ico_step01_other.png") no-repeat;}
.step02.other .step-inner{ background: url("/rentalserver/order/images/ico_step02_other.png") no-repeat;}
.step03.other .step-inner{ background: url("/rentalserver/order/images/ico_step03_other.png") no-repeat;}
.step04.other .step-inner{ background: url("/rentalserver/order/images/ico_step04_other.png") no-repeat;}


.step-box.no-step{
	background-image:none;
}
.step-box.no-step .step-inner{
	padding:0;
}


/* h4 */
.flow-box h4{
	padding: 0 0 10px;
	font-size:22px;
	font-size:2.2rem;
	color: #004380;
}

/* btn */
.flow-box p.btn,
.flow-box p.btn-order{
	float:left;
}

.flow-box p.btn-border a{
	width:360px;
	box-sizing:border-box;
}

/* step-img */
.flow-box .step-img ul.step-list{
	padding: 10px 0;
}
.flow-box .step-img li{
	float: left;
	width: 172px;
	margin-right: 21px;
	color: #2077AC;
}
.flow-box .step-img li.adjust{
	width: 198px;
}
.flow-box .step-img  li.last{
	margin-right: 0;
}

.flow-box .step-img p.caution{
	float: right;
	width: 342px;
	padding-left: 28px;
	background: url("/rentalserver/shared/images/ico_caution.png") no-repeat 0 2px;
	color: #F08512;
	line-height: 1.6;
}

/* ul.notes */
.flow-box ul.notes{
	padding-top: 1.5em;
}


/*----------------------------------------------------------------------
	schedule-box
----------------------------------------------------------------------*/

.schedule-box{
	font-size:15px;
	font-size:1.5rem;
}
.schedule-box h3{
	color:#2C3943;
	font-size:20px;
	font-size:2.0rem;
	font-weight:bold;
}
.schedule-box h3:before{
	display:inline-block;
	content:"●";
	color:#2177AD;
	font-size:15px;
	font-size:1.5rem;
	padding-right:0px;
	vertical-align:text-top;
}
.schedule-box .img{
	margin:10px 0;
}
.schedule-box p.notes{
	margin-bottom:5px;
	padding-left: 3.0em;
	text-indent: -3.0em;
	line-height: 1.5;
	font-size: 13px;
	font-size: 1.3rem;
	color: #666;
}
.schedule-box .notes + h3{
	padding-top:40px;
}
.schedule-box .img + h3{
	padding-top:10px;
}

.other-box{
	margin:30px 0;
}
.other-box h4{
	background:#2177AD;
	padding:10px 0 5px 20px;
	color:#FFF;
	font-size:18px;
	font-size:1.8rem;
}
.other-box p{
	padding:20px 30px;
	border:4px solid #BECEDE;
	border-top:none;
	line-height:1.5;
}


/*----------------------------------------------------------------------
	form-tab - タブ切り替え -
----------------------------------------------------------------------*/

.form-tab {
	padding:10px 0 0;
	font-size:0;
	text-align:center;
}
.form-tab label {
	display:inline-block;
	background:#EEE;
	width:300px;
	height:60px;
	margin:0 auto;
	padding:20px 0 0;
	box-sizing:border-box;
	text-align:center;
	color:#232F3E;
	line-height:1.2;
	font-size:18px;
	font-size:1.8rem;
	position:relative;
	vertical-align:middle;
	border:1px solid #232F3E;
	border-bottom:none;
	transition:all 0.25s ease;
}
.form-tab label:nth-of-type(1){
}
.form-tab label:nth-of-type(n+2){
	margin-left:20px;
}
.form-tab label span{
	display:block;
	font-size:15px;
	font-size:1.5rem;
	margin:3px 0;
}
.form-tab label:hover,
.form-tab input[type="radio"]:checked + label {
	background:#232F3E;
	font-weight:bold;
	color:#FFF;
	border:1px solid #232F3E;
}

.form-tab label:hover{
	cursor:pointer;
}
.form-tab > input[type="radio"] {
	display: none;
}
.form-tab .tab-box {
	width:100%;
	font-size:15px;
	font-size:1.5rem;
	line-height:1.5;
	box-sizing:border-box;
}
.form-tab .tab-box h2{
	text-indent:-99999em !important;
	display:none !important;
}
.form-tab > .tab-box > div {
	display: none;
	padding-top:40px;
}
#tab1:checked ~ .tab-box > #tabActive1 {
	display: block;
	border-top:2px solid #232F3E;
}
#tab2:checked ~ .tab-box > #tabActive2 {
	display: block;
	border-top:2px solid #232F3E;
}

.tab-box h3{
	margin:0 0 10px;
	text-align:left;
}
.tab-box h3 + div{
	margin:0 0 20px;
}
.tab-box p{
	font-size:16px;
	font-size:1.6rem;
	line-height:1.6;
}
.btn-portal a {
	padding: 20px 10px;
}


/*----------------------------------------------------------------------
	link-area
----------------------------------------------------------------------*/

.link-area{
	margin-top:30px;
	padding:20px 30px 15px;
	border:1px solid #E5E5E5;
	overflow:hidden;
}
.link-area li{
	float:left;
	display:inline;
	margin:0 0 7px 0;
}
.link-area li {
	width:450px;
}
/*
.link-area li:nth-child(4n) {
	width:200px;
}*/
.link-area li a{
	background:url(/rentalserver/shared/images/ico_arw03.png) 0 50% no-repeat;
	padding-left:25px;
}

.link-area li.pdf {
	margin-left:-10px;
	margin-bottom:2px;
}

.link-area li.pdf a {
    background:url("/rentalserver/shared/images/ico_pdf.png") no-repeat scroll left top;
    line-height:1.3;
    display: inline-block;
	padding-left:35px;
}

/*----------------------------------------------------------------------
	order-recommend
----------------------------------------------------------------------*/

.order-recommend,
.order-recommend * {
	box-sizing:border-box;
}

.order-recommend {
	border:1px solid #ccc;
	padding:20px;
	margin-top:20px;
}

/*----------------------------------------------------------------------
	notes
----------------------------------------------------------------------*/
span.notes {
	padding-left:5px;
	font-weight:normal;
}
ul.notes li {
	line-height:1.8;
	padding-left:1.4em;
	text-indent:-1.4em;
}
ul.notes-payment li {
	padding-left:3em;
	text-indent:-3em;
}

/*----------------------------------------------------------------------------------------------------
	for タブレット（1039px以下）
-----------------------------------------------------------------------------------------------------*/
@media (max-width: 1039px) {
	.scroll_box {
		padding-bottom: 15px;
	}
	.scroll_box table {
		width: 980px;
	}
}
/*----------------------------------------------------------------------------------------------------
	for SP（768px以下）
-----------------------------------------------------------------------------------------------------*/
@media (max-width: 768px) {
	.link-area {
		padding: 20px 15px 15px;
	}
	.link-area li {
		width: 100%;
	}
	.step-wrap {
		padding: 40px 10px 45px;
	}
	.step-inner {
		padding-left: 50px;
	}
	.step01 .step-inner,
	.step02 .step-inner,
	.step03 .step-inner,
	.step04 .step-inner {
		background-size: 41px!important;
	}
	.step-box {
		background-position: -22px 0;
	}
	.btn-order a.blank {
		width: 100%;
		max-width: 360px;
		display: block;
		padding-right: 15px;
		font-size: 1.6rem;
	}
	.flow-box h4 {
		font-size: 2rem;
		line-height: 1.5;
	}
	.flow-box p.btn,
	.flow-box p.btn-order {
		float: none;
	}
	.btn-border {
		width: auto;
	}
	.flow-box p.btn-border a {
		width: auto;
		font-size: 1.2rem;
	}
	.form-tab label {
		font-size: 1.2rem;
		width: 34%;
		line-height: 1.6;
	}
	.btn-portal.tac {
		width: 100%;
	}
	.btn-portal a {
		width: 100%;
		max-width: 360px;
		font-size: 2rem;
	}
	.btn-portal a span {
		font-size: 1.5rem;
	}
}