﻿.container {
	overflow-y:scroll;
}
.form button {
    margin:0 auto;
    box-shadow: none;

	background: #4c4c4c;
	background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
	background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 );
}
.form button[type="submit"] {
    clear:both;
    margin:0 auto;
    text-transform: uppercase;
    box-shadow: none;
    font-size:3.0em;
    padding:15px 50px;
    border-radius:5px;
    margin-bottom:100px;
}

.form button:hover, .form button:focus {
    box-shadow: none;
	background: #4c4c4c;
	background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%);
	background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
	background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 );
}

.form button.goback , .form button.goback:hover , .form button.goback:focus {
    margin:0 auto;
    color:#666;
    box-shadow: none;
	background: #ffffff;
	background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
	background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
	border:1px solid #ccc;
}



input[type="text"],input[type="tel"],input[type="email"]{
 font-size:3.5vh;
 height:auto;
 padding:20px;
 margin:0;
 border-radius:5px;
}
.guide-1 {
    background:#f1f1f1;
    border:1px solid #999;
    margin-bottom:10px;
    border-radius:5px;
    box-shadow:2px 2px 2px #ccc;
}

.guide-1 span.txt {
    display:block;
    margin-top:10px;
    font-weight:500;
    font-size:1.0em;
    display:inline-block;
    font-size:1.0rem;
}

.guide-1 span.req{
    font-size:0.6rem;
    color:#fff;
    background:#c00;
    border-radius:5px;
    padding:1px 2px;
    margin-left:5px;
}

.guide-2 {
    padding:10px 0;
    background:#fff;
}

.itemlist .line {
	border-bottom:1px solid #999;
	padding:15px;
	display:flex;
	align-items:center;
	justify-content:flex-end;
}
.cp_ipcheck {
	width: 90%;
	margin: -15px auto 0;
	text-align: center;
	display:inline-block;
	padding-top:10px;
}
.cp_ipcheck label {
	line-height:40px;
	display:inline-block;
	font-size:1.1em;
	float:left;
}
.cp_ipcheck p {
	clear:both;
	font-size:0.9em;
}
input.qtty-input{
	width:100%;
	max-width:65px;
	margin-bottom:0;
	border:1px solid #333;
	border-radius:3px;
	font-size:1.2em;
	text-align:center;
}
@keyframes click-wave {
	0% {
		position: relative;
		width: 30px;
		height: 30px;
		opacity: 0.35;
	}
	30% {
		position: relative;
		width: 200px;
		height: 20px;
		opacity: 0.35;
		margin-top: -6px;
		margin-left: -78px;
	}
	100% {
		width: 200px;
		height: 200px;
		margin-top: -80px;
		margin-left: -80px;
		opacity: 0;
	}
}
.cp_ipcheck .option-input02 {
	position: relative;
	top: 13.33333px;
	right: 0;
	bottom: 0;
	left: 0;
	width: 30px;
	height: 30px;
	margin-right: 0.5rem;
    margin-bottom:0;
	cursor: pointer;
	transition: all 0.15s ease-out 0s;
	color: #ffffff;
	border: none;
	outline: none;
	border-radius:5px;
	background: #cbcbcb;
	-webkit-appearance: none;
	        appearance: none;
}
.cp_ipcheck .option-input02:hover {
	background: #999999;
}
.cp_ipcheck .option-input02:checked {
	background: #333333;
}
.cp_ipcheck .option-input02:checked::before {
	font-size: 20px;
	line-height: 30px;
	position: absolute;
	display: inline-block;
	width: 30px;
	height: 30px;
	content: '✔';
	text-align: center;
}
.cp_ipcheck .option-input02:checked::after {
	position: relative;
	display: block;
	content: '';
	-webkit-animation: click-wave 0.65s;
	        animation: click-wave 0.65s;
	background: #333333;
}

span.noimage{
	display:flex;
	align-items:center;
	justify-content:center;
	width:80%;
	height:auto;
	min-height:100px;
	max-width:200px;
	background:#666;
	color:#f1f1f1;
	border:5px double #999;
	margin:0 auto;
	background: #7d7e7d;
	background: -moz-linear-gradient(45deg, #7d7e7d 0%, #0e0e0e 100%);
	background: -webkit-linear-gradient(45deg, #7d7e7d 0%,#0e0e0e 100%);
	background: linear-gradient(45deg, #7d7e7d 0%,#0e0e0e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=1 );

}

span.price{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	width:100%;
	height:100%;
	font-size:1.2em;
}
span.soluout{
	background:#333;
	color:#ccc;
	padding:5px 10px;
	border-radius:3px;
	background: #45484d;
	background: -moz-linear-gradient(top, #45484d 0%, #000000 100%);
	background: -webkit-linear-gradient(top, #45484d 0%,#000000 100%);
	background: linear-gradient(to bottom, #45484d 0%,#000000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 );
}


table.itemlist{
    width:90%;
    margin:0 auto;
}

table.itemlist th{
    background:#ccc;
    color#fff;
    text-align:center;
}
table.itemlist thead tr {
    border-bottom:3px solid #333;;
}

table.itemlist tbody td {
    border:1px #999 solid;
    border-top:0;
    border-bottom:1px #333 solid;
}

table.itemlist tbody td.price {
    text-align:right;
    vertical-align:middle;
    font-size:1.3em;
}
table.itemlist tbody td.thumb {
    border-right:0;
    width:150px;
}
table.itemlist tbody td.name {
    border-left:0;
}
table.itemlist tbody td.thumb img {
    width:auto;
    height:auto;
    max-height:100px;
}
fieldset{
    background-color:#f2f5f6;
}
fieldset legend {
	color:#6A4575;
	border-bottom: 2px solid #6A4575;
	margin-bottom:15px;
	text-align:center;
	line-height:1.5rem;
    background-color:#333;
    color:#fff;
    border-bottom:2px solid #999;
}

.comfirm-txt{
	margin-left:0;
	margin-right:0;
}
.border-box{
	padding:10px 0;
	border-bottom:1px solid #999;
}
.caution{
	display:inline-block;
    background: #fff;
	min-width:70%;
	border:1px solid #ccc;
	padding:10px;
	box-shadow:2px 2px 2px #ccc;
    margin-top: 20px;
	margin-bottom:20px;
	text-align:left;
	border-radius:3px;
}
form .row .guide-1 {
	background: #f1f1f1;
	border: 1px solid #999;
	margin-bottom: 10px;
}
form .row .row .guide-2 {
	padding: 10px 0;
	background: #fff;
}
.no-stage {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: auto;
	margin: 50px auto 0;
}
.no-stage span {
	border: 1px solid #333;
	padding:50px;
	font-weight:900;
	background:#eee;
	box-shadow:2px 2px 2px #ddd;
	border-radius:5px;
}

#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #000;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}

@media screen and (max-width: 896px){

    .content {
        padding:1em;
    }
    .columns {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
	}

    fieldset{
        padding:0;
    }
    input[type="text"],input[type="tel"],input[type="email"]{
     font-size:1.2em;
     height:auto;
     padding:10px;
    }

    .guide-1 span.txt {
    	font-size:2.2vh;
    }

.comfirm-txt{
	margin-left:0;
	margin-right:0;
}
.border-box{
	padding:10px 0;
	border-bottom:1px solid #999;
}

    div.itemlist {
		padding:0;
	}

	.itemlist .line {
		border-bottom:1px solid #999;
		padding:15px 0;
		display:flex;
		align-items:center;
		justify-content:flex-end;
	}
	.thumb {
		padding:0;
	}

	span.price{
		border-top:1px dotted #999;
		border-bottom:1px dotted #999;
		margin:10px 0;
	}
	.form button[type="submit"] {
	    clear:both;
	    margin:0 auto;
	    text-transform: uppercase;
	    box-shadow: none;
	    font-size:2.5em;
	    padding:15px 30px;
	    border-radius:5px;
	    margin-bottom:10px;
	}

	.form button.goback , .form button.goback:hover , .form button.goback:focus {
	    margin:0 auto;
	    color:#666;
	    padding:10px 30px;
	    box-shadow: none;
		background: #ffffff;
		background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
		background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
		background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
		border:1px solid #ccc;
	    margin-bottom:100px;
	}
	
	.caution{
		min-width:90%;
	}

}
