/* new configuration page design */

.configuration-tab {
    display: flex;
	justify-content: flex-end;
	align-content: center;
	align-items:flex-end;
    flex-wrap: wrap;
	padding:0;
	margin:0;
}

.configuration-tab-label1,
.configuration-tab-label2,
.configuration-tab-label3,
.configuration-tab-label4,
.configuration-tab-label5{
   	margin:0 0 30px 0;
    padding: 0;
	box-sizing: border-box;
	cursor:pointer;
	transition:.1s all ease-in;
	position:relative;
	border-bottom:1px solid #BDC3CB;
	display:flex;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;

}
.configuration-tab-label1{
 	order:1;
	width:340px;
	position:relative;
	box-sizing: border-box;
	border-top-right-radius: 0.5em;
	justify-content: flex-start;
}

.configuration-tab-label2,
.configuration-tab-label3,
.configuration-tab-label4,
.configuration-tab-label5{
	order:2;
	width:calc((100% - 340px)/4);
	box-sizing: border-box;
	justify-content: flex-end;
}

.configuration-tab-label2::before,
.configuration-tab-label3::before,
.configuration-tab-label4::before,
.configuration-tab-label5::before{
	transition:.5s all ease;
}

.configuration-tab-label2::before,
.configuration-tab-label3::before,
.configuration-tab-label4::before,
.configuration-tab-label5::before{
	width:10px;
	height:10px;
	bottom:0px;
	left:calc((100% - 10px)/2);
	display:block;
	content:'';
	border-top:2px solid #27455b;
	border-left:2px solid #27455b;
	position:absolute;
	 -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	background:#27455b;
	z-index:2;
	opacity:0;
}


.configuration-tab-label1 span{
	flex:0 0 calc(100% - 4px);
	font-size:200%;
	color:#27455b;
	text-shadow: 1px 1px #fff;
	background:rgba(237,235,230,1);
	text-align:center;
	font-weight:200;
	padding:20px 0px 14px 0px;
	box-sizing: border-box;
	cursor:pointer;
	position:relative;
	border:0;
	border-top-right-radius: 0.5em;
}

.configuration-tab-label2 span,
.configuration-tab-label3 span,
.configuration-tab-label4 span,
.configuration-tab-label5 span{
	font-size:100%;
	color:#27455b;
	background:rgba(237,235,230,1);
	flex:0 0 calc(100% - 4px);
	height:100%;
	font-weight:300;
	text-align:center;
	padding:10px 0 10px 0;
	box-sizing: border-box;
	transition:.1s all ease-in;
	border-top-right-radius: .8em;
}


.configuration-tab-label1 span:hover,
.configuration-tab-label2 span:hover,
.configuration-tab-label3 span:hover,
.configuration-tab-label4 span:hover,
.configuration-tab-label5 span:hover{
	opacity:.6;
}

.configuration-tab-content1,
.configuration-tab-content2,
.configuration-tab-content3,
.configuration-tab-content4,
.configuration-tab-content5{
    width: 100%;
	opacity:0;
	transition:.2s;
	order:6;
	padding:20px 4px 0 4px;
	box-sizing: border-box;
	margin:0;
	display: none;
}



.configuration-tab-switch-view1:checked+.configuration-tab-label1{
 	order:1;
	width:340px;
	position:relative;
	border-bottom:1px solid #BDC3CB;
	box-sizing: border-box;
	background:#fff;
	border-top-right-radius: 0.5em;
}

.configuration-tab-switch-view1:checked+.configuration-tab-label1 span{
	font-size:200%;
	color:#fff;
	background:#27455b;
	text-shadow:0px 0px #fff;
	display:inline-block;
	width:100%;
	height:100%;
	text-align:center;
	font-weight:200;
	padding:20px 0px 14px 0px;
	box-sizing: border-box;
	cursor:pointer;
	border-top-right-radius: 0.5em;
}

.configuration-tab-switch-view2:checked+.configuration-tab-label2,
.configuration-tab-switch-view3:checked+.configuration-tab-label3,
.configuration-tab-switch-view4:checked+.configuration-tab-label4,
.configuration-tab-switch-view5:checked+.configuration-tab-label5{
	position:relative;
	border-bottom:1px solid #BDC3CB;
	box-sizing: border-box;
}
.configuration-tab-switch-view2:checked+.configuration-tab-label2 span,
.configuration-tab-switch-view3:checked+.configuration-tab-label3 span,
.configuration-tab-switch-view4:checked+.configuration-tab-label4 span,
.configuration-tab-switch-view5:checked+.configuration-tab-label5 span{
 	background:#27455b;
	box-sizing: border-box;
	color:#fff;
	position:relative;

}
.configuration-tab-switch-view1:checked+.configuration-tab-label1 span::after,
.configuration-tab-switch-view2:checked+.configuration-tab-label2 span::after,
.configuration-tab-switch-view3:checked+.configuration-tab-label3 span::after,
.configuration-tab-switch-view4:checked+.configuration-tab-label4 span::after,
.configuration-tab-switch-view5:checked+.configuration-tab-label5 span::after{
	content:'';
	width:100%;
	height:1px;
	display:block;
	left:0;
	bottom:-1px;
	position:absolute;
	background:#27455b;
}
.configuration-tab-switch-view1:checked+.configuration-tab-label1::before,
.configuration-tab-switch-view2:checked+.configuration-tab-label2::before,
.configuration-tab-switch-view3:checked+.configuration-tab-label3::before,
.configuration-tab-switch-view4:checked+.configuration-tab-label4::before,
.configuration-tab-switch-view5:checked+.configuration-tab-label5::before{
	width:10px;
	height:10px;
	bottom:-6px;
	left:calc((100% - 10px)/2);
	display:block;
	content:'';
	border-top:2px solid #27455b;
	border-left:2px solid #27455b;
	position:absolute;
	 -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	background:#27455b;
	z-index:2;
	opacity:1;
}

.configuration-tab-switch-view1:checked+.configuration-tab-label1 span:hover,
.configuration-tab-switch-view2:checked+.configuration-tab-label2 span:hover,
.configuration-tab-switch-view3:checked+.configuration-tab-label3 span:hover,
.configuration-tab-switch-view4:checked+.configuration-tab-label4 span:hover,
.configuration-tab-switch-view5:checked+.configuration-tab-label5 span:hover{
	opacity:1;
	cursor: default;
}

.configuration-tab-switch-view1:checked+.configuration-tab-label1+.configuration-tab-content1,
.configuration-tab-switch-view2:checked+.configuration-tab-label2+.configuration-tab-content2,
.configuration-tab-switch-view3:checked+.configuration-tab-label3+.configuration-tab-content3,
.configuration-tab-switch-view4:checked+.configuration-tab-label4+.configuration-tab-content4,
.configuration-tab-switch-view5:checked+.configuration-tab-label5+.configuration-tab-content5{
    display: block;
	opacity:1;    
	animation-name: displayAnime;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}
@keyframes displayAnime{
  from {
    opacity: 0;
	  margin-top:-4px;
  }
  to {
    opacity: 1;
	  margin-top:0;
  }
}
.configuration-tab-switch-view1 {
    display: none;
}
.configuration-tab-switch-view2 {
    display: none;
}
.configuration-tab-switch-view3 {
    display: none;
}
.configuration-tab-switch-view4 {
    display: none;
}
.configuration-tab-switch-view5 {
    display: none;
}
@media screen and (max-width: 1200px) {
		
	.configuration-tab{
		justify-content: space-around;
	}
	.configuration-tab-label1{
 	order:1;
	width:100%;
	margin:0;
	}
	.configuration-tab-label1 span{
	flex: 0 0 100%;
	padding:10px;
	}
	.configuration-tab-label1 span,
	.configuration-tab-label5 span{
	flex: 0 0 100%;
	}
	.configuration-tab-label2,
	.configuration-tab-label3,
	.configuration-tab-label4,
	.configuration-tab-label5{
	order:3;
	width:calc(100% / 4);
	margin:0;
	box-shadow:0px 3px 3px #f5f3ee;
	justify-content: flex-start;
	}

	.configuration-tab-content1{
    width: 100%;
    display: block;
	opacity:1;
	order:2;
	border-left:1px solid #BDC3CB;
	border-right:1px solid #BDC3CB;
	border-bottom:1px solid #BDC3CB;
	margin:0 0 60px 0;
	box-sizing: border-box;
	padding:40px 4px 10px 4px;
	box-shadow:0px 3px 3px #f5f3ee;
	}
	
	.configuration-tab-content2,
	.configuration-tab-content3,
	.configuration-tab-content4,
	.configuration-tab-content5{
    width: 100%;
	order:4;
	border-left:1px solid #BDC3CB;
	border-right:1px solid #BDC3CB;
	border-bottom:1px solid #BDC3CB;
	box-sizing: border-box;
	margin:0;
	padding:40px 4px 10px 4px;
	}

	input.configuration-tab-switch-view1:checked~.configuration-tab-content1{
		display:block;
		opacity:1;
	}
	.configuration-tab-label1,
	.configuration-tab-switch-view1:checked+.configuration-tab-label1{
		width:100%;
		margin:0;
		border:0px;
		border-top-right-radius: 0;
		pointer-events: none;
	}
	.configuration-tab-label1::before{
	width:10px;
	height:10px;
	bottom:-6px;
	left:calc((100% - 10px)/2);
	display:block;
	content:'';
	border-top:2px solid #27455b;
	border-left:2px solid #27455b;
	position:absolute;
	 -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	background:#27455b;
	z-index:2;
	opacity:1;
	}
	.configuration-tab-label1 span,
	.configuration-tab-switch-view1:checked+.configuration-tab-label1 span{
		text-align:center;
		background:#27455b;
		color:#fff;
		text-shadow:0px 0px #fff;
		padding:20px 0;
		border-top-right-radius: 0;
		
	}
	.configuration-tab-label1 span::before,
	.configuration-tab-switch-view1:checked+.configuration-tab-label1 span::before{
		content:'';
		left:0;
		top:100%;
		width:100%;
		height:10px;
		background:rgba(237,235,230,1);
		display:block;
		position:absolute;
	}
	.configuration-tab-label1 span:hover{
		opacity:1;
		cursor: default;
	}

}
@media screen and (max-width: 600px) {
	
	.configuration-tab-label2 span,
	.configuration-tab-label3 span,
	.configuration-tab-label4 span,
	.configuration-tab-label5 span{
		font-size:80%;
	}
	
}
@media screen and (max-width: 450px) {
	
	.configuration-tab-label2 span,
	.configuration-tab-label3 span,
	.configuration-tab-label4 span,
	.configuration-tab-label5 span{
		font-size:50%;
		font-weight:600;
	}
	
}

/* new configuration mask design - product page -*/
.btn-wrapper{
	width:100%;
	padding:0 0 5px 0;
	box-sizing: border-box;
	margin:0;
	position:relative;
	z-index:1;
}
.btn-wrapper::before{
	content:'';
	width:1px;
	height:calc(100% - 60px);
	position:absolute;
	background:#BDC3CB;
	left:19px;
	top:40px;
	display:block;
	z-index:-1;
}
.btn-wrapper h3{
	color:#27455b;
	font-size:150%;
	font-weight:200;
	box-sizing: border-box;
	margin:0px 0 20px 0;
	position:relative;
	display:flex;
	justify-content: flex-start;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
}
.btn-wrapper h3 span.title{
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	margin:0;
	box-sizing: border-box;
	min-height:50px;
	height:auto;
	padding:0 0 0 60px;
}
.btn-wrapper h3 span.modnum{
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	width:40px;
	height:40px;
	top:calc((100% - 40px) /2)px;
	left:0;
	position:absolute;
	text-align:center;
	font-weight:400;
	font-size:20px;
	z-index:2;
}
.btn-wrapper h3 span.modnum::before{
	content:'';
	width:33px;
	height:33px;
	box-sizing: border-box;
	position:absolute;
	background:rgba(237,235,230,.4);
	border-radius:50%;
	top:5px;
	left:3px;
	z-index:-1;
}
.btn-wrapper h3 span.modnum::after{
	content:'';
	width:43px;
	height:43px;
	position:absolute;
	background:#fff;
	border:3px solid rgba(9,86,142,.3);
	box-sizing: border-box;
	border-radius:50%;
	top:0px;
	left:-2px;
	z-index:-2;
}

.btn-wrapper h3 span.modnum.selected::after{
	content:'';
	width:43px;
	height:43px;
	position:absolute;
	background:#fff;
	border:3px solid rgba(9, 142, 16, 0.932);
	border-radius:50%;
	top:0px;
	left:-2px;
	z-index:-2;
}

.btn-wrapper h3 span.learn_link{
	display:inline-block;
	box-sizing: border-box;
	padding:0 0 0 60px;
	position:relative;
	color:#2f73c8;
	transition:.2s all ease-in-out;
	z-index:1;
}
.btn-wrapper h3 span.learn_link:hover{
	cursor:pointer;
}
.btn-wrapper h3 span.learn_link::before{
	content:'';
	width:60px;
	height:1px;
	border-top:1px dashed #eee;
	display:block;
	position:absolute;
	top:calc(50% - 1px);
	left:0;
	z-index:-1;
}

.btn-wrapper h3 span.learn_link p{
	display:inline-block;
	width:100%;
	height:100%;
	padding:6px 12px 6px 12px;
	box-sizing: border-box;
	font-size:14px;
	font-weight:300;
	transition:.2s all ease-in-out;
	border:1px solid #eee;
	border-radius:.3em;
	background:#fff;
	z-index:2;
}
.btn-wrapper span.learn_link p:hover{
	text-decoration: underline;
	transform:scale(1.05);
}


.btn-wrapper div input[type="radio"]{
	display:none;
}

/* alignment-btn-container product page */
.alignment-btn-container{
	width:100%;
	display:flex;
	justify-content: space-around;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 40px 0;
	padding:0 30px;
	box-sizing: border-box;
}


.alignment-btn-container label{
	flex: 0 30%;
}
.alignment-btn-container label .button-container{
	border-radius:.5em;
	box-sizing: border-box;
	padding:10px;
	margin:0;
	border:1px solid #BDC3CB;
	box-shadow: 0px 1px 2px #c5cfd7;
	display:flex;
	justify-content: space-around;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
}


.alignment-btn-container label .button-container:hover{
	transform: scale(1.02);
}
.alignment-btn-container label .button-container span{
	flex:1 1;
	transition:.3s all ease-in-out;
	display:inline-block;
}

.alignment-btn-container label .button-container span.text{
	font-weight:200;
	color:#27455b;
	box-sizing: border-box;
	padding:10px;
	font-size:140%;
}

.alignment-btn-container label .button-container span.text{font-size:150%;}
.alignment-btn-container label .button-container span.img{
	display:inline-block;
	margin:0;
	padding:0;
}
.alignment-btn-container label .button-container span.img img{
	width:100%;
	height:100%;
	max-width:125px;
	max-height:80px;
	border:0;
}
.btn-wrapper .alignment-btn-container input[type="radio"]:checked + label .button-container{
	border:4px solid #09568e;
}

.btn-wrapper input[type="radio"]:checked+ label .button-container span.text{
	transition:.1s all ease-in-out;
} 

/* frame-btn-container product page */
/* material-btn-container product page */
.frame-btn-container,
.material-btn-container{
	width:100%;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 40px 0;
	padding:0 0 0 30px;
	box-sizing: border-box;
	position:relative;
}
.frame-btn-container label,
.material-btn-container label{
	flex: 0 0 100%;
	margin-bottom:20px;
	padding:0;
	display:block;
}
.frame-btn-container label .button-container,
.material-btn-container label .button-container{
	border-radius:.5em;
	width:50%;
	height:50px;
	border:1px solid #BDC3CB;
	box-sizing: border-box;
	box-shadow: 0px 1px 2px #c5cfd7;
	display:flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
	background:#fff;
	overflow: hidden;
}
.frame-btn-container label .button-container span.text,
.material-btn-container label .button-container span.text{
	flex:0 0 calc(100 - 100px);
	font-size:100%;
	font-weight:300;
	color:#27455b;
	padding:10px;
	display:inline-block;
	box-sizing: border-box;
}
.frame-btn-container label .button-container span.price,
.material-btn-container label .button-container span.price{
	flex:0 0 100px;
	font-size:100%;
	height:auto;
	position:relative;
	font-weight:300;
	z-index:2;
	text-align:center;
}
.frame-btn-container label .button-container span.price,
.material-btn-container label .button-container span.price{
	display:none;
}
.frame-btn-container label .button-container span.sp,
.material-btn-container label .button-container span.sp{
	color:#27455b;
	font-weight:300;
	display:inline-block;
}

.frame-btn-container .frame-explain,
.material-btn-container .material-explain{
	width:50%;
	position:absolute;
	left:50%;
	padding-left:60px;
	margin:0;
	box-sizing: border-box;
	transition:.2s all ease-in-out;
	display:flex;
	justify-content: space-between;
	align-content: stretch;
	align-items: center;
	flex-wrap:wrap;
	opacity:0;

}
.frame-btn-container .frame-explain span.frame-pic,
.material-btn-container .material-explain span.material-pic{
	flex:0 0 150px;
	padding:0;
	margin:10px 0 0 0;
	position:relative;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
}
.frame-btn-container .frame-explain span.frame-pic img,
.material-btn-container .material-explain span.material-pic img{
	flex:1 1;
	width:100%;
	max-width:150px;
	height:100%;
	display:block;
	border-radius:.3em;
}
.frame-btn-container .frame-explain div.frame-text,
.material-btn-container .material-explain div.material-text{
	flex:0 0 calc(100% - 150px);
	padding:0 0 0 45px;
	box-sizing: border-box;
	margin:0;
	display:block;
	color:#27455b;
	font-size:90%;
	font-weight:300;
}
.frame-btn-container .frame-explain div.frame-text p,
.material-btn-container .material-explain div.material-text p{
	line-height:1.2;
	letter-spacing:.03em;
}
.frame-btn-container .frame-explain div.frame-text p strong,
.material-btn-container .material-explain div.material-text p strong{
	font-weight:400;
}
.material-btn-container .material-explain div.material-text .textile-block{
	width:100%;
	padding:0;
	margin:0;
	display:flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-desc{
	flex:0 0 100%;
	padding:0;
	margin:0;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care p strong,
.material-btn-container .material-explain div.material-text .textile-block .textile-block-desc p strong{
	font-weight:400;
	margin:0;
	padding:0;
	display:none;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care p,
.material-btn-container .material-explain div.material-text .textile-block .textile-block-desc p{
	display:none;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-desc ul{
	margin:0;
	padding:0;
	list-style-position: inherit;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-textile ul li{
	margin-bottom:4px;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care{
	flex:0 0 100%;
	display:flex;
	justify-content: flex-start;
	align-content: flex-start;
	align-items: center;
	flex-wrap:wrap;
	margin-top:4px;
	padding:0;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care p{
	display:inline-block;
	flex:0 0 100%;
	margin:0;
	padding:0;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care div{
	flex:0 0 100%;
	display:flex;
	justify-content: flex-start;
	align-content: flex-start;
	align-items: center;
	flex-wrap:wrap;
	margin:0;
	padding:0;
}
.material-btn-container .material-explain div.material-text .textile-block .textile-block-care div img{
	display:block;
	width:100%;
	max-width:30px;
	margin-right:14px;
}
.frame-btn-container input,
.material-btn-container input{display:none;}

.frame-btn-container input:checked + .frame-explain + label .button-container,
.material-btn-container input:checked + .material-explain + label .button-container{border:4px solid #09568e;box-sizing: border-box;}

.frame-btn-container input:checked + .frame-explain,
.material-btn-container input:checked + .material-explain{opacity:1;}


/* material-btn-container product page */
.dimension-container{
	width:100%;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 30px 0;
	box-sizing: border-box;
	position:relative;
}
.dimension-pic-container,
.dimension-btn-container{
	flex:0 0 50%;
	display:flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	height:auto;
	margin:0;
	box-sizing: border-box;
	position:relative;
}

.dimension-pic-container{padding:0 30px 0 30px; align-content: center;}
.dimension-btn-container{padding:0 0 0 30px; align-content: flex-start;}



.dimension-pic-container span.dimension-pic{
	display:inline-block;
	position:relative;
	width:auto;
	height:auto;
	border:1px solid #eee;
	border-radius:.3em;
	transition: .2s all ease-in-out;
}
.dimension-pic-container span.dimension-pic:hover{
	transform: scale(1.05);
	cursor:pointer;
}
.dimension-pic-container span.dimension-pic::before{
	content:'';
	border-radius:50%;
	position:absolute;
	right:10px;
	top:10px;
	background:rgba(228,222,207,.8);
	display:block;
	width:60px;
	height:60px;
	transition: .2s all ease-in-out;
}
.dimension-pic-container span.dimension-pic::after{
	content:'';
	border-radius:50%;
	position:absolute;
	background-image: url('../images/structure/icon_enlarge.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 80% 80%;
	right:10px;
	top:10px;
	width:60px;
	height:60px;
}
.dimension-pic-container span.dimension-pic:hover::before{
	background:rgba(218,207,180,1);
	transform: scale(1.2);
}
.dimension-pic-container span.dimension-pic a{
	position:absolute;
	display:block;
	width:100%;
	height:100%;
	top:0;
	left:0;
}
.dimension-pic-container span.dimension-pic img{
	max-width:520px;
	width:auto;
	max-height:300px;
	height:auto;
	border-radius:.3em;
	
}
.dimension-btn-container p{
	flex: 0 0 100%;
	margin-bottom:20px;
	display:block;
	line-height:1.2;
	font-size:88%;
	color:#BDC3CB;
}
.dimension-btn-container label{
	flex: 0 0 100%;
	margin-bottom:20px;
	display:block;
}
.dimension-btn-container label{
	flex: 0 0 100%;
	margin-bottom:20px;
	display:block;
	font-size:90%;
}
.dimension-btn-container label .button-container{
	border-radius:.5em;
	width:100%;
	height:50px;
	border:1px solid #BDC3CB;
	box-sizing: border-box;
	box-shadow: 0px 1px 2px #c5cfd7;
	display:flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
	background:#fff;
	overflow: hidden;
}
.dimension-btn-container label .button-container span.text{
	flex:0 0 calc(100% - 100px);
	font-size:110%;
	font-weight:300;
	color:#27455b;
	padding:10px;
	display:inline-block;
	box-sizing: border-box;
}

.dimension-btn-container label .button-container span.price{
	flex:0 0 100px;
	font-size:110%;
	height:auto;
	position:relative;
	font-weight:300;
	z-index:2;
	text-align:center;
}
.dimension-btn-container label .button-container span.price{
	display:none;
}
.dimension-btn-container label .button-container span.sp{
	color:#27455b;
	font-weight:300;
	display:inline-block;
}



.dimension-btn-container label .button-container button,
.dimension-btn-container label .button-container p{display:none;}
.dimension-btn-container textarea#new_custom_size_input{display:none;}


.dimension-btn-container input{display:none;}
.dimension-btn-container input.custom:checked + label .button-container{
	height:350px;
	transition:.2s all ease-in-out;
}

.dimension-btn-container input:checked + label .button-container{
	border:4px solid #09568e;
	padding:0px;
}
.dimension-btn-container input.custom:checked + label + p{
	display:none;
}
.dimension-btn-container input.custom:checked + label .button-container p{
	display:inline-block;
	flex:0 0 100%;
	font-size:90%;
	font-weight:300;
	color:#AF0000;
	padding:10px;
	box-sizing: border-box;
	height:auto;
	max-height:50px;
}
.dimension-btn-container input.custom:checked + label .button-container span.price,
.dimension-btn-container input.custom:checked + label .button-container span.text{
	height:50px;
}
.dimension-btn-container input.custom:checked + label .button-container textarea#new_custom_size_input{
	display:block;
	border-radius:.3em;
	border:1px solid #aaa;
	margin:0 auto;
	flex:0 0 100%;
	height:120px;
	max-width:96%;
	resize: none;
}
.dimension-btn-container input.custom:checked + label .button-container textarea#new_custom_size_input:hover{
	background:#fdffff;
}
.dimension-btn-container input.custom:checked + label .button-container textarea#new_custom_size_input:focus{
	outline: none;
	box-shadow:0px 0px 3px #11458c;
}
.dimension-btn-container input.custom:checked + label .button-container button{
	display:block;
	height:50px;
	padding:10px;
	background:rgba(237,235,230,1);
	color:#27455b;
	border:0;
	box-sizing: border-box;
	flex:0 0 100%;
	max-width:96%;
	margin:10px auto;
	border-radius:.3em;
	font-size:120%;
	outline: none;
}
.dimension-btn-container input.custom:checked + label .button-container button:active{
	background:#27455b;
	color:#fff;
}
.dimension-btn-container input.custom:checked + label .button-container button:hover{
	cursor:pointer;
}
.dimension-btn-container input.custom:checked + label .button-container button._active{
	background:#27455b;
	color:#fff;
}
.dimension-btn-container input.custom:checked + label .button-container textarea._saved{
	border: 3px #27455b solid;
}
/* Colors-container product page */

.colors-container{
	width:100%;
	height:auto;
	display:flex;
	justify-content: flex-start;
	align-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	margin:0 0 40px 0;
}

.secondarycolors-btn-container,
.maincolors-btn-container{
	flex:0 0 100%;
	width:100%;
	display:flex;
	justify-content: flex-start;
	align-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 20px 0;
	padding:0 420px 0 30px;
	box-sizing: border-box;
	position:relative;
	overflow:hidden;
}

.maincolors-btn-container h4.colors-header,
.secondarycolors-btn-container h4.colors-header{
	flex:0 0 100%;
	margin:0 0 10px 0;
	font-weight:200;
	color:#27455b;
	font-size:100%;
}
.secondarycolors-btn-container label,
.maincolors-btn-container label{
	flex: 0 0 40px;
	height:40px;
	margin-bottom:8px;
	margin-right:8px;
	display:block;
	
}

.secondarycolors-btn-container label .button-container,
.maincolors-btn-container label .button-container{
	width:40px;
	height:40px;
	border-radius:50%;
	padding:4px;
	box-sizing: border-box;
	border:1px solid #BDC3CB;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
	background:#fff;
}

.secondarycolors-btn-container label .button-container:hover,
.maincolors-btn-container label .button-container:hover{
	transform: scale(1.3);
}

.secondarycolors-btn-container label .button-container span.color-icon,
.maincolors-btn-container label .button-container span.color-icon{
	flex:0 0 32px;
	display:block;
	margin:0;
	width:32px;
	height:32px;
	box-sizing: border-box;
	overflow:hidden;
	border-radius:50%;
	position:relative;
}

.secondarycolors-btn-container label .button-container span.color-icon img,
.maincolors-btn-container label .button-container span.color-icon img{
	position:absolute;
	top:0;
	left:0;
	max-width:250px;
	max-height:50px;
}
.secondarycolors-btn-container .colors-explain,
.maincolors-btn-container .colors-explain{
	opacity:0;
	position:absolute;
	max-width:360px;
	right:0px;
	top:0px;
	margin:30px 0 0 0;
	padding:0;
	pointer-events: none;
}
.secondarycolors-btn-container .colors-explain span.colors-pic,
.maincolors-btn-container .colors-explain span.colors-pic{
	display:inline-block;
	flex:0 0 180px;
	height:50px;
	position:relative;
	overflow: hidden;
	border-radius:.3em;
}


.secondarycolors-btn-container .colors-explain span.colors-pic img,
.maincolors-btn-container .colors-explain span.colors-pic img{
	width:250px;
	height:50px;
	display:block;
	top:0;
	left:0;
	border-radius:.3em;
}
.secondarycolors-btn-container .colors-explain span.colors-code,
.maincolors-btn-container .colors-explain span.colors-code{
	font-weight:200;
	color:#27455b;
	padding:10px;
	box-sizing: border-box;
	display:inline-block;
	flex: 0 0 calc(100% - 180px);
	position:relative;
	background:#fff;
	z-index:1;
	font-size:90%;
}


.secondarycolors-btn-container input,
.maincolors-btn-container input{display:none;}

.secondarycolors-btn-container input:checked + .colors-explain + label,
.maincolors-btn-container input:checked + .colors-explain + label{
	flex:0 0 40px;
}
.secondarycolors-btn-container input:checked + .colors-explain + label .button-container,
.maincolors-btn-container input:checked + .colors-explain + label .button-container{
	border:4px solid #09568e;
	padding:0px;
	transform: scale(1.1);
}
.secondarycolors-btn-container input:checked + .colors-explain + label .button-container{
	
}
.secondarycolors-btn-container input:checked + .colors-explain,
.maincolors-btn-container input:checked + .colors-explain{
	opacity:1;
	max-width:360px;
	position:absolute;
	right:0px;
	margin:30px 0 0 0;
	padding:0;
	transition: .2s all ease-in;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
}


/* combination-btn-container product page */
.combination-btn-container{
	width:100%;
	display:flex;
	justify-content: space-around;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 60px 0;
	padding:0 30px;
	box-sizing: border-box;
}
.combination-btn-container p{
	display:inline-block;
	flex: 0 0 100%;
	height:auto;
	line-height:1.5;
	font-size:110%;
	color:#BDC3CB;
	font-weight:300;
	text-align:center;
	margin: 0 0 30px 0;
}

.combination-btn-container label{
	flex: 0 0 30%;
	height:auto;
}
.combination-btn-container label .button-container{
	border-radius:.5em;
	height:70px;
	box-sizing: border-box;
	padding:10px 100px 10px 10px;
	margin:0;
	border:1px solid #BDC3CB;
	box-shadow: 0px 1px 2px #c5cfd7;
	display:flex;
	justify-content: space-around;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
	overflow:hidden;
}


.combination-btn-container label .button-container:hover{
	transform: scale(1.02);
}

.combination-btn-container label .button-container span.text{
	flex:1 1;
	font-weight:200;
	color:#27455b;
	box-sizing: border-box;
	padding:10px;
	font-size:140%;
	text-align:center;
}

.combination-btn-container label .button-container span.icon{
	flex:0 0 80px;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	margin:0;
	padding:0;
}
.combination-btn-container label .button-container span.icon img{
	width:100%;
	height:100%;
	max-width:60px;
	max-height:60px;
	border:0;
}
.combination-btn-container label .button-container span.price{
	flex:0 0 100px;
	font-size:100%;
	height:auto;
	position:absolute;
	right:0;
	font-weight:400;
	z-index:2;
	text-align:center;
	box-sizing: border-box;
	padding:10px;
}
.combination-btn-container label .button-container span.price{
	color:#fff;
	display:none;
}
.combination-btn-container label .button-container span.sp{
	color:#27455b;
	font-weight:300;
	display:inline-block;
}

.combination-btn-container input[type="checkbox"]{display:none;}
.combination-btn-container input[type="checkbox"]:checked + label .button-container{
	border:4px solid #09568e;
}

.combination-btn-container input[type="checkbox"]:checked+ label .button-container span.text{
	transition:.1s all ease-in-out;
}


/* extra-container product page */
.extra-container{
	width:100%;
	display:flex;
	justify-content: space-around;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	height:auto;
	margin:0 0 60px 0;
	padding:0 30px;
	box-sizing: border-box;
	position:relative;
}
.extra-container label{
	flex:0 0 100%;
	padding:0;
	margin:0;
	display:flex;
	justify-content: flex-start;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;	
}

.extra-container input{
  position: relative;
  display:none;
}
.extra-container label .button-container{
	flex:0 0 100%;
	max-width:600px;
	height:auto;
	min-height:50px;
	box-sizing: border-box;
	padding:0 0 0 38px;
	margin:0;
	display:flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
}
.extra-container label .button-container span.checkmark,
.extra-container label .button-container span.checkmark-no{
  	height:22px;
	width:22px;
	border:1px solid #BDC3CB;
	box-sizing: border-box;
	border-radius:50%;
	display:inline-block;
	position:absolute;
	left:0;
	top:auto;
	line-height:1.0;
}
.extra-container label .button-container span.checkmark-no::before,
.extra-container label .button-container span.checkmark::before{
	content:'+';
	height:20px;
	width:20px;
	display:block;
	position:absolute;
	text-align:center;
	border-radius:50%;
	left:calc((100% - 20px)/2);
	color:#27455b;
	opacity:0;
	transition:.1s all ease-in;
}
.extra-container label .button-container span.checkmark-no::before{
	content:'-';
	top:-2px;
	font-size:24px;
	font-weight:400;
}
.extra-container label .button-container span.checkmark::before{
	content:'+';
	top:0px;
	font-size:20px;
	font-weight:300;
	display:block;
}
.extra-container label .button-container span.text-no{
	flex:0 0 100%;
}
.extra-container label .button-container span.text{
	flex:0 0 calc(100% - (130px + 150px));
	height:auto;
}
.extra-container label .button-container span.text-no{
	font-weight:300;
	font-size:120%;
	color:#666;
}
.extra-container label .button-container span.text{
	
font-weight:300;
	font-size:120%;
	color:#27455b;
	position:relative;
}

.extra-container label .button-container span.price{
	flex:0 0 100px;
	color:#27455b;
	display:inline-block;
	text-align:right;
	font-weight:300;
	font-size:100%;
	padding:0 0 0 30px;
	margin:0 0 0 10px;
	box-sizing: border-box;
	position:relative;
	z-index:1;
	letter-spacing:0.05em;
}
.extra-container label .button-container span.price::before{
	content:'';
	display:block;
	height:1px;
	width:30px;
	position:absolute;
	left:0;
	top:calc((100% - 1px)/2);
	border-top:1px dashed #e5e7e7;
	z-index:-1;
}
.extra-container label .button-container span.detail-btn{
	flex:0 0 120px;
	display:inline-block;
	transition:.2s all ease-in-out;
	position:relative;
}
.extra-container label .button-container span.detail-btn:hover{
		transform: scale(1.06);
}
.extra-container label .button-container span.detail-btn a{
	display:block;
	width:100%;
	height:100%;
	font-weight:300;
	font-size:90%;
	color:#2f73c8;
	text-align:center;
	text-decoration: none;
	transition:.2s all ease-in-out;	
	border:1px solid #eee;
	padding:3px;
	margin:0 0 0 30px;
	box-sizing: border-box;
	border-radius:.3em;
}
.extra-container label .button-container span.detail-btn a:hover{
	text-decoration:underline;
}

.extra-container input:checked + label .button-container span.checkmark::before,
.extra-container input:checked + label .button-container span.checkmark-no::before{
	opacity:1.0;
}


.extra-btn-container{
	flex:0 0 100%;
	height:0;
	opacity:0;
	transition:.2s all ease-in-out;
	display:none;
	justify-content: flex-start;
	align-content: flex-start;
	align-items: center;
	flex-wrap:wrap;
	padding:0;
	margin:0;
}
.extra-btn-container p{
	flex:0 0 100%;
	text-align:left;
	font-weight:300;
	font-size:90%;
	color:#AF0000;
	height:30px;
	display:block;
	margin:0 0 20px 0;
	padding:10px 0 10px 10px;
	box-sizing: border-box;
}
.extra-btn-container input{display:none;}

.extra-btn-container label{
	flex:0 0 140px;
	height:140px;
	padding:0;
	display:block;
	transition:.1s all ease-in-out;
	box-sizing: border-box;
	cursor:pointer;
}
.extra-btn-container label:hover{
	transform:scale(1.01);
}
.extra-btn-container label .button-container{
	border-radius:.5em;
	box-sizing: border-box;
	width:100%;
	height:140px;
	padding:4px;
	margin:0 0 20px 0;
	border:1px solid #BDC3CB;
	box-shadow: 0px 1px 2px #c5cfd7;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	transition:.1s all ease-in-out;
	cursor:pointer;
	position:relative;
	font-weight: 200;
}
.extra-btn-container label .button-container span{
	flex:0 0 100%;
	height:140px;
	display:block;
	position:relative;
}
.extra-btn-container label .button-container span.img{
	position:relative;
	width:100%;
	height:100%;
	border-radius:.3em;
	padding:4px;
	box-sizing: border-box;
	display:block;
}
.extra-btn-container label .button-container span.img img{
	width:100%;
	height:100%;
	border-radius:.3em;
}

.extra-container input:checked + label + .extra-btn-container{
	opacity:1.0;
	height:auto;
	padding:0;
	margin:10px 0 20px 0;
	display:flex;
	animation: extra-btn-container 0.4s infinite alternate ease-in-out;
	animation-iteration-count: 1;
	-webkit-animation-iteration-count: 1;
}
.extra-btn-container input:checked + label .button-container{
	border:4px solid #09568e;
	box-sizing: border-box;
}
@keyframes extra-btn-container {
  from {
	  opacity:0;
  }
  to {
	  opacity:1.0;
  }
}
/* CAUTION an SELECTED for h3 - product page */
.caution{
	background:rgba(255,245,10,.4);
	position:relative;
	border-radius:0.3em;
}
.caution::before{
	content: attr(data-caution);
	display:inline-block;
	/* position:absolute; */
	top:-15px;
	left:60px;
	color:#AF0000;
	font-weight:300;
	font-style: italic;	
	font-size:18px;
	animation: caution 0.8s infinite alternate ease-in-out;
}

@keyframes caution {
  from {
    transform: translateY(0);
	  opacity:1;
  }
  to {
    transform: translateY(5px);
	  opacity:.4;
  }
}
.selected{
	position:relative;
	z-index:3;
}
.selected::before{
	content:'\2713';
	display:inline-block;
	position:absolute;
	top:-15px;
	left:10px;
	color:#36c264;
	font-weight:300;
	font-style: italic;	
	font-size:30px;
	z-index:3;
}
.selected::after{
	content:'';
	width:46px;
	height:46px;
	position:absolute;
	border:3px solid rgba(54,194,100,1);
	border-radius:50%;
	top:0px;
	left:-6px;
	z-index:3;
}

/* YOUR CHOICE product page */

.yourchoice-wrapper{
	width:100%;
	height:100%;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap:wrap;
	padding:0;
	margin:60px 0 0 0;
	box-sizing: border-box;
	position:relative;
}
.yourchoice-wrapper::before{
	content:'';
	width:1px;
	height:50px;
	position:absolute;
	top:-60px;
	left:calc((100% - 1px)/2);
	display:block;
	border-left:1px solid #BDC3CB;
}
.yourchoice-wrapper h3{
	flex:0 0 100%;
	padding:0;
	margin:0 0 30px 0;
	font-size:300%;
	color:#27455b;
	font-weight:200;
	letter-spacing:.1em;
	text-align:center;
}

.yourchoice-wrapper .details-box{
	flex: 0 0 50%;
	padding:10px;
	box-sizing: border-box;
	order:1;
	border-right:1px solid #BDC3CB;
}


.yourchoice-wrapper .details-box dl{
	width:100%;
	padding:0;
	margin:0;
}
.yourchoice-wrapper .details-box dl dt{
	width:100%;
	padding:10px 0 4px 0;
	box-sizing: border-box;
	margin:0;
	height:auto;
	border-bottom:1px solid #eee;
	font-size:90%;
	font-weight:300;
	letter-spacing:.1em;
	color:#8e9299;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap:wrap;
}
.yourchoice-wrapper .details-box dl dt span.edit{
	display:inline-block;
	margin:0 10px 0 20px;
	padding:2px 6px 2px 6px;
	box-sizing: border-box;
	border:1px solid #2f73c8;
	border-radius:.3em;
	color:#2f73c8;
	font-size:95%;
	font-weight:300;
	transition:.2s all ease-in-out;
	cursor:pointer;
}
.yourchoice-wrapper .details-box dl dt span.edit:hover{
	background:#2f73c8;
	color:#fff;
	transform: scale(1.1);
}
.yourchoice-wrapper .details-box dl dd{
	width:100%;
	padding:0 10px 0 20px;
	box-sizing: border-box;
	margin:10px 0 20px 0;
	font-size:100%;
	font-weight:300;
	color:#27455b;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap:wrap;
}
.yourchoice-wrapper .details-box dl dd ul{
	margin:0;
	padding:0;
	list-style-position: inside;
	width:100%;
}
.yourchoice-wrapper .details-box dl dd ul li{
	margin:0 0 6px 0;
	padding:0;
	font-size:100%;
	width:100%;
	display:flex;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;

}
.yourchoice-wrapper .details-box dl dd ul li span.img{
	flex:0 0 100%;
	display:flex;
	justify-content: flex-start;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	position:relative;
	margin:0 0 10px 0;
}
.yourchoice-wrapper .details-box dl dd ul li span.img img{
	width:100%;
	height:100%;
	max-width:60px;
	max-height:60px;
	display:block;
	margin:0 0 0 20px;
	position:relative;
	border-radius:.3em;
}
.yourchoice-wrapper .details-box dl dd ul li span.choice{
	flex:0 0 calc(100% - 100px);
	color:#27455b;
}

.yourchoice-wrapper .details-box dl dd ul li span.price{
	flex:0 0 90px;
	margin:0 0 0 10px;
	color:#27455b;
	text-align:right;
}

.yourchoice-wrapper .details-box dl dd span.choice{
	flex:0 0 100%;
	display:flex;
	justify-content: space-between;
	align-content: center;
	/*align-items: center;*/
	width:100%;
	font-size:100%;
	margin:0 0 8px 0;
}

.yourchoice-wrapper .details-box dl dd span.choice .red {
	color: #ab0432;
}

.yourchoice-wrapper .details-box dl dd span.choice a{
	display:inline-block;
	color:#27455b;
	font-size:90%;
}
.yourchoice-wrapper .details-box dl dd span.choice img{
	width:100%;
	height:100%;
	max-width:250px;
	max-height:50px;
	display:block;
	border:0;
}
.yourchoice-wrapper .details-box dl dd span.default{
	display:inline-block;
	width:100%;
	font-size:100%;
	color:#666;
	margin:0 0 8px 0;
}

.yourchoice-wrapper .details-box dl dd span.choice span.price{
	right:0;
	flex:0 0 auto;
	width:auto;
	display:inline-block;
	text-align:right;
}

.yourchoice-wrapper .details-box dl dt.total{
	width:calc(100% - 200px);
	padding:10px 10px 0 0;
	box-sizing: border-box;
	margin:0;
	display:inline-block;
	float:left;
	border-bottom:0px;
	text-align:right;
}
.yourchoice-wrapper .details-box dl dd.total{
	width:200px;
	margin:30px 0 0 0;
	padding:10px 10px 0 0;
	box-sizing: border-box;
	display:flex;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
	flex-wrap:wrap;
	float:left;
	border-top:1px solid #eee;
}
.yourchoice-wrapper .details-box dl dd.total span.price{
	text-align:right;
	flex:1 1;
	display:inline-block;
	font-weight:400;
}
.yourchoice-wrapper .details-box dl dd.total span.total{
	text-align:left;
	flex:1 1;
	display:inline-block;
	font-weight:400;
	color:#918260;
}
.yourchoice-wrapper .total-box{
	flex: 0 0 50%;
	padding:10px;
	box-sizing: border-box;
	order:2;
	position:sticky;
	top:0;
}
.yourchoice-wrapper .total-box span.sum{
	display:flex;
	justify-content: flex-end;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	border-bottom:1px solid #eee;
	text-align:right;
}
.yourchoice-wrapper .total-box span.sum span.name{
	width:100%;
	text-align:right;
	display:inline-block;
	color:#918260;
	font-size:100%;
	font-weight:300;
}
.yourchoice-wrapper .total-box span.sum span.price{
	width:100%;
	display:inline-block;
	color:#918260;
	font-size:300%;
}
.yourchoice-wrapper .total-box span.tax{
	display:inline-block;
	width:100%;
	color:#27455b;
	font-weight:300;
	font-size:80%;
	text-align:right;
}
.yourchoice-wrapper .total-box span.tax span.price,
.yourchoice-wrapper .total-box span.tax span.percent{
	width:auto;
	color:#27455b;
	font-weight:300;
	font-size:80%;
}
.yourchoice-wrapper .total-box span.tax span.price{
	padding:0;
}
.yourchoice-wrapper .total-box span.tax span.percent{
	padding:0 10px 0 0;
}
.yourchoice-wrapper .total-box span.options{
	display:flex;
	justify-content: flex-end;
	align-content: center;
	align-items: center;
	flex-wrap:wrap;
	width:100%;
	color:#918260;
	font-weight:400;
	font-size:100%;
	text-align:right;
	margin:20px 0;
}
.yourchoice-wrapper .total-box span.options span.price,
.yourchoice-wrapper .total-box span.options span.name{
	width:auto;
	font-weight:300;
	font-size:100%;
}
.yourchoice-wrapper .total-box span.options span.price{
	flex: 0 0 100px;
	padding:0;
	margin:4px 0;
	font-weight:400;
}
.yourchoice-wrapper .total-box span.options span.name{
	flex: 0 0 calc(100% - 100px);
	padding:0 10px 0 0;
	box-sizing: border-box;
}
.yourchoice-wrapper .total-box span.options span.price::before{
	content:'\02665';
	display:inline-block;
	margin:0 4px 0 0;
	font-size:15px;font-weight:300;
}


.yourchoice-wrapper .total-box .btn-container{
	width:100%;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	text-align:center;
	flex-wrap:wrap;
	padding:0;
	margin:30px 0 0 0;
}
.yourchoice-wrapper .total-box .btn-container span.request-btn{
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	text-align:center;
	flex:0 0 100%;
	width:100%;
	height:60px;
	border-radius:.5em;
	color:#27455b;
	font-size:100%;
	font-weight:500;
	background:#edebe6;
	letter-spacing:.08em;
	cursor:pointer;
}

.yourchoice-wrapper .total-box .btn-container span.purchase-btn{
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	flex:0 0 100%;
	width:100%;
	height:60px;
	font-size:130%;
	background:#36c264;
	color:#fff;
	font-weight:500;
	box-shadow:0px 2px 2px #eee,0px -1px 2px #eee;
	text-shadow:0 1px 3px #107f35;
	border-radius:.5em;
	letter-spacing:.08em;
	transition:.5s all ease-in-out;
	cursor:pointer;
	position:relative;
	margin:0 0 30px 0;
}
.yourchoice-wrapper .total-box .btn-container span.purchase-btn::before{
	content:'';
	background-image: url("img/big_buy_icon_light.png");
	background-size: contain;
	background-repeat: no-repeat;
	width:32px;
	height:32px;
	position:absolute;
	top:4px;
	left:4px;

}
.yourchoice-wrapper .total-box .btn-container span.request-btn:hover,
.yourchoice-wrapper .total-box .btn-container span.purchase-btn:hover{
	animation: btnAnime 5s infinite alternate ease-in-out;
}
@keyframes btnAnime{
	0% { transform:scale(1.00) }
	8% { transform:scale(1.03) }
 100% { transform:scale(1.00) }
}
.yourchoice-wrapper .total-box .purchase-desc{
	width:100%;
	padding:0;
	margin:20px 0 0 0;
}
.yourchoice-wrapper .total-box .purchase-desc h4{
	font-weight:300;
	color:#27455b;
	font-size:100%;
	margin:0;
	padding:0;
}
.yourchoice-wrapper .total-box .purchase-desc p{
	font-size:90%;
	line-height: 1.3;
	letter-spacing: .05em;
	color:#959da0;font-weight:300;
}







/* Configuration button */
.configuration-btn{
	position:sticky;
	bottom:4px;
	left:calc(100% - 260px);
	width:250px;
	height:60px;
	border-radius:60px;
	background:#2f73c8;
	box-shadow:0px 2px 2px #eee,0px -1px 2px #eee;
	text-shadow:0 1px 3px #133f76;
	text-align:center;
	color:#fff;
	display:flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	font-weight:400;
	font-size:120%;
	cursor:pointer;
	transition:.3s all ease-in-out;
	padding:0;
	overflow:hidden;
}
.configuration-btn:hover{
	transform: scale(1.05);
}
	
@media screen and (max-width: 1200px) {

	.btn-wrapper{padding:0px;}
	.btn-wrapper::before{display:none;}
	
	.btn-wrapper h3 span.title{min-height:50px;height:auto;}
	.btn-wrapper h3 span.modnum{width:36px;height:36px;font-size:18px;left:10px;top:calc((100% - 36px) /2);}
	.btn-wrapper h3 span.modnum::before{display:none;}
	.btn-wrapper h3 span.modnum::after{width:36px;height:36px;top:1px;left:0px;}
	
	.btn-wrapper h3 span.modnum.selected::after{content:'';width:36px;height:36px;top:1px;left:0px;}
	
	.alignment-btn-container{padding:0 10px;}
	.alignment-btn-container label{flex: 0 30%;}
	
	.combination-btn-container{padding:0 10px;}
	.combination-btn-container label{flex: 0 0 100%; margin:0 0 14px 0;}
	.combination-btn-container label .button-container{height:auto;min-height:40px;padding:0px;}
	.combination-btn-container label .button-container span.text{font-size:120%;text-align:left;}
	.combination-btn-container label .button-container span.price{font-size:100%;}
	
	
	.dimension-btn-container{padding:0 10px;}
	.dimension-pic-container{flex:0 0 50%;}
	.dimension-btn-container{flex:0 0 50%;}
	.dimension-pic-container span.dimension-pic img{width:100%;max-height:auto;}
	.dimension-btn-container label .button-container{min-height:50px;height:auto;}
	
	.frame-btn-container,
	.material-btn-container{padding:0 10px;}
	.frame-btn-container label .button-container,
	.material-btn-container label .button-container{min-height:50px;height:auto;}
	
	.secondarycolors-btn-container,
	.maincolors-btn-container{padding:0 180px 0 10px;min-height:120px;}
	.secondarycolors-btn-container .colors-explain span.colors-pic,
	.maincolors-btn-container .colors-explain span.colors-pic{flex:0 0 100%;}
	.secondarycolors-btn-container .colors-explain,
	.maincolors-btn-container .colors-explain{right:0px;max-width:150px;}
	.secondarycolors-btn-container input:checked + .colors-explain,
	.maincolors-btn-container input:checked + .colors-explain{max-width:150px;right:0;}
	.secondarycolors-btn-container .colors-explain span.colors-code,
	.maincolors-btn-container .colors-explain span.colors-code{flex:0 0 100%;height:auto;font-size:80%;font-weight:300;text-align:center;}
	.secondarycolors-btn-container .colors-explain span.colors-code::before,
	.maincolors-btn-container .colors-explain span.colors-code::before{display:none;}
	
	.extra-container{padding:0 10px;}
	.extra-container label .button-container{max-width:100%;}
	.extra-container label .button-container{padding:0 0 0 34px;margin:0 0 10px 0;max-width:100%;align-content: flex-start;align-items: flex-start}
	.extra-container label .button-container span.checkmark,
	.extra-container label .button-container span.checkmark-no{top:0px;left:6px;}
	.extra-container label .button-container span.text-no,
	.extra-container label .button-container span.text{flex:0 0 calc(100% - (90px + 10px + 80px));}
	.extra-container label .button-container span.text-no,
	.extra-container label .button-container span.text{font-size:110%;}
	.extra-container label .button-container span.price{flex:0 0 80px;font-size:80%;margin:0;display:flex;justify-content: flex-end; align-items: center;height:100%;padding:4px 4px;box-sizing: border-box;}
	.extra-container label .button-container span.price::before{display:none;}
	.extra-container label .button-container span.detail-btn{flex:0 0 90px;margin:0 0 0 10px;padding:0;}
	.extra-container label .button-container span.detail-btn a{font-size:90%;padding:2px 4px;margin:0;}
	.extra-btn-container{margin:0 0 0 0; position:relative; top:-20px;}
	.extra-btn-container label .button-container{padding:0;margin:0;}


}
@media screen and (max-width: 850px) {
	
	.alignment-btn-container label .button-container span.img{flex: 0 0 100%;text-align:right;}
	.alignment-btn-container label .button-container span.text{flex: 0 0 100%;}
	
	.frame-btn-container,
	.material-btn-container{padding:0 10px 150px 10px;box-sizing: border-box;}
	.frame-btn-container label,
	.material-btn-container label{flex:0 0 100%;order:1;padding:0;margin:0 0 20px 0;}
	.frame-btn-container label .button-container,
	.material-btn-container label .button-container{width:100%;}
	.frame-btn-container .frame-explain span.frame-pic,
	.material-btn-container .material-explain span.material-pic{flex:0 0 120px;}
	.frame-btn-container .frame-explain div.frame-text,
	.material-btn-container .material-explain div.material-text{padding:0 0 0 20px;font-size:80%;}
	.material-btn-container .material-explain div.material-text .textile-block .textile-block-care div img{width:22px;margin-right:10px;}
	.frame-btn-container .frame-explain,
	.material-btn-container .material-explain{flex:0 0 100%;position:absolute;width:100%;order:2;margin:0;box-sizing: border-box; padding:10px;left:0;bottom:0;;max-height:150px;}
	
	.extra-btn-container p{margin:0 0 10px 0;padding:0;height:auto;}

}
@media screen and (max-width: 750px) {
	
	
	.alignment-btn-container label{flex: 0 40%;}
	
	.dimension-pic-container{flex:0 0 100%; padding-bottom: 30%!important;}
	.dimension-btn-container{flex:0 0 100%;}
	
	.secondarycolors-btn-container,
	.maincolors-btn-container{padding:0 130px 0 10px;min-height:120px;}
	.secondarycolors-btn-container input:checked + .colors-explain,
	.maincolors-btn-container input:checked + .colors-explain{width:100px;}
	.secondarycolors-btn-container .colors-explain span.colors-code,
	.maincolors-btn-container .colors-explain span.colors-code{font-size:10px;}
	
	
	.yourchoice-wrapper .total-box{flex:0 0 100%;order:1;position:relative;margin:0 0 20px 0;}
	.yourchoice-wrapper .details-box{flex:0 0 100%;order:2;border-right:0px;}
	.yourchoice-wrapper .total-box span.sum span.name{text-align:left;}
	.yourchoice-wrapper .total-box span.sum{justify-content:flex-start;	text-align:left;}
	.yourchoice-wrapper .total-box span.tax{text-align:left;}
	.yourchoice-wrapper .total-box span.options{justify-content:flex-start;	text-align:left;}
	.yourchoice-wrapper .total-box span.options span.name{flex:0 0 calc(100% - 100px);font-size:90%;text-align:right;}
	.yourchoice-wrapper .total-box span.options span.price{flex:0 0 100px;font-size:90%;}
	.yourchoice-wrapper .details-box dl dd{	padding:0 10px 0 10px;}
	

}
@media screen and (max-width: 600px) {
	.alignment-btn-container{justify-content: space-between;}
	.alignment-btn-container label{flex: 0 45%;padding-bottom: 30%;!important;}
	.alignment-btn-container label .button-container span.img{flex:0 0 100%;text-align:center;}
	.alignment-btn-container label .button-container span.text{flex:0 0 100%;text-align:center;font-size:130%;}

	.dimension-pic-container{flex:0 0 100%;}
	.dimension-btn-container{flex:0 0 100%;}
}
@media screen and (max-width: 550px) {

	.btn-wrapper h3{font-size:20px;}
	.btn-wrapper h3 span.modnum{left:-10px;top:10px;}
	.btn-wrapper h3 span.modnum{width:30px;height:30px;font-size:18px;}
	.btn-wrapper h3 span.modnum::after{width:36px;height:36px;top:-3px;left:-3px;}
	.btn-wrapper h3 span.title{min-height:50px;height:auto;padding:8px 0px 8px 32px;}
	.btn-wrapper h3 span.learn_link{width:auto;padding:0;text-align:right;position:absolute;right:0;top:-10px;margin:0;padding:0;}
	.btn-wrapper h3 span.learn_link p{width:auto;padding:0px 4px;font-size:70%;margin:0;font-weight:300;}
	.btn-wrapper h3 span.learn_link::before{display:none;}
	
	.btn-wrapper h3 span.modnum.selected::after{top:-3px;left:-3px;}
}
@media screen and (max-width: 480px) {
	

	
	.alignment-btn-container{padding:0;}
	
	.combination-btn-container{padding:0;}
	.combination-btn-container p{font-size:90%;}
	
	.dimension-btn-container{padding:0;}
	.dimension-btn-container label .button-container span.text{flex:0 0 calc(100% - 60px);}
	.dimension-btn-container label .button-container span.price{flex:0 0 60px;}
	.dimension-btn-container p{display:none;}
	.dimension-pic-container span.dimension-pic::before,
	.dimension-pic-container span.dimension-pic::after{width:34px;height:34px;}
	.dimension-pic-container span.dimension-pic::before{background:rgba(218,207,180,1);}
	

	.material-btn-container{padding:0 0 180px 0;}
	.material-btn-container .material-explain{flex:0 0 100%;padding:0 10px 0 10px;bottom:20px;}
	.material-btn-container .material-explain span.material-pic{flex:0 0 100%;width:100%;height:80px;overflow:hidden;border-radius:.3em;margin:0 0 6px 0;}
	.material-btn-container .material-explain span.material-pic img{width:100%;max-width:100%;height:auto;position:absolute;top:0;left:0;}
	.material-btn-container .material-explain div.material-text{flex:0 0 100%; padding:0; height:80px;font-size:11px;}
	.material-btn-container .material-explain div.material-text .textile-block .textile-block-desc ul{list-style-position: inside;}
	.material-btn-container .material-explain div.material-text .textile-block .textile-block-care div{display:none;}
	
	.extra-container{padding:0;}
	.extra-container label .button-container{padding:0 0 0 24px;margin:0 0 10px 0;align-content: flex-start;align-items: flex-start;}
	.extra-container label .button-container span.checkmark,
	.extra-container label .button-container span.checkmark-no{width:18px;height:18px;top:1px;left:0px;}
	.extra-container label .button-container span.checkmark-no::before,
	.extra-container label .button-container span.checkmark::before{width:18px;height:18px;font-size:18px;left:-1px;top:-1px;}
	.extra-container label .button-container span.text-no,
	.extra-container label .button-container span.text{flex:0 0 calc(100% - (80px + 6px));font-size:100%;padding:0;margin:0;}
	.extra-container label .button-container span.price{flex:0 0 80px;margin:6px 6px 0 0;padding:0;position:relative;font-size:80%;align-items: flex-start;align-content: center;}
	.extra-container label .button-container span.price::before{display:none;}
	.extra-container label .button-container span.detail-btn{flex:0 0 100%;display:flex;justify-content: flex-end; margin:6px 0 0 0;padding:0;}
	.extra-container label .button-container span.detail-btn a{flex:0 0 100px;font-size:80%;padding:2px 4px;}
	.extra-btn-container{justify-content: space-around;}
	.extra-btn-container p{ font-size:80%;margin:10px 0;}
	.extra-btn-container label{flex:0 0 100px;height:100px;margin:0 0 20px 0;padding:0;box-sizing: border-box;}
	.extra-btn-container label .button-container{height:100px;margin:0;padding:0;box-sizing: border-box;}
	
	.secondarycolors-btn-container,
	.maincolors-btn-container{padding:0 10px 0 10px;min-height:auto;}
	.secondarycolors-btn-container input:checked + .colors-explain,
	.maincolors-btn-container input:checked + .colors-explain{display:none;}
	.maincolors-btn-container h4.colors-header,
	.secondarycolors-btn-container h4.colors-header{font-size:14px;}
	
	.yourchoice-wrapper{margin:100px 0 0 0;}
	.yourchoice-wrapper .total-box,
	.yourchoice-wrapper .details-box{padding:0;}
	.yourchoice-wrapper h3{font-size:220%;}
	.yourchoice-wrapper .total-box span.sum span.name{font-size:100%;text-align:center;}
	.yourchoice-wrapper .total-box span.tax{text-align:center;}
	
	.yourchoice-wrapper .total-box span.sum span.price{font-size:220%;text-align:center;}
	.yourchoice-wrapper .total-box span.options span.name{font-size:12px;text-align:left;}
	.yourchoice-wrapper .total-box span.options span.price{text-align:right;}
	.yourchoice-wrapper .details-box dl dd span.choice{font-size:12px;}
	.yourchoice-wrapper .details-box dl dd span.choice img{max-width:30px;height:30px;border-radius:.3em;}
	.yourchoice-wrapper .details-box dl dd ul li span.price{font-size:12px;}
	
	.caution::before{left:32px;}
	
	.configuration-btn{left:0;width:100%;height:40px;border-radius:0px;bottom:0px;font-size:110%;}
	
}