@charset "utf-8";

/*--------------------
firstview
--------------------*/
#firstview.underlayer {
	background: url(../images/post/index/fv.jpg) no-repeat center center/cover;
}

/*--------------------
post
--------------------*/
#post {
	background: #f5f1e7;
	padding: 130px 0 80px;
}

	#post .inner {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		width: 1100px;
	}
	
	#post #main {
		order: 2;
		width: 780px;
		box-shadow: 12px 12px 0 rgba(235,230,217,1);
	}
	
		#post #main .impressions {			
			display: flex;
			justify-content: flex-start;
			align-items: center;
			background: #c1aa83;
			padding: 20px 54px 16px 16px;
		}
					
			#post #main .impressions .icon {
				width: 25px;
				height: 25px;
			}
			
			#post #main .impressions .icon svg {
				width: 100%;
				height: auto;
			}
			
			#post #main .impressions .icon svg .cls-1 {
			    fill: #fff;
			}
			
			#post #main .impressions h2 {
				width: calc(100% - 25px);
				padding: 0 0 0 16px;
				box-sizing: border-box;
				font-size: 18px;
				color: #fff;
			}
		
		#post #main form {
			background: #fff;
			padding: 10px 30px 50px;
		}
		
			#post #main form dl {
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
				padding: 24px 0;
				border-bottom: solid 1px #eaebea;
			}
			
			#post #main form dl:last-of-type {
				border-bottom: none;
			}
			
			#post #main form dl dt {
				width: 115px;
				padding: 18px 0 0;
			}
			
			#post #main .confirm table {
				width: 100%;			
			}
			
			#post #main .confirm table th {
				width: 150px;
				box-sizing: border-box;
				padding: 24px 0;
				text-align: left;
			}
			
			#post #main .confirm table td {
				width: calc(100% - 150px);
				box-sizing: border-box;
				padding: 24px 0;
			}
			
			#post #main .confirm .btn {
				padding: 30px 0;
			}
			
			#post #main .btn .red {
				background: #b50500;
				color: #fff;
			}
			
			#post #main .btn a {
				min-width: 300px;
				border-radius: 4px;
				height: 53px;
				line-height: 53px;
				vertical-align: top;
			}
			
			#post #main .btn .back {
				background: #5e5e5e;
				color: #fff;
			}
			
			#post #main .error {
				 padding: 40px 0;
				 background: #fff;
			}
			#post #main .error .btn {
				padding: 30px 0;
			}

			#post #main .error .alert {
				color: #ff0000;
				padding: 10px 0;
				text-align: center;
			}
			
			#post #main form dl dd {
				width: calc(100% - 115px);
			}
			
			#post #main form dl dd input[type="text"],
			#post #main form dl dd textarea {
				width: 100%;
				box-sizing: border-box;
			}
			
			#post #main form .feature {
				display: block;
			}
			
			#post #main form .feature dt {
				width: 100%;
				padding: 0;
			}
			
			#post #main form .feature dd {
				width: 100%;
			}
			
			#post #main form .date_of_use {
			} 
			
			#post #main form .date_of_use dd {
				display: flex;
				justify-content: flex-start;
				align-items: center;
			} 
			
			#post #main form .date_of_use dd span {
				display: inline-block;
				padding: 0 16px 0 8px;
				font-size: 15px;
			}
			
			#post #main form .contents_of_use .select_shop_course {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin: 0 0 14px;
			}
			
			#post #main form .contents_of_use .select_shop_course .select_wrap:first-of-type {
				width: 297px;
			}
			
			#post #main form .contents_of_use .select_shop_course .select_wrap:last-of-type {
				width: 297px;
			}
			
			#post #main form .contents_of_use .select_shop_course .select_wrap select {
				width: 100%;
			}
			
			#post #main form .contents_of_use .select_women {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				flex-wrap: wrap;
			} 
			
			#post #main form .contents_of_use .select_women .select_wrap {
				width: 184px;
				margin: 0 10px 0 0;
			}
			
			#post #main form .contents_of_use .select_women .select_wrap select {
				width: 100%;
			} 
			
			#post #main form .contents_of_use .select_women .caution {
				margin: 12px 0 0;
				font-size: 14px;
			}
				
			#post #main form .feature {
				padding: 24px 0 14px;
			}
			
			#post #main form .feature dt {
				margin: 0 0 20px;
			}
			
			#post #main form .feature dd ul {
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				flex-wrap: wrap;
			}
			
			#post #main form .feature dd ul li {
				width: 20%;
				margin: 0 0 10px;
			}
			
			#post #main form .feature dd ul li label {
				font-size: 14px;
				line-height: 1.3;
			}
			
			#post #main form .feature dd ul li label input[type="checkbox"] {
				margin: 0 5px 0 0;
			}
			
			#post #main form .rate .select_rate {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				margin: 0 0 16px;
			}
			
			#post #main form .rate .select_rate .caution {
				margin: 0 0 0 15px;
				font-size: 15px;
			}
			
			#post #main form .btn input[type="submit"] {
				min-width: 300px;
				border-radius: 4px;
			}
			
	



/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px) {

/*--------------------
post
--------------------*/
#post {
	padding: 50px 0 80px;
}

	#post .inner {
		flex-direction: column;
		width: 90%;
	}
	
	#post #main {
		order: 1;
		width: 100%;
		box-shadow: 8px 8px 0 rgba(235,230,217,1);
	}
	
		#post #main .impressions {
			padding: 16px 54px 16px 16px;
		}
					
			#post #main .impressions .icon {
				width: 20px;
				height: 20px;
			}
			
			#post #main .impressions h2 {
				width: calc(100% - 20px);
				padding: 0 0 0 12px;
				font-size: 16px;
			}
		
		#post #main form {
			padding: 10px 20px 40px;
		}
		
			#post #main form dl {
				display: block;
				padding: 16px 0;
			}
			
			#post #main form dl:last-of-type {
				border-bottom: none;
			}
			
			#post #main form dl dt {
				width: 100%;
				padding: 0 0 10px;
				font-size: 14px;
			}
			
			#post #main form dl dd {
				width: 100%;
			}
			
			#post #main .confirm table th {
				width: 130px;
			}

			#post #main .confirm table th,
			#post #main .confirm table td {
				font-size: 14px;
			}
			
			#post #main .btn .back {
				margin: 10px 0 0;
				min-width: 240px;
			}


			#post #main form dl dd input[type="text"],
			#post #main form dl dd textarea {
				padding: 5px 10px;
			}
			
			#post #main form dl dd .select_wrap::before {
				right: 10px;
				top: 14px;
				bottom: inherit;
			}
			
			#post #main form dl dd .select_wrap select {
				padding: 6px 24px 6px 6px;
			}
			
			#post #main form .feature {
				display: block;
			}
			
			#post #main form .feature dt {
				width: 100%;
				padding: 0;
			}
			
			#post #main form .feature dd {
				width: 100%;
			}
			
			#post #main form .date_of_use {
			} 
			
			#post #main form .date_of_use dd {
				display: flex;
				justify-content: flex-start;
				align-items: center;
			} 
			
			#post #main form .date_of_use dd .year select {
				width: 75px;
			}
			
			#post #main form .date_of_use dd .month select,
			#post #main form .date_of_use dd .day select {
				width: 60px;
			}
			
			#post #main form .date_of_use dd span {
				display: inline-block;
				padding: 0 8px 0 2px;
				font-size: 14px;
			}
			
			
			#post #main form .contents_of_use .select_shop_course {
				display: block;
				margin: 0 0 10px;
			}
			
			#post #main form .contents_of_use .select_shop_course .select_wrap:first-of-type {
				width: 100%;
				margin: 0 0 10px;
			}
			
			#post #main form .contents_of_use .select_shop_course .select_wrap:last-of-type {
				width: 100%;
			}

			
			#post #main form .contents_of_use .select_women {
			} 
			
			#post #main form .contents_of_use .select_women .select_wrap {
				width: calc( (100% - 10px) / 2);
				margin: 0;
			}
			
			#post #main form .contents_of_use .select_women .select_wrap:first-of-type {
				margin: 0 10px 0 0;
			}
			
			#post #main form .contents_of_use .select_women .select_wrap select {
				width: 100%;
			} 
			
			#post #main form .contents_of_use .select_women .caution {
				margin: 10px 0 0;
				font-size: 11px;
			}
			
			#post #main form .hotel_of_use .select_wrap {
				width: 100%;
				height: auto;
			} 
			
			#post #main form .hotel_of_use .select_wrap select {
				width: 100%;
			}
			
				
			#post #main form .feature {
				padding: 15px 0;
			}
			
			#post #main form .feature dt {
				margin: 0 0 15px;
			}
			
			#post #main form .feature dd ul {
			}
			
			#post #main form .feature dd ul li {
				width: 50%;
				margin: 0 0 10px;
			}
			
			#post #main form .feature dd ul li label {
				font-size: 13px;
				line-height: 1.3;
			}
			
			#post #main form .feature dd ul li label input[type="checkbox"] {
				margin: -3px 0 0 0;
			}
			
			#post #main form .rate {
				padding: 0 0 20px;
			}
			
			#post #main form .rate .select_rate {
				margin: 0 0 10px;
			}
			
			#post #main form .rate .select_rate .caution {
				margin: 0 0 0 15px;
				font-size: 14px;
			}
			
			#post #main form .btn input[type="submit"] {
				min-width: 240px;
			}
			

}