@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Quicksand&display=swap');
.pc_only{
  display: block;
  margin: 0 auto;
}
.sp_only{
  display: none;
}
.w-96{
width: 96%;
margin: 0 auto;
}
@media only screen and (max-width: 767px) {
  .pc_only{
    display: none;
  }
  .sp_only{
    display: block;
  }
}
/******************************************************************************
 * display
*******************************************************************************/
.block { display: block; }
.inline { display: inline; }
.inlineblock { display: inline-block; }
.displaynone { display: none; }

/******************************************************************************
 * float
*******************************************************************************/
.floatl { float: left; }
.floatr { float: right; }
.clear { clear: both; }

/******************************************************************************
 * indent
*******************************************************************************/
.indent01 {padding-left:1em;
text-indent:-1em;}

/******************************************************************************
 * gray_b
*******************************************************************************/
.gray_b {border: #ddd solid 1px;}


/******************************************************************************
 * responsive
*******************************************************************************/

.img-responsive {
  display: block;
  max-width: 100%;
  margin-left:auto;
  margin-right:auto;
  height: auto;
}
.img-no-responsive {
  display: block;
  max-width: auto;
  height: auto;
}
/* Float Clear
=============================================================================*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	line-height: 0;
	font-size:0;
}
.clearfix {	display:inline-block;}
/*\*/
* html .clearfix { height: 1%;}
.clearfix {	display: block;}
/**/
.clear { clear: both; }


/******************************************************************************
 * alpha
*******************************************************************************/
.alpha25 { filter: alpha(opacity=25); -moz-opacity: 0.25; opacity: 0.25; }
.alpha50 { filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; }
.alpha60 { filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; }
.alpha80 { filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; }

/******************************************************************************
 * MARGIN
*******************************************************************************/
.m0 { margin: 0px !important; }
.m5 { margin: 5px !important; }
.m10 { margin: 10px !important; }
.m15 { margin: 15px !important; }
.m20 { margin: 20px !important; }
.m25 { margin: 25px !important; }
.m30 { margin: 30px !important; }
.m35 { margin: 35px !important; }
.m40 { margin: 40px !important; }
.m45 { margin: 45px !important; }
.m50 { margin: 50px !important; }
.m55 { margin: 55px !important; }
.m60 { margin: 60px !important; }
.m65 { margin: 65px !important; }
.m70 { margin: 70px !important; }
.m75 { margin: 75px !important; }
.m80 { margin: 80px !important; }
.m85 { margin: 85px !important; }
.m90 { margin: 90px !important; }
.m95 { margin: 95px !important; }
.m100 { margin: 100px !important; }
.mt0 { margin-top: 0px !important; }
.mt5 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
.mt55 { margin-top: 55px !important; }
.mt60 { margin-top: 60px !important; }
.mt65 { margin-top: 65px !important; }
.mt70 { margin-top: 70px !important; }
.mt75 { margin-top: 75px !important; }
.mt80 { margin-top: 80px !important; }
.mt85 { margin-top: 85px !important; }
.mt90 { margin-top: 90px !important; }
.mt95 { margin-top: 95px !important; }
.mt100 { margin-top: 100px !important; }
.mb0 { margin-bottom: 0px !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb55 { margin-bottom: 55px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb65 { margin-bottom: 65px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb75 { margin-bottom: 75px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb85 { margin-bottom: 85px !important; }
.mb90 { margin-bottom: 90px !important; }
.mb95 { margin-bottom: 95px !important; }
.mb100 { margin-bottom: 100px !important; }
.ml0 { margin-left: 0px !important; }
.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }
.ml45 { margin-left: 45px !important; }
.ml50 { margin-left: 50px !important; }
.ml55 { margin-left: 55px !important; }
.ml60 { margin-left: 60px !important; }
.ml65 { margin-left: 65px !important; }
.ml70 { margin-left: 70px !important; }
.ml75 { margin-left: 75px !important; }
.ml80 { margin-left: 80px !important; }
.ml85 { margin-left: 85px !important; }
.ml90 { margin-left: 90px !important; }
.ml95 { margin-left: 95px !important; }
.ml100 { margin-left: 100px !important; }
.mr0 { margin-right: 0px !important; }
.mr5 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }
.mr55 { margin-right: 55px !important; }
.mr60 { margin-right: 60px !important; }
.mr65 { margin-right: 65px !important; }
.mr70 { margin-right: 70px !important; }
.mr75 { margin-right: 75px !important; }
.mr80 { margin-right: 80px !important; }
.mr85 { margin-right: 85px !important; }
.mr90 { margin-right: 90px !important; }
.mr95 { margin-right: 95px !important; }
.mr100 { margin-right: 100px !important; }

/******************************************************************************
 * PADDING
*******************************************************************************/
.p0 { padding: 0px !important; }
.p5 { padding: 5px !important; }
.p10 { padding: 10px !important; }
.p15 { padding: 15px !important; }
.p20 { padding: 20px !important; }
.p25 { padding: 25px !important; }
.p30 { padding: 30px !important; }
.p35 { padding: 35px !important; }
.p40 { padding: 40px !important; }
.p45 { padding: 45px !important; }
.p50 { padding: 50px !important; }
.p55 { padding: 55px !important; }
.p60 { padding: 60px !important; }
.p65 { padding: 65px !important; }
.p70 { padding: 70px !important; }
.p75 { padding: 75px !important; }
.p80 { padding: 80px !important; }
.p85 { padding: 85px !important; }
.p90 { padding: 90px !important; }
.p95 { padding: 95px !important; }
.p100 { padding: 100px !important; }
.pt0 { padding-top: 0px !important; }
.pt5 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pt45 { padding-top: 45px !important; }
.pt50 { padding-top: 50px !important; }
.pt55 { padding-top: 55px !important; }
.pt60 { padding-top: 60px !important; }
.pt65 { padding-top: 65px !important; }
.pt70 { padding-top: 70px !important; }
.pt75 { padding-top: 75px !important; }
.pt80 { padding-top: 80px !important; }
.pt85 { padding-top: 85px !important; }
.pt90 { padding-top: 90px !important; }
.pt95 { padding-top: 95px !important; }
.pt100 { padding-top: 100px !important; }
.pb0 { padding-bottom: 0px !important; }
.pb5 { padding-bottom: 5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb45 { padding-bottom: 45px !important; }
.pb50 { padding-bottom: 50px !important; }
.pb55 { padding-bottom: 55px !important; }
.pb60 { padding-bottom: 60px !important; }
.pb65 { padding-bottom: 65px !important; }
.pb70 { padding-bottom: 70px !important; }
.pb75 { padding-bottom: 75px !important; }
.pb80 { padding-bottom: 80px !important; }
.pb85 { padding-bottom: 85px !important; }
.pb90 { padding-bottom: 90px !important; }
.pb95 { padding-bottom: 95px !important; }
.pb100 { padding-bottom: 100px !important; }
.pl0 { padding-left: 0px !important; }
.pl5 { padding-left: 5px !important; }
.pl10 { padding-left: 10px !important; }
.pl15 { padding-left: 15px !important; }
.pl20 { padding-left: 20px !important; }
.pl25 { padding-left: 25px !important; }
.pl30 { padding-left: 30px !important; }
.pl35 { padding-left: 35px !important; }
.pl40 { padding-left: 40px !important; }
.pl45 { padding-left: 45px !important; }
.pl50 { padding-left: 50px !important; }
.pl55 { padding-left: 55px !important; }
.pl60 { padding-left: 60px !important; }
.pl65 { padding-left: 65px !important; }
.pl70 { padding-left: 70px !important; }
.pl75 { padding-left: 75px !important; }
.pl80 { padding-left: 80px !important; }
.pl85 { padding-left: 85px !important; }
.pl90 { padding-left: 90px !important; }
.pl95 { padding-left: 95px !important; }
.pl100 { padding-left: 100px !important; }
.pr0 { padding-right: 0px !important; }
.pr5 { padding-right: 5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pr45 { padding-right: 45px !important; }
.pr50 { padding-right: 50px !important; }
.pr55 { padding-right: 55px !important; }
.pr60 { padding-right: 60px !important; }
.pr65 { padding-right: 65px !important; }
.pr70 { padding-right: 70px !important; }
.pr75 { padding-right: 75px !important; }
.pr80 { padding-right: 80px !important; }
.pr85 { padding-right: 85px !important; }
.pr90 { padding-right: 90px !important; }
.pr95 { padding-right: 95px !important; }
.pr100 { padding-right: 100px !important; }
/******************************************************************************
 * FONT
*******************************************************************************/
.mincho { font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif}
.font10 { font-size: 10px; font-size:1.0rem; }
.font11 { font-size: 11px; font-size:1.1rem; }
.font12 { font-size: 12px; font-size:1.2rem; }
.font13 { font-size: 13px; font-size:1.3rem; }
.font14 { font-size: 14px; font-size:1.4rem; }
.font15 { font-size: 15px; font-size:1.5rem; }
.font16 { font-size: 16px; font-size:1.6rem; }
.font17 { font-size: 17px; font-size:1.7rem; }
.font18 { font-size: 18px; font-size:1.8rem; }
.font19 { font-size: 19px; font-size:1.9rem; }
.font20 { font-size: 20px; font-size:2.0rem; }
.font21 { font-size: 21px; font-size:2.1rem; }
.font22 { font-size: 22px; font-size:2.2rem; }
.font23 { font-size: 23px; font-size:2.3rem; }
.font24 { font-size: 24px; font-size:2.4rem; }
.font25 { font-size: 25px; font-size:2.5rem; }
.font26 { font-size: 26px; font-size:2.6rem; }
.font27 { font-size: 27px; font-size:2.7rem; }
.font28 { font-size: 28px; font-size:2.8rem; }
.font29 { font-size: 29px; font-size:2.9rem; }
.font30 { font-size: 30px; font-size:3.0rem; }
.font31 { font-size: 31px; font-size:3.1rem; }
.font32 { font-size: 32px; font-size:3.2rem; }
.font33 { font-size: 33px; font-size:3.3rem; }
.font34 { font-size: 34px; font-size:3.4rem; }
.font35 { font-size: 35px; font-size:3.5rem; }
.font36 { font-size: 36px; font-size:3.6rem; }
.font37 { font-size: 37px; font-size:3.7rem; }
.font38 { font-size: 38px; font-size:3.8rem; }
.font39 { font-size: 39px; font-size:3.9rem; }
.font40 { font-size: 40px; font-size:4.0rem; }
.bold { font-weight: bold; }
.normal { font-weight: normal; }
.underline { text-decoration: underline; }

/******************************************************************************
 * COLOR
*******************************************************************************/
.red { color: #dd0000; }
.redpink { color: #ff6699; }
.pink { color: #ff3399; }
.blue { color: #0099ff; }
.blue2 { color: #4790ce; }
.blue3 { color:#4abfdc; }
.green { color: #229c73; }
.green2 { color: #47a38a; }
.egreen { color: #2abfbf; }
.white { color: #ffffff; }
.orange { color: #ff6633; }
.gold { color: #D0A31A; }
.gray { color: #888888; }
.gray2 { color: #CCCCCC; }

/******************************************************************************
 * bg_color
*******************************************************************************/
.bg_red { background-color: #fff2f2;}
.bg_green { background-color: #229c73; }
/******************************************************************************
 * TEXT
*******************************************************************************/
.tx-left { text-align: left; }
.tx-center { text-align: center; }
.tx-right { text-align: right; }
.tx-justify{text-align: justify; text-justify: inter-ideograph;}
.ls-1 { letter-spacing: 1px; }
.ls-2 { letter-spacing: 2px; }
.v-top { vertical-align: top; }
.v-middle { vertical-align: middle; }
.underline { text-decoration:underline;}
.indent-1 {padding-left:1em;text-indent:-1em;}

/*----------------------------------------------------
  #goods-tit
--------------------------------------------------- */

.title-en {
    font-size: 14px;
	font-weight: 600;
}
.title-en {
    letter-spacing: .08em;
}	
	
/******************************************************************************
 * btn
*******************************************************************************/
#wrapper .btn-common {
    /*margin: 40px auto 0;*/
    display: block;
    font-size: 14px;
	max-width: 240px;
	line-height: 48px;
	/*font-family: 'Noto Sans Japanese', sans-serif;*/
  }
#wrapper .btn-common-c {
    margin: 40px auto 0;
    display: block;
    font-size: 14px;
	width: 240px;
	line-height: 48px;
	/*font-family: 'Noto Sans Japanese', sans-serif;*/
  }

	.btn-common,.btn-common-c {
	  position: relative;
	  z-index: 1;
	  display: inline-block;
	  height: 50px;
      line-height: 50px;
      font-size: 15px;
      margin-bottom: 0;
	  text-align: left;
	  white-space: nowrap;
	  vertical-align: middle;
	  cursor: pointer;
	  -webkit-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none;
	  background-image: none;
	  background-color: #000000;
	  color: #fff!important;
	  font-weight: 600;
	  border: 0;
	  -webkit-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	  -moz-transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
		transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	}

	.btn-common:visited,
	.btn-common:link,
	.btn-common-c:visited,
	.btn-common-c:link{
		color: #fff;
	}
	.btn-common:after,
	.btn-common:before,
	.btn-common-c:after,
	.btn-common-c:before {
		content: '';
		position: absolute;
		-webkit-transition: all 0.3s cubic-bezier(0.42, 0, 0.58, 1);
		-moz-transition: all 0.3s cubic-bezier(0.42, 0, 0.58, 1);
		transition: all 0.3s cubic-bezier(0.42, 0, 0.58, 1);

	}
	.btn-common:before,
	.btn-common-c:before {
		z-index: -1;
		top: 0;
		left: 0;
		height: 100%;
		width: 0;
		background: rgba(255, 255, 255, 0.3);
	}
	.btn-common:hover:before,
	.btn-common-c:hover:before {
		width: 100%;
	}
	.btn-common:after,
	.btn-common-c:after{
		top: 50%;
		right: 14px;
		display: block;
		margin-top: -4px;
		width: 14px;
		height: 9px;
		background: url("https://arrange-concrete.sakura.ne.jp/am/wp-content/themes/concraft-ec/images/form_ar01.svg") no-repeat;
	}
	.btn-common:hover:after,
	.btn-common-c:hover:after{
		right: 11px;
	}
	.btn-common:hover,
	.btn-common-c:hover{
		color: #fff;
	}
/******************************************************************************
 * product
*******************************************************************************/
.product-top-dt {
    position: absolute;
    /* top: 0; */
    /* left: 0; */
    /* width: 100%; */
    /* height: 100%; */
	width: calc((100% - 176px)/12*8 + 112px);
    background-color: #fff;
    /*padding: 20px 0 60px;*/
    margin: -60px auto 0;
    background: #fff;
    /*width: 750px;*/
	clear:both;
  }
  @media (max-width: 767px) {
	
.product-top-dt {
	position: relative;
    width: 100%;
    padding: 20px 0 0px;
    margin: 0px auto 0;
  }
}