.youtube iframe {
width: 1000px;
height: 600px;
margin: 1rem;
padding: 1rem;
display: block;
margin-left: auto;
margin-right: auto
}

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

html {
font-size: 62.5%;
/* sets the base font to 10px for easier math */
}

body {
font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-style: normal;
font-weight: 300;
font-size: 1.6rem;
color: #444444;
width: 100%;
line-height: 1.44;
letter-spacing: 0.01em;
}

a,
a:hover,
a:visited {
color: #333;
}

a {
outline: none;
}

a:focus {
outline: none;
}

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

button,
input[type="submit"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding: 0;
border: none;
outline: none;
background: transparent;
}

button,
input,
select,
textarea {
font-family: inherit;
font-size: 100%;
}


.pc {
display: inherit;
}

.sp {
display: none;
}
.sp2 {
display: none;
}

.mobile {
display: none;
}


#main {
width: 100%;
height: auto;
overflow: hidden;
margin: 0;
padding: 0;
}

.top-title {
width: 100%;
background: url(images/bg.svg) center center no-repeat;
background-size: cover;
}

.title-wrap {
max-width: 1240px;
padding: 0 20px;
margin: 0 auto;
}

.top-title-img {
vertical-align: top;
width: 100%;
}

.raitennsezuni_top {
width: 100%;
background-color: #f5f5f5;
padding: 4rem 0;
}
.raitennsezuni_top .img_box {
position: relative;
width: 100%;
height: calc(100vw - 700px);
min-height: 190px;
max-height: 350px;
overflow: hidden;
}
.raitennsezuni_top img{
position: absolute;
left: 0;
width: 100vw;
height: 100%;
min-height: 190px;
object-fit: cover;
}
.img_box p {
width: 100%;
height: 100%;
position: absolute;
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
font-size: 6.4rem;
font-weight: bold;
margin: 0 auto;
text-align: center;
color: #ffffff;
text-shadow: 0 0 8px #9c9c9c;
}
.online-step-area {
padding: 6.4rem 0;
}

.flow-wrap {
max-width: calc(1200px + 6%);
padding: 0 3%;
margin: 0 auto;
}

.online-session-main-title {
position: relative;
padding-bottom: 0.5em;
margin-bottom: 4rem;
font-weight: bold;
text-align: center;
}

.online-session-main-title::before,
.online-session-main-title::after {
content: "";
position: absolute;
right: 2em;
left: 0;
bottom: 0;
width: 2em;
height: 5px;
margin: 0 auto;
background-color: #6BB09D;
}

.online-session-main-title::before {
background-color: #F7F0B6;
left: 2em;
width: 4em;
}

.step-top-text {
font-size: 2rem;
line-height: 1.8;
text-align: center;
}

.step-top-text p {
text-align: justify;
word-break: break-all;
}

.online-step-title-area {
margin-bottom: 5rem;
}

/*---- totonoダウンロード ----*/
.totonodr-box {
display: flex;
justify-content: center;
align-items: center;
width: calc(60% - 2rem);
max-width: 600px;
min-width: 470px;
margin: 0 auto;
padding: 0 0 7rem;
}
.totonodr-box a {
margin: 0 auto;
}
.totonodr img {
width: 100%;
}

/*---- ステップ ----*/

.step-wrap {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
width: 100%;
}

.online-step {
width: 95%;
height: 110px;
position: relative;
margin: 1rem auto;
padding: 1rem 1rem 1rem 2rem;
background-color: #6BB09D;
color: #ffffff;
clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%);
}

.online-step-pff {
width: 18%;
position: relative;
padding: 1rem 1rem 1rem 2rem;
background-color: #136CBC;
color: #ffffff;
clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%);
}

.online-step-number {
display: block;
padding-bottom: 0.5rem;
font-size: 2rem;
}

.online-step-text {
margin-bottom: 1rem;
font-size: 1.7rem;
color: #ffffff;
}

.online-session-main .top-title-text {
margin-bottom: 30px;
}

.step-block {
display: flex;
align-items: flex-start;
justify-content: space-between;
padding: 1rem 0;
margin: 1rem auto 10rem;
}

.content {
width: 100%;
margin: 0 auto;
}

.content01 .text-box {
width: 100%;
width: 1200px;
margin: 4rem auto;
line-height: 3rem;
font-size: 1.8rem;
}

.content02 {
background-color: rgba(227, 232, 158, 0.2);
}

.content02 h2 {
width: 100%;
height: auto;
text-align: center;
font-size: 4rem;
margin: 4rem auto;
color: #6BB09D;
}

.content02 .outi-step {
display: flex;
align-items: center;
width: 1200px;
height: auto;
margin: 0 auto;
padding: 4rem 0;
}

.content02 .outi-step02 {
background-image: url("images/heyakarcyan.png");
background-repeat: no-repeat;
background-position: right bottom;
background-size: 26% auto;
position: relative;
}

.content02 .outi-step02 .fukidashi-box {
position: absolute;
top: 10%;
right: 19%;
width: 16rem;
height: auto
}

.content02 .outi-step02 .fukidashi {
display: flex;
align-items: center;
justify-content: center;
width: 14rem;
height: 14rem;
border-radius: 8rem;
background-color: #6BB09D;
padding: 2rem;
color: #ffffff;
position: relative;
margin-left: 25px;
}

.content02 .outi-step02 .fukidashi::before {
content: "";
position: absolute;
bottom: -1px;
right: -1px;
margin-top: -15px;
border: 12px solid transparent;
border-left: 30px solid #6BB09D;
z-index: 0;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

.content02 .outi-step .step-box {
width: 15%;
height: auto;
overflow: hidden;
text-align: center;
}

.content02 .outi-step .step-box img {
width: 100%;
height: auto;
}

.content02 .outi-step .arrow-box {
width: 10%;
height: auto;
text-align: center;
}

.content02 .outi-step .arrow-box img {
width: 80%;
height: auto;
}

.content03 h2 {
width: 100%;
height: auto;
text-align: center;
font-size: 4rem;
margin: 0 auto;
margin-bottom: 0;
color: #ff6c1b;
}

.content03 .youtube-box {
width: 71%;
max-width: 1060px;
margin: 0 auto;
margin-bottom: 8rem;
}

.content03 .youtube-box .youtube {
width: 100%;
padding-top: 57.1%;
position: relative;
}

.content03 .youtube-box .youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}

.content03 .flow-box {
width: 100%;
height: auto;
}

.content03 .flow-box01 {
background-color: rgb(255 236 175 / 30%);
position: relative;
}

.content03 .flow-box01::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid rgb(255 236 175 / 30%);
z-index: 1;
}

.content03 .flow-box .flow-content {
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 4rem 8rem;
}

.content03 .flow-title-box {
width: 100%;
height: auto;
overflow: hidden;
}

.content03 .flow-title-box .step-mark {
display: block;
align-items: center;
justify-content: center;
text-align: center;
font-size: 2.25rem;
font-family: 'Teko', sans-serif;
font-weight: bold;
border-bottom: solid 4px #6BB09D;
float: left;
margin: 2.2rem 2rem 0 0;
line-height: 0.6rem;
/* width: 7rem;
height: 10rem;
border-radius: 5rem;
color: #ffffff;
background-color: #6BB09D; */
}

.content03 .flow-title-box .step-mark .p {
vertical-align: -1.5rem;
}

.content03 .flow-title-box .step-mark span {
font-size: 5rem;
line-height: 0.7;
vertical-align: -1.5rem;
}

.content03 .flow-title-box h3 {
width: 80%;
height: auto;
font-size: 3.4rem;
line-height: 10rem;
float: left;
}

.content03 .flow-title-box h3 span {
font-size: 2.2rem;
margin-left: 1rem;
}

.content03 .flow-box .flow-content .flow-text {
width: 100%;
min-height: 312px;
padding-right: 50%;
background-repeat: no-repeat;
background-position: right top;
background-size: 45% auto;
font-size: 1.8rem;
line-height: 2;
}

.content03 .flow-text span {
font-weight: bold;
color: #ff6c1b;
}

.content03 .flow-box01 .flow-content .flow-text {
background-image: url(images/flow01_back.png);
}

.content03 .flow-content .flow-text a.search-line {
display: block;
width: max-content;
padding: 1rem 3rem;
font-size: 2.4rem;
font-weight: bold;
color: #ffffff;
background-color: #6BB09D;
border-radius: 0.5rem;
text-decoration: none;
margin: 4rem 0;
margin-top: 2rem;
}

.content03 .flow-box02 {
background-color: rgba(227, 232, 158, 0);
position: relative;
}

.content03 .flow-box02::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid #ffffff;
z-index: 1;
}

.content03 .flow-box02 .flow-text .equipment {
width: 100%;
height: auto;
margin-top: 2rem;
}

.content03 .flow-box02 .flow-text .equipment span {
display: block;
width: 100%;
font-size: 2rem;
font-weight: bold;
color: #ff6c1b;
margin-bottom: 1rem;
}

.content03 .flow-box02 .flow-content .flow-text {
background-image: url(images/flow02_back.png);
}

.content03 .flow-box03 {
background-color: rgb(255 236 175 / 30%);
position: relative;
}

.content03 .flow-box03::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid rgb(255 236 175 / 30%);
z-index: 1;
}

.content03 .flow-box03 .flow-content .flow-text {
background-image: url(images/flow03_back.png);
}

.content03 .flow-box03 .flow-text span.sub-title {
display: block;
width: 100%;
height: auto;
font-size: 2rem;
font-weight: bold;
margin-top: 0.5rem;
line-height: 3rem;
}

.content03 .flow-box03 .flow-text .naiken-text {
width: 100%;
height: auto;
min-height: 300px;
padding-right: 45%;
margin-top: 1rem;
background-repeat: no-repeat;
background-position: right top;
background-size: 40% auto;
}

.content03 .flow-box03 .flow-text .naiken-text h4 {
width: max-content;
font-size: 2.6rem;
background-color: #6BB09D;
color: #ffffff;
padding: 0.5rem 2rem;
margin-bottom: 1rem;
border-radius: 0.5rem;
}

.button-title02 {
width: 100%;
padding-bottom: 2rem;
}

.button-title02 span {
display: block;
width: 100%;
height: auto;
color: #5baff5;
font-size: 2rem;
font-weight: bold;
margin-top: 2rem;
}

.button-title02 a {
display: block;
width: max-content;
padding: 1rem 3rem;
font-size: 2.4rem;
font-weight: bold;
color: #ffffff;
background-color: #5baff5;
border-radius: 0.5rem;
text-decoration: none;
margin-top: 2rem;
}

.content03 .flow-box04 {
background-color: rgba(227, 232, 158, 0);
position: relative;
}

.content03 .flow-box04::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid #ffffff;
z-index: 1;
}

.content03 .flow-box04 .flow-content .flow-text {
background-image: url(images/flow04_back.png);
}

.content03 .flow-box05 {
background-color: rgb(255 236 175 / 30%);
position: relative;
}

/* .content03 .flow-box05::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid rgb(255 236 175 / 30%);
z-index: 1;
} */

.content03 .flow-box05 .flow-content .flow-text {
background-image: url(images/flow05_back.png);
}

.content03 .flow-box06 {
background-color: rgba(227, 232, 158, 0);
position: relative;
}

.content03 .flow-box06::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -120px;
border: 120px solid transparent;
border-top: 60px solid #ffffff;
z-index: 1;
}

.content03 .flow-box06 .flow-content .flow-text {
background-image: url(images/flow06_back.png);
}

.content03 .flow-box07 {
background-color: rgb(255 236 175 / 30%);
position: relative;
}

.content03 .flow-box07 .flow-content .flow-text {
background-image: url(images/flow07_back.png);
}

.content04 .contact-box {
width: 100%;
height: auto;
margin: 8rem auto;
padding: 0 8rem;
text-align: center;
font-size: 1.8rem;
}

.content04 .contact-box a {
display: block;
width: max-content;
height: auto;
margin: 0 auto;
margin-top: 3rem;
padding: 2rem 5rem;
font-size: 3.2rem;
font-weight: bold;
color: #ffffff;
background-color: #6BB09D;
border-radius: 1rem;
text-align: center;
text-decoration: none;
}

/* no-visit */

.formError {
margin-top: -55px !important;
}

.formError .formErrorContent {
font-size: 1.6rem !important;
}

#no-visit-contact * {
box-sizing: border-box;
}

#no-visit-contact #main {
width: 1200px;
height: auto;
overflow: hidden;
float: none;
margin: 0 auto;
font-size: 1.6rem;
}

#no-visit-contact :focus {
outline: none;
}

#no-visit-contact .breadcrumb {
margin-top: 1em;
}

#no-visit-contact #content01 {
width: 100%;
height: auto;
overflow: hidden;
margin: 0 auto;
}

#no-visit-contact .content-title h2 {
font-size: 3rem;
text-align: center;
color: #ff6c1b;
margin: 4rem auto;
}

#no-visit-contact .step-box {
width: 100%;
height: auto;
overflow: hidden;
margin-bottom: 40px;
}

#no-visit-contact .step-box ul,
#no-visit-contact .step-box li {
list-style: none;
}

#no-visit-contact .step-box li {
display: flex;
justify-content: center;
align-items: center;
width: 30%;
height: 6rem;
float: left;
position: relative;
color: #999999;
background-color: #f1f1f1;
border-radius: 7px;
font-size: 1.8rem;
font-weight: bold;
margin-right: 5%;
z-index: -1;
}

#no-visit-contact .step-box li span {
font-size: 1.8rem;
margin-right: 1.2rem;
}

#no-visit-contact .step-box li::after {
content: "";
width: 0;
height: 0;
border-top: 16px solid transparent;
border-left: 16px solid #f1f1f1;
border-bottom: 16px solid transparent;
border-right: 16px solid transparent;
position: absolute;
right: -31px;
top: 50%;
margin-top: -16px;
}

#no-visit-contact .step-box .active {
color: #ffffff;
background-color: #ff6c1b;
}

#no-visit-contact .step-box .active::after {
content: "";
width: 0;
height: 0;
border-top: 16px solid transparent;
border-left: 16px solid #ff6c1b;
border-bottom: 16px solid transparent;
border-right: 16px solid transparent;
position: absolute;
right: -31px;
top: 50%;
margin-top: -16px;
}

#no-visit-contact .step-box li.step03 {
margin-right: 0;
}

#no-visit-contact .form-box {
width: 100%;
height: auto;
overflow: hidden;
}

#no-visit-contact #formWrap {
width: 100%;
height: auto;
overflow: hidden;
font-size: 1.6rem;
}

#no-visit-contact #formWrap dl {
display: block;
width: 100%;
height: auto;
overflow: hidden;
box-sizing: border-box;
margin: 0 auto;
}

#no-visit-contact #formWrap .form-item {
width: 100%;
height: auto;
overflow: hidden;
border-bottom: 2px solid #efefef;
padding: 2rem 0;
font-size: 1.8rem;
}

#no-visit-contact #formWrap dt {
display: block;
width: 35%;
height: 100%;
overflow: hidden;
box-sizing: border-box;
float: left;
padding: 1em;
line-height: 2.8em;
color: #ff6c1b;
}

#no-visit-contact #formWrap dt::before {
display: inline-block;
width: 10px;
height: 2rem;
vertical-align: middle;
content: "";
margin-right: 1rem;
border-radius: 5px;
background-color: #ff6c1b;
}

#no-visit-contact #formWrap dt span {
display: inline-block;
vertical-align: middle;
width: auto;
height: auto;
padding: 0.5rem;
font-size: 1.6rem;
color: #ffffff;
background-color: #ff6c1b;
border-radius: 5px;
margin-left: 1.6rem;
line-height: 1.6rem;
}

#no-visit-contact #formWrap dd {
display: block;
width: 65%;
height: 100%;
overflow: hidden;
box-sizing: border-box;
float: left;
padding: 1em;
line-height: 2.8em;
background: #ffffff;
}

#no-visit-contact #formWrap form,
#no-visit-contact #formWrap form input,
#no-visit-contact #formWrap form select,
#no-visit-contact #formWrap form textarea {
font-size: 1.6rem;
}

#no-visit-contact #formWrap form select {
width: 35%;
padding: 1rem;
border: 1px solid #e7e7e7;
background-color: #ffffff;
float: left;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/1697571/chevron-down.svg) no-repeat right;
}

#no-visit-contact #formWrap .from-box {
width: 10%;
height: auto;
font-size: 2rem;
padding: 1rem;
text-align: center;
float: left;
}

#no-visit-contact #formWrap form input[type="text"] {
width: 80%;
padding: 1rem;
border: 1px solid #e7e7e7;
}

#no-visit-contact #formWrap form textarea {
width: 80%;
height: 20rem;
padding: 1rem;
border: 1px solid #e7e7e7;
}

#no-visit-contact .privacy .privacy-title {
width: 100%;
height: auto;
padding: 0.7rem 2rem;
color: #ffffff;
background-color: #ff6c1b;
font-size: 2rem;
font-weight: bold;
border-radius: 5px;
}

#no-visit-contact .privacy .privacy-area {
width: 100%;
height: 250px;
overflow: auto;
font-size: 1.6rem;
margin-top: 20px;
padding: 1.4rem;
border: 1px solid #e7e7e7;
}

#no-visit-contact .privacy .privacy-area h3 {
color: #ff6c1b;
text-align: center;
}

#no-visit-contact .privacy .privacy-area .ceo-box {
width: 100%;
height: auto;
margin: 1.4rem 0;
text-align: right;
}

#no-visit-contact .privacy .privacy-area h4 {
margin: 1.4em 0;
}

#no-visit-contact .privacy .privacy-area .kaiji-box {
width: 100%;
height: auto;
text-align: center;
margin: 1.4em 0;
}

#no-visit-contact .privacy .privacy-area ol {
padding-left: 2em;
}

#no-visit-contact #formWrap form .button-box {
width: 680px;
height: auto;
overflow: hidden;
margin-left: auto;
margin-right: auto;
margin-top: 80px;
margin-bottom: 80px;
}

#no-visit-contact #formWrap form .button-box input {
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
width: 300px;
height: 60px;
box-sizing: border-box;
background-color: #ffffff;
font-size: 1.2em;
color: #ff6c1b;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
border: solid 1px #ff6c1b;
margin: 0;
}

#no-visit-contact #formWrap form .button-box input[type="submit"] {
color: #ffffff;
background-color: #ff6c1b;
float: left;
}

#no-visit-contact #formWrap form .button-box input[type="reset"] {
float: right;
}

#no-visit-contact .form-item03 input {
margin-bottom: 2rem;
}

#no-visit-contact #formWrap .raiten-bi-box select {
float: none;
margin-bottom: 20px;
}

#no-visit-contact #formWrap form #form-raiten-bi input {
width: 25%;
}

#no-visit-contact #formWrap form .select-time,
#no-visit-contact #formWrap form .select-minute {
width: 50%;
height: auto;
float: left;
}

#no-visit-contact #formWrap form .select-time select,
#no-visit-contact #formWrap form .select-minute select {
width: 60%;
}



#no-visit-contact #formWrap {
width: 100%;
height: auto;
overflow: hidden;
margin: 40px autp;
}

#no-visit-contact #formWrap table {
width: 100%;
}

#no-visit-contact #formWrap table tr {
display: block;
width: 100%;
height: auto;
overflow: hidden;
border-bottom: 2px solid #efefef;
}

#no-visit-contact #formWrap table th {
display: block;
width: 35%;
height: 100%;
overflow: hidden;
box-sizing: border-box;
float: left;
padding: 1em;
line-height: 2.8em;
color: #ff6c1b;
text-align: left;
border: none;
}

#no-visit-contact #formWrap table td {
display: block;
width: 65%;
height: 100%;
overflow: hidden;
box-sizing: border-box;
float: left;
padding: 1em;
line-height: 2em;
background: #ffffff;
}

#no-visit-contact #formWrap input[type="submit"] {
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
width: 300px;
height: 60px;
box-sizing: border-box;
background-color: #ff6c1b;
font-size: 1.2em;
color: #ffffff;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
border: solid 1px #ff6c1b;
margin: 80px 20px;
}

#no-visit-contact #formWrap input[type="button"] {
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
width: 300px;
height: 60px;
box-sizing: border-box;
background-color: #ffffff;
font-size: 1.2em;
color: #ff6c1b;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
border: solid 1px #ff6c1b;
margin: 80px 20px;
}



#no-visit-contact #content01 .thanks-box {
font-size: 1.6rem;
margin-bottom: 80px;
}

#no-visit-contact #content01 .back-box a {
display: block;
display: flex;
justify-content: center;
align-items: center;
width: 30%;
height: 5rem;
color: #ffffff;
background-color: #ff6c1b;
border-radius: 7px;
font-size: 1.8rem;
font-weight: bold;
margin: 80px auto;
text-decoration: none;
}



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

*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}


input[type="submit"],
input[type="reset"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}

input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}

.pc {
display: none;
}

.sp {
display: block;
}

.mobile {
display: inherit;
}

/*-TOP-*/
.img_box p {
font-size: 4rem;
}
/*-ステップ-*/
.online-step-area {
padding: 3rem 0;
}

.online-step-title-area {
margin-bottom: 3rem;
}

.online-session-main-title {
margin-bottom: 2rem;
}

/*---- totonoダウンロード ----*/
.totonodr-box {
display: block;
width: 100%;
min-width: 150px;
padding: 0 0 3rem;
}
.totonodr-box a {
width: 100%;
}
.totonodr img {
display: flex;
justify-content: center;
width: 80%;
max-width: 240px;
margin: 0 auto 1.5rem;
}


.step-top-text {
font-size: 1.5rem;
}

.step-wrap {
display: flex;
flex-direction: column;
align-items: center;
}

.online-step {
width: 80%;
height: auto;
position: relative;
padding: 0;
margin-bottom: 1rem;
clip-path: polygon(0% 0%, 100% 0%, 100% 80%, 50% 100%, 50% 100%,
0% 80%);
text-align: center;
}

.online-step-pff {
width: 80%;
position: relative;
padding: 0;
margin-bottom: 1rem;
background-color: #136CBC;
color: #ffffff;
clip-path: polygon(0% 0%, 100% 0%, 100% 80%, 50% 100%, 50% 100%,
0% 80%);
text-align: center;
}

.online-step-number {
margin: 0.5rem auto;
font-size: 1.6rem;
}

.online-step-text {
margin-bottom: 2rem;
font-size: 1.4rem;
}

.step-block {
display: block;
}

.title-wrap {
padding: 0.5rem 0;
}

.content {
width: 100%;
}

.content-button .button-box {
width: 94%;
margin: 2rem auto;
}

.content-button .button-box span {
font-size: 2rem;
}

.content-button .button-box a {
width: 100%;
font-size: 2rem;
padding: 1.5rem;
margin: 2rem auto;
}

.content h2 {
width: 94%;
height: auto;
font-size: 2.4rem;
margin: 2rem auto;
}

.content01 .text-box {
width: 94%;
margin: 1rem auto;
font-size: inherit;
text-align: left;
}

.content02 .outi-step {
width: 94%;
margin: 0 auto;
padding: 2rem 0;
}

.content02 .outi-step .step-box {
width: 40%;
}

.content02 .outi-step .arrow-box {
width: 10%;
}

.content02 .outi-step .slant img {
transform: rotate(135deg);
}

.content02 .outi-step02 {
background-size: 45% auto;
}

.content02 .outi-step02 .fukidashi-box {
right: 12%
}

.content02 .outi-step02 .fukidashi {
width: 10rem;
height: 10rem;
border-radius: 5rem;
font-size: 1.4rem;
}

.content02 .outi-step02 .fukidashi::before {
border: 5px solid transparent;
border-left: 20px solid #6BB09D;
}

.content03 .youtube-box {
width: 100%;
height: auto;
}

.content03 .youtube-box .youtube {
padding-top: 56.7%;
}

.content03 .flow-box .flow-content {
width: 94%;
padding: 4rem 0;
}

.content03 .flow-title-box .step-mark {
float: none;
margin: 2rem auto 0;
}

.content03 .flow-title-box h3 {
width: 100%;
float: none;
text-align: center;
line-height: inherit;
margin-top: 1.5rem;
}

.content03 .flow-box03 .flow-text span.sub-title {
padding-left: 0;
}

.content03 .flow-box03 .flow-text .naiken-text h4 {
margin-left: auto;
margin-right: auto;
}

.content03 .flow-title-box h3 span {
display: block;
width: 100%;
height: auto;
text-align: center;
margin: 1rem auto;
}

.content03 .flow-box .flow-content .flow-text {
height: auto;
min-height: 0;
padding: 0;
padding-bottom: 70%;
background-position: center bottom;
background-size: 100% auto;
}

.content03 .flow-content .flow-text a.search-line {
width: 100%;
padding: 1rem;
text-align: center;
font-size: 2rem;
margin: 2rem auto;
}

.content03 .flow-box02 .flow-text .equipment {
padding-left: 0;
}

.content03 .flow-box03 .flow-content .flow-text {
height: auto;
min-height: 0;
padding: 0;
padding-bottom: 70%;
background-position: center bottom;
background-size: 100% auto;
}

.content03 .flow-box03 .flow-text .naiken-text {
min-height: 0;
padding: 0;
padding-bottom: 72%;
background-position: center bottom;
background-size: 100% auto;
}

.content03 .flow-box01::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid rgb(255 236 175 / 30%);
}

.content03 .flow-box02::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid #ffffff;
}

.content03 .flow-box03::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid rgb(255 236 175 / 30%);
}

.content03 .flow-box04::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid #ffffff;
}

.content03 .flow-box05::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid rgb(255 236 175 / 30%);
}

.content03 .flow-box06::before {
margin-left: -60px;
border: 60px solid transparent;
border-top: 30px solid #ffffff;
}

.button-title02 {
margin-top: 4rem;
}

.button-title02 a {
margin: 0 auto;
}

.content04 .contact-box {
width: 94%;
margin: 4rem auto;
padding: 0 0;
}

.content04 .contact-box a {
width: 100%;
height: auto;
margin-top: 2rem;
padding: 1rem;
font-size: 2rem;
}

/* no-visit */

#no-visit-contact input[type="submit"],
#no-visit-contact input[type="reset"],
#no-visit-contact input[type="button"],
#no-visit-contact button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

#no-visit-contact input[type="text"]:focus,
#no-visit-contact select:focus,
#no-visit-contact textarea:focus {
outline: 0;
}

#no-visit-contact * {
box-sizing: border-box;
}

#no-visit-contact .drawer-hamburger {
width: 2.9rem;
}

#no-visit-contact #main {
width: 94%;
height: auto;
overflow: hidden;
margin: 1rem auto;
}

#no-visit-contact #content {
width: 100%;
height: auto;
overflow: hidden;
margin: 0 auto;
}

#no-visit-contact .content-title h2 {
width: 100%;
height: auto;
font-size: 2rem;
text-align: center;
color: #ff6c1b;
margin: 20px auto;
}

#no-visit-contact .step-box {
width: 100%;
height: auto;
overflow: hidden;
margin-top: 1rem;
margin-bottom: 1rem;
}

#no-visit-contact .step-box ul,
#no-visit-contact .step-box li {
list-style: none;
}

#no-visit-contact .step-box li {
display: block;
width: 30%;
height: auto;
float: left;
position: relative;
color: #999999;
background-color: #f1f1f1;
border-radius: 7px;
font-size: 1.4rem;
font-weight: bold;
margin-right: 5%;
z-index: -1;
padding: 0.5rem;
text-align: center;
}

#no-visit-contact .step-box .active {
color: #ffffff;
background-color: #ff6c1b;
}

#no-visit-contact .step-box .active::after {
content: "";
width: 0;
height: 0;
border-top: 16px solid transparent;
border-left: 16px solid #ff6c1b;
border-bottom: 16px solid transparent;
border-right: 16px solid transparent;
position: absolute;
right: -31px;
top: 50%;
margin-top: -16px;
}

#no-visit-contact .step-box li.step03 {
margin-right: 0;
}

#no-visit-contact .step-box li span {
display: block;
width: 100%;
height: auto;
color: #999999;
text-align: center;
}

#no-visit-contact .step-box li.active span {
color: #fff;
}

#no-visit-contact .form-item {
width: 100%;
height: auto;
overflow: hidden;
font-size: 1.6rem;
margin-top: 1rem;
}

#no-visit-contact #formWrap .form-item dt,
#no-visit-contact #formWrap .form-item dd {
display: block;
width: 100%;
height: auto;
line-height: 3.4rem;
padding: 0.5rem;
}

#no-visit-contact .form-item dt {
color: #ff6c1b;
line-height: 3.4rem;
}

#no-visit-contact #formWrap dt span {
display: inline-block;
vertical-align: middle;
width: auto;
height: auto;
padding: 0.5rem;
color: #ffffff;
background-color: #ff6c1b;
border-radius: 5px;
margin-left: 1rem;
line-height: 1;
}

#no-visit-contact #formWrap dt::before {
display: inline-block;
width: 10px;
height: 1.6rem;
vertical-align: middle;
content: "";
margin-right: 1rem;
border-radius: 5px;
background-color: #ff6c1b;
}

#no-visit-contact #formWrap form,
#no-visit-contact #formWrap form input,
#no-visit-contact #formWrap form select,
#no-visit-contact #formWrap form textarea {
font-size: 1.6rem;
}

#no-visit-contact #formWrap form input[type="text"] {
width: 100%;
padding: 0.5rem;
border: 1px solid #e7e7e7;
}

#no-visit-contact #formWrap form select {
width: 100%;
padding: 0.5rem;
border: 1px solid #e7e7e7;
background-color: #ffffff;
}

#no-visit-contact #formWrap form textarea {
width: 100%;
height: 10rem;
padding: 0.5rem;
border: 1px solid #e7e7e7;
line-height: 1.6;
}

#no-visit-contact .privacy .privacy-title {
width: 100%;
height: auto;
padding: 0.5rem;
background-color: #ff6c1b;
font-size: 1.6rem;
font-weight: bold;
border-radius: 5px;
margin-top: 1rem;
line-height: 1.6;
}

#no-visit-contact .privacy .privacy-area {
width: 100%;
height: 250px;
overflow: auto;
font-size: 1.4rem;
margin-top: 20px;
padding: 1.4rem;
border: 1px solid #e7e7e7;
}

#no-visit-contact .privacy .privacy-area h3 {
color: #ff6c1b;
text-align: center;
}

#no-visit .privacy .privacy-area h4 {
margin: 1rem 0;
}

#no-visit-contact .privacy .privacy-area .ceo-box {
width: 100%;
height: auto;
margin: 1rem 0;
text-align: right;
}

#no-visit-contact .privacy .privacy-area .kaiji-box {
width: 100%;
height: auto;
text-align: center;
margin: 1rem 0;
}

#no-visit-contact .form-item10 .naiyo {
padding-left: 1rem;
}

#no-visit-contact .privacy .privacy-title p {
color: #ffffff;
}

#no-visit-contact #formWrap form .button-box {
width: 100%;
height: auto;
overflow: hidden;
margin: 2rem auto;
}

#no-visit-contact #formWrap form .button-box input {
display: block;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
width: 100%;
height: 60px;
box-sizing: border-box;
background-color: #ffffff;
font-size: 1.2em;
color: #ff6c1b;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
border: solid 1px #ff6c1b;
margin: 2rem auto;
float: none;
}

#no-visit-contact #formWrap form .button-box input[type="submit"] {
color: #ffffff;
background-color: #ff6c1b;
}

#no-visit-contact .formError {
left: 50% !important;
}


#no-visit-contact .formError .formErrorContent {
font-size: 1rem;
}



#no-visit-contact.kakunin #formWrap table th,
#no-visit-contact.kakunin #formWrap table td {
display: block;
width: 100%;
height: auto;
text-align: left;
padding: 0.5rem 0;
border: none;
}

#no-visit-contact.kakunin #formWrap tablee th {
color: #ff6c1b;
}

#no-visit-contact.kakunin #formWrap table td {
padding-left: 1rem;
}

#no-visit-contact.kakunin #formWrap input {
display: block;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
width: 300px;
height: 60px;
box-sizing: border-box;
background-color: #ffffff;
font-size: 1.2em;
color: #ff6c1b;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
border: solid 1px #ff6c1b;
margin: 2rem auto;
}

#no-visit-contact.kakunin #formWrap input[type="submit"] {
color: #ffffff;
background-color: #ff6c1b;
}

#no-visit-contact #content01 .thanks-box {
margin: 0;
}

#no-visit-contact #content01 .back-box a {
display: block;
width: 300px;
height: 60px;
box-sizing: border-box;
font-size: 1.2em;
color: #ffffff;
background-color: #ff6c1b;
text-align: center;
line-height: 60px;
border-radius: 5px;
text-decoration: none;
margin: 2rem auto;
}

}
@media only screen and (max-width: 400px) {
.sp2 {
display: block;
}
/*-TOP-*/
.img_box p {
line-height: 4.5rem;
}
}