@charset "utf-8";
body {
	width: 100%;
	background-color: #fff;
}
@media screen and (min-width:641px) {
	.sp {display: none;}
}
@media screen and (max-width:640px) {
	.pc {display: none;}
}

/* header */
#header {
	width: 100%;
	background-color: #fff;
	-webkit-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
	   -moz-box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
			box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
}
#header h1,
#header .name {
	text-align: left;
	padding-left: 1em;
}
#header .top_tch {
	color: #585858;
	/*text-align: center;*/
	padding-left: 3.2em;
}
#header .top_tch a {
	color: #585858;
	text-decoration: none;
}
#header .wrap {position: relative;}
#header .logo {
	width: 140px;
	position: fixed;
	right: 90px;
	top: 30px;
	z-index: 104;
}
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, #main {padding-top: 75px;} /* ie11 */
}
#main {overflow: hidden;}

@media screen and (min-width:641px) {
	#header {height: 75px;}
	#main {padding-top: 75px;}

	#header h1,
	#header .name {padding-top: 18px;}
	#header .top_tch {font-size: 1.2rem;}
}
@media screen and (max-width:640px) {
	#header {
		height: 105px;
		transition: all 0.3s;
	}
	#main {padding-top: 105px;}
	#header h1,
	#header .name {
		padding-top: 26px;
		transition: all 0.3s;
		position: relative;
		z-index: 102;
	}
	#header h1 img,
	#header .name img {width: 220px;}
	#header .top_tch {
		font-size: 3vw;
		position: relative;
		z-index: 102;
	}
	#header .logo {
		width: 20vw;
		top: 6.5%;
		right: 120px;
	}
	.fixed #header {height: 70px;}
	.fixed #header .top_tch {display: none;}
	.fixed #header h1,
	.fixed #header .name {padding-top: 20px;}
	.fixed #header .logo {top: 4%;right: 90px;}
}
@media screen and (max-width:480px) {
	#header {height: 60px;}
	#main {padding-top: 60px;}
	#header h1,
	#header .name {padding-top: 14px;}
	#header h1 img,
	#header .name img {width: 130px;}
	#header .top_tch {font-size: 3vw;}
	#header .logo {
		width: 24vw;
		top: 25px;
		right: 70px;
	}

	.fixed #header {height: 40px;}
	.fixed #header h1,
	.fixed #header .name {padding-top: 12px;}
	.fixed #main {padding-top: 40px;}
	.fixed #header .logo {top: 2%;right: 11vw;}
}
@media screen and (max-width:360px) {
	.fixed #header .logo {top: 2%;right: 12vw;}
}

/* footer */
#footer {background-color: #333;}
#footer .copyright {
	color: #d7d7d7;
	text-align: center;
	background-color: #000;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
}
#footer .ft_link,
#footer .ft_link i,
#footer .ft_address {
	color: #d7d7d7;
	text-decoration: none;
	font-style: normal;
}
.btn_ft {
	color: #000;
	text-align: center;
	text-decoration: none;
	display: block;
	background-color: #fff;
	transition: all 0.3s;
}
.btn_ft:hover {opacity: 0.7;}

/* go top */
.gotop {
	text-align: center;
	width: 100%;
}
.btn_gotop {
	text-decoration: none;
	display: block;
}


@media screen and (min-width:641px) {
	#footer .copyright {
		font-size: 1.2rem;
		height: 60px;
	}
	#footer .wrap_ft_flex {
		max-width: 1280px;
		padding: 4vh 10px;
		margin: auto;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	#footer .ft_info {
		width: 40%;
		max-width: 620px;
	}
	#footer .ft_link:nth-of-type(2) {width: 35%;}
	#footer .ft_link:nth-of-type(3) {width: 25%;}
	#footer .ft_link {
		max-width: 330px;
		position: relative;
	}
	#footer .ft_h1 {
		width: 60%;
		max-width: 320px;
		margin-bottom: 25px;
	}
	#footer .ft_h2 {
		width: 40%;
		max-width: 180px;
		margin-bottom: 15px;
	}
	#footer .ft_address {font-size: 2vw;}
	#footer .ft_li {
		font-size: 2vw;
		font-weight: 700;
		margin-bottom: 15px;
	}
	#footer .ft_lis {
		font-weight: 200;
		margin: 12px 0 0 1.2em;
	}
	#footer .ft_li .ft_lis i {font-size: 1.6vw;}
	#footer .ft_li_oth {
		font-size: 1.6vw;
		margin-bottom: 12px;
	}
	#footer .ft_contact {
		position: absolute;
		bottom: 18px;
	}
	#footer .btn_ft {
		font-size: 2vw;
		width: 140px;
		height: 40px;
		line-height: 40px;
	}

	.btn_gotop {
		color: #fff;
		font-size: 1.6vw;
		background-color: #000;
		padding: 1.2em 0 1em;
	}
	.btn_gotop::before {
		content: url(../images/gotop_wh.svg);
		display: block;
		margin: auto;
	}
}
@media screen and (min-width:768px) {
	#footer .ft_info {width: 40%;}
	#footer .ft_link:nth-of-type(2) {width: 35%;}
	#footer .ft_link:nth-of-type(3) {width: 25%;}
	#footer .ft_address {font-size: 1.6vw;}
	#footer .ft_li {font-size: 1.8vw;}
	#footer .ft_li_oth,
	#footer .ft_li .ft_lis i {font-size: 1.4vw;}
	#footer .btn_ft {
		font-size: 1.8vw;
		width: 150px;
	}
	.btn_gotop {font-size: 1.4vw;}
}
@media screen and (min-width:980px) {
	#footer .wrap_ft_flex {padding: 100px 5px 80px;}

	#footer .ft_h1 {margin-bottom: 40px;}
	#footer .ft_h2 {margin-bottom: 15px;}
	#footer .ft_li,
	#footer .ft_address {font-size: 1.6rem;}
	#footer .ft_li_oth,
	#footer .ft_li .ft_lis i {font-size: 1.6rem;}
	#footer .btn_ft {
		font-size: 1.6rem;
		width: 160px;
		height: 50px;
		line-height: 50px;
	}
	#footer .ft_info {padding-left: 10px;}
	.btn_gotop {font-size: 1.4rem;}
/*	.gotop {bottom: 10px;}*/
}
@media screen and (min-width:1280px) {
	#footer .wrap_ft_flex {padding: 100px 0;}
	#footer .ft_info {
		width: 50%;
		padding-left: 0px;
	}
	#footer .ft_link:nth-of-type(2),
	#footer .ft_link:nth-of-type(3) {width: 25%;}
}
@media screen and (min-width:1281px) {
}
@media screen and (max-width:640px) {
	.gotop {
		text-align: center;
		background-color: #fff;
	}
	.gotop.brand {background-color: #f1f1f1;}
	.btn_gotop {
		color: #000;
		font-size: 2.4vw;
		text-decoration: none;
		display: block;
		padding: 30px 0;
	}
	.btn_gotop::before {
		content: '';
		display: block;
		margin: auto;
		background: url(../images/gotop.svg) 50% 0 no-repeat;
		width: 27px;
		height: 30px;
	}
	
	/*#footer .ft_link {display: none;}*/
	#footer .ft_info {
		padding: 50px 25px 35px;
	}
	#footer .ft_h1 {
		width: 65%;
		margin-bottom: 35px;
	}
	#footer .ft_h2 {margin-bottom: 20px;}
	#footer .ft_address {
		display: none;
/*		font-size: 2.4vw;
		line-height: 1.8;*/
	}
	
	#footer .ft_ul_sub {display: none;}
	#footer .ft_link {
		color: #000;
		display: block;
	}
	#footer .ft_link.pc {display: none;}
	#footer .ft_li_oth,
	#footer .ft_li {
		background-color: #d7d7d7;
		border-top: 1px solid #333;
	}
	#footer .ft_li_oth .ft_link,
	#footer .ft_li > .ft_link {
		font-size: 2.6vw;
		padding: 1em 15px;
	}
	#footer .ft_lis {border-top: 1px solid #f1f1f1;}
	#footer .ft_lis .ft_link {
		color: #000;
		font-size: 2.2vw;
		padding: 0.8em 15px;
	}
	#footer .ft_lis .ft_link i{
		color: #000;
		font-size: 1.8vw;
		margin-left: 0.3em;
	}
	#footer .ft_open {
		font-size: 2.6vw;
		padding: 1em 15px;
		position: relative;
	}
	#footer .ft_open::before,
	#footer .ft_open::after {
		content: '';
		display: block;
		width: 14px;
		height: 1px;
		background-color: #333;
		position: absolute;
		top: 1.8em;
		transition: all 0.3s;
	}
	#footer .ft_open::before {left: 190px;}
	#footer .ft_open::after  {left: 199px;}
	#footer .ft_open.open::before,
	#footer .ft_open.open::after {top: 1.5em;}
	#footer .ft_open::before {transform: rotate(42deg)}
	#footer .ft_open::after  {transform: rotate(-42deg)}
	#footer .ft_open.open::before {transform: rotate(-42deg)}
	#footer .ft_open.open::after  {transform: rotate(42deg)}

	#footer .copyright {
		font-size: 1.8vw;
		height: 50px;
		line-height: 50px;
	}
}
@media screen and (max-width:480px) {
	#footer .ft_info {padding: 35px 15px 20px;}
	#footer .ft_h1 {margin-bottom: 20px;}
	#footer .ft_h2 {
		width: 45%;
		margin-bottom: 10px;
	}
	#footer .ft_open,
	#footer .ft_li_oth .ft_link,
	#footer .ft_li > .ft_link {font-size: 3.8vw;}
	#footer .ft_lis .ft_link {font-size: 3.2vw;}
	#footer .ft_lis .ft_link i{font-size: 2.8vw;}

	/*#footer .ft_address {font-size: 4vw;}*/
	#footer .copyright {font-size: 2.8vw;}
	.btn_gotop {
		font-size: 3.6vw;
		padding: 20px 0;
	}
}

/* more info */
#more_info {
	position: fixed;
	transition: all 0.4s;
}
#more_info .side_link {
	color: #fff;
	text-decoration: none;
	font-weight: 400;
	display: block;
	padding: 1em;
	background-color: #474747;
}
#more_info .side_link::after {
	content: '';
	display: inline-block;
	background: url(../images/icon01_wh.svg) 0 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 15px;
	height: 15px;
}
@media screen and (min-width:641px) {
	#more_info .side_link {font-size: 1.6vw;}
	#more_info {
		top: 150px;
		right: -90px;
		z-index: 99;
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		-o-writing-mode: vertical-rl;
		writing-mode: vertical-rl;
	}
	.show_bar #more_info {right: 0;}
	.show_bar.none #more_info {right: -90px;}
	#more_info .side_link::after {margin-top: 0.5em;}
}
@media screen and (min-width:980px) {
	#more_info .side_link {font-size: 1.4rem;}

}
@media screen and (max-width:640px) {
	#more_info {
		text-align: center;
		width: 100%;
		bottom: 0;
		left: 0;
		z-index: 12;
	}
	.show_bar.none #more_info {bottom: -90px;}
	#more_info .side_link {font-size: 4vw;}
	#more_info .side_link::after {margin-left: 0.5em;}
}


/* contens base style */
.btn_c,
.center {text-align: center;}
.btn_r,
.txt_r,
.right {text-align: right;}
#main .section {
	max-width: 1280px;
	margin: auto;
}

.kome {
	text-indent: -1em;
	padding-left: 1em;
}
.detail .small{
	font-size: 1.4rem;
}
.mb05 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb25 {margin-bottom: 25px;}
.mb30 {margin-bottom: 30px;}
.mb35 {margin-bottom: 35px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}
.mb60 {margin-bottom: 60px;}

@media screen and (min-width:641px) {
	#main {padding-bottom: 1px;}
	#main .wrap_section {
		padding: 0 10px;
		margin: 0 auto 80px;
	}
	#main .wrap_flex {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	#main .wrap_flex.no_stretch {
		-ms-align-items: flex-start;
		align-items: flex-start;
	}
}
@media screen and (min-width:980px) {
	#main .wrap_section {margin: 0 auto 100px;}
}
@media screen and (min-width:1280px) {
	#main .wrap_section {
		padding: 0;
		margin: 0 auto 120px;
	}
}

/* page title */
/* h1 */
#main .title_main {text-align: center;}
#main .title_main .h1_ttl {
	color: #000;
	font-weight: 400;
	margin: auto;
	padding: 1em 0;
	border-top: 1px solid #d7d7d7;
	border-bottom: 1px solid #d7d7d7;
	position: relative;
}
#main .h1_ttl::before,
#main .h1_ttl::after {
	content: '';
	display: block;
	height: 1px;
	background-color: #333;
	position: absolute;
}
#main .h1_ttl::before {
	top: -1px;
	animation: h1_bar-top 4s forwards;
}
#main .h1_ttl::after {
	bottom: -1px;
	animation: h1_bar-btm 4s forwards;
}
@keyframes h1_bar-top {
	0% {left: 86%;right: 0;}
	50% {left: 0%;right: 0;}
	100%{left: 0%;right: 86%;}
}
@keyframes h1_bar-btm {
	0% {right: 86%;left: 0;}
	50% {right: 0%;left: 0;}
	100%{right: 0%;left: 86%;}
}

#main .title_main .h1_pos {
	display: inline-block;
	height: 1em;
	position: relative;
}
#main .title_main em {
	font-style: normal;
	position: relative;
	z-index: 10;
}
#main .title_main .h1_en {
	color: #b2b2b2;
	font-style: normal;
	font-weight: 600;
	white-space: nowrap;
	position: absolute;
	z-index: 1;
}
#main .title_main .h1_ttl .txt {
  display: block;
  margin-top: 1em;
}

@media screen and (min-width:641px) {
	#main .title_main {
    padding: 80px 10px;
    padding-bottom: 60px;
  }

	#main .h1_ttl {
		font-size: 5vw;
		width: 80%;
		max-width: 740px;
	}
	#main .title_main .h1_en {
		font-size: 2.6vw;
		bottom: -1.4em;
		right: -2.7em;
	}
  #main .title_main .h1_ttl .txt {
		font-size: 2.6vw;
  }
}
@media screen and (min-width:768px) {
	#main .h1_ttl {font-size: 4vw;}
  #main .title_main .h1_ttl .txt,
	#main .h1_ttl .h1_en {font-size: 2.2vw;}
}
@media screen and (min-width:980px) {
	#main .title_main {
    padding: 100px 10px;
    padding-bottom: 60px;
  }
	#main .h1_ttl {font-size: 4rem;}
  #main .title_main .h1_ttl .txt,
	#main .h1_ttl .h1_en {font-size: 2rem;}
}
@media screen and (min-width:1280px) {
	#main .title_main {
    padding: 100px 0px;
    padding-bottom: 60px;
  }
}
@media screen and (max-width:640px) {
	#main .title_main {
    padding: 100px 0px;
    padding-bottom: 60px;
  }
	#main .h1_ttl {
		font-size: 6.4vw;
		width: 80%;
	}
	#main .title_main .h1_en {
		font-size: 3.4vw;
		bottom: -1.45em;
		right: -0.8em;
	}
  #main .title_main .h1_ttl .txt {
		font-size: 3.4vw;
  }
}
@media screen and (max-width:480px) {
	#main .title_main {
    padding: 50px 0px;
    padding-bottom: 30px;
  }
	#main .title_main .h1_en {
		bottom: -1.6em;
		right: -1.2em;
	}
}
/* IE11 */
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, #main .title_main {margin: 80px auto;} /* IE11 */
}

/*.boxlink {transition: all 0.4s;}*/
.boxlink:hover {
	cursor: pointer;
/*	opacity: 0.7;*/
}
.boxlink.none:hover {
	cursor:default;
	opacity: 1;
}

/* button style */
/********************/
.link_back01,
.txt_link03,
.txt_link02,
.txt_link01 {
	color: #000;
	text-decoration: none;
	display: inline-block;
	position: relative;
	padding-bottom: 10px;
	overflow: hidden;
}
.txt_link03 {padding-bottom: 2px;}

.txt_link01::after {
	content: '';
	display: inline-block;
	background: url(../images/arrow01.svg) 0 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 10px;
	height: 15px;
	margin-left: 0.8em;
}
.txt_link03[target="_blank"]::after,
.txt_link01[target="_blank"]::after,
.txt_link02::after {
	content: '';
	display: inline-block;
	background: url(../images/icon01.svg) 0 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 15px;
	height: 15px;
	margin-left: 0.8em;
}
.link_back01::before {
	content: '';
	display: inline-block;
	background: url(../images/arrow02.svg) 0 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 10px;
	height: 15px;
	margin-right: 0.8em;
}

.link_back01 .line::before,
.link_back01 .line::after,
.txt_link03 .line::before,
.txt_link02 .line::before,
.txt_link02 .line::after,
.txt_link01 .line::before,
.txt_link01 .line::after {
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 0;
	left: 0;
}
.link_back01 .line::before,
.txt_link02 .line::before,
.txt_link01 .line::before {
	background-color: #333;
	z-index: 1;
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s;
}
.txt_link02 .line::after,
.txt_link01 .line::after {
	background-color: #929292;
	z-index: 2;
	transform: translateX(-102%);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.txt_link02:hover .line::before,
.txt_link01:hover .line::before {
	transform: translateX(102%);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.link_back01:hover .line::before,
.txt_link02:hover .line::after,
.txt_link01:hover .line::after {
	transform: translateX(0);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s;
}

.link_back01 .line::before {
	background-color: #333;
	z-index: 1;
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s;
}
.link_back01 .line::after {
	background-color: #929292;
	z-index: 2;
	transform: translateX(102%);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.link_back01:hover .line::before {
	transform: translateX(-102%);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.link_back01:hover .line::after {
	transform: translateX(0);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s;
}
.txt_link03 .line::before {
	background-color: #333;
	z-index: 2;
	transform: translateX(-102%);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}
.txt_link03:hover .line::before {
	transform: translateX(0);
	transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s;
}

@media screen and (min-width:641px) {
	.link_back01,
	.txt_link02,
	.txt_link01 {font-size: 2vw;}
}
@media screen and (min-width:980px) {
	.link_back01,
	.txt_link02,
	.txt_link01 {font-size: 1.6rem;}
}
@media screen and (min-width:1280px) {
	.link_back01,
	.txt_link02,
	.txt_link01 {font-size: 2rem;}
}
@media screen and (max-width:640px) {
	.link_back01,
	.txt_link02,
	.txt_link01 {font-size: 4vw;}
  
  .__recommend .line {display: none;}
  .__recommend .txt_link01,
  .__recommend .txt_link02,
  .__recommend .txt_link03 {text-decoration: underline;}

}
@media screen and (max-width:480px) {
	.link_back01,
	.txt_link02,
	.txt_link01 {font-size: 4.4vw;}
}

/* animation */
/*********************
* fadeInUp
*********************/
@-webkit-keyframes fadeInUp { 
	0% { 
		opacity: 0; 
		-webkit-transform: translateY(30px); 
	} 
	100% { 
		opacity: 1; 
		-webkit-transform: translateY(0); 
	} 
} 

@keyframes fadeInUp { 
	0% { 
		opacity: 0; 
		transform: translateY(50px); 
	} 
	100% { 
		opacity: 1; 
		transform: translateY(0); 
	} 
}
.fadeInUp_once,
.fadeInUp_delay1,
.fadeInUp_delay2,
.fadeInUp_delay3,
.fadeInUp{
	opacity: 0; 
	-webkit-transform: translateY(50px); 
	transform: translateY(50px); 
}
.animate .fadeInUp {
	opacity: 1;
	-webkit-animation: fadeInUp 2s;
	animation: fadeInUp 2s;
	-webkit-transform: translateY(0px); 
	transform: translateY(0px); 
}
.fadeInUp_once,
.animate .fadeInUp_delay1 {
	-webkit-animation: fadeInUp 2s ease .5s;
	animation: fadeInUp 2s ease .5s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: translateY(0px); 
	transform: translateY(0px); 
}
.animate .fadeInUp_delay2 {
	-webkit-animation: fadeInUp 2s ease 1s;
	animation: fadeInUp 2s ease 1s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: translateY(0px); 
	transform: translateY(0px); 
}
.animate .fadeInUp_delay3 {
	-webkit-animation: fadeInUp 2s ease 1.5s;
	animation: fadeInUp 2s ease 1.5s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: translateY(0px); 
	transform: translateY(0px); 
}

/**********
* Fade In *
**********/
.fadeIn_delay,
.fadeIn_once,
.fadeIn {opacity: 0;}
@-webkit-keyframes fadeIn { 
	0% {opacity: 0;} 
	100% {opacity: 1;} 
} 
@keyframes fadeIn { 
	0% {opacity: 0;} 
	100% {opacity: 1;} 
}
.fadeIn_once,
.animate .fadeIn { 
	-webkit-animation: fadeIn 4s; 
	animation: fadeIn 4s; 
	opacity: 1;
}
.animate .fadeIn_delay { 
	-webkit-animation: fadeIn 3s ease 1.5s; 
	animation: fadeIn 3s ease 1.5s; 
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

/**********
* flipInY *
**********/
.flipInY {opacity: 0;}
@-webkit-keyframes flipInY { 
	0% { 
		-webkit-transform: perspective(400px) rotateY(90deg); 
		opacity: 0; 
	} 
	40% { 
		-webkit-transform: perspective(400px) rotateY(-10deg); 
	} 
	70% { 
		-webkit-transform: perspective(400px) rotateY(10deg); 
	} 
	100% { 
		-webkit-transform: perspective(400px) rotateY(0deg); 
		opacity: 1; 
	} 
} 
@keyframes flipInY { 
	0% { 
		transform: perspective(400px) rotateY(90deg); 
		opacity: 0; 
	} 
	40% { 
		transform: perspective(400px) rotateY(-10deg); 
	} 
	70% { 
		transform: perspective(400px) rotateY(10deg); 
	} 
	100% { 
		transform: perspective(400px) rotateY(0deg); 
		opacity: 1; 
	} 
} 
.animate .flipInY { 
	-webkit-backface-visibility: visible !important; 
	-webkit-animation-name: flipInY; 
	backface-visibility: visible !important; 
	animation-name: flipInY; 
}
.animate .flipInY { 
	-webkit-animation: flipInY 2s; 
	animation: flipInY 2s; 
	opacity: 1;
}

@keyframes fadeup_once {
	0% {
		opacity: 0;
		transform: translateY(40px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}


/*********************
* fadeInRight 
*********************/
@-webkit-keyframes fadeInRight { 
	0% { 
		opacity: 0; 
		-webkit-transform: translateX(40px); 
	} 
	100% { 
		opacity: 1; 
		-webkit-transform: translateX(0); 
	} 
} 
@keyframes fadeInRight { 
	0% { 
		opacity: 0; 
		transform: translateX(40px); 
	} 
	100% { 
		opacity: 1; 
		transform: translateX(0); 
	} 
}
.fadeInRight_delay,
.fadeInRight { 
	opacity: 0; 
	-webkit-transform: translateX(40px);  
	transform: translateX(40px); 
}
.animate .fadeInRight { 
	 opacity: 1;
	-webkit-animation: fadeInRight 2s; 
	animation: fadeInRight 2s; 
	-webkit-transform: translateX(0px);  
	transform: translateX(0px); 
}
.animate .fadeInRight_delay { 
	-webkit-animation: fadeInRight 2s ease 1s; 
	animation: fadeInRight 2s ease 1s; 
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: translateX(0px);  
	transform: translateX(0px); 
}

/*********************
* fadeInLeft 
*********************/
@-webkit-keyframes fadeInLeft { 
	0% { 
		opacity: 0; 
		-webkit-transform: translateX(-40px); 
	} 
	100% { 
		opacity: 1; 
		-webkit-transform: translateX(0); 
	} 
} 
@keyframes fadeInLeft { 
	0% { 
		opacity: 0; 
		transform: translateX(-40px); 
	} 
	100% { 
		opacity: 1; 
		transform: translateX(0); 
	} 
} 
.fadeInLeft_delay,
.fadeInLeft { 
	opacity: 0; 
	-webkit-transform: translateX(-40px);  
	transform: translateX(-40px); 
}
 .animate .fadeInLeft { 
	opacity: 1;
	-webkit-animation: fadeInLeft 2s; 
	animation: fadeInLeft 2s; 
	-webkit-transform: translateX(0px);  
	transform: translateX(0px); 
}
.animate .fadeInLeft_delay { 
	-webkit-animation: fadeInLeft 2s ease 1s; 
	animation: fadeInLeft 2s ease 1s; 
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	-webkit-transform: translateX(0px);  
	transform: translateX(0px); 
}

/* floating-btn */
.floating-btn {
	color: #fff;
	width: min(38.54vw,370px);
  width: auto;
	text-align: center;
	position: fixed;
	z-index: 10;
	right: min(2.86vw,40px);
	transition: 0.3s;
	transition-timing-function: ease-in;
	background: #494949;
	cursor: pointer;
  bottom: 0;
}

.floating-btn__box {
	padding: 1rem 2rem 2.5rem 2rem;
	font-size: 1.6rem;
	font-weight: bold;
}

.floating-btn__link {
	line-height: 1.2;
	text-decoration: none;
	color: #494949;
	font-weight: bold;
	display: block;
	background: #fff;
	padding: 1.7rem 1rem;
	transition: all 0.3s;
}

.floating-btn__link:hover{
	opacity: 0.7;
}


.floating-btn__link:not(:last-child) {
	margin-bottom: 1.5rem;
}

.floating-btn__ttl {
	/*font-size: min(2.08vw,2rem);*/
  font-size: min(2.085vw, 1.6rem);
	line-height: 1.2;
	font-weight: 600;
	/*text-align: center;*/
	text-align: left;
/*	padding: 1.8rem 1rem 1.8rem 2.5rem;*/
	position: relative;
}
.floating-btn__ttl::before,
.floating-btn__ttl::after {
	content: '';
	display: block;
	position: absolute;
}
.floating-btn__ttl::before {
	width: 1px;
	height: calc(100% - 2.4rem);
	background-color: rgba(255,255,255,.8);
	top: 1.2rem;
	right: 50px;
}
.floating-btn__ttl::after {
	width: 8px;
	height: 8px;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	/*transform: rotate(45deg);*/
	transform: rotate(-45deg);
	right: 25px;
	top: calc(50% - 4px);
}
.floating-btn__ttl a {
  color: #fff;
  text-decoration: none;
  display: block;
	padding: 1.8rem 7.5rem 1.8rem 2.5rem;
}
.floating-btn__ttl.__cmn {display: block;}
.floating-btn__ttl.__jakomo {display: none;}

@media screen and (max-width: 640px) {
	.floating-btn {
		width: 100%;
		right: auto;
		left: 50%;
		transform: translateX(-50%);
	}

	.floating-btn__box {
		padding: 2vw 5vw 5vw 5vw;
	}

	.floating-btn__link {
		padding: 4.17vw;
	}

	.floating-btn__link:not(:last-child) {
		margin-bottom: 4.17vw;
	}

	.floating-btn__ttl {
		/*font-size: 1.8rem;*/
		/*padding: 4vw;*/
    font-size: clamp(1.4rem, 3.644vw, 2.8rem);
    line-height: 1.6;
	}
  .floating-btn__ttl a {
    padding: 2vw 5rem 2vw 4vw;
  }
}

/* 取扱ブランドメニュー */
.header_inner{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.handling-item{
	width: 140px;
	/*display: inline-block;*/
	z-index: 1000;
	margin-right: 2.5rem;
	display: flex;
	flex-direction: column;
}

.handling-item_btn{
	position: relative;
	font-size: 1.6rem;
	text-align: center;
	cursor: pointer;
	border: 1px solid #333333;
	padding: 0.7rem 0.8rem 0.7rem 1.1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1.2;
	margin-top: 8px;
	font-weight: bold;
	
}
.handling-item_btn::after{
	content: '';
	display: inline-block;
	background: url(../images/arrow03.svg) 0 0 no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	width: 16px;
	height: 9px;
	margin-left: 0.7rem;
	transform: scale(1, 1);
	position: relative;
	bottom: -1px;
	transition: transform 0.3s ease-in-out;
}

#header.open .handling-item_btn::after{
	transform: scale(1, -1);
	transition: transform 0.3s ease-in-out;
	bottom: 0;
}

.handling-item_ul{
	width: 300px;
	font-size: 1.6rem;
	position: absolute;
	top: 75px;
	right: 20px;
	padding: 2.5rem 3.5rem 4rem 4rem;
	background: #fff;
	transition: 0.3s;
	transition-timing-function: ease-in;
	opacity: 0;
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
  z-index: 102;
}

.handling-item_li{
	line-height: 1.25;
}
.handling-item_li:not(:first-child){
	margin-top: 1.8rem;
}
.handling-item_li a{
	text-decoration: none;
	color: #000;
}
.handling-item_li a:hover{
	text-decoration: underline;
}
.handling-item_li i{
	font-size: 1.2rem;
	font-style: normal;
	margin-left: 2px;
}
/*
.handling-item_li.__line{
	width: 3rem;
	content: '';
	display: block;
	height: 1px;
	background-color: #333;
	margin: 3rem 0;
}
*/
.handling-item_li.__line {
  position: relative;
  margin-top: 3rem;
  padding-top: 3rem;
}
.handling-item_li.__line::before {
	content: '';
	display: block;
  width: 3rem;
	height: 1px;
	background-color: #333;
  position: absolute;
  top: 0;
  left: 0;
}

.header_btn-area{
	display: flex;
	margin: 1.2rem 2.5rem 0 1rem;
}

@media screen and (max-width: 980px){
	.handling-item_li i{
		display: block;
	}
	.handling-item_li a{
		line-height: 1.2;
	}
}

@media screen and (max-width: 640px){

	.handling-item{
		width: 100%;
		flex-direction: column;
		justify-content: center;
	}
	.handling-item_li i{
		display: inline;
	}
	.handling-item_li.__line{
		width: 2rem;
	}
	.handling-item_ul{
		padding: min(6.47vw,3.5rem) min(7.25vw,4rem);
	}
	.handling-item_btn{
		font-size: min(2.81vw,1.8rem);
		padding: 0.66rem 0.9rem 0.66rem 1rem;
		margin-top: 0;
	}
	.handling-item_btn::after{
		width: min(2.97vw,19px);
		height: min(1.56vw,10px);
		margin-left: 0.4em;
	}
	.fixed .handling-item_btn::after {
		width: min(2.34vw,15px);
		height: min(1.25vw,8px);
	}
	.fixed .handling-item_btn{
		font-size: 1.2rem;
		padding: 0.5rem;
	}
	.handling-item{
		margin-right: 3.13vw;
	}
	.header_btn-area{
		margin-left: 1.39vw;
	}
	.handling-item_ul{
		top: 105px;
		right: 0;
		margin-top: 0;
	}
	.fixed .handling-item_ul{
		top: 70px;
	}
}
@media screen and (max-width: 480px){
	.header_btn-area{
	margin-right: 1rem;
	margin-top: 1rem;
	}
	.fixed .header_btn-area{
	margin-right: 5px;
	margin-top: 5px;
	}
	.handling-item_ul{
		top: 60px;
	}
	.handling-item_btn{
		font-size: 3vw;
	}
	.fixed .handling-item_ul{
		top: 40px;
	}
}
.handling-item_ul{
	display: none;
	animation: fadeOut 0.4s ease-in forwards;
}

#header.open .handling-item_ul{
	display: block;
	animation: fadeIn 0.4s ease-in forwards;
}


@keyframes fadeIn{
	0% {
	  display: none;
	  opacity: 0;
	}

	100% {
	  opacity: 1;
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
		display: block;
	}
	100% {
		opacity: 0;
	}
}

/*showroom*/
/************/
#showroom {background-color: #f1f1f1;}
.h2_showroom {
	color: #333;
	font-size: clamp(2rem, 5.21vw, 4rem);
	text-align: center;
	margin-bottom: min(2vw, 40px);
	position: relative;
}
.h2_showroom::before {
	content: '';
	width: 100%;
	height: 1px;
	background-color: #333;
	position: absolute;
	top: calc(50% + .1em);
	left: 0;
	z-index: 1;
}
.h2_showroom span {
	font-weight: 500;
	display: inline-block;
	padding: 0 .8em;
	background-color: #f1f1f1;
	position: relative;
	z-index: 2;
}
.txt_shrm {
	font-size: clamp(1.4rem, 6.66vw, 2.8rem);
	margin: 0 auto min(8vw, 60px);
}
.btn_ul .btn_li {
	margin: min(6vw, 45px) min(4vw, 30px) 0;
}
.btn_bl {
	color: #fff;
	font-size: clamp(1.5rem, 7.14vw, 3.0rem);
	font-weight: 500;
	text-align: center;
	text-decoration: none;
	display: block;
	padding: .4em 0;
	background-color: #494949;
	transition: all .4s;
}
.btn_bl:hover {opacity: .7;}

@media screen and (min-width:641px) {
	.wrap_section#showroom {
	  padding: min(6.25vw, 120px) 10px;
			margin: auto;
	}
	.index .wrap_section#showroom {padding-top: 0;}
	.h2_showroom {font-size: 3.4vw;}
	.txt_shrm {font-size: 1.6vw;}
}
@media screen and (min-width:768px) {
	.h2_showroom {
		font-size: min(3.908vw, 3rem);
	}
	.txt_shrm {
		font-size: min(3.81vw, 1.6rem);
		text-align: center;
		max-width: 950px;
		margin-bottom: min(2.34375vw, 45px);
	}
	.btn_ul {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	.btn_ul .btn_li {
		margin: 0 25px;
	}
	.btn_bl {
		font-size: min(4.285vw, 1.8rem);
		width: 310px;
		padding: .4em 0 .6em;
	}
}
@media screen and (min-width:980px) {
	.wrap_section#showroom {padding: 120px 0;}
}
@media screen and (max-width: 640px) {
	.wrap_section#showroom {padding: 140px 25px;}
  .index .wrap_section#showroom {
	padding: 0 25px 140px;
  }
	.txt_shrm {font-size: clamp(1.3rem, 3.386vw, 2.6rem);}
	/*.btn_bl {font-size: min(7.14vw, 3.0rem);}*/
	.btn_bl {
		font-size: clamp(1.6rem, 4.168vw, 3.2rem);
		padding: .4em 0 .6em;
	}
}
@media screen and (max-width:480px) {
	.wrap_section#showroom {padding: 60px 15px 70px;}
  .index .wrap_section#showroom {padding: 0 15px 80px;}
	/*.btn_bl {font-size: min(5.721vw, 2.4rem);}*/
	
}

/*bread / date*/
#main #bread,
#main .date {
  color: #333;
  margin: auto;
  width: min(95vw, 1280px);
}
#main .date {
  font-size: clamp(1.2rem, 3.126vw, 2.4rem);
  margin-bottom: min(4vw, 30px);
  text-align: right;
}
#main #bread {
  font-size: clamp(1.1rem, 2.865vw, 2.2rem);
  margin-bottom: min(8vw, 60px);
}
#main #bread .brd_li {
  display: inline;
  padding-left: 1em;
  position: relative;
}
#main #bread .brd_li::before {
  content: '/';
  display: block;
  position: absolute;
  left: .25em;
  top: 0;
}
#main #bread .brd_li._home {
  padding-left: 0;
}
#main #bread .brd_li._home::before {
  display: none;
}
#main #bread .brd_li .brd_link {
  color: #333;
  text-decoration: none;
}
#main #bread .brd_li .brd_link:hover {
  text-decoration: underline;
}

@media screen and (min-width:641px) {
  #main .date {
    font-size: clamp(0.7rem, 1.824vw, 1.4rem);
    margin-bottom: 30px;
  }
  #main #bread {
    font-size: clamp(0.7rem, 1.824vw, 1.4rem);
    margin-bottom: 60px;
  }
}


