@charset "utf-8";



/* common
----------------------------------------------------------- */
div#contents{
	overflow:hidden;
}
div#contents div.inner{
	width:1024px;
	margin:0 auto;
}
div#contents div h1.ttl{
	width:100vw;
	margin:0 0 15px calc(-50vw + 512px);
	padding:15px 0;
	color:#ff7f17;
	font-size:24px;
	font-weight:bold;
	line-height:1;
	background:#000;
}
div#contents div h2.sttl{
	margin:0 auto 15px;
	padding:0;
	font-size:20px;
	text-align:center;
	border-bottom:5px #ddd solid;
}
div#contents div.box{
	width:1024px;
	margin:0 auto;
}
div#contents div.box table,
div#contents div.box p{
	width:100%;
	margin:0 auto 60px;
}
div#contents div.box table{
	border-bottom:1px #ccc solid;
}
div#contents div.box table th,
div#contents div.box table td{
	padding:5px 10px;
	border-top:1px #ccc solid;
}
div#contents div.box table th{
	min-width:30%;
	background-color:#ecf0f1
}
@media screen and (max-width:1144px){
	div#contents div.inner {
	  width: 100%;
	}
	div#contents div h1.ttl{
		margin:0 0 30px -5.55%
	}
	div#contents div.box{
		width:100%;
	}
}

/* pic
----------------------------------------------------------- */
ul.pic{
	width:500px;
	float:left;
	margin:0 auto 60px;
	overflow:hidden;
}
ul.pic li{
	width:calc(25% - 11.25px);
	margin:0 15px 15px 0;
}
ul.pic li:not(.main){
	cursor:pointer;
}
ul.pic li:nth-child(4n+1){
	margin-right:0;
}
ul.pic li.main{
	width:100%;
}
ul.pic li.main img{
	transition:none!important;
}
ul.pic li:not(.main) img:hover{
	opacity:0.5;
}
@media screen and (max-width:1144px){
	ul.pic{
		width:auto;
		float:none;
		margin-bottom:30px;
	}
	ul.pic li.main{
		width:49%;
		float:left;
		margin:0 3% 0 0;
	}
	ul.pic li{
		width:15.33%;
		margin:0 1% 1% 0;
	}
	ul.pic li:nth-child(4n+1){
		margin-right:1%;
	}
	ul.pic li:nth-child(3n+1){
		margin-right:0;
	}
	ul.pic li:first-child{
		margin-right:3%;
	}
}

/* info
----------------------------------------------------------- */
div.info{
	width:480px;
	float:right;
	margin:0 auto 60px;
	overflow:hidden;
}
div.info h2.ttl{
	margin-bottom:15px;
	padding-bottom:25px;
	color:#007dff;
	font-size:24px;
	font-weight:bold;
	border-bottom:5px #e1e1e1 solid;
}
div.info p.outline{
	margin-bottom:15px;
	padding-bottom:15px;
	border-bottom:5px #e1e1e1 solid;
}
div.info dl#add_info{
	margin-bottom:15px;
}
div.info dl#add_info dt,
div.info dl#add_info dd{
	margin-top: 5px;
	padding:2px 10px 2px 5px;
}
div.info dl#add_info dt{
	width:calc(25% - 15px);
	background-color:#f0f0f0;
}
div.info dl#add_info dd{
	width:calc(75% - 15px - 15px);
}
div.info dl#detail_info{
	margin-bottom:15px;
}
div.info dl#detail_info dt,
div.info dl#detail_info dd{
	width:calc(25% - 15px);
	margin:5px 0 0 0;
	padding:2px 10px 2px 5px;
	font-size:14px;
}
div.info dl#detail_info dd:nth-child(4n){
	margin-right:0;
}
div.info dl#detail_info dt:nth-child(2n+1){
	background-color:#f0f0f0;
}

ul#equipments_icon li{
	width:calc(25% - 7.5px - 2px);
	margin:0 10px 10px 0;
	color:#c8c8c8;
	font-size:12px;
	text-align:center;
	border:1px #c8c8c8 solid;
}
ul#equipments_icon li:nth-child(4n){
	margin-right:0;
}
ul#equipments_icon li.on{
	color:#fff;
	border:1px #007dff solid;
	background-color:#007dff;
}
@media screen and (max-width:1144px){
	div.info{
		width:auto;
		float:none;
	}
	ul#equipments_icon li{
		width:calc(20% - 8px - 2px);
	}
	ul#equipments_icon li:nth-child(4n){
		margin-right:10px;
	}
	ul#equipments_icon li:nth-child(5n){
		margin-right:0;
	}
}

/* fee
----------------------------------------------------------- */
div#fee{}

/* equipments
----------------------------------------------------------- */
div#equipments{}

/* contract
----------------------------------------------------------- */
div#contract{}


/* btn
----------------------------------------------------------- */
div#contract + p{
	width: calc(100% - 60px);
	max-width: 964px;
	padding:0 30px;
	text-align:center;
	letter-spacing:-0.4em;
}
div#contract + p a.btn{
	display:inline-block;
	width:calc(50% - 30px);
	margin: 15px;
	vertical-align:top;
	letter-spacing:normal;
}
@media screen and (max-width:540px){
	div#contract + p{
		width:100%;
		padding:0;
	}
	div#contract + p a.btn{
		width:calc(50% - 20px);
		margin: 15px 5px;
	}
}
@media screen and (max-width:420px){
	div#contract + p a.btn{
		width:calc(100% - 30px);
		margin: 15px;
	}
	div#contract + p a.btn + a.btn{
		margin-top: 0;
	}
}


/* outline_delete
----------------------------------------------------------- */
div.info p.outline{
	display:none;
}
