/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}
 
.cf:after {
    clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
	clear: both;
}


img {
	max-width: 100%;
	height: auto;
}

#plan_detail {
	text-align: left;
	
	//[ SP ]
	@media screen and (max-width: 640px) {
		font-size: 90%;
	}
	
	
	.plan-title {
		.base {
			background-color: rgba(176,147,69,0.35);
			font-size: 24/16em;
			line-height: 1.4em;
			padding: 10/24em;
			box-sizing: border-box;
			min-height: 60/24em;

			img {
				display: inline-block;
				width: 76/24em;
				vertical-align: middle;
			}
			
			span {
				vertical-align: bottom;
			}
			
			&:after {
				content: "";
				display: block;
				clear: both;
				padding-bottom: 1px;
				margin-bottom: -1px;
				width: 100%;
			}
		}
		
		//[ SP ]
		@media screen and (max-width: 640px) {
			padding: 0;
			.base {
				img {
					display: none;
				}				
			}
		}
	}
	
	
	.img_gallery {
		background-color: rgba(255,255,255, 0.35);
		margin-bottom: 25/16em;
		
		.container {
			padding: 20/16em 17/16em;
			padding-bottom: 0;
	
			.item {
				img {
					display: block;
					width: 100%;
					line-height: 0;
				}
				.caption {
					line-height: 22/16em;
					padding: 0.5em 0;
				}
			}

			.big {
				width: 540/930*100%;
				float: left;
				position: relative;
				
				.item {
					.caption {
						font-size: 18/16em;
						line-height: 28/18em;
					}
					
					&:not(:nth-child(1)) {
						position: absolute;
						top: 0;
						left: 0;
						width: 100%;
					}
				}
			}

			.small {
				width: (930-540)/930*100%;
				float: right;
				letter-spacing: -1em;

				.item {
					display: inline-block;
					vertical-align: top;
					letter-spacing: 0;
					width: 50%;
					box-sizing: border-box;
					padding-left: 10/16em;
					padding-bottom: 1em;
					
					.photo {
						position: relative;
						
						&:before {
							content: "";
							display: block;
							position: absolute;
							top: 0;
							left: 0;
							width: 100%;
							height: 100%;
							background-color: rgba(255,255,255,0);
							z-index: 1;
						}
					}
					

					//[ PC ]
					@media screen and (min-width: 641px) {

						&.on {
							.photo {
								&:before {
									background-color: rgba(255,255,255,0.7);
								}
							}
						}

					}//[ PC ]
					
				}
				
				//[ SP ]
				@media screen and (max-width: 640px) {
					&:not(.slick-initialized) li:not(:nth-child(1)) {
						display: none;
					}
				}//[ SP ]

			}//.small		
			
		}//.container
		
		
		.slick-arrow {
			position: absolute;
			background: none;
			border: none;
			outline: none;
			top: 50%;
			margin-top: -1em;
			height: 2em;
			width: 15px;
			overflow: hidden;
			text-indent: -9999px;
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			
			&.slick-prev {
				left: -20px;
				background-image: url(../img/plan/arrow.svg);
				transform: rotate(180deg);
			}
			
			&.slick-next {
				right: -20px;
				background-image: url(../img/plan/arrow.svg);
			}
		}
		
		
		//[ SP ]
		@media screen and (max-width: 640px) {
			background-color: transparent;
			
			.container {
				
				.big {
					display: none;
				}
				
				.small {
					width: 100%;
					float: none;
					letter-spacing: 0;
					
					.item {
						width: 100%;
						padding-left: 0;
						padding-bottom: 0;
					}
				}
			}
		}
		
	}//.img_gallery
	
	.content01 {
		.headerarea {
			//background-color: #FFE2E6;
			background-color: rgba(176, 147, 69, 0.35);
			
			.icon {
				float: left;
				width: 118/16em;
			}
			
			.description {
				margin-left: 118/16em;
				padding: 0.7em 1.5em;
				box-sizing: border-box;
				
				.label {
					margin-bottom: 0.75em;
					
					span {
						display: inline-block;
						font-size: 12/16em;
						line-height: 0.95em;
						white-space: nowrap;
						border: 2/12em solid #BA0000;
						border-radius: 4.577/12em;
						color: #BA0000;
						padding: 0.4em 0.5em;
						margin-right: 0.5em;
					}
				}
				
				.text {
					font-size: 18/16em;
					line-height: 27/18em;
				}
			}//.description 
		}//.headerarea
		
		.body {
			background-color: #fff;
			padding-left: 118/16em;
			box-sizing: border-box;
			
			.art-body {
				padding: 35/16em 48/16em;
				padding-left: 1.5em;
			}
		}
		
		@media screen and (max-width: 640px) {
			.headerarea {
				.icon {
					display: none;
				}

				.description {
					margin-left: 0;
					padding: 1.5em;
				}
			}
			.body {
				padding-left: 0;
				
				.art-body {
					padding: 1em;
				}
			}
		}
	}
	
	
	.buttons {
		text-align: center;
		padding: 2em 0;
		
		a {
			width: 45%;
			display: inline-block;
			margin: 1em;
		}
		
		@media screen and (max-width: 640px) {
			
			a {
				width: 400px;
				max-width: 90%;
				margin: 1em auto;
			}
			
		}
	}
	
}//#plan_detail




.art-body {
	table.type01 {
		width: 100%;
		border-bottom: 2px solid #000;
		border-collapse: inherit;
		margin-bottom: 2em;
		
		tr {
			th,td {
				border-bottom: 1px solid #B3B3B3;
				padding: 1em 0;
				line-height: 1.35em;
			}
			
			td {
				h4 {
					font-size: 21/16em;
					font-weight: bold;
					color: #B20000;
				    margin: 0.5em 0;
				}
				
				h5 {
					font-size: 18/16em;
					margin-bottom: 0.5em;
				}
			}
			
			th {
				padding-right: 1em;
				white-space: nowrap;
			}
		}
		
		.header {
			th,td {
				background-color: #C4DBE7;
				font-size: 18/16em;
				line-height: 1.6em;
				padding: 0.6em 1em;
				border-bottom: none;
				color: #000;
			}
		}
		
		.description {
			th,td {
				font-size: 14/16em;
				line-height: 1.75em;
				color: #000;
				border-bottom: none;
				padding: 1.5em 0;
			}
		}
	}
	
	
	.table_type02 {
		margin: -10px;
		
		table {
			width: 100%;
			border-collapse: separate;
			border-spacing: 5px;
			margin-bottom: 2em;

			tr {
				th,td {
					padding: 1em 1.5em;
					line-height: 1.35em;
					background-color: #fff;
				}

				td {
					font-size: 18/16em;
					line-height: 1.5em;
				}

				th {
					font-size: 21/16em;
					padding-right: 1em;
					white-space: nowrap;
					vertical-align: middle;
				}
			}

			.header {
				th,td {
					background-color: #FFCCD3;
					font-size: 24/16em;
					line-height: 1.6em;
					padding: 0.6em 1em;
					border-bottom: none;
					color: #000;
				}
			}

			.description {
				th,td {
					font-size: 14/16em;
					line-height: 1.75em;
					color: #000;
					border-bottom: none;
					padding: 1.5em 0;
				}
			}

			//[ SP ]
			@media screen and (max-width: 640px) {
				tr {
					display: block;

					th, td {
						display: block;
						margin-bottom: 5px;
						padding: 0.5em 1em;
						width: 100%;
						box-sizing: border-box;
					}

					td {
						background-color: rgba(0,0,0,0.1);
						padding: 1em;
					}

					th {
					}
				}

				.header {
					th,td {
						padding: 0.25em 0.5em;
					}
				}

				.acmode {
					th {
						position: relative;

						&:after {
							content: "";
							display: inline-block;
							background-image: url(../img/plan/acmode_arrow.png);
							background-size: contain;
							background-repeat: no-repeat;
							background-position: center;
							width: 1em;
							height: 1em;
							position: absolute;
							right: 1em;
							top: 0.65em;
							z-index: 1;
						}

						&.open:after {
							transform: rotate(180deg);
						}
					}
				}

			}
		}
	}
	
	
	.table_type03 {
		background-color: #fff;
	    padding-bottom: 1px;
	    margin-bottom: 3em;
		
		.header {
			background-color: #FFCCD3;
			font-size: 24/16em;
			line-height: 1.6em;
			padding: 0.6em 1em;
			border-bottom: none;
			color: #000;
		}
		
		table {
			width: 92%;
			margin: 4%;
			tr {
				th {
					width: 35%;
					padding-bottom: 1em;
				}
				
				td {
					width: 65%;
					padding-left: 1.5em;
					line-height: 24/16em;
					padding-bottom: 1em;
					
					h3 {
						color: #AD0000;
					}
					
					.small {
						font-size: 12/16em;
					}
				}
			}
		}
		
		//[ SP ]
		@media screen and (max-width: 640px) {
			table {
				tr {
					display: block;
					padding-bottom: 1em;
					
					th,td {
						width: 100%;
						display: block;
						padding-left: 0;
					}
				}
			}
		}
		
	}//.table_type03
	
	
	h3 {
		font-size: 18/16em;
		line-height: 1.5em;
		margin-bottom: 0.75em;
		font-weight: bold;
	}
	
	hr {
		padding: 0;
		border: none;
		border-bottom: 1px dotted #000;
		margin: 1.75em 0;
	}
	
	
	.layout01 {
		.fl { float: left; }
		.fr { float: right; }
		
		.col2 {
			margin: 0 -1%;
			.item {
				width: 50%;
				box-sizing: border-box;
				padding: 1%;
			}
		}
		
		.col3 {
			margin: 0 -0.5%;
			
			.item {
				width: 33.3333%;
				box-sizing: border-box;
				padding: 0.5%;
			}
		}
		
		h3 {
			background-color: #FFCCD3;
			font-size: 18/16em;
			line-height: 1.6em;
			padding: 0.6em 1em;
		}
		
		h4 {
			font-size: 18/16em;
			line-height: 1.6em;
			margin-top: 1em;
			margin-bottom: 0.5em;
		}
		
		//[ SP ]
		@media screen and (max-width: 640px) {
			.col2 {
				margin: 0;
				.item {
					width: 100%;
					padding: 0;
					padding-bottom: 1em;
				}
			}
		}
		
	}//.layout01
	
	
	.layout46 {
		.item_l {
			float: left;
			width: 40%;
		}
		.item_r {
			float: right;
			width: 60%;
			box-sizing: border-box;
			padding-left: 1.5em;
		}
		
		
		//[ SP ]
		@media screen and (max-width: 640px) {
			.item_l {
				width: 45%;
			}
			.item_r {
				width: 55%;
				padding-left: 1em;
			}
		}
	}
}