@charset "utf-8";
/* PC ================================================== */
@media all and (min-width:960px){
#product {
	width: 100%;
	padding: 100px 0px 270px;
}
	.product--inner {
		width: 90%;
		max-width: 1000px;
		margin: auto auto;
	}
		.product--inner .section-heading {
			width: 100%;
			margin: auto auto 95px;
			text-align: center;
		}
		.product-list {
			width: 100%;
		}
			.product-item {
				width: 100%;
				padding: 0px 0px 60px;
				margin: auto auto 60px;
				border-bottom: solid 1px #CCCCCC;
				position: relative;
			}
			.product-item:last-of-type {
				padding: 0px;
				margin: auto auto 0px;
				border-bottom: none;
			}
				.product-item_title {
					width: 50%;
					font-family: 'shippori-antique', sans-serif;
					font-size: 32px;
					font-weight: 700;
					line-height: 40px;
					color: #000000;
					position: absolute;
					top: 0;
					left: 0;
				}
					.tab-group {
						width: 335px;
						margin: auto 0px 40px auto !important;
						display: flex;
						justify-content: space-between;
						align-items: center;
					}
						.tab {
							width: 160px;
							height: 40px;
							background-color: #F2F2F2;
							font-family: 'shippori-antique', sans-serif;
							font-size: 20px;
							font-weight: 400;
							text-align: center;
							line-height: 40px;
							color: #CCCCCC;
							cursor: pointer;
						}
						.tab.is-active {
							background-color: #BEA76D;
							color: #FFF;
							transition: all 0.2s ease-out;
						}

					.panel-group {
						width: 100%;
					}
						.panel {
							display: none;
						}
						.panel.is-show {
							display: block;
							animation-name: panel-fadein;
							animation-duration: .8s;
							-webkit-animation-duration: .8s;
						}
						@keyframes panel-fadein {
							0% {
								opacity: 0;
								transform: translate(0%,5px);
								-webkit-transform: translate(0%,5px);
							}
							100% {
								opacity: 1;
								transform: translate(0%,0px);
								-webkit-transform: translate(0%,0px);
							}
						}
							.panel-inner {
								width: 100%;
								display: flex;
								justify-content: space-between;
								align-items: flex-start;
							}
								.panel-item {
									width: 47.5%;
									height: auto;
								}
									.product-image {
										width: 100%;
										/* height: auto; */
										height: 300px;
										margin: auto auto 25px;
										overflow: hidden;
									}
										.product-image img {
											width: 100%;
											height: auto;
										}

									.product-btn_list {
										width: 100%;
										display: flex;
										justify-content: space-between;
										align-items: center;
									}
										.product-btn {
											display: block;
											width: 47.6%;
											height: 44px;
											border-radius: 22px;
											font-family: 'shippori-antique', sans-serif;
											font-size: 16px;
											text-align: center;
											line-height: 44px;
											letter-spacing: 0.0em;
											color: #ffffff;
											position: relative;
											transition: .2s ease-out;
											-webkit-transition: .2s ease-out;
										}
											.product-btn:after {
												content: '';
												border-top: 3px solid transparent;
												border-bottom: 3px solid transparent;
												border-left: 4px solid #ffffff;
												position: absolute;
												top: 50%;
												right: 15px;
												transform: translate(0%,-50%);
												-webkit-transform: translate(0%,-50%);
												transition: .2s ease-out;
												-webkit-transition: .2s ease-out;
											}
											.product-btn:hover:after {
												right: 13px;
											}
										.product-btn_details {
											background-color: #0C4EA3;
										}
										.product-btn_details:hover {
											background-color: #0F66D0;
										}
										.product-btn_contact {
											background-color: #BEA76D;
										}
										.product-btn_contact:hover {
											background-color: #CCB98E;
										}
}

/* Tablet ================================================== */
@media all and (min-width:560px) and (max-width:959px){
#product {
	width: 100%;
	padding: 40px 0px 200px;
}
	.product--inner {
		width: 90%;
		margin: auto auto;
	}
		.product--inner .section-heading {
			width: 100%;
			margin: auto auto 45px;
			text-align: center;
		}
		.product-list {
			width: 100%;
		}
			.product-item {
				width: 100%;
				padding: 0px 0px 60px;
				margin: auto auto 60px;
				border-bottom: solid 1px #CCCCCC;
				position: relative;
			}
			.product-item:last-of-type {
				padding: 0px;
				margin: auto auto 0px;
				border-bottom: none;
			}
				.product-item_title {
					width: 50%;
					font-family: 'shippori-antique', sans-serif;
					font-size: 32px;
					font-weight: 700;
					line-height: 40px;
					color: #000000;
					position: absolute;
					top: 0;
					left: 0;
				}
					.tab-group {
						width: 335px;
						margin: auto 0px 40px auto !important;
						display: flex;
						justify-content: space-between;
						align-items: center;
					}
						.tab {
							width: 160px;
							height: 40px;
							background-color: #F2F2F2;
							font-family: 'shippori-antique', sans-serif;
							font-size: 20px;
							font-weight: 400;
							text-align: center;
							line-height: 40px;
							color: #CCCCCC;
							cursor: pointer;
						}
						.tab.is-active {
							background-color: #BEA76D;
							color: #FFF;
							transition: all 0.2s ease-out;
						}

					.panel-group {
						width: 100%;
					}
						.panel {
							display: none;
						}
						.panel.is-show {
							display: block;
							animation-name: panel-fadein;
							animation-duration: .8s;
							-webkit-animation-duration: .8s;
						}
						@keyframes panel-fadein {
							0% {
								opacity: 0;
								transform: translate(0%,5px);
								-webkit-transform: translate(0%,5px);
							}
							100% {
								opacity: 1;
								transform: translate(0%,0px);
								-webkit-transform: translate(0%,0px);
							}
						}
							.panel-inner {
								width: 100%;
								display: flex;
								justify-content: space-between;
								align-items: flex-start;
							}
								.panel-item {
									width: 47.5%;
									height: auto;
								}
									.product-image {
										width: 100%;
										/* height: auto; */
										height: 206px;
										margin: auto auto 25px;
										overflow: hidden;
									}
										.product-image img {
											width: 100%;
											height: auto;
										}

									.product-btn_list {
										width: 100%;
									}
										.product-btn {
											display: block;
											width: 100%;
											height: 44px;
											border-radius: 22px;
											font-family: 'shippori-antique', sans-serif;
											font-size: 16px;
											text-align: center;
											line-height: 44px;
											letter-spacing: 0.0em;
											color: #ffffff;
											position: relative;
											transition: .2s ease-out;
											-webkit-transition: .2s ease-out;
										}
											.product-btn:after {
												content: '';
												border-top: 3px solid transparent;
												border-bottom: 3px solid transparent;
												border-left: 4px solid #ffffff;
												position: absolute;
												top: 50%;
												right: 15px;
												transform: translate(0%,-50%);
												-webkit-transform: translate(0%,-50%);
												transition: .2s ease-out;
												-webkit-transition: .2s ease-out;
											}
										.product-btn_details {
											background-color: #0C4EA3;
											margin: auto auto 12px;
										}
										.product-btn_contact {
											background-color: #BEA76D;
										}
}

/* SP ================================================== */
@media all and (max-width:559px){
#product {
	width: 100%;
	padding: 40px 0px 200px;
}
	.product--inner {
		width: 90%;
		margin: auto auto;
	}
		.product--inner .section-heading {
			width: 100%;
			margin: auto auto 60px;
			text-align: center;
		}
		.product-list {
			width: 100%;
		}
			.product-item {
				width: 100%;
				padding: 0px 0px 45px;
				margin: auto auto 35px;
				border-bottom: solid 1px #CCCCCC;
			}
			.product-item:last-of-type {
				padding: 0px;
				margin: auto auto 0px;
				border-bottom: none;
			}
				.product-item_title {
					width: 100%;
					margin: auto auto 35px;
					font-family: 'shippori-antique', sans-serif;
					font-size: 32px;
					font-weight: 400;
					line-height: 40px;
					text-align: center;
					color: #000000;
				}
					.tab-group {
						width: 100%;
						margin: auto auto 25px !important;
						display: flex;
						justify-content: space-between;
						align-items: center;
					}
						.tab {
							width: 48%;
							height: 40px;
							background-color: #F2F2F2;
							font-family: 'shippori-antique', sans-serif;
							font-size: 16px;
							font-weight: 400;
							text-align: center;
							line-height: 40px;
							color: #CCCCCC;
							cursor: pointer;
						}
						.tab.is-active {
							background-color: #BEA76D;
							color: #FFF;
							transition: all 0.2s ease-out;
						}

					.panel-group {
						width: 100%;
					}
						.panel {
							display: none;
						}
						.panel.is-show {
							display: block;
							animation-name: panel-fadein;
							animation-duration: .8s;
							-webkit-animation-duration: .8s;
						}
						@keyframes panel-fadein {
							0% {
								opacity: 0;
								transform: translate(0%,5px);
								-webkit-transform: translate(0%,5px);
							}
							100% {
								opacity: 1;
								transform: translate(0%,0px);
								-webkit-transform: translate(0%,0px);
							}
						}
							.panel-inner {
								width: 100%;
							}
								.panel-item {
									width: 100%;
									height: auto;
									margin-bottom: 45px;
								}
								.panel-item:last-of-type {
									margin: auto auto 0px;
								}
									.product-image {
										width: 100%;
										/* height: auto; */
										height: 212px;
										margin: auto auto 13px;
										overflow: hidden;
									}
										.product-image img {
											width: 100%;
											height: auto;
										}

									.product-btn_list {
										width: 100%;
									}
										.product-btn {
											display: block;
											width: 100%;
											height: 44px;
											border-radius: 22px;
											font-family: 'shippori-antique', sans-serif;
											font-size: 14px;
											text-align: center;
											line-height: 44px;
											letter-spacing: 0.0em;
											color: #ffffff;
											position: relative;
											transition: .2s ease-out;
											-webkit-transition: .2s ease-out;
										}
											.product-btn:after {
												content: '';
												border-top: 3px solid transparent;
												border-bottom: 3px solid transparent;
												border-left: 4px solid #ffffff;
												position: absolute;
												top: 50%;
												right: 15px;
												transform: translate(0%,-50%);
												-webkit-transform: translate(0%,-50%);
												transition: .2s ease-out;
												-webkit-transition: .2s ease-out;
											}
										.product-btn_details {
											background-color: #0C4EA3;
											margin: auto auto 12px;
										}
										.product-btn_contact {
											background-color: #BEA76D;
										}
}