@charset "UTF-8";
/* CSS Document */

/************************************************
cubus.css 202405
************************************************ */
.underline{
	background: linear-gradient(transparent 60%, #ffffa4 0%);
}

/*/////フォーム/////*/
input[type="tel"],input[type="number"],input[type="text"] {
	outline: none;
	border: solid 1px #ccc;
	padding: 3px;
}
input[type="number"] {
	/*width: 60%;*/
	text-align: right;
}
input[type="checkbox"], input[type="radio"] {
  margin: 4px 3px 0 0;
}
input {
  outline: none;
}
input:focus{
  outline: #333 1px solid;
}
input[type="text"]:focus {
	outline: #333 1px solid;
}
textarea {
  width: 60%;
	line-height: 1.4;
	outline: none;
	border: solid 1px #ccc;
}
#cubus-eta {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	margin: 30px auto;
	overflow: hidden;
}
#cubus-eta img{
	max-width: 100%;
}

#cubus-eta .intro {
	margin: 0 auto 20px;
}
#cubus-eta .intro .intro-ttl{
	font-size: 17px;
	letter-spacing: .05em;
	line-height: 1.6;
	margin: 0 0 20px;
}
#cubus-eta .intro .intro-txt{
	font-size: 14px;
	letter-spacing: .05em;
	line-height: 1.6;
}
#cubus-eta .new3d_cont .lead-txt{
	font-size: 12px;
	letter-spacing: .05em;
	line-height: 1.6;
	margin: 0 auto 20px;
}

#cubus-eta .new3d_cont .form-estimate{
  width: 100%;
  border-collapse: collapse;
  text-align: left;
	border: none;
}
#cubus-eta .new3d_cont form .form-estimate .t-box {
  /*display: block !important;*/
  width: 100%;
	margin: 0 auto 60px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box.t-arrow{
	margin-bottom: 20px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box.t-arrow::after {
  content: "";
	display: block;
	background: url(/files/images/unique/cubus/arrow_img.png) no-repeat center top;
	background-size: contain;
	padding: 30px;
	margin: 20px auto;
}
#cubus-eta .new3d_cont form .form-estimate .t-box-sub {
  width: 100%;
	padding: 30px;
	margin: 0 auto 80px;
	border: 2px solid #ddd;
	border-radius: 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box-sub .t-box:last-child {
	margin-bottom: 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th {
	font-size: 18px;
	font-weight: 600;
	letter-spacing: .03em;
	line-height: 1.6;
  padding: 2%;
  display: block;
  color: #333;
  background-color: #f0f0f0;
	margin: 0 auto 30px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th-s {
	font-size: 16px;
  padding: 0 0 .3em !important;
	border-bottom: 1px solid #333;
  background:none;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th-s .en {
	font-size: 120%;
	position: relative;
	top: 1px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th .th-sub {
  font-size: 90%;
	margin-left: .5em;
}
#cubus-eta .new3d_cont .form-estimate .t-box .sub {
	display: block;
	font-size: 11px;
	margin-top: 1em;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td {
 /* width: 98% !important;*/
  padding: 0 0 4%;
  display: block !important;
  line-height: 1.4;
  border-right: 0px solid #ccc;
  border-bottom: 0px solid #ccc;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td:last-child {
	padding: 0;
}

#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-flex.notice {
  justify-content: flex-start;
	align-items: center;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-inner {
	width: 48%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 0 2%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img {
	width: 40%;
	margin-right: 3%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-lead-img {
	width: 40%;
	margin-right: 3%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img-img {
	width: 30%;
	margin-left: 3%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt {
	width: 53%;
	margin: auto;
	font-feature-settings: "palt";
	letter-spacing: .05em;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img-txt {
	width: 63%;
	margin: auto;
	font-feature-settings: "palt";
	letter-spacing: .05em;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-t {
	font-size: 16px;
	font-weight: 600;
	margin: 20px 0 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-w {
	display: inline-block;
	min-width: 12em;
	text-align: left;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-p {
	width: 48%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-inner {
	display: inline-block;
	text-align: left;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-sub {
	font-size: 90%;
	color: #e00006;
	margin: 20px 0 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td label{
	/*width: 63%;*/
	font-size: 15px;
	font-weight: 400;
	letter-spacing: .05em;
	display: block;
	margin-bottom: 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .form-inner label{
	padding: 20px 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .number-txt input{
	width: 30%;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .mail-txt input{
	width: 30%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .text-txt input{
	width: 40%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .tel-txt input{
	width: 8%;
}

#cubus-eta .new3d_cont form .form-estimate .t-box .notice label{
  margin: 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .notice a{
	font-size: 14px;
  text-decoration: underline;
	margin-left: 10px;
}
#cubus-eta .submit-btn input{
	padding: .5em 2em;
	border: 4px double #111;
	background: #fff;
	font-size: 15px;
	-webkit-appearance: none;
  border-radius: 0;
}
#cubus-eta .submit-btn input:hover {
	opacity: 0.8;
	cursor: pointer;
	background: #FBF481;
}
#cubus-eta .submit-box{
	background: #f2f2f2;
	padding: 20px 10px;
}

#cubus-eta .text-box{
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
}
/*#cubus-eta .text-box .flL{
	width: 48%;
}
#cubus-eta .text-box .flR{
	width: 48%;
}

#cubus-eta .box3 .flL{
	width: 32%;
}*/

/*#cubus-eta .text-box p{
	display: block;
}
#cubus-eta .text-box .ttl{
	display: block;
	float: none;
}
#cubus-eta .text-box .ttl:before{
	content: "■";
}
#cubus-eta .space{
	margin: .5em 0 .8em;
}
#cubus-eta .space p{
	margin: 0!important;
}
*/
.ec-blockBtn--action.contactB {
  background-color: #4d4d4d;
  border-color: #4d4d4d;
}
.ec-blockBtn--action.contactB:active {
  background-color: #4d4d4d;
  border-color: #4d4d4d;
}
#cubus-eta .required {
  color: #e00006;
	font-size: 12px;
	font-weight: 400;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	margin-left: 10px;
  padding: 2px 12px 3px;
	border: 1px solid #e00006;
}

@media screen and (max-width: 896px){
.underline{
	background: linear-gradient(transparent 60%, #ffff66 0%);
}
		
/*/////フォーム/////*/
/*input[type="tel"],input[type="number"]{
	border: 1px solid #666;
	}*/
input[type="radio"]{
	position: relative;
	top:-1px;
}
input[type="text"],input[type="button"],textarea,input[type="tel"],input[type="number"] {
	-webkit-appearance: none;
	border-radius: 0;
}
textarea {
  width: 90%;
}
#cubus-eta .intro {
	margin: 0 auto 20px;
}
#cubus-eta .intro .intro-ttl{
	font-size: 15px;
}
#cubus-eta .intro .intro-txt{
	font-size: 13px;
}
#cubus-eta .new3d_cont .lead-txt{
	font-size: 12px;
	letter-spacing: .05em;
	line-height: 1.6;
	margin: 0 auto 20px;
}

#cubus-eta .new3d_cont .form-estimate {
	border: none;
}
#cubus-eta .new3d_cont form .form-estimate .t-box {
	margin: 0 auto 40px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box-sub {
  width: 100%;
	padding: 20px;
	margin: 0 auto 60px;
	border-radius: 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th {
	font-size: 14px;
	margin: 0 auto 30px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th .th-sub {
  font-size: 90%;
}
#cubus-eta .new3d_cont .form-estimate .t-box .sub {
	font-size: 11px;
	margin-top: .5em;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td {
	font-size: 13px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td p{
	margin-right: .5em;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt {
	width: 48%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-t {
	font-size: 14px;
	margin: 20px 0 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-w {
	display: block;
	min-width: 12em;
	margin-bottom: 5px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-w.manufacturer{
	display: block;
	margin-bottom: 5px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-p {
	width: 48%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td label{
	font-size: 13px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-inner label{
	width: 48%;
	padding: 10px 0;
	display: flex;
	align-items: flex-start;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .notice label{
  margin: 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .notice a{
	font-size: 13px;
}
#cubus-eta .submit-btn input{
	font-size: 1.4rem;
	padding: 1em 4em;
	color: #333;
}
#cubus-eta .submit-box{
	padding: 1em;
}
.ec-off4Grid .ec-off4Grid__cell {
	width: 60% !important;
}
.ec-blockBtn--action {
	height: 50px;
	line-height: 50px;
	font-size: 18px;
}
/*#cubus-eta .text-box{
	width: 100%;
}*/
	
/*#cubus-eta .text-box .flL{
	width: 48%;
	margin: 0;
}
#cubus-eta .text-box .flL input,#cubus-eta .text-box .flR input{
	width: 60%;
}
#cubus-eta .text-box .flR{
	width: 48%;
	margin: 0;
}
#cubus-eta .box3 .flL{
	width: 33%;
}
#cubus-eta .box3 .flL input{
	width: 60%;
}*/
/*#cubus-eta .text-box p{
	display: block!important;
}
#cubus-eta .text-box .ttl{
	display: block;
	float: none;
	padding-left: .5em;
}*/
/*#cubus-eta .space{
	margin: .5em 0 .8em;
}
#cubus-eta .space p{
	margin: 0 .5em .5em 0!important;
}*/

}

@media screen and (max-width: 568px){
/*/////フォーム/////*/
textarea {
  width: 90%;
	font-size: 16px;
}
#cubus-eta .intro {
	text-align: left;
	margin: 0 auto 20px;
}
#cubus-eta .intro .intro-ttl{
	font-size: 14px;
}
#cubus-eta .intro .intro-txt{
	font-size: 12px;
	margin-bottom: .5em;
}
#cubus-eta .new3d_cont .lead-txt{
	font-size: 12px;
	letter-spacing: .05em;
	line-height: 1.6;
	margin: 0 auto 20px;
}
#cubus-eta .new3d_cont .form-estimate {
	border: none;
}
#cubus-eta .new3d_cont form .form-estimate .t-box {
	margin: 0 auto 40px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box.t-arrow::after {
  content: "";
	padding: 20px;
	margin: 20px auto;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .th {
	font-size: 14px;
	margin: 0 auto 30px;
}
	
#cubus-eta .new3d_cont form .form-estimate .t-box .td {
	font-size: 13px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td p{
	margin-right: .5em;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td p .name-txt{
	font-size: 13px;
	margin-right: 3px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt {
	width: 90%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img-txt {
	width: 100%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-t {
	font-size: 14px;
	margin: 20px 0 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-w {
	display: inline-block;
	min-width: 12em;
	margin-bottom: 5px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-w.manufacturer{
	display: block;
	margin-bottom: 5px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-p {
	width: 100%;
	margin-bottom: 20px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-inner {
  width: 48%;
  display: block;
  margin: 0 0 2%;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td label{
	font-size: 13px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-inner label{
	width: 100%;
	padding: 10px 0;
	display: flex;
	align-items: flex-start;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .number-txt input{
	width: 30%;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .text-txt input{
	width: 100%;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .mail-txt input{
	width: 100%;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .tel-txt input{
	width: 20%;
	font-size: 16px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-txt-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img {
  width: 90%;
  margin: 0 auto;
}
#cubus-eta .new3d_cont form .form-estimate .t-box-sub .t-box .td .form-img {
  margin: 0 auto 10px;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-lead-img {
  width: 90%;
  margin: 0 auto 10px;
}
	#cubus-eta .new3d_cont form .form-estimate .t-box .td .form-img-img {
  width: 100%;
  margin: 15px auto 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .notice label{
  margin: 0;
}
#cubus-eta .new3d_cont form .form-estimate .t-box .notice a{
	font-size: 13px;
}
#cubus-eta .submit-btn input{
	font-size: 1.4rem;
	padding: 1em 4em;
	color: #333;
}
#cubus-eta .submit-box{
	padding: 1em;
}
.ec-off4Grid .ec-off4Grid__cell {
	width: 80% !important;
}
.ec-blockBtn--action {
	height: 50px;
	line-height: 50px;
	font-size: 18px;
}
}


/************************************************
cubus.css 202406-12
************************************************ */
.cubus-ec{
	padding: 0;
	margin: 0 auto 40px;
	line-height: 1.6;
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
.cubus-ec img{
	max-width: 100%;
	height: auto;
}
.cubus-ec p{
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: .03em;
}

/*TOP*/
.cubus-ec .main-box {
	width: 100%;
	margin: 0 auto;
	/*height: 100dvh;*/
	/*min-height: 100vh;
	height: -webkit-fill-available;*/
	/*overflow: visible;*/
	/*letter-spacing: .15em;
	padding: 0;*/
	/*margin: 0;*/
}
.cubus-ec .main-inner{
	/*position: absolute;
	top: 0;
	left: 0;*/
	position: relative;
	/*width: 100%;
	height: auto;*/
	/*height: 100%;*/
	/*clip-path: inset(0);*/
}
.cubus-ec .main-bg{
	/*position: fixed;*/
	/*width: 100vw;
	height: 80svh;*/
	/*min-height: 100vh;
	height: -webkit-fill-available;*/
	/*overflow: visible;
	background-image:  url("/files/images/unique/cubus/main.jpg");
	background-size: cover;
	background-position: center center;*/
	/*z-index: -1;*/
	margin: 0 auto;
}
.cubus-ec .main-box img{
	max-width: 100%;
}
.cubus-ec .main-box .main-logo{
	position: absolute;
	/*top: 3%;
	right: 7%;*/
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	z-index: 100;
	width: 100%;
	margin: 0 auto;
	opacity: 0.9;
	text-align: center;
}
.cubus-ec .main-box .main-logo img{
	width: 100%;
	max-width: 500px;
}
.cubus-ec .main-box .main-logo p{
	margin: 0 auto 15px;
}

/*.svg-box {
	position: absolute;
	bottom: 12svh;
	left: 10%;
	margin: 0 auto;
	text-align: left;
}
#svg {
  margin: 0 auto 0;
  font-size: 25px;
  transform: rotate(-10deg);
	width: 38vw;
}*/

.intro-box{
	width: 100%;
	text-align: center;
	margin: 80px auto 100px;
}
.intro-img{
	margin: 0 auto 40px;
}
.logo-box{
	width: 100%;
	max-width: 400px;
	margin: 80px auto;
}

.cubus-ec .lead-ttl{
	font-size: 17px;
	line-height: 1.6;
	letter-spacing: .1em;
	margin: 0 auto 40px;
	text-align: center;
}

.category-box{
	position: relative;
	margin: 0 auto;
}
.sub-page .category-ttl .en{
	display: inline;
	text-shadow: none;
	animation: color-change 2s ease-in-out forwards;
}
.category-ttl .en.white{
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
	color: #fff;
	/*animation: color-change2 2s ease-in-out forwards;*/
}
/*.category-box.sub-page{
	animation: color-bg 2s ease-in-out forwards;
}
@keyframes color-bg {
  0%{
	background: #000;
	visibility: visible;
  }
	20%{
	background: #000;
  }
  100%{
	background: #fff;
	visibility: visible;
  }
}*/

/*.category-box .mv-img{
	animation: mvImg 2s ease-in-out forwards;
}
@keyframes mvImg {
  0%{
	opacity: 0;
	background: #000;
	visibility: visible;
  }
  100%{
	opacity: 1;
	background: #000;
	visibility: visible;
  }
}*/

.category-inner{
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	margin: 0 auto;
	color: #333;
	text-align: center;
	z-index: 100;
}

.category-ttl .en,.category-ttl .color01{
	display: inline;
	font-size: 70px;
	font-weight: 500;
	/*font-family: "Teko", sans-serif;*/
	font-family: "Oxanium", sans-serif;
	letter-spacing: .02em;
	line-height: 1.2;
	margin: 0 auto;
	/*text-shadow: 0px 0px 10px rgba(255,255,255,0.40);*/
	/*animation: color-change 2s ease-in-out forwards;*/
}
.sub-page .category-ttl .en{
	text-shadow: none;
	opacity: 0;
	animation: color-change 0.6s 0.6s ease-in-out forwards;
}
.category-ttl .en.white{
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
	color: #fff;
}
.sub-page .category-ttl .en.white{
	text-shadow: none;
	animation: color-change2 0.6s 0.6s ease-in-out forwards;
}
.sub-page .category-ttl .en.white:nth-of-type(2){
	animation: color-change2 0.6s 0.5s ease-in-out forwards;
}
.category-ttl .jp{
	display: block;
	font-size: 20px;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	letter-spacing: 0.3em;
}
.sub-page .category-ttl .jp{
	opacity: 0;
	animation: color-change 0.6s 0.4s ease-in-out forwards;
}
.category-ttl .jp.white{
	color: #fff;
	animation: color-change2 0.6s 0.4s ease-in-out forwards;
}

@keyframes color-change {
  0%{
	opacity: 0;
	color:#fff;
	text-shadow: none;
	transform: translate(0,10px);
  }
  20%{
	color:#fff;
  }
  100%{
	opacity: 1;
	color:#333;
	transform: translate(0,0);
  }
}
@keyframes color-change2 {
  0%{
	opacity: 0;
	color:#fff;
	transform: translate(0,10px);
  }
	100%{
	opacity: 1;
	color:#fff;
	transform: translate(0,0);
	text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
  }
}
.sub-page .category-ttl .color01{
	animation: color-change3 1.2s 0.4s ease-in-out forwards;
}
.category-ttl .color01{
	color: #DF891B;
}
@keyframes color-change3 {
  0%{
	opacity: 1;
	transform: translate(0,8px);
  }
	100%{
	opacity: 1;
	transform: translate(0,0); 
  }
}

.cubus-ec .category-link{
	width: 80%;
	min-width: 7em;
	font-size: 15px;
	letter-spacing: .1em;
	font-family: "Noto Sans JP", sans-serif;
	margin: 30px auto 0;
	text-align: center;
}

/*== ボタン共通設定 */
.btn-c{
	padding: 5px 2em;
	margin: 0;
  position: relative;
	overflow: hidden;
  outline: none; 
  transition: ease .2s;
	border: 1px solid #666;
	color: #666;
}
.btn-c span {
	position: relative;
	z-index: 3;
}
.btn-c:hover{
	color:rgba(255,255,255,0.70);
	border: 1px solid #2a2625;
	cursor: pointer;
	color: #fff;
}
/*== 背景が流れる（下から上） */
.bgbottom:before {
 	content: '';
 	position: absolute;
 	bottom:0;
 	left: 0;
 	z-index: 2;
 	background: rgba(42,38,37,0.50);
 	width: 100%;
	height: 0;
 	transition:.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}
/*hoverした際の形状*/
.bgbottom:hover:before{
	height: 100%;	
	background: rgba(42,38,37,1.00);
}
.btn-c:after{
	content: "▶";
	font-size: 90%;
	padding-left: .5em;
}
.btn-c:hover:after{
	position: relative;
	z-index: 200;
}

.btn2{
	padding: 5px 2em;
	margin: 0;
  position: relative;
	overflow: hidden;
  outline: none; 
  transition: ease .2s;
	border: 1px solid #2a2625;
	background: rgba(255,255,255,0.50);
}
.btn2 span {
	position: relative;
	z-index: 3;
}
.btn2:hover{
	color:#fff;
	cursor: pointer;
}
/*== 背景が流れる（下から上） */
.bgbottom2:before {
 	content: '';
 	position: absolute;
 	bottom:0;
 	left: 0;
 	z-index: 2;
 	background: rgba(255,255,255,0.50);
 	width: 100%;
	height: 0;
 	transition:.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}
/*hoverした際の形状*/
.bgbottom2:hover:before{
	height: 100%;	
	background: rgba(255,255,255,1.00);
}

.section-box{
	position: relative;
	padding: 0;
	margin: 0 auto 80px;
}
.section-box:last-child{
	margin: 0 auto;
}
.section-inner{
	width: 1150px;
	margin: 0 auto;
}
.flex-box{
	display: flex;
	flex-wrap: wrap;
}
.product-flex{
	justify-content: space-between;
	margin: 0 auto 40px;
}

/*　画像の拡大　*/
.zoomIn img{
	transform: scale(1);
	transition: .3s ease-in-out;
}
.zoomIn :hover img{
	transform: scale(1.02);
}
/*　画像のマスク　*/
.mask{
	display: block;
	line-height: 0;
	overflow: hidden;
}

/* CONCEPT */
.concept-inner{
	width: 1000px;
	margin: 0 auto;
}
.concept-inner .concept-txt:last-child{
	margin: 0 auto;
}
.concept-slider {
  margin-inline: auto;
	overflow: hidden;
	pointer-events: none;
	margin: 40px auto;
}
.concept-slider.slick-slider{
	width: 500px;
}
.slick-img img {
  width: 100%;
}

/*USE*/
/* USE slider */
.product-slider{
	width: 48%;
	margin: 0 auto 40px;
}
.product-txt{
	width: 48%;
}
.product-slider .slick-next,.product-slider .slick-prev {
  position: absolute;
  top: 50%;
  display: block;
  padding: 0;
  width: 30px;
  height: 30px;
  outline: none;
  border: none;
  background: transparent;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  /*transform: translate(0, -50%);*/
  z-index: 99;
}

.product-slider .slick-next {
	right: -20px;
	z-index: 100;
}
.product-slider .slick-prev {
	left: -20px;
	z-index: 100;
}
.product-slider .slick-next {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	content: "";
	font-size: 0;
	color: #333;
	width: 40px;
	height: 40px;
	/*background: url(/files/images/unique/cubus/arrow_right.png) no-repeat left bottom;
	background-size: contain;*/
	transition: all 0.2s ease-in;
}
.product-slider .slick-prev {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	content: "";
	font-size: 0;
	color: #333;
	width: 40px;
	height: 40px;
	/*background: url(/files/images/unique/cubus/arrow_left.png) no-repeat left bottom;
	background-size: contain;*/
	transition: all 0.2s ease-in;
}
.product-slider .slick-next:hover{
	transition: all 0.2s ease-in;
	transform: translate(5px,0); 
	-webkit-transform: translate(5px,0); 
}
.product-slider .slick-prev:hover {
	transition: all 0.2s ease-in;
	transform: translate(-5px,0); 
	-webkit-transform: translate(-5px,0); 
}

.product-slider .slick-slide img {
  width: 100%;
}
.product-slider .slick-slide{
  margin: 0;
}
.product-slider .slick-dots li.slick-active button,
.product-slider .slick-dots li button {
	font-size: 20px;
	width: 10px;
	height: 10px;
}
.product-slider .slick-dots li button::before{
	width: 10px;
	height: 10px;
}
/*.product-slider .slick-dots {
	position: absolute;
	bottom: -60px;
}*/
.slick-prev.slick-disabled,.slick-next.slick-disabled {
	opacity: 0;
}
.product-slider .txt-box{
	margin: 20px auto 0;
}

/*BASIC*/
.basic-box{
	position: relative;
	width: 1100px;
	margin: 80px auto;
}
.basic-flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
}
.basic-flex2{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin: -50px auto 60px;
}
.basic-ttl{
	width: 30%;
	font-size: 20px;
	font-weight: 400;
	letter-spacing: .05em;
	text-align: left;
	margin: 0 0 10px;
}
.basic-ttl .en{
	font-size: 40px;
	font-family: "Oxanium", sans-serif;
	letter-spacing: .05em;
	margin: 0;
	/*color: #DF891B;*/
}
.basic-ttl .jp{
	position: relative;
	top:-2px;
	font-size: 20px;
	font-family: "Noto Sans JP", sans-serif;
	letter-spacing: .05em;
	padding-left: 20px;
	margin: 0;
}
.basic-img1{
	width: 66%;
}
.basic-img2{
	width: 40%;
}
.basic-txt-box{
	width: 56%;
}
.basic-txt{
	font-size: 16px;
	line-height: 1.8;
	text-align: left;
}
.structure-box{
	position: relative;
	width: 1100px;
	margin: 200px auto 240px;
}
.structure-img{
	position: relative;
}
.structure-txt1{
	width: 34%;
	position: absolute;
	top: 380px;
	left: 0;
	font-size: 14px;
	margin: 20px 0 0;
}
.structure-txt2{
	width: 34%;
	position: absolute;
	top: 380px;
	right: 0;
	font-size: 15px;
	margin: 20px 0 0;
}
.structure-txt3{
	width: 34%;
	position: absolute;
	top: 960px;
	left: 0;
	font-size: 14px;
	margin: 20px 0 0;
}
.structure-txt4{
	width: 34%;
	position: absolute;
	top: 960px;
	right: 0;
	font-size: 15px;
	margin: 20px 0 0;
}

/*STANDARD*/
.standard-lead-ttl{
	font-size: 20px;
	font-weight: 400;
	text-align: center;
	margin: 0 0 20px;
}
.standard-lead-ttl .en{
	font-size: 60px;
	font-family: "Oxanium", sans-serif;
	letter-spacing: .05em;
	margin: 0;
	color: #999;
}
.standard-box{
	width: 1100px;
	margin: 0 auto 60px;
}
.standard-flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.standard-img{
	width: 50%;
}
.standard-ttl{
	font-size: 18px;
	text-align: left;
	margin: 0 0 20px;
	border-bottom: 1px solid #000;
}
.cubus-ec .standard-ttl .grid{
	font-size: 60px;
	font-weight: 500;
	font-family: "Oxanium", sans-serif;
	font-weight: 500;
	letter-spacing: .02em;
	line-height: 1.0;
	margin: 0;
}
.standard-ttl .size{
	position: relative;
	top: -2px;
	font-size: 18px;
	font-weight: 400;
	letter-spacing: .05em;
	padding-left: 10px;
	margin: 0;
}
.standard-txt-box{
	width: 90%;
	margin: 0 auto;
}
.standard-txt{
	font-size: 15px;
	font-weight: 500;
	line-height: 1.8;
	text-align: left;
}
.standard-item{
	width: 80%;
	margin: 0 auto;
}
.custom-flex{
	width: 1100px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 60px auto;
}
.custom-item{
	width: 48%;
	margin: 0 auto 40px;
}
.custom-img{
	margin: 0 auto 20px;
}
.cubus-ec .custom-ttl{
	font-size: 18px;
	font-weight: 600;
	text-align: left;
	margin: 0 0 5px;
}
.cubus-ec .custom-txt{
	font-size: 15px;
	text-align: left;
	margin: 0;
}
.cubus-ec a.zoom::after {
	content: "";
	display: none;
}
.cubus-ec .end-inner{
	position: relative;
}
.cubus-ec .end-txt{
	position: absolute;
	bottom: 3vw;
	left: 0;
	right: 0;
	font-size: 16px;
	text-align: center;
}
.cubus-ec .link-box{
	width: 60%;
	margin: 40px auto 0;
}
.cubus-ec .link-box .category-link{
	padding: 20px;
}


@media screen and (max-width: 896px){
	.cubus-ec{
		width: 100%;
		padding: 0;
		margin: 0 auto;
	}
	.cubus-ec h3{
		padding: 0;
		margin: 0 auto ;
	}
	.cubus-ec a{
		color: #333;
	}
	.cubus-ec img{
		vertical-align: top;
	}
	
	/*TOP*/
	.cubus-ec .main-box .main-logo{
		width: 70vh;
		max-width: 300px;
		margin: 0 auto;
	}
	
	.section-box{
		position: relative;
		padding: 0;
		margin: 0 auto 20px;
	}
	.section-box:last-child{
		margin: 0 auto;
	}
	.section-inner{
		width: 90%;
		margin: 0 auto;
	}
	.cubus-ec p{
		font-weight: 500;
		line-height: 1.6;
		letter-spacing: .05em;
	}
	.intro-box{
		width: 100%;
		text-align: center;
		margin: 0 auto;
		background: #fff;
	}
	.logo-box{
		width: 50vh;
		max-width: 300px;
		margin: 60px auto 80px;
	}
	.logo-box p{
		margin: 0 auto 5px;
	}
	.cubus-ec .lead-ttl{
		font-size: 15px;
		margin: 0 auto 0;
	}
	
	.intro-img{
		margin: 40px auto;
	}
	
	.category-box{
		position: relative;
		margin: 0 auto;
	}
	.category-ttl{
		width: 100%;
	}
	.category-ttl .en,.category-ttl .color01{
		width: 100%;
		font-size: 40px;
		margin: 0 auto;
	}
	.category-ttl .en.white{
		color: #fff;
	}
	.category-ttl .jp{
		font-size: 15px;
		font-weight: 600;
	}
	.category-ttl .jp.white{
		color: #fff;
	}
	.cubus-ec .category-link{
		width: 50%;
		font-size: 12px;
		margin: 20px auto 0;
	}
	.section-box{
		position: relative;
		padding: 0;
		margin: 0 auto 40px;
	}
	.section-box:last-child{
		margin: 0 auto;
	}
	.section-inner{
		width: 100%;
		margin: 0 auto;
	}
	
	/*== ボタン共通設定 */
	/*== 背景が流れる（下から上） */
	.bgbottom:before {
		content: '';
		transition:none;
	}
	/*hoverした際の形状*/
	.bgbottom:hover:before{
		height: 100%;	
		background: rgba(42,38,37,0.90);
	}
	/*hoverした際の形状*/
	.bgbottom:active:before{
		height: 100%;	
		background: rgba(42,38,37,0.90);
	}
	/*== 背景が流れる（下から上） */
	.bgbottom2:before {
		content: '';
		transition: none;
	}
	/*hoverした際の形状*/
	.bgbottom2:hover:before{
		height: 100%;	
		background: rgba(255,255,255,0.90);
	}
	/*hoverした際の形状*/
	.bgbottom2:active:before{
		height: 100%;	
		background: rgba(255,255,255,0.90);
	}

	.intro{
		width: 100%;
		text-align: center;
		margin: 0 auto 60px;
	}
	.intro p{
		font-size: 14px ;
		line-height: 1.8;
		margin: 0 auto;
	}
	.cubus-ec .lead-ttl{
		font-size: 14px;
		letter-spacing: .05em;
		margin: 0 auto;
	}
	
	/* CONCEPT */
	.category-box.sub-page{
		margin: 0 auto 40px;
	}
	.cubus-ec .concept-txt{
		font-size: 15px;
		line-height: 1.8;
		margin: 0 auto 20px;
	}
	.concept-img{
		margin: 80px auto 80px;
	}
	.concept-svg{
		position: relative;
	}
	.concept-svg .svg-box {
		display: none;
	}
	.concept-inner{
		width: 90%;
		margin: 0 auto;
	}
	.concept-slider {
		margin: 40px auto;
	}
	.concept-slider.slick-slider{
		width: 50%;
		max-width: 500px;
	}
	.slick-img img {
		width: 100%;
	}

	/*USE*/
	.product-slider{
		/*width: 100%;*/
		margin: 0 auto;
	}
	.product-slider .slick-next {
		right: -10px;
		width: 30px;
		height: 30px;
	}
	.product-slider .slick-prev {
		left: -10px;
		width: 30px;
		height: 30px;
	}
	.product-slider .slick-next:before {
		content: "";
		width: 30px;
		height: 30px;
	}
	.product-slider .slick-prev:before {
		content: "";
		width: 30px;
		height: 30px;
	}
	.product-slider .slick-next:hover::before {
		transition: all 0.3s ease-in;
		transform: translate(0,0); 
		-webkit-transform: translate(0,0); 
	}
	.product-slider .slick-prev:hover::before {
		transition: all 0.3s ease-in;
		transform: translate(0,0); 
		-webkit-transform: translate(0,0); 
	}
	.product-slider .slick-slide{
		margin: 0 5px;
	}
	.product-slider .slick-dots li.slick-active button:before,
	.product-slider .slick-dots li button:before {
		font-size: 30px;
	}
	.product-slider .slick-dots {
			position: absolute;
			bottom: -30px;
	}
	.slick-prev.slick-disabled,
		.slick-next.slick-disabled {
				opacity: 0;
	}
	.product-slider .txt-box{
		margin: 20px auto 0;
	}
	.product-slider .slide-txt{
		width: 98%;
		font-size: 13px;
		line-height: 1.5;
		margin: 10px auto 0;
	}
	.standard-ttl{
		font-size: 16px;
	}
	.cubus-ec .standard-ttl .grid{
		font-size: 40px;
	}
	.standard-ttl .size{
		position: relative;
		top: -2px;
		font-size: 15px;
	}
	.standard-txt {
		font-size: 13px;
	}
	
	/*BASIC*/
	.basic-box{
		width: 92%;
		margin: 80px auto;
	}
	.basic-flex{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		margin: 0 auto 40px;
	}
	.basic-img{
		width: 38%;
	}
	.basic-txt-box{
		width: 56%;
	}
	.cubus-ec .basic-ttl{
		font-size: 23px;
		font-weight: 400;
		letter-spacing: .05em;
		text-align: left;
		margin: 0 0 10px;
	}
	.basic-ttl .en{
		font-size: 30px;
		letter-spacing: .02em;
		margin: 0;
	}
	.basic-ttl .jp{
		position: relative;
		top: -2px;
		font-size: 15px;
		letter-spacing: .05em;
		padding-left: 20px;
		margin: 0;
	}
	.basic-txt{
		font-size: 13px;
		line-height: 1.8;
		text-align: left;
	}
	.structure-img{
		position: relative;
	}
	.structure-txt1{
		width: 36%;
		position: absolute;
		top: 32vw;
		left: 0;
		font-size: 12px;
	}
	.structure-txt2{
		width: 36%;
		position: absolute;
		top: 32vw;
		right: 0;
		font-size: 12px;
	}
	.structure-txt3{
		width: 36%;
		position: absolute;
		top: 80vw;
		left: 0;
		font-size: 12px;
	}
	.structure-txt4{
		width: 36%;
		position: absolute;
		top: 80vw;
		right: 0;
		font-size: 12px;
	}
	.structure-box{
		width: 92%;
		margin: 80px auto 200px;
	}
	
	/*CUSTOM*/
	.custom-flex{
		width: 90%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto;
	}
	.custom-item{
		width: 48%;
		margin: 0 auto 40px;
	}
	.custom-img{
		margin: 0 auto 20px;
	}
	.cubus-ec .custom-ttl{
		font-size: 15px;
		margin: 0 0 5px;
	}
	.cubus-ec .custom-txt{
		font-size: 13px;
		margin: 0;
	}
	.cubus-ec .end-txt {
		width: 90%;
		position: absolute;
		bottom: 3vw;
		font-size: 13px;
		margin: auto;
	}
	.cubus-ec .link-box .category-link {
    width: 80%;
    font-size: 14px;
    margin: 20px auto 0;
  }
}

@media screen and (max-width: 568px){
		.cubus-ec{
			margin: 0 auto 40px;
		}
		.cubus-ec .main-bg{
			margin: 0 auto !important;
		}
		.cubus-ec .main-box .main-logo{
			position: absolute;
			top: 93%;
			left: 50%;
			transform: translateX(-50%) translateY(-93%);
			width: 68%;
			max-width:inherit;
			margin: 0 auto;
		}
		.svg-box {
			width: 100%;
			position: absolute;
			bottom: 1em;
			left: 5%;
			margin: 0 auto;
			}

		.section-box{
			position: relative;
			padding: 0;
			margin: 0 auto 20px;
		}
		.section-box:last-child{
			margin: 0 auto;
		}

		.intro{
			width: 100%;
			margin: 0 auto 30px;
		}
		.intro p{
			font-size: 13px;
			line-height: 1.6;
			margin: 0 auto;
		}

		.logo-box{
			width: 58%;
			max-width:inherit;
			margin: 40px auto 40px;
		}
		.logo-box p{
			margin: 0 auto 5px;
		}

		.cubus-ec .lead-ttl{
			width: 95%;
			font-size: 3.4vw;
			margin: 0 auto 0;
		}
		.intro-img{
			margin: 0 auto;
		}
	
		.category-box{
			position: relative;
			margin: 0 auto;
		}
		.category-ttl{
			width: 100%;
		}
		.category-ttl .en,.category-ttl .color01{
			width: 100%;
			font-size: 9.5vw;
			line-height: 1.2;
			margin: 0 auto ;
		}
	
		.category-ttl .en.white{
			color: #fff;
		}
		.category-ttl .jp{
			font-size: 3.6vw;
			font-weight: 600;
		}
		.category-ttl .jp.white{
			color: #fff;
		}
		.cubus-ec .category-link{
			width: 80%;
			font-size: 3.0vw;
			margin: 15px auto 0;
		}
	
		/* CONCEPT */
		.category-box.sub-page{
			margin: 0 auto 40px;
		}
		.cubus-ec .concept-txt{
			font-size: 3.4vw;
			line-height: 1.8;
			margin: 0 auto 20px;
		}
		.concept-img{
			margin: 40px auto;
		}
		.concept-inner{
			width: 95%;
			margin: 0 auto;
		}
		.concept-slider.concept-slider {
			margin: 20px auto;
		}
	
	/* USE */
	.product-flex {
		margin: 0 auto 60px;
	}
	.product-slider .slick-slide {
    margin-right: 10px;
	}
	/*.product-slider .slick-next,.product-slider .slick-prev {
		position: absolute;
		transform: translate(0, -50%);
		width: 30px;
		height: 30px;
	}*/
	.product-slider {
		width: 90%;
    margin: 0 auto 20px;
	}
	.product-slider .slick-dots {
		position: absolute;
		bottom: -30px;
	}
/*	.product-slider .slick-next {
		right: 35%;
	}
	.product-slider .slick-prev {
		left: 35%;
	}
	.product-slider .slick-next:before {
		content: "";
		width: 30px;
		height: 30px;
	}
	.product-slider .slick-prev:before {
		width: 30px;
		height: 30px;
	}*/
	/*.product-slider .slick-slide{
		margin: 0 5px;
	}*/
	.product-slider .slide-txt{
		width: 100%;
		font-size: 3.0vw;
		line-height: 1.5;
		margin: 10px auto 0;
	}
	.product-txt {
		width: 100%;
	}
	
	/*BASIC*/
	.basic-box{
		margin: 40px auto 20px;
	}
	.basic-flex{
		margin: 0 auto 40px;
	}
	.basic-flex2 {
		margin: -20vw auto 0;
	}
	.basic-flex:last-child{
		margin: 0 auto;
	}
	.basic-img1{
		width: 60%;
	}
	.basic-img2{
		width: 46%;
	}
	.basic-txt-box{
		width: 100%;
		margin: 30px auto;
	}
	.cubus-ec .basic-ttl{
		width: 37%;
		font-size: 3.8vw;
		font-weight: 400;
		letter-spacing: .05em;
		margin: -10vw 0 10px;
		text-align: center;
	}
	.basic-ttl .en{
		font-size: 6.8vw;
	}
	.basic-ttl .jp{
		display: block;
		font-size: 3.8vw;
		letter-spacing: .05em;
		text-align: center;
		padding: 0;
		margin: 0;
	}
	.basic-txt{
		font-size: 3.4vw;
	}
	.structure-txt1{
		width: 48%;
		position: absolute;
		top: 43vw;
		left: 0;
		font-size: 3.0vw;
	}
	.structure-txt2{
		width: 48%;
		position: absolute;
		top: 43vw;
		right: 0;
		font-size: 3.0vw;
	}
	.structure-txt3{
		width: 48%;
		position: absolute;
		top: 174vw;
		left: 0;
		font-size: 3.0vw;
	}
	.structure-txt4{
		width: 48%;
		position: absolute;
		top: 174vw;
		right: 0;
		font-size: 3.0vw;
	}
	.structure-box{
		width: 92%;
		margin: 0 auto 60vw;
		line-height: 1.5;
	}
	
	/*STANDARD*/
	.standard-lead-ttl{
		font-size: 4.3vw;
		margin: 10px 0 20px;
	}
	.standard-lead-ttl .en{
		font-size: 10vw;
		letter-spacing: .05em;
		margin: 0;
	}
	.standard-box{
		width: 100%;
		margin: 0 auto 40px;
	}
	.standard-img{
		width: 100%;
	}
	.standard-ttl{
		font-size: 3.8vw;
		margin: 0 0 20px;
	}
	.cubus-ec .standard-ttl .grid{
		font-size: 10vw;
		letter-spacing: .05em;
	}
	.standard-ttl .size{
		position: relative;
		top: -2px;
		font-size: 3.8vw;
		letter-spacing: .05em;
	}
	.standard-txt-box{
		width: 90%;
	}
	.standard-txt{
		font-size: 3.4vw;
		line-height: 1.8;
	}
	.standard-txt br{
		display: none;
	}
	
	/*CUSTOM*/
	.custom-item{
		width: 100%;
		margin: 0 auto 40px;
	}
	.custom-img{
		width: 90%;
		margin: 0 auto 20px;
	}
	.cubus-ec .custom-ttl{
		font-size: 4.0vw;
	}
	.cubus-ec .custom-txt{
		font-size: 3.4vw;
	}
	.cubus-ec .end-txt {
		position: absolute;
		bottom: 5vw;
		font-size: 3.4vw;
	}
	.cubus-ec .link-box {
		width: 90%;
		margin: 40px auto 0;
	}
}