@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@charset "UTF-8";
/* CSS Document */
/* Layout */
@media screen and (max-width: 834px){
/*@media screen and (min-width: 415px){*/

.top_copy_w {
	max-width: 834px;
	min-width: 415px;
	height: 640px;
	margin: 0;
	padding: 0;
	background: -webkit-gradient(linear, 50%, bottom, from(#fff), to(#eee));
	background: -webkit-linear-gradient(bottom, #b01 0%, #eee 100%);
	background: -moz-linear-gradient(top, #fff, #eee);
	background: -o-linear-gradient(bottom, #fff 50%, #eee 100%);
	background: -ms-linear-gradient(bottom, #fff 50%, #eee 100%);
	background: linear-gradient(to bottom, #fff 50%, #eee 100%);
}

.top_copy_w .top_w_head01{
	height: 640px;
	margin-top: 64px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/50gd2_cl.png) no-repeat;
	background-position: 80% 50px;
	background-size: 760px;
 }

.top_copy_w .top_w_head02{
	height: 640px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/38gd2_cl.png) no-repeat;
	background-position: 80% 50px;
	background-size: 760px;	
}

.top_copy_w .top_w_head03{
	height: 640px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/24gd2_cl.png) no-repeat;
	background-position: 80% 50px;
	background-size: 760px;	
}

.top_copy_w .top_w_head04{
	height: 640px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/50tu_cl.png) no-repeat;
	background-position: 80% 50px;
	background-size: 760px;	
}

.top_w_titlecapbox {
	margin: 330px 0 0 5%;
	padding: 0;
	width: 95%;
	box-sizing: border-box;
}

.top_w_titlecapbox img {
	display: block;
	height: 104px;
	margin: 0 24px 40px;
}

.top_w_titlecapbox h1 {
	width: 500px;
	height: 3em;
	margin: 0;
	padding: 0;
	font:100 64px/72px 'Noto Sans JP', sans-serif;
	text-shadow: 0 0 4px #fff;
	text-align: left;
	letter-spacing: -1px;
	color: #555;
	box-sizing: border-box;
}

.top_copy {
	max-width: 834px;
	min-width: 415px;
	height: 64px;
	margin: 0;
	padding: 0;
	background: -webkit-gradient(linear, 50%, bottom, from(#fff), to(#f6f6f6));
	background: -webkit-linear-gradient(bottom, #b01 0%, #f6f6f6 100%);
	background: -moz-linear-gradient(top, #fff, #f6f6f6);
	background: -o-linear-gradient(bottom, #fff 50%, #f6f6f6 100%);
	background: -ms-linear-gradient(bottom, #fff 50%, #f6f6f6 100%);
	background: linear-gradient(to bottom, #fff 50%, #f6f6f6 100%);
}

.top_copy .top_head01 {
	height: 700px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/sspec_ro.png) no-repeat;
	background-position: 75% 100px;
	background-size: 650px;	
}

.top_copy .top_head02 {
	height: 700px;
	box-sizing: border-box;
	border:1px solid rgba(255,255,255,0);
	background: url(../image/products/climber_mini.png) no-repeat;
	background-position: 65% 120px;
	background-size: 355px;	
}

.top_copy h1 {
	width: 720px;
	margin: 240px 0 0 0;
	padding: 0;
	font:200 72px/90px 'Noto Sans JP', sans-serif;
	text-shadow: 0 0 4px #fff;
	text-align: left;
	letter-spacing: -4px;
	color: #333;
	position: relative;
	left: 15%;
}

.top_copy h2 {
	width: 700px;
	margin: 220px 0 0 0;
	padding: 0;
	font: 200 72px/90px 'Noto Sans JP', sans-serif;
	text-shadow: 0 0 4px #fff;
	text-align: left;
	letter-spacing: -4px;
	color: #333;
	position: relative;
	left: 15%;
}

#content_article {
	max-width: 834px;
	min-width: 415px;
	margin: 0;
	padding: 0;
	background: #fff;
	font: 400 12px/18px 'Noto Sans JP', sans-serif;
	text-align: left;
	letter-spacing: 1px;
	color: #333;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-content: flex-start;
	clear: both;
}

.order_titlebox {
	max-width: 834px;
	min-width: 415px;
	margin: 0;
	padding: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-flow: column-reverse nowrap;
	justify-content: center;
	align-content: flex-start;
	align-items: center;
	box-sizing: border-box;
	background: -webkit-gradient(linear, 50%, bottom, from(#fff), to(#f6f6f6));
	background: -webkit-linear-gradient(bottom, #b01 0%, #f6f6f6 100%);
	background: -moz-linear-gradient(top, #fff, #f6f6f6);
	background: -o-linear-gradient(bottom, #fff 50%, #f6f6f6 100%);
	background: -ms-linear-gradient(bottom, #fff 50%, #f6f6f6 100%);
	background: linear-gradient(to bottom, #fff 50%, #f6f6f6 100%);
}

.order_title {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 24px 5% 0;
	box-sizing: border-box;
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-content: flex-start;
}

.order_title div {
	text-align: center;
	margin: 0;
}

.order_title div img.product {
	width: 85%;
	margin: auto;
	max-width:400px;
}

.order_title h2 {
	font: 600 16px/20px 'Noto Sans JP', sans-serif;
	margin: 20px 0 16px;
 	border-bottom: 1px solid #ccc;
 }

.order_title h2 small {
	font: 600 14px/28px 'Noto Sans JP', sans-serif;
	position: relative;
	left: 5%;
}

.red_a { color: #D01; }

.order_title .order_price {
	width: auto;
	height: auto;
	margin: 0 5% 1em;
	padding: 0 5% 0;
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-content: flex-start;
	text-align: left;
}

span.price {
	font: 600 12px/16px 'Noto Sans JP', sans-serif;
}

span.bkpcap {
	display: block;
	font: 300 10px/16px 'Noto Sans JP', sans-serif;
	padding: 1em 1em 0;
	text-align: left;
}

.contents_orderform {
	width: 100%;
	margin: 0 auto;
	padding: 40px 5%;
	box-sizing: border-box;
	flex-grow: 2;
	flex-flow: column nowrap;
	flex-basis: auto;
	clear: both;
}

.contents_orderform .txtarea ,.txtarea_order {
	width: 100%;
	margin: 0;
	padding: 20px 0;
	box-sizing: border-box;
	border-bottom: 1px solid #789;
}

.kakakutitle {
	height: auto;
	padding: 0;
	margin: 4px 0 16px;
	font: 200 20px/24px 'Noto Sans JP', sans-serif;
	color: #666;
	letter-spacing: 2px;
	padding: 4px 0;
}

.kakakutitle .secondcell {
	padding: 0;
}

div.PayPalbox {
	/*height: 104px;*/
	height: 96px;
	border-top: 1px solid #ccc;
}

div.PayPal {
	position: relative;
	/*top: 4px;*/
	top: 28px;
	left: 16px;
	float: left;
	width: auto;
}

/*#RadioGroup1_2 { float: left; position: relative; top: 12px; }
span.card { padding-left: 24px; }
div.PayPallogo { float: left; width: 100%; }
div.PayPallogo a img { height: 52px; position: relative; top: 8px; left: 44px; padding: 0px; margin: 0; }*/

#RadioGroup1_2 { position: relative; top: 12px; }
span.card { padding-left: 24px; }
img.card { height: 20px; }
div.PayPallogo { float: right; }
div.PayPallogo a img { height: 52px; position: relative; top: 8px; padding: 0px; margin: 0; }

div.bankbox {
	height: 68px;
	border-top: 1px solid #ccc;
}

div.bank {
	position: relative;
	top: 28px;
	left: 16px;
	float: left;
}
/*/////////////////////order_17 brake pad START/////////////////////*/

.blkimgbox {
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-content: flex-start;
	align-items: flex-start;
}

.blkimgbox div {
	width: 33%;
	margin: 16px auto;
	text-align: center;
}

.tool div {
	width: 50%;
	margin: 16px auto;
	text-align: center;
}

.blkimgbox div img.bkp01 {
	padding: 1em 0 0;
	width: 50%;
}

.blkimgbox div img.bkp02 {
	width: 90%;
}

.tool div img.tool01{
	width: 70%;
}

.tool div img.tool02{
	width: 81%;
}

.tool div img.tool03{
	padding-top: 0%;
	width: 40%;
}

.tool div img.tool04{
	padding-top: 9.9%;
	width: 40%;
}

/*/////////////////////order_17 brake pad END/////////////////////*/

table {width: 100%}

td.firstcell {
	width: 20%;
	padding: 0 0 0 1em;
}

td {
	border-bottom: 1px solid #ddd;
	padding: 8px 12px;
}

textarea.cancelEnter {
	width: 90%;
	height: 16px;
	padding: 4px 8px;
	font: 200 14px/14px 'Noto Sans JP', sans-serif;
}


#top_banner {
	width: 100%;
	height: 196px;
	margin: 12px 0 0;
	padding: 0;
	background: #f3f3f3;
	clear: both;
}

.top_bannerbox {	max-width: 834px;
	min-width: 415px;
height: inherit;
	margin: 0 auto;
	padding: 0;
}

.top_bannerbox_txt {
	font: 400 12px/16px 'Noto Sans JP',sans-serif;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	clear: both;
}

.top_bannerbox_img {
	text-align: center;
	height: 120px;
	margin: 0;
	padding: 8px 0 0 0;
}

.top_bannerbox1 {
	width: 25%;
	min-width: 250px;
	height: 164px;
	margin: 16px 0;
	padding: 0;
	border-right: 1px solid #999;
	box-sizing: border-box;
	float: left;
}

.top_bannerbox2 {
	width: 25%;
	min-width: 250px;
	height: 164px;
	margin: 16px 0;
	padding: 0;
	border-right: 1px solid #999;
	box-sizing: border-box;
	float: left;
}

.top_bannerbox3 {
	width: 25%;
	min-width: 250px;
	height: 164px;
	margin: 16px 0;
	padding: 0;
	border-right: 1px solid #999;
	box-sizing: border-box;
	float: left;
}

.top_bannerbox4 {
	width: 25%;
	min-width: 250px;
	height: 164px;
	margin: 16px 0;
	padding: 0;
	border: none;
	float: left;
}


////////////////////////////////////

#btn_navi{
	width:600px;
}

.top_menu ul{
	width:840px;
	text-align:center;
	margin:0 0 10px 50%;
	position:absolute;
	left:-420px;
	bottom:0;
	color:white;
}

.top_menu ul li{
	float:left;
	width:120px;
}

.top_menu ul li a{text-decoration:none;padding:10px 10px 10px;border-radius:10px;}
.top_menu ul li a:link{color:#FFFFFF}
.top_menu ul li a:visited{color:#FFFFFF}
.top_menu ul li a:hover{color:#FFFFFF;font-weight:800;background:#FF3333;
    -moz-box-shadow: inset 0px 0px 5px 5px #666666;
    -webkit-box-shadow: inset 0px 0px 5px 5px #666666;
    box-shadow: inset 0px 0px 5px 5px #666666;
}

.fade1{
	animation-name: fade_in;
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
	animation-delay: 1s;
	animation-iteration-count: 1;
	animation-direction:alternate;
	animation-play-state:runnning;
	animation-fill-mode: forwards;

	-moz-animation-name: fade_in;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-delay: 1s;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction:alternate;
	-moz-animation-play-state:runnning;
	-moz-animation-fill-mode: forwards;

	-webkit-animation-name: fade_in;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-delay: 1s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction:alternate;
	-webkit-animation-play-state:runnning;
	-webkit-animation-fill-mode: forwards;

	-o-animation-name: fade_in;
	-o-animation-duration: 2s;
	-o-animation-timing-function: ease-in-out;
	-o-animation-animation-delay: 1s;
	-o-animation-iteration-count: 1;
	-o-animation-direction:alternate;
	-o-animation-play-state:runnning;
	-o-animation-fill-mode: forwards;

	-ms-animation-name: fade_in;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease-in-out;
	-ms-animation-animation-delay: 1s;
	-ms-animation-iteration-count: 1;
	-ms-animation-direction:alternate;
	-ms-animation-play-state:runnning;
	-ms-animation-fill-mode: forwards;
	opacity: 0;
}

@-moz-keyframes fade_in {
	0%{opacity:0;}
	100%{opacity:1;}
}

@-webkit-keyframes fade_in {
	0%{opacity:0;}
	100%{opacity:1;}
}

@-o-keyframes fade_in {
	0%{opacity:0;}
	100%{opacity:1;}
}

@-ms-keyframes fade_in {
	0%{opacity:0;}
	100%{opacity:1;}
}

.fade2{
	animation-name: fade_in;
	animation-duration: 3.5s;
	animation-timing-function: ease-in-out;
	animation-delay: 2s;
	animation-iteration-count: 1;
	animation-direction:alternate;
	animation-play-state:runnning;
	animation-fill-mode: forwards;

	-moz-animation-name: fade_in;
	-moz-animation-duration: 3.5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-delay: 2s;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction:alternate;
	-moz-animation-play-state:runnning;
	-moz-animation-fill-mode: forwards;

	-webkit-animation-name: fade_in;
	-webkit-animation-duration: 3.5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-delay: 2s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction:alternate;
	-webkit-animation-play-state:runnning;
	-webkit-animation-fill-mode: forwards;

	-o-animation-name: fade_in;
	-o-animation-duration: 3.5s;
	-o-animation-timing-function: ease-in-out;
	-o-animation-animation-delay: 2s;
	-o-animation-iteration-count: 1;
	-o-animation-direction:alternate;
	-o-animation-play-state:runnning;
	-o-animation-fill-mode: forwards;

	-ms-animation-name: fade_in;
	-ms-animation-duration: 3.5s;
	-ms-animation-timing-function: ease-in-out;
	-ms-animation-animation-delay: 2s;
	-ms-animation-iteration-count: 1;
	-ms-animation-direction:alternate;
	-ms-animation-play-state:runnning;
	-ms-animation-fill-mode: forwards;
	color:#FFFFFF;
	opacity: 0;
}

@-moz-keyframes fade_in {
	0%{opacity:0;color:#FFFFFF;}
	50%{color:#FFFFFF;}
	100%{opacity:1;color:#AA0011;}
}

@-webkit-keyframes fade_in {
	0%{opacity:0;color:#FFFFFF;}
	50%{color:#FFFFFF;}
	100%{opacity:1;color:#AA0011;}
}

@-o-keyframes fade_in {
	0%{opacity:0;color:#FFFFFF;}
	50%{color:#FFFFFF;}
	100%{opacity:1;color:#AA0011;}
}

@-ms-keyframes fade_in {
	0%{opacity:0;color:#FFFFFF;}
	50%{color:#FFFFFF;}
	100%{opacity:1;color:#AA0011;}
}