@charset "utf-8";
/* CSS Document */


/*PC*/
@media screen and (min-width: 1680px) {

.header { background: url("../images/contact/hedImg.jpg") center center no-repeat; background-size: cover;}

.cont01 {}
.cont01 .inner { width: 1536px; margin: 0 auto; padding: 100px 0 150px; text-align: center;}
.cont01 .inner h3 { font-size: 30px; margin: 0 0 40px;}
.cont01 .inner p { margin: 0 0 20px;}
.cont01 .inner .btn { width: 300px; height: 72px; margin: 50px auto 0;}
.cont01 .inner .btn a { width: 100%; height: 100%; padding-left: 50px; display: flex; align-items: center; background: var(--color99_10); color: var(--color00_10); position: relative;}
.cont01 .inner .btn a::after  { content: "\f061"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 26px; position: absolute; right: 30px;}
.cont01 .inner .btn a:hover { background: var(--color99_08);}
.cont01 .inner .btn a:hover::after  { content: "\f061"; right: 20px;}

}


@media print, screen and (min-width: 768px) and ( max-width: 1679px) {

.header { background: url("../images/contact/hedImg.jpg") center center no-repeat; background-size: cover;}

.cont01 {}
.cont01 .inner { width: 91.4286vw; margin: 0 auto; padding: 5.9524vw 0 8.9286vw; text-align: center;}
.cont01 .inner h3 { font-size: 1.7857vw; margin: 0 0 2.3810vw;}
.cont01 .inner p { margin: 0 0 1.1905vw;}
.cont01 .inner .btn { width: 17.8571vw; height: 4.2857vw; margin: 2.9762vw auto 0;}
.cont01 .inner .btn a { width: 100%; height: 100%; padding-left: 2.9762vw; display: flex; align-items: center; background: var(--color99_10); color: var(--color00_10); position: relative;}
.cont01 .inner .btn a::after  { content: "\f061"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 1.5476vw; position: absolute; right: 1.7857vw;}
.cont01 .inner .btn a:hover { background: var(--color99_08);}
.cont01 .inner .btn a:hover::after  { content: "\f061"; right: 1.1905vw;}

}



/*sp*/
@media only screen and (max-width: 767px) {

.header { background: url("../images/contact/hedImg.jpg") center center no-repeat; background-size: cover;}

.cont01 {}
.cont01 .inner { width: 100%; margin: 0 auto; padding: 14.9254vw 4.4776vw 22.3881vw;}
.cont01 .inner h3 { font-size: 4.4776vw; margin: 0 0 5.9701vw; text-align: center;}
.cont01 .inner p { margin: 0 0 2.9851vw;}
.cont01 .inner .btn { width: 44.7761vw; height: 10.7463vw; margin: 7.4627vw auto 0;}
.cont01 .inner .btn a { width: 100%; height: 100%; padding-left: 7.4627vw; display: flex; align-items: center; background: var(--color99_10); color: var(--color00_10); position: relative;}
.cont01 .inner .btn a::after  { content: "\f061"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 3.8806vw; position: absolute; right: 4.4776vw;}
.cont01 .inner .btn a:hover { background: var(--color99_08);}
.cont01 .inner .btn a:hover::after  { content: "\f061"; right: 2.9851vw;}

}




@media screen and (width: 640px) {

.header { background: url("../images/contact/hedImg.jpg") center center no-repeat; background-size: cover;}

.cont01 {}
.cont01 .inner { width: 100%; margin: 0 auto; padding: 100px 30px 150px;}
.cont01 .inner h3 { font-size: 30px; margin: 0 0 40px; text-align: center;}
.cont01 .inner p { margin: 0 0 20px;}
.cont01 .inner .btn { width: 300px; height: 72px; margin: 50px auto 0;}
.cont01 .inner .btn a { width: 100%; height: 100%; padding-left: 50px; display: flex; align-items: center; background: var(--color99_10); color: var(--color00_10); position: relative;}
.cont01 .inner .btn a::after  { content: "\f061"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 26px; position: absolute; right: 30px;}
.cont01 .inner .btn a:hover { background: var(--color99_08);}
.cont01 .inner .btn a:hover::after  { content: "\f061"; right: 20px;}

}