@charset "UTF-8"; /* 共通 ------------------------------------------------------------- */ /* 共通 */ body { width: 100%; font-size: 13pt; font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; overflow-x: hidden; overflow-y: scroll; } body.noscroll { /* スマホのメニュー表示時のスクロール固定 */ position: fixed; overflow-y: scroll; } /* 改行の調整 */ .br-scrY { display: none; } @media screen and (max-width: 1120px) { .br-scrY { display: inline; } } .br-scr3 { display: none; } @media screen and (max-width: 900px) { .br-scr3 { display: inline; } } .br-mob { display: none; } @media screen and (max-width: 700px) { .br-mob { display: inline; } } .br-mob_s { display: none; } @media screen and (max-width: 461px) { .br-mob_s { display: inline; } } @media screen and (max-width: 700px) { .br-cancel-mob { display: none; } } @media screen and (max-width: 461px) { .br-cancel-mob_s { display: none; } } /* フォントサイズの調整 */ .txt-085 { font-size: 0.85em; } /* 行 */ .row4cel { display: table-row; } /* 表示の切り替え */ .hide { display: none; } /* ヘッダー --------------------------------------------------------- */ /* ヘッダー */ .header, .header2 { max-width: 1100px; margin: 0 auto; padding: 36px 10px 10px; /* ヘッダー内部 */ } @media screen and (max-width: 700px) { .header, .header2 { padding: 10px; } } .header__inner, .header2__inner { display: table; width: 100%; table-layout: fixed; /* 左ボックス */ /* 右ボックス */ } @media screen and (max-width: 461px) { .header__inner, .header2__inner { display: block; } } .header__inner-leftbox, .header2__inner-leftbox { display: table-cell; text-align: left; vertical-align: bottom; /* ロゴ */ /* テキスト */ } .header__inner-leftbox .leftbox__logo, .header2__inner-leftbox .leftbox__logo { color: #78bc35; } .header__inner-leftbox .leftbox__logo img, .header2__inner-leftbox .leftbox__logo img { /* @media screen and (max-width: $break-point-mob_s){ width: 70%; max-width: 70%; height: auto; } */ } @media screen and (max-width: 700px) { .header__inner-leftbox .leftbox__logo img, .header2__inner-leftbox .leftbox__logo img { width: 100%; max-width: 100%; height: auto; } } .header__inner-leftbox .leftbox__text, .header2__inner-leftbox .leftbox__text { padding-left: 2.5em; font-size: 0.99em; /* @media screen and (max-width: $break-point-scr1){ font-size: 0.99em * 0.9; } @media screen and (max-width: $break-point-scr2){ font-size: 0.99em * 0.85; } @media screen and (max-width: $break-point-scr3){ font-size: 0.99em * 0.8; } @media screen and (max-width: $break-point-scr4){ font-size: 0.99em * 0.75; } */ } @media screen and (max-width: 700px) { .header__inner-leftbox .leftbox__text, .header2__inner-leftbox .leftbox__text { padding-left: 15%; } } @media screen and (max-width: 700px) { .header__inner-leftbox .leftbox__text, .header2__inner-leftbox .leftbox__text { font-size: 0.693em; } } @media screen and (max-width: 461px) { .header__inner-leftbox, .header2__inner-leftbox { display: block; } } .header__inner-rightbox, .header2__inner-rightbox { display: table-cell; text-align: right; vertical-align: bottom; /* テキスト */ } @media screen and (max-width: 461px) { .header__inner-rightbox, .header2__inner-rightbox { text-align: left; } } .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { margin: 0; padding: 0; display: inline-block; text-align: left; font-size: 0.99em; line-height: 1.5em; } @media screen and (max-width: 461px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { padding-left: 15%; } } @media screen and (max-width: 1100px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { font-size: 0.891em; } } @media screen and (max-width: 1000px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { font-size: 0.8415em; } } @media screen and (max-width: 900px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { font-size: 0.792em; } } @media screen and (max-width: 800px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { font-size: 0.7425em; } } @media screen and (max-width: 700px) { .header__inner-rightbox .rightbox__text, .header2__inner-rightbox .rightbox__text { font-size: 0.693em; } } @media screen and (max-width: 461px) { .header__inner-rightbox, .header2__inner-rightbox { display: block; } } .header2 { border-bottom: 1px solid #000000; margin-bottom: 80px; } @media screen and (max-width: 700px) { .header2 { margin-bottom: 30px; } } /* アイキャッチ */ .eyecatch { text-align: center; /* アイキャッチタイトル（ロゴ） */ } .eyecatch .eyecatch__title { margin: 0; padding: 0; background-color: #000000; } @media screen and (max-width: 700px) { .eyecatch .eyecatch__title { /* 左右を一部カットする準備 */ overflow: hidden; } } .eyecatch .eyecatch__title-img { width: 100%; max-width: 1500px; height: auto; vertical-align: bottom; } @media screen and (max-width: 700px) { .eyecatch .eyecatch__title-img { /* 左右を一部カットする */ width: 150%; margin-left: -25%; } } /* メイン ----------------------------------------------------------- */ .main { /* 紹介 */ /* 紹介のボックス */ /* ご相談リンク */ /* WORKS */ /* WORKSの紹介団体 */ /* お問い合わせ */ } .main__introduction { margin: 0; padding: 0; } @media screen and (max-width: 700px) { .main__introduction { padding: 0 10px; } } .main__introduction-title { font-size: 2em; text-align: center; margin: 56px 0 36px; padding: 0; line-height: 1.4em; } @media screen and (max-width: 1100px) { .main__introduction-title { font-size: 1.8em; } } @media screen and (max-width: 1000px) { .main__introduction-title { font-size: 1.7em; } } @media screen and (max-width: 900px) { .main__introduction-title { font-size: 1.6em; } } @media screen and (max-width: 800px) { .main__introduction-title { font-size: 1.5em; } } @media screen and (max-width: 700px) { .main__introduction-title { font-size: 1.4em; } } @media screen and (max-width: 700px) { .main__introduction-title { margin: 20px 0; } } .main__introduction-textwrap { padding: 0 0 3em; } @media screen and (max-width: 700px) { .main__introduction-textwrap { padding: 0 0 20px; } } .main__introduction-text { text-align: center; margin: 0.5em; padding: 0; line-height: 1.7em; font-size: 1.1em; } @media screen and (max-width: 1100px) { .main__introduction-text { font-size: 0.99em; } } @media screen and (max-width: 1000px) { .main__introduction-text { font-size: 0.935em; } } @media screen and (max-width: 900px) { .main__introduction-text { font-size: 0.88em; } } @media screen and (max-width: 800px) { .main__introduction-text { font-size: 0.825em; } } @media screen and (max-width: 700px) { .main__introduction-text { font-size: 0.77em; } } .main__introduction-block1, .main__introduction-block2 { list-style: none; max-width: 1116px; margin: 3em auto; padding: 0; font-size: 0; /* .introduction__boxでinline-blockの隙間をなくす */ display: table; table-layout: fixed; width: 100%; } .main__introduction-block2 { width: 100%; } .main .introduction__box { /* ボックスのヘッダー */ /* ボックスの本体 */ } .main .introduction__box-outer { display: table-cell; padding: 8px; font-size: 13pt; /* .introduction__boxでinline-blockの隙間をなくしたことによるフォントサイズを復活させる */ } @media screen and (max-width: 700px) { .main .introduction__box-outer { width: 100%; } } .main .introduction__box-head { background-color: #808080; background-image: url("../img/paper_fold.png"); background-repeat: no-repeat; background-size: 32px 32px; } .main .introduction__box .box__head-title { padding: 0.5em; font-size: 1.5em; /* @media screen and (max-width: $break-point-scr1){ font-size: 1.5em * 0.9; } @media screen and (max-width: $break-point-scr2){ font-size: 1.5em * 0.85; } @media screen and (max-width: $break-point-scr3){ font-size: 1.5em * 0.8; } @media screen and (max-width: $break-point-scr4){ font-size: 1.5em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 1.5em * 0.7; } */ color: #FFFFFF; text-align: center; } .main .introduction__box-body, .main .introduction__box-body2 { border-left: 4px solid #808080; border-right: 4px solid #808080; border-bottom: 4px solid #808080; height: 170px; } @media screen and (max-width: 1150px) { .main .introduction__box-body, .main .introduction__box-body2 { height: 190px; } } @media screen and (max-width: 700px) { .main .introduction__box-body, .main .introduction__box-body2 { height: auto; } } .main .introduction__box-body2 { display: table; } .main .introduction__box-left, .main .introduction__box-right { display: table-cell; vertical-align: middle; } @media screen and (max-width: 700px) { .main .introduction__box-left, .main .introduction__box-right { display: block; } } .main .introduction__box-right { width: 52%; } @media screen and (max-width: 700px) { .main .introduction__box-right { width: auto; } } .main .introduction__box .box__body-catch, .main .introduction__box .box__body-catch2 { padding: 20px 0; font-size: 1.1em; /* @media screen and (max-width: $break-point-scr1){ font-size: 1.1em * 0.9; } @media screen and (max-width: $break-point-scr2){ font-size: 1.1em * 0.85; } @media screen and (max-width: $break-point-scr3){ font-size: 1.1em * 0.8; } @media screen and (max-width: $break-point-scr4){ font-size: 1.1em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 1.1em * 0.7; } */ text-align: center; } .main .introduction__box .box__body-catch2 { padding-left: 24px; text-align: left; } @media screen and (max-width: 700px) { .main .introduction__box .box__body-catch2 { padding-left: 0; text-align: center; } } .main .introduction__box .box__body-text, .main .introduction__box .box__body-text2 { margin: 0; padding: 0.9em 0.7em 0.9em 0.9em; padding-top: 0; font-size: 0.7em; /* @media screen and (max-width: $break-point-scr1){ font-size: 0.7em * 0.9; } @media screen and (max-width: $break-point-scr2){ font-size: 0.7em * 0.85; } @media screen and (max-width: $break-point-scr3){ font-size: 0.7em * 0.8; } @media screen and (max-width: $break-point-scr4){ font-size: 0.7em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 0.7em * 0.7; } */ line-height: 1.7em; } .main .introduction__box .box__body-text2 { text-align: left; } .main .introduction__box .box__body-image2 { vertical-align: middle; text-align: center; } .main .introduction__box .box__body-image2 img { padding: 20px; display: inline-block; vertical-align: middle; } @media screen and (max-width: 461px) { .main .introduction__box .box__body-image2 img { padding: 10px; } } .main__contactlink { margin: 140px 0; padding: 0; } @media screen and (max-width: 700px) { .main__contactlink { /* スマホではご相談のリンクを下部に固定 */ margin: 0; padding: 0; position: fixed; bottom: 0; width: 100vw; background-color: rgba(255, 255, 255, 0.8); border-top: 1px solid rgba(255, 255, 255, 0.8); box-shadow: 0px 0px 6px; } } .main__contactlink-button { text-align: center; } @media screen and (max-width: 700px) { .main__contactlink-button { /* スマホではご相談のリンクを下部に固定 */ padding: 12px 0; } } .main__contactlink-button a { display: inline-block; width: 380px; padding: 0.5em 0; font-size: 2.1em; color: #000000; text-decoration: none; border: 4px solid #000000; } @media screen and (max-width: 700px) { .main__contactlink-button a { width: calc(100% - 44px); } } @media screen and (max-width: 1100px) { .main__contactlink-button a { font-size: 1.89em; } } @media screen and (max-width: 1000px) { .main__contactlink-button a { font-size: 1.785em; } } @media screen and (max-width: 900px) { .main__contactlink-button a { font-size: 1.68em; } } @media screen and (max-width: 800px) { .main__contactlink-button a { font-size: 1.575em; } } @media screen and (max-width: 700px) { .main__contactlink-button a { font-size: 1.47em; } } .main__works { margin: 140px 0 0; padding: 0 10px; background-color: #78BD36; text-align: center; } @media screen and (max-width: 700px) { .main__works { margin: 20px 0 0; padding: 0 10px; } } .main__works-title { display: inline-block; padding: 0.2em 0; width: 350px; font-size: 1.75em; color: #FFFFFF; background-color: #3C5F1B; } @media screen and (max-width: 700px) { .main__works-title { width: 70%; } } @media screen and (max-width: 1100px) { .main__works-title { font-size: 1.575em; } } @media screen and (max-width: 1000px) { .main__works-title { font-size: 1.4875em; } } @media screen and (max-width: 900px) { .main__works-title { font-size: 1.4em; } } @media screen and (max-width: 800px) { .main__works-title { font-size: 1.3125em; } } @media screen and (max-width: 700px) { .main__works-title { font-size: 1.225em; } } .main__works-contents { max-width: 1100px; margin: 0 auto; padding: 0 0 50px; } @media screen and (max-width: 700px) { .main__works-contents { padding: 0 0 20px; } } .main .contents__group { margin: 30px 0; text-align: left; font-size: 1.1em; text-decoration: underline; } @media screen and (max-width: 1100px) { .main .contents__group { font-size: 0.99em; } } @media screen and (max-width: 1000px) { .main .contents__group { font-size: 0.935em; } } @media screen and (max-width: 900px) { .main .contents__group { font-size: 0.88em; } } @media screen and (max-width: 800px) { .main .contents__group { font-size: 0.825em; } } @media screen and (max-width: 700px) { .main .contents__group { font-size: 0.77em; } } .main .contents__group-title { margin: 60px 0 36px; font-size: 2.1em; line-height: 1.5em; } @media screen and (max-width: 700px) { .main .contents__group-title { margin: 20px 0; } } @media screen and (max-width: 1100px) { .main .contents__group-title { font-size: 1.89em; } } @media screen and (max-width: 1000px) { .main .contents__group-title { font-size: 1.785em; } } @media screen and (max-width: 900px) { .main .contents__group-title { font-size: 1.68em; } } @media screen and (max-width: 800px) { .main .contents__group-title { font-size: 1.575em; } } @media screen and (max-width: 700px) { .main .contents__group-title { font-size: 1.47em; } } .main .contents__group-subtitle { margin: 60px 0 36px; font-size: 1.3em; line-height: 1.7em; } @media screen and (max-width: 700px) { .main .contents__group-subtitle { margin: 20px 0; } } @media screen and (max-width: 1100px) { .main .contents__group-subtitle { font-size: 1.17em; } } @media screen and (max-width: 1000px) { .main .contents__group-subtitle { font-size: 1.105em; } } @media screen and (max-width: 900px) { .main .contents__group-subtitle { font-size: 1.04em; } } @media screen and (max-width: 800px) { .main .contents__group-subtitle { font-size: 0.975em; } } @media screen and (max-width: 700px) { .main .contents__group-subtitle { font-size: 0.91em; } } .main .contents__group-text { margin: 20px auto; font-size: 0.75em; /* @media screen and (max-width: $break-point-scr1){ font-size: 0.75em * 0.9; } @media screen and (max-width: $break-point-scr2){ font-size: 0.75em * 0.85; } @media screen and (max-width: $break-point-scr3){ font-size: 0.75em * 0.8; } @media screen and (max-width: $break-point-scr4){ font-size: 0.75em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 0.75em * 0.7; } */ max-width: 720px; text-align: left; line-height: 1.5em; } .main__contactus, .main__contactus2 { margin: 0; padding: 0; text-align: center; } @media screen and (max-width: 700px) { .main__contactus, .main__contactus2 { padding: 0 10px; } } .main__contactus-title, .main__contactus2-title { display: inline-block; padding: 0.2em 0; width: 350px; font-size: 1.75em; color: #FFFFFF; background-color: #808080; } @media screen and (max-width: 700px) { .main__contactus-title, .main__contactus2-title { width: 70%; } } @media screen and (max-width: 1100px) { .main__contactus-title, .main__contactus2-title { font-size: 1.575em; } } @media screen and (max-width: 1000px) { .main__contactus-title, .main__contactus2-title { font-size: 1.4875em; } } @media screen and (max-width: 900px) { .main__contactus-title, .main__contactus2-title { font-size: 1.4em; } } @media screen and (max-width: 800px) { .main__contactus-title, .main__contactus2-title { font-size: 1.3125em; } } @media screen and (max-width: 700px) { .main__contactus-title, .main__contactus2-title { font-size: 1.225em; } } .main__contactus-contents, .main__contactus2-contents { max-width: 1100px; margin: 0 auto; padding: 0 10px 80px; } @media screen and (max-width: 700px) { .main__contactus-contents, .main__contactus2-contents { padding: 0 0 20px; } } .main .contents__contact { /* お問い合わせのリード文 */ /* お問い合わせの電話 */ /* お問い合わせのEメール */ } .main .contents__contact-lead { padding: 60px 0; font-size: 1.1em; line-height: 1.7em; } @media screen and (max-width: 700px) { .main .contents__contact-lead { padding: 20px 0; } } @media screen and (max-width: 1100px) { .main .contents__contact-lead { font-size: 0.99em; } } @media screen and (max-width: 1000px) { .main .contents__contact-lead { font-size: 0.935em; } } @media screen and (max-width: 900px) { .main .contents__contact-lead { font-size: 0.88em; } } @media screen and (max-width: 800px) { .main .contents__contact-lead { font-size: 0.825em; } } @media screen and (max-width: 700px) { .main .contents__contact-lead { font-size: 0.77em; } } .main .contents__contact-tel { max-width: 588px; margin: 0 auto; } .main .contents__contact-tel .contact__tel-phone { margin: 0; padding: 0 26px 14px; border-bottom: 3px solid #000000; font-size: 1.7em; } @media screen and (max-width: 1100px) { .main .contents__contact-tel .contact__tel-phone { font-size: 1.53em; } } @media screen and (max-width: 1000px) { .main .contents__contact-tel .contact__tel-phone { font-size: 1.445em; } } @media screen and (max-width: 900px) { .main .contents__contact-tel .contact__tel-phone { font-size: 1.36em; } } @media screen and (max-width: 800px) { .main .contents__contact-tel .contact__tel-phone { font-size: 1.275em; } } @media screen and (max-width: 700px) { .main .contents__contact-tel .contact__tel-phone { font-size: 1.19em; } } .main .contents__contact-tel .contact__tel-phone a { padding-left: 1em; text-decoration: none; color: #000000; } @media screen and (max-width: 461px) { .main .contents__contact-tel .contact__tel-phone a { padding-left: 0; } } .main .contents__contact-tel .contact__tel-hour { margin: 0; padding: 14px 0 0; font-size: 1.33em; } @media screen and (max-width: 1100px) { .main .contents__contact-tel .contact__tel-hour { font-size: 1.197em; } } @media screen and (max-width: 1000px) { .main .contents__contact-tel .contact__tel-hour { font-size: 1.1305em; } } @media screen and (max-width: 900px) { .main .contents__contact-tel .contact__tel-hour { font-size: 1.064em; } } @media screen and (max-width: 800px) { .main .contents__contact-tel .contact__tel-hour { font-size: 0.9975em; } } @media screen and (max-width: 700px) { .main .contents__contact-tel .contact__tel-hour { font-size: 0.931em; } } .main .contents__contact-email { max-width: 588px; margin: 0 auto; } .main .contents__contact-email .contact__email { margin: 60px 0 52px; } .main .contents__contact-email .contact__email-lead { margin: 70px 0 0; padding: 0 0 44px; background-image: url("../img/arrow.png"); background-repeat: no-repeat; background-size: 161px 36px; background-position: center bottom; font-size: 1.1em; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-lead { margin: 20px 0 0; } } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-lead { font-size: 0.99em; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-lead { font-size: 0.935em; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-lead { font-size: 0.88em; } } @media screen and (max-width: 800px) { .main .contents__contact-email .contact__email-lead { font-size: 0.825em; } } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-lead { font-size: 0.77em; } } .main .contents__contact-email .contact__email-form { margin: 54px 0 0; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form { margin: 20px 0 0; } } .main .contents__contact-email .contact__email-form .form__tbl, .main .contents__contact-email .contact__email-form .form__confirm { display: table; text-align: left; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl, .main .contents__contact-email .contact__email-form .form__confirm { display: block; } } .main .contents__contact-email .contact__email-form .form__tbl dl, .main .contents__contact-email .contact__email-form .form__confirm dl { display: table-row; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dl, .main .contents__contact-email .contact__email-form .form__confirm dl { display: block; } } .main .contents__contact-email .contact__email-form .form__tbl dt, .main .contents__contact-email .contact__email-form .form__tbl dd, .main .contents__contact-email .contact__email-form .form__confirm dt, .main .contents__contact-email .contact__email-form .form__confirm dd { display: table-cell; vertical-align: top; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dt, .main .contents__contact-email .contact__email-form .form__tbl dd, .main .contents__contact-email .contact__email-form .form__confirm dt, .main .contents__contact-email .contact__email-form .form__confirm dd { display: block; } } .main .contents__contact-email .contact__email-form .form__tbl dt, .main .contents__contact-email .contact__email-form .form__confirm dt { padding: 14px 14px 0 0; /*width: 50%;*/ font-size: 0.78em; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dt, .main .contents__contact-email .contact__email-form .form__confirm dt { width: auto; } } .main .contents__contact-email .contact__email-form .form__tbl dd, .main .contents__contact-email .contact__email-form .form__confirm dd { margin: 0; padding: 0 0 30px; width: 50%; text-align: right; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dd, .main .contents__contact-email .contact__email-form .form__confirm dd { padding: 0; } } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dd, .main .contents__contact-email .contact__email-form .form__confirm dd { width: auto; } } .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd textarea { width: 450px; border: 1px solid #999999; margin: 0; padding: 2px; font-size: 0.9em; /* @media screen and (max-width: $break-point-scr4){ font-size: 0.9em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 0.9em * 0.7; } */ } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd textarea { width: 90%; } } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd textarea { font-size: 0.81em; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd textarea { font-size: 0.765em; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd textarea { font-size: 0.72em; } } .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 40px; } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 36px; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 34px; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 32px; } } @media screen and (max-width: 800px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 30px; } } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dd input[type="text"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__tbl dd input[type="email"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="text"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="tel"], .main .contents__contact-email .contact__email-form .form__confirm dd input[type="email"] { height: 28px; } } .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 330px; } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 297px; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 280.5px; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 264px; } } @media screen and (max-width: 800px) { .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 247.5px; } } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__tbl dd textarea, .main .contents__contact-email .contact__email-form .form__confirm dd textarea { height: 231.0px; } } .main .contents__contact-email .contact__email-form .form__confirm dd { padding: 14px 0; text-align: left; width: 450px; margin-left: auto; font-size: 0.9em; /* @media screen and (max-width: $break-point-scr4){ font-size: 0.9em * 0.75; } @media screen and (max-width: $break-point-mob){ font-size: 0.9em * 0.7; } */ border-bottom: 1px solid #999999; vertical-align: bottom; } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__confirm dd { width: 90%; } } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-form .form__confirm dd { font-size: 0.81em; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-form .form__confirm dd { font-size: 0.765em; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-form .form__confirm dd { font-size: 0.72em; } } .main .contents__contact-email .contact__email-form .form__required { color: #FF0000; } .main .contents__contact-email .contact__email-form .form__message { padding: 30px 0; } .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { margin: 0; padding: 0; text-align: left; font-size: 0.99em; line-height: 1.5em; } @media screen and (max-width: 1100px) { .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { font-size: 0.891em; } } @media screen and (max-width: 1000px) { .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { font-size: 0.8415em; } } @media screen and (max-width: 900px) { .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { font-size: 0.792em; } } @media screen and (max-width: 800px) { .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { font-size: 0.7425em; } } @media screen and (max-width: 700px) { .main .contents__contact-email .contact__email-form .form__message p, .main .contents__contact-email .contact__email-form .form__message li { font-size: 0.693em; } } .main .contents__contact-email .contact__email-form .form__message ul { padding-left: 1.5em; } .main .contents__contact-email .contact__email-form .g-recaptcha { padding: 0 0 30px; } .main .contents__contact-email .contact__email-form .form__actions-check, .main .contents__contact-email .contact__email-form .form__actions-reset, .main .contents__contact-email .contact__email-form .form__actions-submit, .main .contents__contact-email .contact__email-form .form__actions-back { margin: 0 10px; padding: 8px 14px; background-color: #666666; border: 1px solid #666666; color: #FFFFFF; font-size: 0.78em; } .main .contents__contact-email .contact__email-form .form__actions-check:hover, .main .contents__contact-email .contact__email-form .form__actions-reset:hover, .main .contents__contact-email .contact__email-form .form__actions-submit:hover, .main .contents__contact-email .contact__email-form .form__actions-back:hover { background-color: #000000; cursor: pointer; } /* フッター --------------------------------------------------------- */ /* フッター */ .footer { background-color: #000000; } .footer__inner { padding: 5px; color: #FFFFFF; font-size: 0.67em; text-align: center; }