@charset "utf-8";
/**************************************************
All Page
**************************************************/

/*** css initialize ***/
html, body, div, h1, h2, h3, h4, h5, h6, p, span, header, footer, nav, aside,
small, abbr, address, code, del, img, ins, kbd, q, samp,
strong, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, dialog, figure,
menu, section, time, mark, object, audio, video {
margin:0;
padding:0;
border:0;
font-weight:inherit;
font-style:inherit;
font-size:100%;
font-family:inherit;
vertical-align:baseline;
word-break:break-all;
word-wrap:break-word;
}

section, header, footer, aside, article, menu, nav, details, figcaption, figure {
display:block;
}

h1, h2, h3, h4, h5, h6 {
font-weight:normal;
}

body {
font-family:"游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "メイリオ", sans-serif;
font-size:15px;
text-align:center;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
color:#4c4c4c;
background:#fff;
}

body.ban {
overflow:hidden;
}

html {
}

.clear {
clear:both;
}

img {
border:none;
vertical-align:bottom;
}

ul,ol {
list-style:none;
}

a {
color:#1b1b1b;
outline:none;
text-decoration:none;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
}

a:hover,
a:active {
color:#686868;
}

a[href^="tel:"] {
pointer-events:none;
}

@font-face {
font-family:'Font Awesome 5 Free';
font-style:normal;
font-weight:400;
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.eot");
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.woff2") format("woff2"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.woff") format("woff"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.ttf") format("truetype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-regular-400.svg#fontawesome") format("svg");
font-display:swap;
}

@font-face {
font-family:'Font Awesome 5 Free';
font-style:normal;
font-weight:900;
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.eot");
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.woff2") format("woff2"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.woff") format("woff"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.ttf") format("truetype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-solid-900.svg#fontawesome") format("svg");
font-display:swap;
}

@font-face {
font-family:'Font Awesome 5 Free';
font-style:normal;
font-weight:400;
font-display:swap;
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.eot");
src: url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.eot?#iefix") format("embedded-opentype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.woff2") format("woff2"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.woff") format("woff"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.ttf") format("truetype"),
url("/wp-content/themes/miyakoreform/fonts/webfonts/fa-brands-400.svg#fontawesome") format("svg");
}


/* wrapper --------------- */

#wrapper {
width:100%;
text-align:center;
float:left;
overflow:hidden;
}

#wrap {
width:1000px;
margin:0 auto;
}

.pc {
display:block;
}

.sp {
display:none;
}

/* -------------------------------------------------------------- */


/* header --------------- */

header {
width:100%;
padding:10px 0;
font-weight:bold;
float:left;
}

header #logo {
float:left;
}

header nav {
padding-top:45px;
padding-left:50px;
font-size:14px;
float:left;
}

header nav li {
padding:0 10px;
display:inline-block;
letter-spacing:0.1em;
}

header #tel {
padding-top:8px;
text-align:right;
font-size:13px;
float:right;
}

header #tel span {
padding-bottom:5px;
font-size:19px;
display:inline-block;
letter-spacing:0.1em;
}

header #tel span:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f2a0';
}

/* -------------------------------------------------------------- */


/* visual --------------- */

#visual {
width:100%;
float:left;
}

#visual img {
width:auto;
max-width:100%;
height:auto;
}

/* -------------------------------------------------------------- */


/* form-scroll --------------- */

.form-scroll {
width:100%;
padding:50px 0;
background:#f1f1f1;
float:left;
box-sizing:border-box;
}

.form-scroll a {
width:400px;
padding:20px 30px;
background:#303030;
font-size:17px;
font-weight:bold;
color:#fff;
display:inline-block;
box-sizing:border-box;
letter-spacing:0.1em;
position:relative;
}

.form-scroll a:hover {
background:#f26d00;
}

.form-scroll a:before,
.form-scroll a:after {
width:2px;
height:100%;
background:#fff;
content:'';
display:block;
position:absolute;
top:0;
}

.form-scroll a:before {
left:10px;
}

.form-scroll a:after {
right:10px;
}

/* -------------------------------------------------------------- */


/* reason --------------- */

#reason {
width:100%;
padding:70px 0 50px;
float:left;
}

#reason h1 {
width:100%;
margin-bottom:50px;
font-size:28px;
font-weight:bold;
float:left;
letter-spacing:0.1em;
position:relative;
}

#reason h1 br {
display:none;
}

#reason h1 span.h1 {
position:relative;
}

#reason h1 span.h1:before,
#reason h1 span.h1:after {
content:'';
width:2px;
height:50px;
background:#8d8d8d;
position:absolute;
}

#reason h1 span.h1:before {
top:-10px;
left:-25px;
transform:rotate(-35deg);
}

#reason h1 span.h1:after {
top:-10px;
right:-25px;
transform:rotate(35deg);
}

#reason h1 span.dot {
padding:0 5px;
font-size:36px;
color:#e10000;
position:relative;
}

#reason h1 span.dot:before {
width:7px;
height:7px;
background:#000;
content:'';
position:absolute;
top:-9px;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border-radius:50%;
-webkit-transform:border-radius:50%;
-moz-transform:border-radius:50%;
}

#reason .img {
width:100%;
margin-bottom:50px;
float:left;
}

#reason .img img {
width:auto;
max-width:100%;
height:auto;
}

#reason .note {
width:100%;
float:left;
}

#reason .note p {
width:818px;
line-height:30px;
text-align:left;
font-weight:bold;
display:inline-block;
float:none;
}

/* -------------------------------------------------------------- */


/* item --------------- */

#item {
width:100%;
float:left;
}

#item .title {
width:100%;
padding:40px 0 25px;
background:#ca3434;
float:left;
position:relative;
}

#item .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #fff;
}

#item .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #b21111, -1px -1px 0 #b21111, -1px 1px 0 #b21111, 1px -1px 0 #b21111, 0px 1px 0 #b21111,  0-1px 0 #b21111, -1px 0 0 #b21111, 1px 0 0 #b21111;
}

#item .title span {
width:100%;
font-size:18px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #b21111, -1px -1px 0 #b21111, -1px 1px 0 #b21111, 1px -1px 0 #b21111, 0px 1px 0 #b21111,  0-1px 0 #b21111, -1px 0 0 #b21111, 1px 0 0 #b21111;
}

#item .block {
width:100%;
padding:30px 20px;
background-size:auto auto;
background-color:rgba(255, 255, 255, 1);
background-image:repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(250, 250, 250, 0.5) 5px, rgba(250, 250, 250, 0.5) 10px );
float:left;
box-sizing:border-box;
}

#item .block .list {
width:100%;
margin-bottom:40px;
float:left;
}

#item .block .list:nth-of-type(4) {
margin-bottom:0;
}

#item h3 {
width:100%;
margin-bottom:30px;
text-align:left;
font-size:22px;
font-weight:bold;
float:left;
letter-spacing:0.1em;
}

#item h3:before {
padding-right:5px;
color:#c54e4e;
font-family:'Font Awesome 5 Free';
font-weight:400;
content:'\f35a';
}

#item .block .box {
width:100%;
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:space-between;
float:left;
}

#item .block .box .boxes {
width:220px;
height:250px;
padding:10px;
background:#fff;
border:1px solid #d8d8d8;
position:relative;
box-sizing:border-box;
}

#item .block .box .boxes .off {
width:81px;
height:81px;
line-height:16px;
padding-top:27px;
background:url('/wp-content/themes/miyakoreform/page/onlinestore/images/item/off.webp') no-repeat;
background-size:contain;
font-size:12px;
font-weight:bold;
color:#fff;
position:absolute;
top:-20px;
left:-20px;
box-sizing:border-box;
}

#item .block .box .boxes .off span {
padding-right:3px;
font-size:21px;
}

#item .block .box .boxes h4 {
width:100%;
margin-top:9px;
font-size:13px;
font-weight:bold;
float:left;
}

#item .block .note {
width:100%;
margin-top:30px;
text-align:left;
font-weight:bold;
float:left;
}

#item .block .note p:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

/* -------------------------------------------------------------- */


/* flow --------------- */

#flow {
width:100%;
margin-bottom:30px;
float:left;
}

#flow .title {
width:100%;
padding:45px 0 20px;
background:#00ab7d;
float:left;
position:relative;
}

#flow .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #f1f1f1;
}

#flow .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #007c5b, -1px -1px 0 #007c5b, -1px 1px 0 #007c5b, 1px -1px 0 #007c5b, 0px 1px 0 #007c5b,  0-1px 0 #007c5b, -1px 0 0 #007c5b, 1px 0 0 #007c5b;
}

#flow .block {
width:100%;
padding:80px 20px 0 30px;
float:left;
box-sizing:border-box;
}

#flow .box {
width:100%;
margin-bottom:130px;
float:left;
}

#flow .box:nth-of-type(1),
#flow .box:nth-of-type(6) {
margin-bottom:70px;
}

#flow .box:nth-of-type(8) {
margin-bottom:0;
}

#flow .box .left {
width:50%;
padding-right:30px;
float:left;
box-sizing:border-box;
position:relative;
}

#flow .box .left:before {
width:2px;
height:50px;
background:#17c999;
content:'';
position:absolute;
bottom:-90px;
left:50%;
transform:translate(-50%,0%);
-webkit-transform:translate(-50%,0%);
-moz-transform:translate(-50%,0%);
}

#flow .box:nth-of-type(8) .left:before {
display:none;
}

#flow .box:nth-of-type(1) .left img {
position:absolute;
top:60px;
left:0;
}

#flow .box:nth-of-type(3) .left img,
#flow .box:nth-of-type(7) .left img {
position:absolute;
top:60px;
right:50px;
}

#flow .box:nth-of-type(5) .left img {
position:absolute;
top:60px;
left:20px;
}

#flow .box .left p {
width:100%;
padding:25px 10px;
background:#f5fffc;
font-weight:bold;
display:inline-block;
box-sizing:border-box;
position:relative;
letter-spacing:0.1em;
}

#flow .box .left p:before,
#flow .box .left p:after {
width:96%;
height:2px;
background:#eee;
content:'';
position:absolute;
left:50%;
transform:translate(-50%,0%);
-webkit-transform:translate(-50%,0%);
-moz-transform:translate(-50%,0%);
}

#flow .box .left p:before {
top:-10px;
}

#flow .box .left p:after {
bottom:-10px;
}

#flow .box .left p span:nth-of-type(2):before,
#flow .box .left p span:nth-of-type(2):after {
width:2px;
height:94%;
background:#eee;
content:'';
position:absolute;
top:50%;
transform:translate(0%,-50%);
-webkit-transform:translate(0%,-50%);
-moz-transform:translate(0%,-50%);
}

#flow .box .left p span:nth-of-type(2):before {
left:-10px;
}

#flow .box .left p span:nth-of-type(2):after {
right:-10px;
}

#flow .box .left p span:nth-of-type(1) {
width:86px;
height:86px;
line-height:86px;
background:url('/wp-content/themes/miyakoreform/page/onlinestore/images/flow/flow-icon.webp') no-repeat;
background-size:contain;
font-size:20px;
color:#fff;
content:'';
position:absolute;
top:-50px;
right:-50px;
z-index:1;
}

#flow .box .right {
width:50%;
margin-top:-20px;
padding-left:30px;
text-align:left;
float:left;
box-sizing:border-box;
}

#flow .box .right p {
width:100%;
margin-bottom:20px;
font-weight:bold;
float:left;
}

#flow .box .right p:last-child {
margin-bottom:0;
}

#flow .box .right p span.right-title {
width:100%;
margin-bottom:3px;
color:#d30000;
float:left;
}

#flow .box .right p a {
color:#0060e3;
}

#flow .box .right p a:after {
padding-left:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f35d';
}

#flow .box .right p a:hover {
color:#6885ac;
}

#flow .box .right p span.note {
padding-top:5px;
font-size:13px;
color:#de7c7c;
display:inline-block;
}

#flow .box .right p span.note:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

/* -------------------------------------------------------------- */


/* caution --------------- */

#caution {
width:100%;
margin-bottom:30px;
float:left;
}

#caution .title {
width:100%;
padding:45px 0 20px;
background:#1081d8;
float:left;
position:relative;
}

#caution .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #f1f1f1;
}

#caution .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #0761a6, -1px -1px 0 #0761a6, -1px 1px 0 #0761a6, 1px -1px 0 #0761a6, 0px 1px 0 #0761a6,  0-1px 0 #0761a6, -1px 0 0 #0761a6, 1px 0 0 #0761a6;
}

#caution ul {
width:100%;
padding:30px 20px 0 45px;
text-align:left;
font-weight:bold;
float:left;
box-sizing:border-box;
}

#caution ul li {
width:100%;
margin-bottom:20px;
float:left;
position:relative;
}

#caution ul li:before {
color:#1081d8;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f071';
position:absolute;
top:4px;
left:-25px;
}

#caution ul li:last-child {
margin-bottom:0;
}

#caution ul li span {
font-size:13px;
}

#caution ul li span:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

/* -------------------------------------------------------------- */


/* faq --------------- */

#faq {
width:100%;
margin-bottom:10px;
float:left;
}

#faq .title {
width:100%;
padding:45px 0 20px;
background:#8449b1;
float:left;
position:relative;
}

#faq .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #fff;
}

#faq .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #641d99, -1px -1px 0 #641d99, -1px 1px 0 #641d99, 1px -1px 0 #641d99, 0px 1px 0 #641d99,  0-1px 0 #641d99, -1px 0 0 #641d99, 1px 0 0 #641d99;
}

#faq .block {
width:100%;
padding:30px 20px 20px;
float:left;
box-sizing:border-box;
}

#faq .block .box {
width:100%;
margin-bottom:20px;
text-align:left;
font-weight:bold;
float:left;
}

#faq .block .box:last-child {
margin-bottom:0;
}

#faq .box .question {
width:100%;
padding:20px;
background:#f7f7f7;
font-size:18px;
float:left;
cursor:pointer;
position:relative;
box-sizing:border-box;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
}

#faq .box .question:hover,
#faq .box .question.close {
color:#fff;
background:#545454;
}

#faq .box .question span:before {
padding-right:15px;
font-size:26px;
color:#e10000;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f059';
vertical-align:-0.1em;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
}

#faq .box .question:hover span:before {
color:#fff;
}

#faq .box .question.close span:before {
color:#fff;
}

#faq .box .question:before,
#faq .box .question:after {
width:16px;
height:3px;
background:#8449b1;
position:absolute;
content:'';
top:calc(50% - 2px);
right:20px;
transform:translate(0%, -50%);
-webkit-transform:translate(0%, -50%);
-moz-transform:translate(0%, -50%);
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
}

#faq .box .question:before {
transform:rotate(0deg);
}

#faq .box .question:after {
transform:rotate(90deg);
}

#faq .box .question.close:before {
transform:rotate(45deg);
}

#faq .box .question.close:after {
transform:rotate(-45deg);
}

#faq .box .question:hover:before,
#faq .box .question:hover:after {
background:#fff;
}

#faq .box .question.close:before,
#faq .box .question.close:after {
background:#fff;
}

#faq .box .answer {
width:100%;
margin-top:20px;
padding:40px 50px;
background:#fbf6fe;
color:#787878;
float:right;
box-sizing:border-box;
border-radius:20px;
-webkit-transform:border-radius:20px;
-moz-transform:border-radius:20px;
display:none;
position:relative;
}

#faq .box .answer:before {
width:30px;
height:30px;
background:url('/wp-content/themes/miyakoreform/onlinestore/images/faq.webp') no-repeat;
background-size:contain;
content:'';
position:absolute;
top:14px;
left:14px;
z-index:1;
}

#faq .box .answer p {
margin-bottom:15px;
}

#faq .box .answer p:last-child {
margin-bottom:0;
}

#faq .box .answer p span {
width:100%;
font-size:12px;
display:inline-block;
}

#faq .box .answer p span:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

#faq .box .answer .answer-box {
width:100%;
margin-bottom:30px;
float:left;
}

#faq .box .answer .answer-box:last-child {
margin-bottom:0;
}

#faq .box .answer .answer-box h3 {
width:100%;
margin-bottom:10px;
font-size:17px;
font-weight:bold;
float:left;
}

#faq .box .answer .answer-box h3:before {
padding-right:8px;
font-size:13px;
color:#8449b1;
content:'●';
vertical-align:0.1em;
}

#faq .box .answer .answer-box span.example {
width:100%;
margin-bottom:10px;
color:#d40000;
float:left;
}

#faq .box .answer .answer-box span.example:before,
#faq .box .answer .answer-box span.example:after {
font-family:'Font Awesome 5 Free';
font-weight:900;
}

#faq .box .answer .answer-box span.example:before {
padding-right:5px;
content:'\f053';
}

#faq .box .answer .answer-box span.example:after {
padding-left:5px;
content:'\f054';
}


#faq .box .answer .answer-box ul {
width:100%;
margin-bottom:10px;
float:left;
}

#faq .box .answer .answer-box ul li {
width:100%;
margin-bottom:12px;
padding-bottom:12px;
border-bottom:2px dotted #debbf3;
float:left;
}

#faq .box .answer .answer-box ul li:last-child {
margin-bottom:0;
}

/* -------------------------------------------------------------- */


/* form --------------- */

#form {
width:100%;
margin-bottom:30px;
float:left;
}

#form .title {
width:100%;
padding:45px 0 20px;
background:#f26d00;
float:left;
position:relative;
}

#form .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #fff;
}

#form .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #bc5500, -1px -1px 0 #bc5500, -1px 1px 0 #bc5500, 1px -1px 0 #bc5500, 0px 1px 0 #bc5500,  0-1px 0 #bc5500, -1px 0 0 #bc5500, 1px 0 0 #bc5500;
}

#form .block {
width:100%;
padding:40px 80px;
border:1px solid #d6d6d6;
border-top:0;
float:left;
box-sizing:border-box;
}

#form .block .box {
width:100%;
padding-bottom:30px;
float:left;
}

#form .block .box:last-child {
padding-bottom:0;
}

#form .block .box .left {
width:30%;
padding:10px 20px 10px 10px;
background:#f9f9f9;
text-align:right;
font-weight:bold;
float:left;
box-sizing:border-box;
position:relative;
}

#form .block .box .left:after {
content:'*';
font-size:18px;
color:red;
position:absolute;
top:5px;
right:5px;
}

#form .block .box .differ .left:after,
#form .block .box .left.num:after,
#form .block .box .left.file:after,
#form .block .box .left.content:after {
display:none;
}

#form .block .box .right {
width:70%;
padding:0 0 0 30px;
text-align:left;
float:left;
box-sizing:border-box;
}

#form .block .box .right .error {
width:100%;
margin-top:5px;
text-align:right;
float:left;
}

#form .block .box .right .houszip .error,
#form .block .box .right .address1 .error,
#form .block .box .right .address2 .error {
display:none;
}

#form .block .box .right input[type="text"],
#form .block .box .right input[type="email"],
#form .block .box .right textarea {
width:100%;
padding:13px;
background:#fff;
border:1px solid #d7d7d7;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
box-sizing:border-box;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}

#form .block .box .right input {
background:#fbfbfb;
}

#form .block .box .right input:hover,
#form .block .box .right textarea:hover {
background:#fbfbfb;
}

#form .block .box .right input:focus,
#form .block .box .right textarea:focus {
background:#fbfbfb;
border:1px solid #d7d7d7;
outline:0;
}

#form .block .box .right .file-box input[type="file"] {
display:none!important;
}

#form .block .box .right .file-box label {
margin-right:10px;
padding:10px 20px;
color:#ffffff;
background-color:#a7a7a7;
border:1px solid #fff;
font-size:14px;
font-weight:bold;
cursor:pointer;
color:#fff;
float:left;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}

#form .block .box .right .file-box label:hover {
background:#f26d00;
}

#form .block .box .right .file-box .file-upload {
margin-top:10px;
float:left;
}

#form .block .box .right .file-box .mwform-file-delete {
display:none;
}

#form .block .box .right .file-box .mw-wp-form_image img {
width:200px;
height:auto;
}

#form .block .box .right .zip {
padding-right:5px;
padding-top:11px;
float:left;
}

#form .block .box .right .hyphen {
padding:10px 5px 0;
float:left;
}

#form .block .box .right .houszip {
float:left;
}

#form .block .box .right input#houszip1,
#form .block .box .right input#differzip1 {
width:100px;
float:left;
}

#form .block .box .right input#houszip2,
#form .block .box .right input#differzip2 {
width:200px;
float:left;
}

#form .block .box .right .address1 {
width:26%;
padding-right:10px;
float:left;
box-sizing:border-box;
}

#form .block .box .right .address2 {
width:74%;
float:left;
}

#form .block .box .right .address3 {
width:100%;
margin-top:10px;
float:left;
}

#form .block .box .right .address3 .note {
margin-bottom:0px;
}

#form .block .box .right .note {
width:100%;
margin-top:5px;
font-size:13px;
float:left;
}

#form .block .box .right .note:before {
padding-right:5px;
font-size:11px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

#form .block .box .differ-address {
padding:7px 10px 7px 30px;
background:#fff5ed;
font-weight:bold;
float:right;
cursor:pointer;
position:relative;
}

#form .block .box .differ-address:before,
#form .block .box .differ-address:after {
width:12px;
height:3px;
background:#f26d00;
position:absolute;
top:18px;
left:8px;
content:'';
}

#form .block .box .differ-address:before {
transform:rotate(0deg);
}

#form .block .box .differ-address:after {
transform:rotate(90deg);
}

#form .block .box .differ-address.close:before {
transform:rotate(45deg);
}

#form .block .box .differ-address.close:after {
transform:rotate(-45deg);
}

#form .block .box .differ {
width:100%;
padding:30px 20px;
border:1px solid #f26d00;
text-align:left;
font-size:16px;
float:left;
display:none;
box-sizing:border-box;
}

#form .block .box .differ .box:nth-of-type(2) {
padding-bottom:0;
}

#form .submit-but {
width:100%;
float:left;
}

#form .submit-but input {
width:230px;
margin:0 5px;
padding:10px 0;
background:#303030;
border:0;
font-size:15px;
color:#fff;
cursor:pointer;
outline:none;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
letter-spacing:0.1em;
}

#form .submit-but input:hover {
background:#f26d00;
}

#form input:placeholder-shown,
#form textarea:placeholder-shown {
color:#cdcdcd;
}

#form input::-moz-input-placeholder,
#form textarea::-moz-input-placeholder {
color:#cdcdcd;
}

#form input::-webkit-input-placeholder,
#form textarea::-webkit-input-placeholder {
color:#cdcdcd;
}

/* -------------------------------------------------------------- */


/* line --------------- */

#line {
width:100%;
margin-bottom:50px;
float:left;
}

#line .block {
width:100%;
padding:0 80px;
float:left;
box-sizing:border-box;
}

#line .block .text {
width:100%;
font-weight:bold;
float:left;
}

#line .block .title {
width:100%;
margin:30px 0 40px;
font-size:18px;
font-weight:bold;
float:left;
letter-spacing:0.1em;
position:relative;
}

#line .block .title br {
display:none;
}

#line .block .title span {
position:relative;
}

#line .block .title span:before,
#line .block .title span:after {
content:'';
width:2px;
height:25px;
background:#000;
position:absolute;
}

#line .block .title span:before {
top:0px;
left:-15px;
transform:rotate(-35deg);
}

#line .block .title span:after {
top:0px;
right:-15px;
transform:rotate(35deg);
}

#line .block .but {
width:100%;
margin-bottom:30px;
float:left;
}

#line .block .img {
width:100%;
float:left;
}

#line .block .img img {
width:auto;
max-width:100%;
height:auto;
}

/* -------------------------------------------------------------- */


/* company --------------- */

#company {
width:100%;
margin-bottom:35px;
float:left;
}

#company .title {
width:100%;
padding:45px 0 20px;
background:#d9ce1f;
float:left;
position:relative;
}

#company .title:before {
content:'';
position:absolute;
top:0;
left:50%;
transform:translate(-50%, 0%);
-webkit-transform:translate(-50%, 0%);
-moz-transform:translate(-50%, 0%);
border:50px solid transparent;
border-top:30px solid #fff;
}

#company .title h2 {
width:100%;
margin-bottom:5px;
font-size:36px;
font-weight:bold;
color:#fff;
float:left;
letter-spacing:0.1em;
text-shadow:1px 1px 0 #b4ab21, -1px -1px 0 #b4ab21, -1px 1px 0 #b4ab21, 1px -1px 0 #b4ab21, 0px 1px 0 #b4ab21,  0-1px 0 #b4ab21, -1px 0 0 #b4ab21, 1px 0 0 #b4ab21;
}

#company .block {
width:100%;
padding:35px 160px 0;
float:left;
box-sizing:border-box;
}

#company .block .box {
width:100%;
float:left;
}

#company .block .box .left {
width:30%;
margin:5px 0;
padding:10px 20px 10px 10px;
background:#f9f9f9;
text-align:right;
font-weight:bold;
float:left;
box-sizing:border-box;
}

#company .block .box .right {
width:70%;
margin:5px 0;
padding:10px 10px 10px 40px;
text-align:left;
font-weight:bold;
float:left;
box-sizing:border-box;
position:relative;
}

#company .block .box .right:before {
width:2px;
height:100%;
background:#a6a6a6;
content:'';
position:absolute;
top:0;
left:15px;
}

#company .block .box .right span {
font-size:13px;
}

#company .block .box .right span:before {
padding-right:5px;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f069';
}

/* -------------------------------------------------------------- */


/* complete --------------- */

#complete {
width:100%;
margin:50px 0;
padding:30px;
background:#f9f9f9;
font-weight:bold;
float:left;
box-sizing:border-box;
}

#complete p:nth-of-type(1) {
margin-bottom:20px;
font-size:24px;
}

#complete .link {
width:100%;
margin-top:40px;
float:left;
}

#complete .link a {
padding:10px 20px;
background:#000;
color:#fff;
display:inline-block;
}

/* -------------------------------------------------------------- */


/* footer --------------- */

footer {
width:100%;
padding:20px 0;
background:#000;
color:#fff;
float:left;
}

footer a {
color:#fff;
}

#top-scroll {
font-size:12px;
position:fixed;
bottom:100px;
right:-20px;
z-index:100;
display:none;
transform:rotate(90deg);
letter-spacing:0.1em;
}

#top-scroll a {
color:#ffa053;
position:relative;
}

#top-scroll a:before,
#top-scroll a:after {
width:20px;
height:1px;
content:'';
display:block;
background:#ffa053;
position:absolute;
}

#top-scroll a:before {
width:30px;
top:8px;
left:-37px;
}

#top-scroll a:after {
width:20px;
bottom:8px;
right:-25px;
}

#top-scroll a span {
position:absolute;
top:8px;
left:-38px;
transform:rotate(-90deg);
}

#top-scroll a span:before,
#top-scroll a span:after {
width:1px;
height:12px;
content:'';
display:block;
background:#ffa053;
position:absolute;
top:0;
}

#top-scroll a span:before {
right:-4px;
transform:rotate(-35deg);
}

#top-scroll a span:after {
right:4px;
transform:rotate(35deg);
}

/* -------------------------------------------------------------- */


/**************************************************
***************************************************
width:[1000px] or less.
***************************************************
**************************************************/

@media screen and (max-width:1000px) {

#wrap {
width:100%;
float:left;
}

a[href^="tel:"] {
pointer-events:auto;
}

header #logo {
width:100%;
}

#reason {
padding:40px 0 30px;
}

#reason .img {
margin-bottom:30px;
}

#reason .note p {
width:100%;
line-height:22px;
padding:0 10px;
font-size:13px;
box-sizing:border-box;
}

#item .title {
padding:30px 0 15px;
}

#item .title:before {
border:30px solid transparent;
border-top:20px solid #fff;
}

#item .title h2 {
font-size:22px;
}

#item .title span {
font-size:13px;
letter-spacing:0em;
}

#item .block {
padding:20px 10px;
}

#item .block .list {
margin-bottom:30px;
}

#flow .title {
padding:30px 0 15px;
}

#flow .title:before {
border:30px solid transparent;
border-top:20px solid #f1f1f1;
}

#flow .title h2 {
font-size:22px;
}

#caution .title {
padding:30px 0 15px;
}

#caution .title:before {
border:30px solid transparent;
border-top:20px solid #f1f1f1;
}

#caution .title h2 {
font-size:22px;
}

#faq .title {
padding:30px 0 15px;
}

#faq .title:before {
border:30px solid transparent;
border-top:20px solid #fff;
}

#faq .title h2 {
font-size:22px;
}

#faq .block {
padding:20px 15px;
}

#faq .block .box {
margin-bottom:10px;
font-size:13px;
}

#faq .box .question {
padding:20px 10px;
font-size:15px;
}

#faq .box .question span:before {
padding-right:10px;
font-size:22px;
}

#faq .box .question:before,
#faq .box .question:after {
width:14px;
right:15px;
}

#faq .box .answer {
margin-top:10px;
padding:20px;
}

#faq .box .answer:before {
width:20px;
height:20px;
top:4px;
left:4px;
}

#faq .box .answer .answer-box h3 {
font-size:15px;
}

#form .title {
padding:30px 0 15px;
}

#form .title:before {
border:30px solid transparent;
border-top:20px solid #fff;
}

#form .title h2 {
font-size:22px;
}

#form .block {
padding:30px 20px;
}

#company .title {
padding:30px 0 15px;
}

#company .title:before {
border:30px solid transparent;
border-top:20px solid #fff;
}

#company .title h2 {
font-size:22px;
}

footer {
padding:10px 0;
font-size:11px;
}

#top-scroll {
bottom:70px;
right:-40px;
}

#top-scroll a:before {
top:7px;
}

#top-scroll a:after,
#top-scroll a span:after {
display:none;
}

#global,
#global span {
display:inline-block;
box-sizing:border-box;
transition:0.4s;
-webkit-transition:0.4s;
-moz-transition:0.4s;
}

#global {
width:36px;
height:29px;
position:fixed;
top:30px;
right:10px;
cursor:pointer;
z-index:1001;
}

#global span {
position:absolute;
left:0;
width:100%;
height:3px;
background-color:#000;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}

.nav-scroll span {
background-color:#e66700!important;
}

#global span:nth-of-type(1) {
top: 0;
}

#global span:nth-of-type(2) {
top:13px;
}

#global span:nth-of-type(3) {
bottom:0;
}

#global.active span {
background-color:#2c2c2c!important;
}

#global.active p {
color:#2c2c2c;
}

#global.active span:nth-of-type(1) {
transform:translateY(13px) rotate(-45deg);
-webkit-transform:translateY(13px) rotate(-45deg);
-moz-transform:translateY(13px) rotate(-45deg);
}

#global.active span:nth-of-type(2) {
left:60%;
opacity:0;
animation:menu-anima 0.8s forwards;
-webkit-animation:menu-anima 0.8s forwards;
-moz-animation:menu-anima 0.8s forwards;
}

@keyframes menu-anima {
  100% {
    height:0;
  }
}

@-webkit-keyframes menu-anima {
  100% {
    height:0;
  }
}

@-moz-keyframes menu-anima {
  100% {
    height:0;
  }
}

#global.active span:nth-of-type(3) {
transform:translateY(-13px) rotate(45deg);
-webkit-transform:translateY(-13px) rotate(45deg);
-moz-transform:translateY(-13px) rotate(45deg);
}

#global-nav {
width:100%;
height:100%;
padding:100px 0 0;
background:rgba(255,255,255,0.9);
display:none;
position:fixed;
top:0;
left:0;
z-index:1000;
text-align:center;
box-sizing:border-box;
overflow-y:auto;
}

header nav {
width:100%;
padding-top:0;
padding-left:10px;
padding-right:10px;
font-size:17px;
float:left;
box-sizing:border-box;
}

header nav li {
width:100%;
margin-bottom:2px;
padding:0;
float:left;
}

header nav li a {
width:100%;
padding:15px 0;
background:#000;
color:#fff;
float:left;
position:relative;
}

header nav li a:before,
header nav li a:after {
width:2px;
height:100%;
background:#fff;
content:'';
display:block;
position:absolute;
top:0;
}

header nav li a:before {
left:10px;
}

header nav li a:after {
right:10px;
}

header #tel {
width:100%;
padding-top:30px;
text-align:center;
font-size:16px;
}

header #tel span {
width:100%;
font-size:28px;
float:left;
}

}


/**************************************************
***************************************************
width:[680px] or less.
***************************************************
**************************************************/

@media screen and (max-width:680px) {

#visual,
#reason .img {
overflow:hidden;
position:relative;
}

#visual:before {
content:'';
display:block;
padding-top:120%;
}

#reason .img:before {
content:'';
display:block;
padding-top:70%;
}

#visual img,
#reason .img img {
position:absolute;
top:0;
left:0;
width:100%;
height:auto;
}

.pc {
display:none;
}

.sp {
display:block;
}

.form-scroll {
padding:30px 0;
}

.form-scroll a {
width:90%;
padding:20px;
}

#caution ul {
padding:20px 15px 0 45px;
font-size:14px;
}

#caution ul li:before {
color:#1081d8;
font-family:'Font Awesome 5 Free';
font-weight:900;
content:'\f071';
position:absolute;
top:3px;
left:-30px;
}

#form .block .box .left {
width:100%;
margin-bottom:5px;
padding:10px 10px 10px 20px;
text-align:left;
}

#form .block .box .left:after {
left:5px;
}

#form .block .box .right {
width:100%;
padding:0;
}

#form .block .box .right input#houszip1,
#form .block .box .right input#differzip1 {
width:90px;
float:left;
}

#form .block .box .right input#houszip2,
#form .block .box .right input#differzip2 {
width:140px;
float:left;
}

#form .block .box .right .note {
font-size:12px;
}

#form .block .box .differ {
padding:20px;
}

#form .submit-but input {
height:50px;
line-height:50px;
padding:0;
}

#form .block .box .right .file-box label {
padding:5px 20px;
}

#form .block .box .right .file-box .file-upload {
margin-top:5px;
}

#complete {
margin:0 0 30px;
padding:20px 10px;
font-size:13px;
}

#complete p:nth-of-type(1) {
font-size:20px;
}

#complete .link {
margin-top:30px;
}

#complete .link a {
padding:10px 30px;
}

#item .block .box .boxes .off {
width:60px;
height:60px;
line-height:14px;
padding-top:17px;
font-size:11px;
top:-10px;
left:-10px;
}

#item .block .box .boxes .off span {
padding-right:1px;
font-size:15px;
}

}


/**************************************************
***************************************************
width:[762px] or less.
***************************************************
**************************************************/

@media screen and (max-width:762px) {

#reason h1 {
line-height:42px;
margin-bottom:30px;
font-size:19px;
}

#reason h1 br {
display:block;
}

#reason h1 span.dot {
padding:0;
font-size:28px;
}

#reason h1 span.h1:before,
#reason h1 span.h1:after {
height:50px;
background:#bebebe;
}

#reason h1 span.h1:before {
top:40px;
left:-5px;
}

#reason h1 span.h1:after {
top:40px;
right:-5px;
}

#reason h1 span.h1 {
display:inline-block;
}

#line {
margin-bottom:30px;
}

#line .block {
padding:0 15px;
}

#line .block .text {
font-size:13px;
}

#line .block .title {
margin:30px 0;
font-size:16px;
}

#line .block .title br {
display:block;
}

#line .block .title span {
display:inline-block;
}

#company .block {
padding:35px 15px 0;
font-size:12px;
}

#company .block .box .left {
padding:10px 5px;
}

#company .block .box .right {
padding:10px 5px 10px 30px;
}

}


/**************************************************
***************************************************
width:[900px] or less.
***************************************************
**************************************************/

@media screen and (max-width:900px) {

#item .block .list {
margin-bottom:20px;
}

#item h3 {
margin-bottom:10px;
font-size:18px;
}

#item .block .box .boxes {
width:48.5%;
height:auto;
margin-bottom:10px;
}

#item .block .box .boxes img {
width:100%;
height:auto;
}

#item .block .box .boxes h4 {
font-size:11px;
}

#item .block .note {
margin-top:10px;
font-size:12px;
}

#flow .block {
padding:60px 15px 0 15px;
}

#flow .box .left {
width:100%;
margin-bottom:30px;
padding-right:0;
}

#flow .box .left:before {
display:none;
}

#flow .box .left p span:nth-of-type(1) {
width:60px;
height:60px;
line-height:60px;
font-size:16px;
top:-40px;
right:auto;
left:10px;
}

#flow .box,
#flow .box:nth-of-type(1),
#flow .box:nth-of-type(6) {
margin-bottom:70px;
}

#flow .box .left img {
display:none;
}

#flow .box .right {
width:100%;
margin-top:0;
padding-left:0;
font-size:14px;
position:relative;
}

#flow .box .right:before {
width:2px;
height:30px;
background:#17c999;
content:'';
position:absolute;
bottom:-45px;
left:50%;
transform:translate(-50%,0%);
-webkit-transform:translate(-50%,0%);
-moz-transform:translate(-50%,0%);
}

#flow .box:nth-of-type(8) .right:before {
display:none;
}

}