@charset "utf-8";

/*----------------------------------------------------

(max-width : 991px)

*----------------------------------------------------*/
@media screen and ( max-width: 991px ) {
/*-----------------------------------------------------
COMMON CSS
------------------------------------------------------*/
html {
	font-size: 1.3vw;
}
body {
	font-size: 1.6rem;
	padding-top: 60px;
}
.tel_link {
	pointer-events: auto
}
/*header*/
header {
	padding: 0 0 0 5%;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: rgba(255,255,255,0.7);
	z-index: 9999;
}
header .h_top {
	padding: 0;
}
header .h_logo {
	width: auto;
}
header.fixed {
	border-bottom: solid 1px #ececec;
}
header.fixed .hbg_btn span {
	/* background: #000; */
}
header.fixed {
	padding-top: 0;
}
header .h_contact .contact_btn {
	margin-right: 0;
}
header .h_contact .contact_btn a {
	width: auto;
	padding: 14px;
}
header .h_contact .contact_btn img {
	max-width: 34px;
}
header .h_contact .contact_btn.tel a {
	padding: 12px;
	border-color: #f0865f;
	background: #f0865f;
}
header .h_contact .contact_btn.tel img {
	max-width: 30px;
}
.hbg_btn {
	height: 60px;
}
.drawer-nav {
	width: 85%;
}
.drawer-hamburger {
	padding: 0 14px;
	width: auto;
	box-sizing: border-box;
}
.drawer-hamburger:hover {
	background: #121212;
}
.drawer-menu .logo img {
	max-width: 350px;
}
.drawer-open header .h_logo img {
	opacity: 0;
}
/*footer*/
footer {
	padding: 0 4%;
}
footer .f_top {
	padding: 2rem 0;
}
footer .f_top .logo_wrap {
	align-items: center;
}
footer .f_top .logo_wrap .f_logo {
	width: 50%;
	padding: 0.4rem 2rem;
	text-align: center;
}
footer .f_top .logo_wrap .f_logo:not(:first-child) {
	margin-left: 0;
	padding-left: 1.5rem;
}
footer .f_top .logo_wrap .f_logo img {
	margin: 0 auto;
	width: 100%;
}
footer .f_bottom {

}
footer .f_bottom .footer_inner {
	padding: 2rem 0;
	justify-content: center;
}
.totop  {
	height: 4rem;
	width: 4rem;
}
/*PAGE CSS*/
.ttl_01 {
	font-size: 4.8rem;
}
.ttl_02 {
	font-size: 3rem;
}
.ttl_box .ttl_sub {
	font-size: 2.6em;
}
.ttl_deco span:after {
	top: 0;
}
.ttl_deco span:before, .ttl_deco span:after {
	width: 3.5rem;
	height: 3.5rem;
}
.ttl_deco span {
	padding-top: 2rem;
	padding-bottom: 3rem;
}
.container {
	padding: 7.5rem 5%;
}
.btn {
	margin-top: 3rem;
}
.list_num {
	font-size: 4rem;
}
/*-----------------------------------------------------
TOP PAGE & COMMON
------------------------------------------------------*/
.contact_area .bottom_wrap .inner {
	flex-wrap: wrap;
}
.contact_area .contact_btn {
	width: 100%;
	margin-top: 1.5rem;
}
.contact_area .btn_contact {
	width: 80%;
	margin: 0 auto;
	padding: 2.5rem 0;
}
.contact_area .btn_contact span {
	padding-left: 4rem;
	padding-top: 0;
	display: inline-block;
}
.contact_area .btn_contact span:before {
	left: 0;
	margin-left: 0;
	margin-top: -13px;
	top: 50%;
}
.sec_contact {
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 7.5rem;
	-webkit-background-size: cover;
	background-size: cover;
}
.contact_area .icon_txt {
	margin-right: 3rem;
}
#top #mainimage .mv_inner {
	background-image: url(../Image/top/mv_bg_tb.png);
}
#top #mainimage .img_mv {
	padding-top: 2rem;
	padding: 2rem 6% 0 6%;
}
#top #mainimage .top_contact {
	margin-top: 4rem;
}
/* example
-------------------------------*/
#top .example {
	padding-top: 7.5rem;
	padding-bottom: 15rem;
}
#top .example .example_list li {
	font-size: 3rem;
	line-height: 1.3;
}
#top .example .b_txt {
	font-size: 4rem;
}
#top .example .b_txt span {
	padding-bottom: 1rem;
}
#top .example:after {
	height: 100px;
}
/*    SECTION 02 report
-------------------------------*/
#top .reason {
	background-position: center bottom;
	background-color: #f1a700;
}
#top .reason .inner {
	padding-bottom: 15rem;
}
#top .reason .reason_list li {
	width: 100%;
	margin-right: 0;
	display: flex;
}
#top .reason .reason_list li:not(:first-child) {
	margin-top: 2rem;
}
#top .reason .reason_list li:before {
	right: inherit;
	left: 3rem;
}
#top .reason .reason_list .txt_box {
	height: auto!important;
	width: 60%;
	margin-top: 0;
	padding: 2.3rem 3rem;
}
#top .reason .reason_list .txt_box .ttl {
	padding-bottom: 1.5rem;
}
#top .reason .reason_list .txt_box .txt {
	margin-top: 1.5rem;
}
#top .reason .reason_list .img_box {
	width: 40%;
}
#top .reason .reason_list .img_box img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
#top .reason .reason_list .list_num {
	right: 1rem;
}
/*voice
-------------------------------*/
.voice .voice_list li {
	width: 100%;
	margin-right: 0;
}
.voice .voice_list li:not(:first-child) {
	margin-top: 2rem;
}
/*works
-------------------------------*/
#top .works .works_slide .item {
	width: 500px;
}
.works .works_wrap .img_box span {
	font-size: 1.6rem;
	padding: 1rem 1rem 2rem 1rem;
}
.works .works_wrap .img_box span:after {
	width: 25px;
	height: 2px;
}
.works .works_wrap .txt_box {
	display: block;
}
.works .works_wrap .txt_box .terms{
	font-size:1.4rem;
}
.works .works_wrap .txt_box h3 {
	font-size: 2.2rem;
}

.works .works_wrap .txt_box .works_ttl {
	width: 100%;
	margin-bottom: 2rem;
}

.works .works_wrap .txt_box .works_detail {
	width: 100%;
}

.works .works_wrap .txt_box .works_detail tr:first-child {
	border-top: solid 2px #e3e3e3;
}

.works .works_wrap .txt_box .works_detail th,
.works .works_wrap .txt_box .works_detail td {
	padding: 1em 1.5em;
}
.works .works_slide + .slide_arrows{
	display: none;
}


/*    SECTION 04  bottom_sec
-------------------------------*/
.m_box {
	max-width: 100%;
}
.m_box .txt_box {
	width: 100%;
	text-align: center;
	padding-right: 0;
}
.m_box .inner {
	padding: 3rem;
}
.m_box .txt_box + .img_box {
	position: static;
	width: 100%;
	margin-top: 3rem;
	min-width: 100%;
	text-align: center;
}
#top .diy .btn {
	margin-top: 2.3rem;
}
#top .diy .btn a {
	margin: 0 auto;
}
/*-----------------------------------------------------
下層共通
------------------------------------------------------*/
.under {
	padding-top: 60px;
}
.under #mainimage {
	height: auto;
}
.under .mv_ttl {
	padding: 11rem 0;
}
.under .mv_ttl .ttl_main {
	font-size: 4.8rem;
}
.under .mv_ttl .inner {
	padding: 2.8rem 0 3rem 0;
}
.under .ttl_02 {
	font-size: 3rem;
}
.under .ttl_03 {
	font-size: 4rem;
}
.under header {
}
.under header .header_inner {
	padding: 0;
}
.under header .h_logo {
	padding: 0;
}
.under header.fixed .h_logo {
	padding: 0;
}
.under .hbg_btn span {
}
.breadcrumb {
	display: none;
}
.under .sec_contact {
	padding-top: 0;
	margin-top: 7.5rem;
	background-position: top center;
	-webkit-background-size: cover;
	background-size: cover;
}
.under .cap_box .txt_box {
	/* line-height: 2; */
}
.table_main > tbody > tr > th, .table_main > tbody > tr > td {
	padding: 0 2rem;
}
/* .ttl_bg {
	padding-top: 4rem;
	padding-bottom: 4rem;
}
.anchor {
	padding: 0 5%;
	margin-bottom: 7.5rem;
}
.anchor .item {
	max-width: 30%;
	padding: 1.5rem 0;
} */

/*-----------------------------------------------------
アスファルト舗装工事.comとは	about
------------------------------------------------------*/
#about .m_box .txt_box {
	width: 100%;
}
#about .m_box .inner {
	padding-top: 5rem;
	padding-bottom: 5rem;
}
#about .m_box .txt_box .txt {
	text-align: left;
}
#about .about_list {
	margin: 0;
}
#about .about_list li .txt_box {
	width: 100%;
}
#about .reason01 {
	padding-bottom: 0;
}
#about .reason02 {
	padding-top: 17.5rem;
	padding-bottom: 22.5rem;
}
#about .reason02 .support_wrap .support_list li {
	width: 100%;
	padding: 2rem 0;
}
#about .reason02 .support_wrap .support_list li:not(:first-child) {
	margin-top: 1rem;
}
#about .reason02 .support_wrap .support_list .icon_box {
	margin-top: 0;
}
#about .reason02 .support_wrap .support_list .icon_box img {
	height: 70px;
}
#about .reason02 .support_wrap .support_list .txt_box {
	margin-top: 1.5rem;
}
#about .reason02 .support_wrap .support_list + .txt_box .b_txt {
	font-size: 3.2rem;
}
/*-----------------------------------------------------
選ばれる理由	faq
------------------------------------------------------*/
#reasons .reason01 .txt_box {
	/* line-height: 2; */
}
#reasons #contents:before {
	height: 60%;
}
#reasons .reason01 {
	padding-bottom: 0;
}
#reasons .reason02 {
	padding-top: 17.5rem;
	padding-bottom: 22.5rem;
}
#reasons .reason02 .support_wrap .support_list li {
	width: 100%;
	padding: 2rem 0;
}
#reasons .reason02 .support_wrap .support_list li:not(:first-child) {
	margin-top: 1rem;
}
#reasons .reason02 .support_wrap .support_list .icon_box {
	margin-top: 0;
}
#reasons .reason02 .support_wrap .support_list .icon_box img {
	height: 70px;
}
#reasons .reason02 .support_wrap .support_list .txt_box {
	margin-top: 1.5rem;
}
#reasons .reason02 .support_wrap .support_list + .txt_box .b_txt {
	font-size: 3.2rem;
}
#reasons .reason03 .m_box {
	flex-wrap: wrap;
}
#reasons .reason03 .m_box .inner {
	width: 100%;
}
#reasons .reason03 .m_box .txt_box {
	width: 100%;
	padding: 6rem 6rem 0;
}
#reasons .reason03 .reason_list .box_wrap:nth-child(even) .m_box .txt_box {
	order: 1;
	padding-right: 4rem;
	padding-left: 4rem;
}
#reasons .reason03 .m_box .img_box {
	width: 100%;
	padding: 0 6rem 6rem;
	text-align: center;
	display: block;
	order: 2;
}
#reasons .reason03 .reason_list .box_wrap:nth-child(even) .m_box .img_box {
	padding-right: 4rem;
	padding-left: 4rem;
}
/*-----------------------------------------------------
料金案内	faq
------------------------------------------------------*/
#price .price_list li {
	width: 100%;
}
#price .price_list li:not(:first-child) {
	margin-top: 5rem;
}
#price .price_list .img_box img {
	width: 100%;
}
#price .price_list .list_num {
	right: inherit;
	left: 3rem;
}
#price .option_list li {
	width: 49.3%;
}
#price .option_list li:not(:nth-child(-n+2)) {
	margin-top: 1rem;
}
/*-----------------------------------------------------
お申し込みの流れ	flow
------------------------------------------------------*/
#flow .cap_box .txt_box {
	/* line-height: 2; */
}
#flow .flow_list {
	margin-left: 0;
	margin-right: 0;
}
#flow .flow_list li .inner {
	flex-wrap: wrap;
}
#flow .flow_list li .txt_box {
	width: 100%;
}
#flow .flow_list li .img_box {
	width: 100%;
	padding-left: 0;
	margin-top: 3rem;
}
#flow .flow_list li .img_box img {
	width: 100%;

}
#flow .flow_list + .bottom_txt {
	font-size: 3.5rem;
}

/*-----------------------------------------------------
施工事例	works
------------------------------------------------------*/
/*-----------------------------------------------------
お客様の声	price
------------------------------------------------------*/
#voice .voice {
	padding-top: 7.5rem;
}
/*-----------------------------------------------------
よくあるご質問	faq
------------------------------------------------------*/
#faq .faq {
	padding-top: 7.5rem;
}
#faq .anchor {
	justify-content: flex-start;
}
#faq .anchor .item {
	width: 32.3%;
	margin-right: 1.5%;
}
#faq .anchor .item .inner:after {
	display: none;
}
#faq .anchor .item:nth-child(3n) {
	margin-right: 0;
}
#faq .anchor .item:not(:nth-child(-n+4)) {
	margin-top: 1rem;
}
#faq .anchor .item:not(:nth-child(-n+3)) {
	margin-top: 1rem;
}
.faq .faq_wrap .faq_q .txt_box:after {
	right: 28px;
	height: 20px;
	margin-top: -10px;
}
.faq .faq_wrap .faq_q .txt_box:before {
	right: 20px;
	width: 20px;
}
/*-----------------------------------------------------
DIYで簡単アスファルト舗装	asphalt
------------------------------------------------------*/
#asphalt #contents:before {
	height: 80%;
}
#asphalt .asphalt01 .check_list li {
	width: 100%;
}
#asphalt .asphalt01 .check_list li .inner {
	font-size: 3rem;
}
#asphalt .asphalt01 .check_list li:not(:nth-child(-n+1)) {
	margin-top: 2rem;
}

#asphalt .asphalt01 .txt_box{
	font-size:2rem;
}
#asphalt .asphalt01 .item_head {
	font-size: 2rem;
}
#asphalt .asphalt01 .img_wrap .item .badge {
	font-size: 1.8rem;
	padding: 1rem 1.5rem;
}
#asphalt .asphalt01 .video_wrap {
	flex-direction: column;
}
#asphalt .asphalt01 .video_wrap .item {
	width: 100%;
}
#asphalt .asphalt01 .video_wrap .item:nth-child(n+2){
	margin-top:5%;
}
#asphalt .asphalt01 .video_wrap .item:nth-child(odd){
	margin-right: 0;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list li {
	width: 49%;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list li:not(:nth-child(-n+2)) {
	margin-top: 1rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .icon_box img {
	height: 70px;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .list_num {
	top: 2rem;
	left: 2rem;
}
#asphalt .asphalt02 .txt_box .l_box {
	width: 100%;
}
#asphalt .asphalt02 .txt_box .l_box {
	font-size: 4rem;
}
#asphalt .asphalt02 .txt_box .r_box {
	width: 100%;
}
#asphalt .asphalt02 {
	padding-top: 17.5rem;
	padding-bottom: 22.5rem;
}
#asphalt .asphalt03 {
	padding-top: 0;
}
#asphalt .asphalt04 .txt_box {
	font-size: 3rem;
}
#asphalt .asphalt04 .c_box {
	flex-wrap: wrap;
}
#asphalt .asphalt04 .contact_area .tel_box {
	width: 100%;
	margin-right: 0;
}
#asphalt .asphalt04 .contact_area .tel_box .num {
	display: inline-block;
}
#asphalt .asphalt04 .c_box .btn_wrap {
	width: 100%;
	margin-top: 2rem;
}
#asphalt .asphalt04 .c_box .btn_wrap .item {
	width: 100%;
	margin-right: 0;
}
/*-----------------------------------------------------
お問合せ・お申込み	contact
------------------------------------------------------*/
#contact #contents.thanks:before {

}
#contact .contact_tel {
	padding: 4rem;
}
#contact .contact_tel .txt_box {
	font-size: 2.5rem;
}
.form_wrap input.long,
.form_wrap select.long {
	width: 100%;
}
.form_wrap textarea {
	width: 100%;
}
.form_wrap .table_main > tbody > tr {
	display: table-row;
}
.form_wrap .table_main > tbody > tr > th,
.form_wrap .table_main > tbody > tr > td {
	display: block;
	width: 100%;
}
.form_wrap .table_main > tbody > tr > th {
    border-right: none;
    padding-top: 2rem;
    padding-bottom: 1rem;
}
.form_wrap .table_main > tbody > tr > td {
    padding-top: 0.5rem;
    padding-bottom: 2rem;
}
.form_wrap .must_fill,
.form_wrap .not_must_fill {
	display: inline-block;
	margin-left: 2em;
}
/*-----------------------------------------------------
運営会社	company
------------------------------------------------------*/
/*-----------------------------------------------------
プライバシーポリシー	privacypolicy
------------------------------------------------------*/
/*-----------------------------------------------------
サイトマップ	sitemap
------------------------------------------------------*/
#sitemap .sitemap_list li .inner {
	padding: 2.3rem 2.5rem;
}
#sitemap .sitemap_list li .inner:after {
	right: 1rem;
	font-size: 2.2rem;
}
}

/*-------------------------------------

	( min-width: 768px ) and (max-width: 991px)　タブレットのみ

-------------------------------------*/
@media ( min-width: 768px ) and (max-width: 991px) {
	.voice .voice_list li .inner {
		display: flex;
		align-items: center;
		padding: 2rem;
	}
	.voice .voice_list .v_top {
		border-bottom: none;
		border-right: solid 2px #121212;
		padding-bottom: 0;
	}
	.voice .voice_list .v_bottom {
		min-width: 60%;
		margin-left: 2rem;
		margin-top: 0;
	}
	#about .about_list .tb_wrap {
		display: flex;
	}
	#about .about_list .tb_wrap .txt {
		width: 60%;
	}
	#about .about_list .tb_wrap .img_box {
		width: 40%;
		padding-left: 2rem;
		padding-top: 4rem;
	}
	#flow .flow_list .tb_wrap {
		display: flex;
	}
	#flow .flow_list .tb_wrap .txt {
		width: 60%;
	}
	#flow .flow_list .tb_wrap .img_box {
		width: 40%;
		padding-top: 3.9rem;
		padding-left: 2rem;
	}
}

/*-------------------------------------

	(max-width : 767px )

-------------------------------------*/
@media screen and (max-width : 767px ) {
/*common*/
html {
	font-size: 1.8vw;
}
body {
	min-width: 100%;
	font-size: 1.5rem;
	line-height: 1.7;
	padding-top: 50px;
}
.container {
	padding: 6rem 5%;
}
.btn_primary {
	padding: 1.6rem 0;
	max-width: 80%;
	font-size: 1.6rem;
}
.btn_primary:after {
	right: 1rem;
}

/*header*/
header {

}
header .h_logo a {
	display: block;
}
header .h_logo img {
	max-width: 200px
}
header.fixed .header_inner {
	/* padding-top: 1rem; */
}
header .h_contact .contact_btn a {
	padding: 12.5px;
	height: 50px;
}
header .h_contact .contact_btn.tel a {
	padding: 10.5px 12.5px;
}
header .h_contact .contact_btn img {
	max-width: 22px;
}
header .h_contact .contact_btn.tel img {
	width: 22px;
}
.hbg_btn {
	height: 50px;
}
.drawer-hamburger {
	border: none;
}

.hbg_btn span {
	margin-bottom: 6px;
	width: 25px;
}
.drawer--right.drawer-open .drawer-nav {
	width: 100%;
}
.drawer-menu {
	padding-bottom: 90px;
}
.drawer.drawer-open .drawer-hamburger .bar01 {
	transform: rotate(-135deg) translate(-7px, -6px);
}
.drawer.drawer-open .drawer-hamburger .bar03 {
	transform: rotate(135deg) translate(-5px, 5px);
}
.drawer--top .drawer-nav {
	width: 100%;
}
/* .drawer.drawer-open .hbg_btn span {
	background: #333;
} */
.drawer.drawer-open header .h_logo a {
	opacity: 0;
	pointer-events: none;
	transition: none;
}
.drawer-menu nav {
	margin-top: 3rem;
}
.drawer-menu nav ul li .nav_item {
	padding: 1.5rem 0;
}
.drawer-menu nav ul li {
	border-width: 3px;
}
.drawer-menu nav ul li:nth-child(-n+2) {
	border-width: 3px;
}
/*footer*/

footer .f_top .logo_wrap {
	display: block;
}
footer .f_top {
	padding-top: 0;
}
footer .f_top .logo_wrap .f_logo {
	width: 100%;
}
footer .f_top .logo_wrap .f_logo img {
	margin: 0 auto;
}
footer .f_top .logo_wrap .f_logo:not(:first-child) {
	margin-left: 0;
	margin-top: 1rem;
}
footer .f_top .logo_wrap .f_logo:not(:first-child):before {
	display: none;
}
footer .copy {
	line-height: 1.4;
	text-align: center;
	width: 100%;
	font-size: 1.2rem;
}
/*-----------------------------------------------------
TOP PAGE & COMMON
------------------------------------------------------*/
.contact_area > .txt p {
	font-size: 1.7rem;
}
.contact_area .bottom_wrap {
	padding: 3rem 4%;
}
.contact_area .icon_txt {
	font-size: 2.4rem;
	width: 10rem;
	height: 10rem;
	margin-right: 0;
}
.contact_area .tel_box {
	width: 100%;
	margin-right: 0;
	margin-top: 1.5rem;
}
.contact_area .tel_box .num {
	font-size: 3.5rem;
	display: inline-block;
	padding-left: 3.6rem;
}
.contact_area .tel_box .num:before {
	height: 30px;
	margin-top: -14px;
}
.contact_area .tel_box .t_txt {
	font-size: 1.8rem;
}
.contact_area .btn_contact {
	padding: 1.8rem 0;
}
.contact_area .btn_contact span:before {
	width: 20px;
}
.contact_area .tel_box .b_txt {
	padding: 1rem;
	width: 80%;
	margin: 1.5rem auto 0;
}
.sec_contact {
	margin-top: 0;
}
.ttl_deco_box  {
	font-size: 1.8rem;
}
.ttl_deco span {
	padding-top: 1rem;
	padding-bottom: 1.5rem;
}
.ttl_deco span:before, .ttl_deco span:after {
	width: 2.5rem;
	height: 2.5rem;
}
.ttl_01 {
	font-size: 3rem;
}
.ttl_02 {
	font-size: 2.5rem;
}
.list_num {
	font-size: 3rem;
}
.u_line {
	display: inline;
	padding-bottom: 0;
	background: linear-gradient(transparent 74%, #f1a700 0%);
}
.under .ttl_02 {
	font-size: 2.5rem;
}
.ttl_box .ttl_sub {
	font-size: 2.2rem;
}
.ttl_en + .ttl_ja {
	font-size: 1.6rem;
}
.ttl_icon {
	-webkit-background-size: auto 40px;
	background-size: auto 40px;
	padding-top: 5rem;
}
.ttl_box.u_arrow .arrow {
	border-top: 3px solid #121212;
	border-right: 3px solid #121212;
}
.ttl_box.u_arrow .inner:before {
	height: 3px;
}
.ttl_box.u_arrow .inner:after {
	height: 3px;
}
.ttl_box.u_arrow .inner {
	padding-bottom: 3.5rem;
}
#top .example {
	padding-top: 6rem;
	padding-bottom: 10rem;
}
#top .example:after {
	height: 50px;
}
#top .example .example_list li {
	font-size: 2.0rem;
	padding: 1.5rem 1rem 1.5rem 5.4rem;
}
#top .example .example_list li:before {
	background-size: 20px;
	width: 4rem;
	background-position: left 1rem center;
}
#top .example .b_txt {
	font-size: 2.4rem;
}
#top .reason .ttl_01 {
	line-height: 1.3;
	margin-top: 1rem;
}
#top .reason .reason_list {
	margin-top: 5rem;
}
#top .reason .reason_list li {
	display: block;
}
#top .reason .reason_list li:not(:first-child) {
	margin-top: 4rem;
}
#top .reason .reason_list .img_box {
	width: 100%;
}
#top .reason .reason_list .txt_box {
	width: 100%;
	padding: 2rem;
}
#top .reason .reason_list .txt_box .ttl {
	font-size: 2rem;
}
#top .reason .reason_list li:before {
	left: 1.5rem;
}
#top .works {
	padding-top: 0;
}
#top .works .works_slide {
	margin-right: -1rem;
	margin-left: -1rem;
}
#top .works .works_slide .item {
	width: auto;
	margin: 0 1rem;
}
#top .works .works_slide {
	margin-top: 3rem;
}
.works .works_wrap .item .img_wrap {
	flex-wrap: wrap;
}
.works .works_wrap .item .img_box {
	width: 100%;
}
.works .works_wrap .img_box span {
	font-size: 1.6rem;
	padding: 1rem 1rem 1.5rem 1rem;
}
.works .works_wrap .img_box span:after {
	width: 25px;
	height: 2px;
	bottom: 0.6rem;
}

.works .works_wrap .txt_box .point {
  padding-left: 2em;
}
.works .works_wrap .txt_box .point:before{
  width:1.5em;
}

#top .faq .faq_wrap {
	margin-top: 3rem;
}
#top .diy .img_box {
	margin-top: 2rem;
}
.works .works_slide .slick-prev,
.works .works_slide .slick-next {
	width: 4rem;
	height: 4rem;
	top: 60%;
}
.works .works_slide  .slick-prev {
	left: -1rem;
}
.works .works_slide .slick-next {
	right: -1rem;
}
.works .works_slide .slick-list {
	overflow: hidden;
}
.voice .voice_list .v_top:before {
	width: 3.5rem;
}
.voice .voice_list {
	margin-top: 3rem;
}
.faq .faq_wrap .txt_box {
	width: 100%;
}
.faq .faq_wrap .faq_a .txt_box {
	padding: 1.5rem 1rem;
}
.faq .faq_wrap .faq_q .txt_box {
	padding: 1.5rem 3.5rem 1.5rem 1rem;
	font-size: 1.6rem;
}
.faq .faq_wrap .faq_q .txt_box:before {
	width: 18px;
	right: 1rem;
	height: 3px;
}
.faq .faq_wrap .faq_q .txt_box:after {
	height: 18px;
	right: 1.8rem;
	margin-top: -10px;
	width: 3px;
}
.faq .faq_wrap .en_box {
	width: 4rem;
	font-size: 3rem;
}
.m_box .inner {
	padding: 2rem;
}
.m_box .txt_box .txt {
	text-align: left;
}

/*-------------------------------------
下層共通
-------------------------------------*/
.under {
	padding-top: 50px;
}
.under header.fixed .header_inner {
	padding-top: 0;
}
.under .mv_ttl {
	padding: 8rem 0;
}
.under .mv_ttl .ttl_main {
	font-size: 3rem;
	line-height: 1.1;
}
.under .ttl_box {
	margin-bottom: 3.5rem;
}
.under .cap_box .ttl_box {
	margin-bottom: 2rem;
}
.under .ttl_03 {
	font-size: 2.8rem;
}
.under .sec_contact {
	padding-top: 6rem;
	margin-top: 0;
}
.under .cap_box .txt_box {
	line-height: 1.8;
	text-align: left;
	font-size: 1.6rem;
}
.under #contents:before {
	-webkit-background-size: 50%;
	background-size: 50%;
}
.table_main > tbody > tr {
	display: table-row;
}
.table_main > tbody > tr > th, .table_main > tbody > tr > td {
	display: block;
	width: 100%;
	padding: 0 2rem;
}
.table_main > tbody > tr > th {
	border-right: none;
	padding-top: 2rem;
	padding-bottom: 0.5rem;
}
.table_main > tbody > tr > td {
	padding-top: 0.5rem;
	padding-bottom: 2rem;
}
.m_box .inner {
	border-width: 5px;
}
.box_deco:before {
	width: 5px;
	height: 20px;
}
.box_deco:after {
	width: 20px;
	height: 5px;
}
/*-----------------------------------------------------
アスファルト舗装工事.comとは	about
------------------------------------------------------*/
#about .about_list li .img_box {
	width: 100%;
	padding-left: 0;
	margin-top: 3rem;
}
#about .about_list li .img_box img {
	width: 100%;
}
#about .about02 .ttl_box {
	margin-bottom: 2.3rem;
}
#about .about_list li .txt_box .txt {
	margin-top: 2rem;
}
#about .about_list .a_ttl {
	font-size: 1.8rem;
}
#about .about_list .a_ttl .num {
	line-height: 45px;
	width: 45px;

}
#about .about_list .a_ttl .ttl {
	line-height: 1;
	padding-left: 1.5rem;
	width: calc(100% - 50px);
}
#about .reason01 .txt_box {
	text-align: left;
	font-size: 1.6rem;
	/* line-height: 1.8; */
}

#about .reason02 {
	padding-bottom: 17.5rem;
}
#about .reason02 .support_wrap {
	padding: 2rem;
}
#about .reason02 .support_wrap .support_list li {
	justify-content: flex-start;
	padding: 2rem 3rem;
}
#about .reason02 .support_wrap .support_list .txt_box {

}
#about .reason02 .support_wrap .support_list .txt_box .b_txt {
	font-size: 2.2rem;
}

#about .reason02 .support_wrap .support_list .icon_box img {
	height: 45px;
	width: auto;
}
#about .reason02 .support_wrap .support_list + .txt_box .b_txt {
	font-size: 2.2rem;
}
/*-----------------------------------------------------
選ばれる理由	faq
------------------------------------------------------*/
#reasons .reason01 .txt_box {
	text-align: left;
	font-size: 1.6rem;
	/* line-height: 1.8; */
}

#reasons .reason02 {
	padding-bottom: 17.5rem;
}
#reasons .reason02 .support_wrap {
	padding: 2rem;
}
#reasons .reason02 .support_wrap .support_list li {
	justify-content: flex-start;
	padding: 2rem 3rem;
}
#reasons .reason02 .support_wrap .support_list .txt_box {

}
#reasons .reason02 .support_wrap .support_list .txt_box .b_txt {
	font-size: 2.2rem;
}

#reasons .reason02 .support_wrap .support_list .icon_box img {
	height: 45px;
	width: auto;
}
#reasons .reason02 .support_wrap .support_list + .txt_box .b_txt {
	font-size: 2.2rem;
}
#reasons .reason03 .m_box .txt_box {
	padding: 3.5rem 3.5rem 0;
}
#reasons .reason03 .m_box .img_box {
	padding: 0 3.5rem 3.5rem;
}
#reasons .reason03 .box_deco.deco01,
#reasons .reason03 .box_deco.deco01:before,
#reasons .reason03 .box_deco.deco01:after {
	top: -3px;
	left: -3px;
}
#reasons .reason03 .box_deco.deco03,
#reasons .reason03 .box_deco.deco03:before,
#reasons .reason03 .box_deco.deco03:after {
	top: -3px;
	right: -3px;
}
#reasons .reason03 .box_deco.deco02,
 #reasons .reason03 .box_deco.deco02:before,
 #reasons .reason03 .box_deco.deco02:after {
	bottom: -3px;
	left: -3px;
}
#reasons .reason03 .box_deco.deco04,
 #reasons .reason03 .box_deco.deco04:before,
 #reasons .reason03 .box_deco.deco04:after {
	bottom: -3px;
	right: -3px;
}
/*-----------------------------------------------------
料金案内	price
------------------------------------------------------*/
#price .price_list .txt_box .p_ttl {
	font-size: 2.5rem;
	padding-bottom: 1.5rem;
}
#price .price_list .txt_box {
	padding: 3rem 2rem;
}
#price .price_list .txt_box .p_price span {
	font-size: 3.5rem;
}
#price .price_list .btn_primary {
	max-width: 100%;
}
#price .option_list li {
	padding-top: 10rem;
}
#price .option_list li:nth-child(1) {
	-webkit-background-size: 70px;
	background-size: 70px;
	background-position: top 20px center;
}
#price .option_list li:nth-child(2) {
	-webkit-background-size: 70px;
	background-size: 70px;
	background-position: top 40px center;
}
#price .option_list li:nth-child(3) {
	-webkit-background-size: 70px;
	background-size: 70px;
	background-position: top 20px center;
}
#price .option_list li:nth-child(4) {
	-webkit-background-size: 70px;
	background-size: 70px;
	background-position: top 20px center;
}
#price .option_list .o_ttl {
	font-size: 2rem;
}
/*-----------------------------------------------------
お申し込みの流れ	flow
------------------------------------------------------*/
#flow .cap_box .txt_box {
	text-align: left;
  font-size: 1.6rem;
}
#flow .flow_list {
	margin-top: 5rem;
}
#flow .flow_list .f_ttl {
	font-size: 1.8rem;
}
#flow .flow_list .f_ttl .ttl {
	line-height: 1;
  padding-left: 1.5rem;
  width: calc(100% - 50px);
}
#flow .flow_list .f_ttl .num {
	line-height: 45px;
  width: 45px;
}
#flow .flow_list li .txt_box .txt {
	margin-top: 3rem;
}
#flow .flow_list li .txt_box .txt .ttl_sub {
	font-size: 1.8rem;
	margin-bottom: 1.5rem;
}
#flow .flow_list li {
	padding-bottom: 3rem;
}
#flow .flow_list li:not(:first-child) {
	margin-top: 2rem;
}
#flow .flow_list + .bottom_txt {
	margin-top: 0;
	font-size: 2.5rem;
}

/*-----------------------------------------------------
施工事例	works
------------------------------------------------------*/
#works #contents:before {
	height: 102%;
}
#works .works .works_wrap {
	margin-top: 5rem;
}
#works .works .works_wrap .item {
	width: 100%;
	margin-right: 0;
	margin-top: 5rem;
}
#works .works .works_wrap .item:first-child {
	margin-top: 0;
}
#works .works .works_wrap .item:nth-child(even) {
	margin-top: 5rem;
}

/*-----------------------------------------------------
お客様の声	price
------------------------------------------------------*/
#voice .voice {
	padding-top: 6rem;
}
#voice .voice .voice_wrap {
	margin-top: 5rem;
}
/*-----------------------------------------------------
よくあるご質問	faq
------------------------------------------------------*/
#faq #contents:before {
	height: 110%;
}
#faq .faq {
	padding-top: 6rem;
}
#faq .anchor {
	margin-bottom: 6rem;
}
#faq .anchor .item {
	width: 49%;
	margin-right: 2%;
}
#faq .anchor .item:nth-child(3n) {
	margin-right: 2%;
}
#faq .anchor .item:nth-child(even) {
	margin-right: 0;
}
#faq .anchor .item:not(:nth-child(-n+3)) {
	margin-top: 1rem;
}
#faq .anchor .item:not(:nth-child(-n+2)) {
	margin-top: 1rem;
}
#faq .anchor .item .inner:after {
	display: block;
	right: 1rem;
}
#faq .main_wrap .f_item:not(:first-child) {
	padding-top: 6rem;
}
#faq .main_wrap .f_item > .ttl_box {
	margin-bottom: 2.3rem;
}
/*-----------------------------------------------------
DIYで簡単アスファルト舗装	asphalt
------------------------------------------------------*/
#asphalt .asphalt01 {
	padding-bottom: 0;
}
#asphalt .asphalt01 .check_list li .inner {
	font-size: 2.2rem;
	padding: 2rem;
}
#asphalt .asphalt01 .check_list li:not(:nth-child(-n+1)) {
	margin-top: 1rem;
}
#asphalt .asphalt01 .txt_box {
	text-align: left;
	line-height: 2;
	font-size: 1.8rem;
}
#asphalt .asphalt01 .item_head{
	border-bottom: 3px solid #000;
}
#asphalt .asphalt01 .img_wrap {
	flex-wrap: wrap;
	flex-direction: column;
}
#asphalt .asphalt01 .img_wrap .item {
	border-width: 3px;
	width: 100%;
	margin-right: 0;
}
#asphalt .asphalt01 .img_wrap .item:nth-child(n+2){
	margin-top:5%;
}

#asphalt .asphalt01 .video_wrap .item .video{
	border: solid 3px;
}
#asphalt .asphalt02 {
	padding-bottom: 17.5rem;
}
#asphalt .asphalt02 .asphalt_wrap {
	padding: 2rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list li {
	width: 100%;
	padding: 2rem 0;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .icon_box {
	margin-top: 0;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .icon_box img {
	height: 45px;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .txt_box {
	margin-top: 1.5rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .txt_box .a_ttl {
	font-size: 2.2rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .txt_box .parent_title {
	font-size: 2.2rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list li:not(:nth-child(-n+1)) {
	margin-top: 1rem;
}
#asphalt .asphalt02 .asphalt_wrap .asphalt_list .txt_box .sm {
	margin-top: 1rem;
}
#asphalt .asphalt02 .txt_box .l_box {
	font-size: 2.6rem;
}
#asphalt .asphalt02 .txt_box .r_box ul {
	padding: 2rem 1.5rem;
}
#asphalt .asphalt02 .txt_box .r_box li {
	font-size: 2.2rem;
}

#asphalt .asphalt04 .c_box {
	padding: 3rem 2rem;
	width: 100%;
}
#asphalt .asphalt04 .c_box .btn_wrap {
	display: block;
}
#asphalt .asphalt04 .contact_area .tel_box {
	margin-top: 0;
}
#asphalt .asphalt04 .c_box .btn_wrap .item {
	width: 100%;
}
#asphalt .asphalt04 .c_box .btn_wrap .item.site {
	margin-top: 1rem;
}
#asphalt .asphalt04 .c_box .btn_wrap .item.mail .inner {
	-webkit-background-size: 30px;
	background-size: 30px;
	background-position: center top 20px;
}
#asphalt .asphalt04 .c_box .btn_wrap .item.site .inner {
	-webkit-background-size: 30px;
	background-size: 30px;
	background-position: center top 20px;
}
#asphalt .asphalt04 .c_box .btn_wrap .item .inner {
	padding-top: 4.5rem;
}
#asphalt .asphalt04 .txt_box {
	text-align: left;
	font-size: 2.4rem;
}
#asphalt .asphalt04 .txt_box .u_line {
	background: linear-gradient(transparent 74%, #d74200 0%);
}
/*-----------------------------------------------------
お問合せ・お申込み	contact
------------------------------------------------------*/
#contact .contact_tel {
	display: block;
	padding: 3rem 2rem;
}
#contact .contact_tel .txt_box {
	font-size: 2.2rem;
	margin-bottom: 2rem;
}
/*-----------------------------------------------------
運営会社	company
------------------------------------------------------*/

/*-----------------------------------------------------
プライバシーポリシー	privacypolicy
------------------------------------------------------*/
#privacypolicy .privacy_wrap .item:not(:first-child) {
	margin-top: 3rem;
}
#privacypolicy .lead_box {
	text-align: left;
	margin-bottom: 5rem;
}
#privacypolicy .privacy_wrap .ttl {
	font-size: 1.8rem;
	padding: 2rem 1.5rem;
}
/*-----------------------------------------------------
サイトマップ	sitemap
-----------------------------------------------------*/
#sitemap .sitemap_list li {
	width: 100%;
}
#sitemap .sitemap_list li:nth-child(n+2) {
	border-top: none;
}
#sitemap .sitemap_list li .inner {
	padding: 2rem;
}
/*-----------------------------------------------------
フォーム共通
------------------------------------------------------*/
.form_wrap {
	margin-top: 5rem;
}
.form_wrap .must_fill {
	margin-left: 1em;
}
.form_wrap .input_txt, .form_wrap textarea {
	padding: 0.5rem 1rem;
	font-size: 1.8rem;
}
.form_wrap input.middle {
	width: 100%;
}
.form_wrap input.long {
	width: 100%;
}
.form_wrap textarea {
	width: 100%;
}
.form_wrap .address > li {
	display: block;
}
.form_wrap .address > li > * {
	display: block;
}
.form_wrap .address > li .field {
	margin-top: 1rem;
}
.form_wrap .btn_wrap {
	margin-top: 3rem;
}
.form_wrap input[type="text"], .form_wrap select, .form_wrap textarea {
	font-size: 1.8rem;
}
/*-----------------------------------------------------
WP PAGER
------------------------------------------------------*/
.wp-pagenavi * {
	font-size: 1.2rem;
}
.wp-pagenavi *:not(.extend) {
	border-width: 2px;
}
.wp-pagenavi .nextpostslink, .wp-pagenavi .previouspostslink {
	display: none;
}
.wp-pagenavi .extend {
	display: none;
}
}

/*-------------------------------------

	(min-width : 576px ) and (max-width:767px)

-------------------------------------*/
@media (min-width : 576px ) and (max-width:767px) {
}

/*-------------------------------------

	(max-width : 575px )

-------------------------------------*/
@media screen and (max-width : 575px ) {
html {
	font-size: 2.5vw;
}
body {
	font-size: 1.6rem;
}
header .h_logo img {
	max-width: 175px;
}
.drawer-menu nav ul li {
	width: 100%;
	text-align: center;
}
.drawer-menu nav ul li:nth-child(n+2) {
	border-top: none;
}
footer .f_top .logo_wrap .f_logo:nth-child(1) img {
	max-width: 200px;
}
footer .f_top .logo_wrap .f_logo:nth-child(2) img {
	max-width: 200px;
}
.contact_area .tel_box .b_txt {
	width: 100%;
}
#about .reason01 .ttl_03 {
	line-height: 1.3;
}
#about .reason02 .ttl_box {
	-webkit-background-size: 80px;
	background-size: 80px;
	padding-top: 10rem;
}
#about .reason02 .support_wrap .support_list li {
	padding: 2rem;
}
#about .reason02 .support_wrap .support_list .icon_box img {
	height: 35px;
}
#about .reason02 .support_wrap .support_list .txt_box {
	margin-left: 1rem;
}
#about .reason02 .support_wrap .support_list .txt_box .b_txt {
	font-size: 2rem;
}
#about .reason02 .support_wrap .support_list + .txt_box .b_txt {
	text-align: left;
	line-height: 1.5;
	font-size: 2rem;
}
#about .reason02 .support_wrap .support_list + .txt_box .b_txt span {
	display: inline;
  padding-bottom: 7px;
  background: linear-gradient(transparent 85%, #d74200 0%);
}
#about .reason02 .support_wrap .support_list + .txt_box .b_txt span:after {
	display: none;
}
#reasons .reason01 .ttl_03 {
	line-height: 1.3;
}
#reasons .reason02 .ttl_box {
	-webkit-background-size: 80px;
	background-size: 80px;
	padding-top: 10rem;
}
#reasons .reason02 .support_wrap .support_list li {
	padding: 2rem;
}
#reasons .reason02 .support_wrap .support_list .icon_box img {
	height: 35px;
}
#reasons .reason02 .support_wrap .support_list .txt_box {
	margin-left: 1rem;
}
#reasons .reason02 .support_wrap .support_list .txt_box .b_txt {
	font-size: 2rem;
}
#reasons .reason02 .support_wrap .support_list + .txt_box .b_txt {
	text-align: left;
	line-height: 1.5;
	font-size: 2rem;
}
#reasons .reason02 .support_wrap .support_list + .txt_box .b_txt span {
	display: inline;
  padding-bottom: 7px;
  background: linear-gradient(transparent 85%, #d74200 0%);
}
#reasons .reason02 .support_wrap .support_list + .txt_box .b_txt span:after {
	display: none;
}
#reasons .reason03 {
	padding-top: 0;
}
#flow .flow_list + .bottom_txt {
	font-size: 2rem;
}
#faq .anchor .item {
	width: 100%;
	margin-right: 0;
}
#faq .anchor .item:nth-child(3n) {
	margin-right: 0;
}
#faq .anchor .item:nth-child(2n) {
	margin-top: 1rem;
}
#faq .anchor .item .inner {
	padding: 0.8rem 0;
}
#contact .contact_tel .txt_box {
	line-height: 1.3;
}
#asphalt .asphalt01 .check_list li .inner {
	font-size: 2rem;
	padding: 2rem 1.5rem;
}
#asphalt .asphalt01 .txt_box {
	font-size: 1.6rem;
}
#asphalt .asphalt01 .check_list li .inner span {
	-webkit-background-size: 25px;
	background-size: 25px;
	padding-left: 3rem;
}

#asphalt .asphalt01 .img_wrap .item {
      
    border-width: 2px;
		
}

/* #asphalt .asphalt01 .img_wrap .item:nth-child(5) {
    margin: 3.2% 27%;
}

#asphalt .asphalt01 .img_wrap .item:nth-child(n+3) {
    margin-top: 3.2%;
} */
#asphalt .asphalt01 .video_wrap .item .video_ttl{
	padding: 0 .75rem;
	margin-bottom: .75rem;
	font-size: 1.6rem;
}
#asphalt .asphalt02 .ttl_box {
	-webkit-background-size: 80px;
	background-size: 80px;
	padding-top: 10rem;
}
#asphalt .asphalt02 .txt_box .r_box li {
	-webkit-background-size: 25px;
	background-size: 25px;
	padding-left: 3rem;
	font-size: 1.8rem;
}
#asphalt .asphalt04 .txt_box {
	font-size: 2.2rem;
}
#asphalt .asphalt04 .c_box .btn_wrap .item.mail .inner {
	background-position: center top 15px;
}
@media screen and (max-width : 330px ) {
	header .h_logo img {
		max-width: 132px;
	}
}
}
