@charset "utf-8";

/* 

===== CONTENTS ===========================================

	1：product_mainimage	
	2: product_link
	3: detail_area
	4: mobile_foot_contmenu_product
	5: product__title
	6: product__parts
	7: product__room
	8: product__menu
	9: product_main_text
 10: product__not-available
 11: product__relation
 12: product__images
 13: product__contact

==========================================================
*/

body:not(.product-top) {
	padding-top: 148px;
}

@media only screen and (max-width: 1499px) {
	body:not(.product-top) {
		padding-top: 128px;
	}
}

@media only screen and (max-width: 768px) {
	body:not(.product-top) {
		padding-top: 119px;
	}
}

.main_pc{display: block;}
.main_tb{display: none;}
.main_sp{display: none;}

p.interview_caption{ margin-top: 0.5em !important;}

.interview_caption .category {
	color: #CCCCCC;
	font-size: 13px;
	font-weight: bold;
	display: block;
	line-height: calc(18 / 13);
	margin-top: 8px;
}

.interview_caption .title {
	display: block;
	line-height: calc(24 / 16);
	margin-top: 4px;
}

.bg_gray {
	margin-bottom: 0;
}

/*
===== responce =====
*/
@media screen and (max-width: 768px) {
	.interview_caption .category {
		font-size: 11px;
		line-height: calc(18 / 13);
	}
}

/*
=========== 1: product_mainimage ===========
*/

figure.product_main{
	position: relative;  	
	}

.product_main_img{
	overflow: hidden;
	z-index: 0;
}
.product_main_img img{
    max-width: none !important;
}

.product_main_title {
	margin-top: 56px;
}

.product_main_top {
	max-width: 760px;
}

/*
===== responce =====
*/
@media screen and (max-width: 1060px){
	figure.product_main{margin-top: 0 !important;}
}

@media screen and (max-width: 768px) {	
	.main_pc{display: none;}
	.main_tb{display: block; width: 100%;}
	.main_sp{display: none;}

	.product_main_title {
		font-size: 18px;
		line-height: calc(30 / 18);
		margin-top: 42px;
	}

	.product_main_title + p {
		margin-top: 30px;
	}

	.product_main_title .leadtop {
		font-size: 14px;
    line-height: calc(26 / 14);
	}

	.product_main_lead .br {
		display: none;
	}
}

@media screen and (max-width: 480px){
.main_pc{display: none;}
.main_tb{display: none;}
.main_sp{display: block; width: 100%;}

p.interview_caption{ font-size:12px !important;}

}

/*
=========== 2: product_link ===========
*/
#product_mainimage_inner{
	max-width: 1024px;
	margin: 0 auto;	
	width: 90%;
}
#product_mainimage_inner div.product_link{
	position: absolute;
    width: 350px;
    bottom:0;
	font-size: 12px;
}
/**/
ul#menu{
    position: absolute;
	bottom: 0;
	left: 0;
	line-height: 16px;
	padding: 0;
    margin: 0;
}
ul#menu li.title_tx{
	font-size: 12px;
	font-weight: normal;
	background: none;
}
/**/
#menu li {
  position: relative;
  margin: 0;
    padding: 5px 5px 5px 10px;
    width: 190px;
  border-bottom: solid 1px #ccc;
  font-weight: bold;
  background: url(../../shared/img/white-65-trans.png) repeat;
  list-style: none;
  font-size: 12px !important;
}
#menu li a {
  display: inline-block;
  width: 180px;
  height: 20px;
  text-decoration:none !important;
  color: #000;
}
#menu li a:hover {
  color: #000;
  background: #fff;
}
#menu li:hover {
  color: #000;
  background: #fff;
}
#menu li.title_tx:hover {
  color: #000;
  background: none;
}

/*
===== responce =====
*/
@media screen and (max-width: 768px) {	
#product_mainimage_inner div.product_link{
	display: none;
}
}

/*
===== 3: detail_area ===========
*/
.leadtop {
	font-size: 18px;
	padding: 20px 10px 0 0;
	/* font-weight: normal; */
}

/**/

#detail_wrap{
	clear: both;
	width: 100%;
	height: 100%;
}
#detail_wrap #detail{
    width: 650px;
    height: 100%;
    padding: 0;
    margin: 40px auto 0 auto;
}

/**/

#item-box_wrap{
	clear: both;
	width: 100%;
	height: 100%;
	margin: 0 auto 40px auto;
}
/**/
#item-box_wrap div.spec_product{
	width: 30%;
	height: 100%;
	float: left;
	margin: 0;
	text-align: right;
	line-height: 2;
}	
#item-box_wrap.item-box_wrap--18 div.spec_product{
	width: 40%;
}
/**/
#item-box_wrap div.spec {
    width: 70%;
    float: left;
    padding: 0 0 5px 0;
	line-height: 2;
}
#item-box_wrap.item-box_wrap--18 div.spec {
	width: 60%;
}
#item-box_wrap div.spec dt {float: left; margin: 0 20px 0 0; width: 20%; text-align: right; color: #999; display: block;}
#item-box_wrap div.spec dl:after { content: ""; clear: both; display: block;}
#item-box_wrap div.spec dd { width: 100%;
    padding-left: 25%;
    word-wrap: initial;
	}
.mb30{margin-bottom:0 !important;}
#item-box_wrap div.spec dd.tx_end{line-height:1.2;}
/**//**//**/


span.end {font-size: 12px; color: #7f0019;}


/*
===== responce =====
*/

@media screen and (max-width: 768px) {	
#detail_wrap #detail{
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 40px auto 0 auto;
}
/**/
#item-box_wrap{
	clear: both;
	width: 90%;
	height: 100%;
	margin: 0 5% 40px 5%;
}
/**/
#item-box_wrap div.spec_product{
	width: 100%;
	height: 100%;
	float: none;
	margin: 0;
	text-align:left;
	font-size: 14px;
	line-height: 2;
}	
#item-box_wrap.item-box_wrap--18 div.spec_product{
	width: 100%;
}
/**/
#item-box_wrap div.spec {
    width: 100%;
    float: left;
    padding: 0 0 5px 0;
	font-size: 14px;
	line-height: 2;
	margin-top: 10px;
}
#item-box_wrap.item-box_wrap--18 div.spec {
	width: 100%;
}
#item-box_wrap div.spec dt {float: left;
    margin: 0 5% 0 0;
    width: 30%;
    text-align: left;
    color: #999;
    display: block;
	}
#item-box_wrap div.spec dl:after { content: ""; clear: both; display: block;}
#item-box_wrap div.spec dd {
	width: 65%;
    float: left;
    padding-left: 0;
	}
#item-box_wrap div.spec dd.mobile_gyoukan {line-height: 1px; padding-bottom: 15px;}
.mb30{margin-bottom:0 !important;}
/**//**//**/

#item-box2{
	width: 90%;
	padding: 0 5% 0 5%;
	margin-bottom: 15px;
	font-size:14px;
}
/**/
#item-box2 ul{
	display: block;
	width: 100%;
	height: 100%;
	margin: 20px 0;
	padding-left: 5%;
}
/**/
#item-box2 li{
	float: none;
	width: 100%;
	line-height: 2;
	font-size:14px;
}
#item-box2 li.after{clear:left;}

/**//**//**/

div.item_box_foot_tx{
	clear: both;
	width: 90%;
	height: 100%;
	padding: 0 5% 0 5%;
	margin-top: 30px;
}
span.end {font-size: 14px; color: #7f0019;}		
}

/*
=========== 4: mobile_foot_contmenu_product ===========
*/

#mobile_foot_contmenu_product{
	max-width: 1024px;
    padding: 0 15px;
}
/**/
#mobile_foot_contmenu_product ul{
    margin: 50px 0;
    padding: 0;
	border-top: 1px solid #ccc;
    background: #f5f5f5;
}
#mobile_foot_contmenu_product ul li{
    list-style: none;
    border-bottom: 1px solid #ccc;
    padding: 10px;
    font-size: 0.75em;
}
#mobile_foot_contmenu_product ul li a{
	display:block;
}
/*
===== responce =====
*/	
@media screen and (min-width: 769px) {	
#mobile_foot_contmenu_product{display:none;}
}
@media screen and (max-width: 768px) {	
#mobile_foot_contmenu_product{display:block;}
}

/*
=========== 5: product__title ===========
*/
.product__title {
	font-size: 16px;
	line-height: calc(28 / 16);
	margin: 66px 0 0;
	text-align: center;
}

.product__room .product__title {
	margin-top: 74px;
}

/*
===== responce =====
*/	
@media screen and (max-width: 768px) {
	.product__title {
		margin-top: 44px;
	}
}

/*
=========== 6: product__parts ===========
*/
.product__parts {
	width: 100%;
}
.product__parts_list {
	column-gap: 20px;
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	padding: 26px 18px 0;
	row-gap: 15px;
}

.product__parts_list::after {
	content: none;
}

.product__parts_item::after {
	content: none;
}

.product__parts_item_link {
	display: grid;
	row-gap: 5px;
	text-decoration: none !important;
}

.product__parts_item_image {
	aspect-ratio: 1 / 1;
	border-radius: 5px;
	object-fit: cover;
}

.product__parts_item_name {
	font-size: 11px;
	line-height: calc(12 /11);
	text-align: center;
}

/*
===== responce =====
*/	
@media screen and (max-width: 768px) {
	.product__parts_list {
		grid-template-columns: repeat(4, 1fr);
		padding: 26px 0 0;
	}
	.product__parts_item_name {
		font-size: 9px;
		line-height: calc(10 /9);
	}
}

/*
=========== 7: product__room ===========
*/
.product__room {
	width: 100%;
}
.product__room_list {
	column-gap: 20px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin-top: 48px;
	padding: 0 8px;
	row-gap: 24px;
}

.product__room_item_link {
	display: grid;
}

.product__room_item_image {
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	object-fit: cover;
}

.product__room_item_image.room1 {
	object-position: left;
}

.product__room_item_name {
	font-size: 14px;
	line-height: calc(26 / 14);
	margin-top: 4px;
	text-align: center;
}

/*
===== responce =====
*/	
@media screen and (max-width: 768px) {
	.product__room_list {
		column-gap: 10px;
		grid-template-columns: repeat(3, 1fr);
		margin-top: 24px;
		padding: 0;
		row-gap: 15px;
	}

	.product__room_item_name {
		font-size: 11px;
		line-height: calc(20 / 11);
	}
}


/*
=========== 8: product__menu ===========
*/
.product__menu {
	box-shadow: 0 3px 5px rgba(0, 0, 0, .16);
	left: 0;
	position: fixed;
	top: 80px;
	width: 100%;
	z-index: 1;
}

.product__menu_header {
	background: rgba(255, 255, 255, 0.8);
	display: flex;
	justify-content: center;
	padding: 20px 0 4px;
}

.product__menu_button {
	align-items: center;
	background: none;
	border: none;
	color: #191919;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	font-size: 12px;
	font-weight: bold;
	line-height: calc(22 / 12);
}

.product__menu_button_icon {
	transform: rotate(90deg);
}

.product__menu_list {
	background: rgba(255, 255, 255, 0.8);
	height: 0;
	opacity: 0;
	transition: all .3s ease-in-out;
	visibility: hidden;
}

.product__menu_list.visible {
	opacity: 1;
	visibility: visible;
}

.product__menu_list .product__parts_list {
	margin: 0 auto;
	max-width: 764px;
	padding: 26px 0 0;
}

/*
===== responce =====
*/	
@media only screen and (max-width: 1499px) {
	.product__menu {
		top: 60px;
	}
}

@media only screen and (max-width: 768px) {
	.product__menu_header {
		padding: 15px 0 0;
	}

	.product__menu_list .product__parts_list {
		max-width: 350px;
		padding: 26px 20px 0;
	}
}

/*
=========== 9: product_main_text ===========
*/
.product__main {
	width: 100%;
}
.product_main_text {
	display: grid;
	margin-top: 52px !important;
}

.product_main_text h2 {
	font-size: 24px;
	margin-top: 0;
}

.product_main_text p {
	margin-top: 24px;
	line-height: calc(30 / 16);
}

.product_main_text_link {
	align-items: center;
	align-self: start;
	border: 1px solid #CCCCCC;
	border-radius: 5px;
	column-gap: 6px;
	display: grid;
	font-size: 14px;
	font-weight: bold;
	grid-template-columns: 1fr 16px;
	justify-self: start;
	line-height: calc(26 / 14);
	padding: 14px 20px;
}

/*
===== responce =====
*/	
@media screen and (min-width: 769px) {
	.product_main_text p {
		grid-column: 1 / 3;
	}

	.product_main_text_link {
		grid-column: 2 / 3;
		justify-self: end;
	}
}

@media screen and (max-width: 768px) {
	.product_main_text {
		margin-top: 21px !important;
	}

	.product_main_text h2 {
		font-size: 18px;
		line-height: calc(30 / 18);
	}

	.product_main_text .leadtop {
		font-size: 14px;
		line-height: calc(26 / 14);
	}

	.product_main_text_link {
		font-size: 11px;
		grid-template-columns: 1fr 12px;
		line-height: calc(20 / 11);
		padding: 9px 15px;
	}
}

/*
=========== 10: product__not-available ===========
*/
.product__not-available {
	background: #3C3C43;
	display: grid;
	justify-content: center;
	margin-bottom: 0 !important;
	padding: 6px 5%;
}

.product__not-available p {
	color: #FFF;
	margin: 0;
}

/*
===== responce =====
*/
@media screen and (max-width: 768px) {
	.product__not-available p {
		display: block;
		font-size: 11px !important;
		line-height: calc(20 / 11);
		text-align: left;
		width: fit-content;
	}
}

@media only screen and (max-width: 480px) {
	.product__not-available {
		width: 100%;
	}
}

/*
=========== 11: product__relation ===========
*/

.product__relation h4 {
	font-size: 24px;
	line-height: calc(38 / 24);
	margin: 93px 0 44px;
	text-align: center;
}

.product__relation .cols {
	column-gap: 20px;
	display: flex;
	flex-wrap: wrap;
}

.product__relation .cols::after {
	content: none;
}

.product__relation .cols .col {
	width: calc(175 / 1024 * 100%);
}

.product__relation .cols .col img{
	aspect-ratio: 1 / 1;
	border-radius: 5px;
	object-fit: cover;
}

/*
===== responce =====
*/
@media screen and (min-width: 769px) {
	.product__relation .cols.center {
		justify-content: center;
	}
}
@media screen and (max-width: 768px) {
	.product__relation h4 {
		font-size: 18px;
		line-height: calc(30 / 18);
		margin: 30px 0;
	}

	.product__relation .cols {
		column-gap: 16px;
		row-gap: 10px;
	}

	.product__relation .cols .col {
		width: calc(50% - 8px);
	}
}

/*
=========== 12: product__images ===========
*/

.product__images .col {
	margin-bottom: 2%;
}

/*
=========== 13: product__contact ===========
*/

.product__contact .relatedLink {
	align-items: flex-end;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.product__contact .relatedLink .links {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.product__contact .relatedLink p {
	margin-bottom: 10px;
}

.product__contact a {
	font-weight: bold;
	line-height: calc(16 / 11);
	text-align: left;
}

.product__contact a span {
	color: #999;
	display: block;
	font-size: 11px;
	font-weight: normal;
	margin-top: 4px;
}

@media screen and (min-width: 769px) {
	.product__contact .relatedLink {
		text-align: right;
	}
}

@media screen and (max-width: 768px) {
	.product__contact .relatedLink {
		align-items: center;
		margin: 40px 0;
	}
}
