Inquiry
點擊這裡與我們聯繫
我們接受諮詢與聯絡
/* ----------------------------------------- */
/* 內容範本：Inquiry – 開始 */
/* ----------------------------------------- */
/** Support **/
.support-list li {
margin: 50px auto;
}
.support-list li img {
display: block;
max-width: 80%;
}
.text-area p {
font-size: 1.375rem;
}
.text-area p:first-child {
font-size: 1.8rem;
}
.content:first-child {
padding: 7% 0 10%;
}
/** Form item **/
.form-item:not(:nth-last-of-type(-n + 2)) {
border-bottom: solid 3px #999;
}
.form-item {
position: relative;
padding: 4% 0;
}
dt {
position: relative;
line-height: 3em;
}
dt, dd, .check-button {
font-size: 1.5rem;
}
.required {
font-size: 0.5em;
}
.form-item:not(:last-child) input,
textarea,
.form-select.select {
border: solid 1px #999;
padding: 10px;
}
.form-select.select:before {
content: '▼';
}
textarea {
resize: none;
height: 400px;
}
.mwform-tel-field {
display: flex;
justify-content: space-between;
line-height: 2em;
}
.mwform-tel-field input[type="text"] {
width: 30%;
}
#mail,
#company-name,
#inquiry-content,
#channel-name,
#channel-url,
textarea {
width: 100%;
}
select {
text-transform: none;
-webkit-appearance: button;
border: none;
border-radius: 0;
background: #fff;
}
.check-button {
width: 100%;
border: none;
color: #fff;
background-color: transparent;
transition: .2s;
}
label.form-button:hover .check-button {
color: #000;
}
.form-button {
position: absolute;
top: 0;
font-size: 1.125rem;
line-height: 50px;
background-color: #000;
filter: drop-shadow(2px 4px 0px #9d9d9d);
transition: .2s;
}
label.form-button:hover {
background-color: #fff;
filter: drop-shadow(0px 0px 2px #000);
}
.form-button:before,
.form-button:after {
position: absolute;
top: 0;
content: '';
border: 25px solid transparent;
transition: .2s;
}
label.form-button:hover:before{
border-right: 15px solid #fff;
filter: drop-shadow(1px 0 0 #fff);
}
label.form-button:hover:after {
border-left: 15px solid #fff;
filter: drop-shadow(-1px 0 0 #fff);
}
.form-button:before {
right: 100%;
border-right: 15px solid #000;
filter: drop-shadow(1px 0 0 #000);
}
.form-button:after {
left: 100%;
border-left: 15px solid #000;
filter: drop-shadow(-1px 0 0 #000);
}
span.error:not(:first-of-type) {
display: none;
}
.form-back input[type="submit"] {
background-color: #fff;
text-decoration: underline;
}
.content > p:first-child {
font-size: 1.75rem;
font-weight: bold;
text-align: center;
line-height: 50px;
}
input.form-back {
position: absolute;
top: 100px;
left: 0;
border: none;
background-color: #fff;
text-decoration: underline;
}
.top-area > a {
position: relative;
background-size: cover;
background-repeat: no-repeat;
}
.top-area > a:first-of-type {
background-image: url(https://brkr.jp/wp-content/uploads/jpg/inquiry_service.jpg);
}
.top-area > a:last-of-type {
background-image: url(https://brkr.jp/wp-content/uploads/jpg/inquiry_influencer.jpg);
}
.top-area > p {
display: none;
}
@media only screen and (min-width: 751px) {
.flex-pc {
display: flex;
}
.top-area > a {
width: 50%;
}
.support-list li {
display: flex;
}
.support-list li img {
width: 25%;
margin: 0 4% 0 auto;
}
.text-area {
width: 60%;
height: fit-content;
margin: auto auto auto 0;
}
dl {
width: 70%;
margin: 0 auto;
}
.form-button {
right: 20px;
width: 250px;
}
.input-name {
display: flex;
justify-content: space-between;
}
#last-name, #first-name {
width: 49%;
}
}
@media only screen and (max-width: 750px) {
img.text-border {
left: -7%;
}
.support-list li img {
margin: 50px auto;
}
.form-button {
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 90%;
}
.form-item:last-of-type {
padding: 3rem 0;
}
.input-name input {
width: 100%;
margin: 10px 0;
}
select#inquiry-content {
font-size: 1.1rem;
}
.top-area > a{
width: 100%;
height: 50vh;
display: block;
}
}
.button-wrapper > img {
width: 50%;
}
.button-wrapper {
width: fit-content;
text-align: center;
}
.button-wrapper > p {
text-decoration: underline;
color: #fff;
}
.complete-text {
width: fit-content;
}
.complete-text > p,
.complete-text > a {
margin: 4rem auto;
font-size: 1.3rem;
text-align: center;
font-weight: 600;
}
.complete-text > p:first-of-type {
font-size: 1.8rem
}
.complete-text > a {
display: block;
margin: 5em 0;
color: #000;
text-decoration: underline;
}
.complete {
min-height: 100vh;
}
.width-range {
padding: 0 5%;
}
/* 元view部分*/
.philosophy {
width: 76%;
}
.philosophy li {
text-align: center;
margin: 10% auto;
}
.philosophy li:last-of-type {
margin-bottom: 5%;
}
.philosophy li:first-of-type {
margin-top: 5%;
}
.philosophy img {
max-width: 100%;
height: auto;
}
.philosophy li p {
margin: auto;
font-size: 2.625rem;
}
@media only screen and (min-width: 751px) {
.philosophy li {
display: flex;
}
.philosophy img {
width: 35%;
margin-right: 5%;
}
/* ----------------------------------------- */
/* 內容範本：Inquiry – 結束 */
/* ----------------------------------------- */
/* ----------------------------------------- */
/* 內容範本：TopContent – 開始 */
/* ----------------------------------------- */
.top-content {
width: 93%;
text-align: right;
color: #fff;
z-index: 1;
filter: drop-shadow(1px 1px 3px #000);
}
h1 {
margin-bottom: -1rem;
}
.news-title {
text-align: justify;
}
.top-content .description {
font-size: 1.875em;
}
@media only screen and (min-width: 751px) {
.top-content .supplementry {
font-size: 1.625em;
}
}
@media only screen and (max-width: 750px) {
.top-content .supplementry {
display: none;
}
}
@media only screen and (max-width: 460px) {
.top-content .description {
font-size: 1.4rem;
text-align: justify;
line-height: 1.4em;
}
}
/* ----------------------------------------- */
/* 內容範本：TopContent – 結束 */
/* ----------------------------------------- */