@charset "UTF-8";

:root{
  --mao:#00BAD8;
  --or:#EF8100;
  --ki:#FFFF10;
  --kuro:#050505;
  --shiro:#FFFFFF;
  --usao:#E2F5F8;
  --en:"Roboto", sans-serif;
  --kage:rgba(15, 15, 15, 0.257);
  --inkage:rgba(255, 255, 255, 0.883);
  --km:100rem;
  --h2:min(calc(1.2rem + 3.3vw),4.2rem);
}

.en{font-family: var(--en);}
.fc_ao{color: var(--mao);}
.fc_or{color: var(--or);}
.fc_ki{color: var(--ki);}
.fc_wh{color: var(--shiro);}
.bg_ao{background-color: var(--mao);}
.bg_or{background-color: var(--or);}
.bg_grad{background: linear-gradient(180deg,var(--usao),rgba(255, 255, 255, 0) 40%);}
.dblo{display: block;}
small{font-size: 0.87em;}
b{font-weight: 700;}
h2{line-height: 1.2;}

.hd__sec{position: absolute;top: 1em;left: 1.2em;z-index: 2;}
.hd__sec p{font-weight: 800;font-size: min(calc(1.2rem + 2vw),2.4rem);position: relative;width: fit-content;}
.hd__sec p::before{content: attr(data-text);position: absolute;top: 0;left: 0;-webkit-text-stroke: 8px var(--shiro);z-index: -1;stroke-linejoin: round;text-shadow: 6px 8px 9px var(--kage);}
.fv_main{min-height: 92vh;background:var(--mao) url(../img/fv_back.jpg) no-repeat top right;background-size: contain;position: relative;z-index: 1;
display: grid;grid-auto-flow: row;padding: 7rem 0 0;align-items: center;overflow: hidden;}

.fv_from {margin-left: 8%;padding: 0.6em 2.4em;font-size: min(calc(1.4rem + 1.2vw),2.4rem);color: var(--shiro);border: solid 1px;box-shadow:inset 5px 8px 12px var(--inkage);background-color: var(--mao);width: fit-content;border-radius: var(--km);}
.fv_h1 {margin-left:min(calc(1.6rem + 11vw),20.6%);font-size: min(calc(5vw + 2rem),8.8rem);padding-bottom: 5vh;line-height: 1.4;font-weight: 900;}
.fv_h1 strong{font-weight: 900;}
.fv_ans {margin:auto auto 0 28%;font-size:min(6.6vw,7rem);font-weight: 800;position: relative;}
.fv_ans::before{content: "";padding:max(1.52em,7rem);display: block;background: url(../img/anser.png)no-repeat center;background-size: contain;bottom: 0%;right: 0;transform: translate(97%,0.5em);position: absolute;}

.lp_sec_2 {position: relative;z-index: 2;padding:3rem 0 8rem;}
.s2_h2 {width: fit-content;margin: 0 auto;display: flex;font-size: min(calc(1.6rem + 4.3vw),7.6rem);align-items: center;gap: 1rem;z-index: 5;}
.s2_p_1::first-letter {color: var(--mao);}
.s2_p_2 {font-size: 3em;position: relative;color: var(--or);text-shadow: 4px 4px 8px var(--kage);}
.s2_p_2::before{content: "3";-webkit-text-stroke: clamp(1.2rem,3vw,20px) var(--shiro);position: absolute;z-index: -1;top: 0;left: 0;text-shadow: 20px 20px 30px var(--kage);}
.lp_sec_2::before{content: "";background: url(../img/ue_sankaku.svg)no-repeat left bottom;background-size: contain;width: 30%;display: block;height: 80vh;position: absolute;bottom: 0;left: 0;transform: translate(-2.4rem,-4rem);}
.lp_sec_2::after{content:"";background: var(--mao);width: 100%;display: block;height: 7rem;position: absolute;bottom: 0;left: 0;}
.s2_h2::after{content: "";background: url(../img/fv_under.png)no-repeat center;background-size: contain;display: block;padding: min(15vw,220px); position: absolute;bottom: 50%;right: 0;transform: translate(0,48%);z-index: 4;}

.lp_sec_3 {padding: 6rem 0;position: relative;z-index: 1;overflow: hidden;}
.lp_sec_3::before{content: "";background: url(../img/shita_sankaku.svg)no-repeat right top;background-size: contain;width: 30%;display: block;height: 80vh;position: absolute;top: 0;right: 0;transform: translate(2.2rem,-11rem);z-index: 1;}
.s3_inner {position: relative;z-index: 2;width: 95%;max-width: 1360px;margin:5% auto;display: grid;grid-template-columns: 1fr 1fr;gap: 2.4em;}
.s3_li:first-of-type{grid-column: span 2;}
.s3_li:first-of-type::before{content: "1";}
.s3_li:nth-of-type(2)::before{content: "2";}
.s3_li:nth-of-type(3)::before{content: "3";}
.s3_li:first-of-type::after{content: "";background: url(../img/1.png)no-repeat center;background-size: contain;}
.s3_li:nth-of-type(2)::after{content: "";background: url(../img/2.png)no-repeat center;background-size: contain;}
.s3_li:nth-of-type(3)::after{content: "";background: url(../img/3.png)no-repeat center;background-size: contain;}
.s3_li::after{position: absolute;bottom: 0;left: 1em;transform: translateY(3em);display: block;width: 10%;height: 60%;min-width: 100px;}
.s3_li::before{font-family: var(--en);font-size:min(calc(3rem + 5vw),8rem);font-weight: 900;color: var(--or);grid-row: span 2;text-shadow: 2px 2px 12px var(--kage);}
.s3_li {padding: 3em;border-radius: 3.8rem;border-top: solid 3px var(--mao);box-shadow: 4px 9px 20px var(--kage);display: grid;grid-template-columns: min(calc(3rem + 5vw),8rem) 1fr;gap: 1.8em;position: relative;background: var(--shiro);}
.s3_li h2 {font-size: var(--h2);}
.s3_in_ul {display: grid;grid-template-columns: repeat(auto-fit,minmax(180px,22%));gap: 1.8rem;justify-content: center;}
.s3_in_li {padding: 2em 1.4em;box-shadow: 4px 8px 12px var(--kage);border-radius: 2px;}

.s3_box {padding:0 1.2em;}


.lp_sec_4 {padding: 6rem 0;}

.s4_h3 {text-align: center;font-size: min(10vw,10rem);font-style: italic;}
.s4_img {width: 90%;max-width: 1200px;margin:auto;}
.s4_img img {box-shadow: 5px 10px 20px var(--kage);}
.s4_con {width: fit-content;font-size: var(--h2);border-radius: 3.8rem;text-align: center;margin:5% auto;line-height: 1.3;font-weight: 700;padding: 1.2em 2em;}

.s4_con b {font-size: 1.1em;}

.s4_con_2 {width: 100%;display: flex;justify-content: center;padding: 3rem 2rem;background: url(../img/sec_back.jpg)no-repeat center;background-size: cover;align-items: center;flex-wrap: wrap;}
.s4_c_img {display: flex;width: 40%;min-width: 375px;}
.s4_c_img img {width: 50%;}
.s4_c_p {font-size: var(--h2);font-weight: 700;}


.lp_sec_5 {padding: 3.8rem 0 0;border-radius: 12rem 12rem 0 0;background: linear-gradient(180deg,var(--usao),rgba(255, 255, 255, 0) 5%);}
.s5_h2 {width: fit-content;font-size: var(--h2);padding:0.4em 1em;border-top: solid 1px var(--mao);border-bottom: solid 1px var(--mao);margin:2% auto;}
.s5_inner {width: 90%;max-width: 1360px;margin: auto;padding: 3em 1.2em;border-radius: 10rem 10rem 0 0;}
.s5_in_ul {display: grid;grid-auto-flow: column;align-items: center;gap: 1rem;width: 90%;max-width: 800px;margin: auto;}
.s5_in_ul li {background: var(--shiro);box-shadow: 4px 9px 20px var(--kage);font-weight: 700;text-align: center;font-size: min(6.2vw,3.4rem);padding: 1em 0;line-height: 1.4;border-radius: 3.8rem;}
.s5_in_ul li small{font-weight: 700;font-size: 0.8em;}
.s5_img {display: grid;grid-auto-flow: column;align-items: center;gap: 1rem;width: 95%;max-width: 1000px;margin: auto;grid-template-columns: 0.5fr 1fr 0.5fr;}
.s5_img img:first-of-type {width: 50%;margin: auto;}
.s5_btn {background: url(../img/ct_back.jpg)no-repeat center;background-size: cover;border-radius: 3.8rem;width: fit-content;margin: 5% auto;display: flex;padding: 1.8em 3.6em;align-items: center;gap: 2rem;box-shadow: inset 4px 4px 10px var(--inkage),4px 8px 20px var(--kage);}
.s5_btn strong {font-size: var(--h2);text-align: center;line-height: 1.2;font-weight: 900;}
.s5_btn small {font-size: 0.7em;font-weight: 700;}
.s5_btn_b {background: var(--ki);color: var(--kuro);padding: 1em;border-radius: var(--km);text-align: center;}
.s5_h3 {text-align: center;font-size: var(--h2);font-weight: 900;}
.s5_img_2 {width: 90%;max-width: 1200px;margin: auto;}

.s5_con {padding: 3em 0 0;display: flex;justify-content: center;align-items: center;background: linear-gradient(180deg,var(--shiro) 50%,var(--mao) 50%);gap: min(30vw,300px);}
.s5_p {display: grid;grid-template-columns: auto 1fr;align-items: center;column-gap: 1rem;position: relative;}
.s5_p_1 {writing-mode: vertical-lr;padding: 0.2em 0.4em;font-size: var(--h2);background-color: var(--usao);color: var(--mao);border-radius: var(--km);letter-spacing: 0.6em;text-indent: 0.6em;font-weight: 700;width: fit-content;}
.s5_p_2 {font-size: var(--h2);font-weight: 900;}
.s5_p_2 b {font-size: 4em;font-weight: 900;letter-spacing: -10px;position: relative;color: var(--or);z-index: 1;margin-right: 1rem;}
.s5_p_2 b::before{position: absolute;content: "10";-webkit-text-stroke: 20px var(--shiro);text-shadow: 20px 20px 30px var(--kage);top: -0.2em;left: 0;z-index: -1;}
.s5_p_3 {grid-column: span 2;text-align: center;font-size: var(--h2);margin-bottom: auto;font-weight: 700;transform: translateY(-2rem);}
.s5_c_btn {font-size: min(5vw,3rem);text-align: center;padding: 1.2em 0.6em;border: unset;box-shadow: 0 6px 0 rgb(173, 101, 7),inset 4px 4px 8px var(--inkage);border-radius: 2rem;cursor: pointer;}
.s5_p::after{content: "";background: url(../img/hito_m.png)no-repeat center;position: absolute;right: 0;top: 50%;transform: translate(100%,calc(-50% + 2rem));display: block;padding: min(15vw,150px);background-size: contain;}


.bk_ovfh {display: none;}
.s5_c_btn.on{position: fixed;top: 3rem;right: 5%;z-index: 1200;font-size: 1.4rem;}
.s5_c_btn.on::before{content: "×";font-size: 3rem;display: block;text-align: center;}
.bk_ovfh.on{display: block;position: fixed;inset: 0 0 0 0;background-color: var(--kage);z-index: 1000;overflow-y: scroll;padding: 6rem 0;}
.s5_btn_img {width: 90%;max-width: 1200px;margin: auto;}
.s5_btn_img img {}
.lp_sec_6 {background: #F7F4D2;padding: 8rem 0;}

.s6_ct_form {width: 90%;max-width: 1000px;margin: auto;position: relative;background: var(--shiro);border-radius: 3.8rem;padding-bottom: 2.8em;}
.s6_h2 {text-align: center;font-size: min(4.8vw,3rem);transform:translateY(-1.4em);}
.s6_h2 b {font-size: 2em;}
.s6_inner {padding: 1.4em;}
.form_contact{width: fit-content;margin: auto;}
.form_contact label{font-weight: 700;font-size: 1.8rem;display: block;margin-bottom: 0.6em;}
.form_contact input:not([type="checkbox"],.sumbit_btn),.form_contact textarea{padding: 0.8em 1.2em;border: solid 1px gray;box-shadow: 2px 8px 20px var(--kage);font-size: 1.8rem;border-radius: 1em;margin-top: 0.4em;width: 100%;}
.required{margin-left: 5px;padding: 0.4em 1em;display: inline-block;background: red;color: var(--shiro);font-size: 1.4rem;border-radius: var(--km);}
.form_contact input[type="checkbox"]{appearance: auto;transform: scale(2);}
.sumbit_btn{width: 80%;margin: auto;font-size: 3.2rem;background: var(--mao);color: var(--shiro);padding: 1em 0;border-radius: var(--km);border: unset;box-shadow: 0 4px 0 rgb(16, 63, 118);cursor: pointer;display: block;}

.ppp_ovfh{width: 90%;margin:0 auto;overflow-y: scroll;height: 320px;padding: 1.8em;box-shadow: inset 4px 4px 12px var(--kage);font-size: 1.4rem;}
.ppp_ovfh h2{margin-bottom: 0.8em;font-size: 3rem;text-align: center;color: var(--mao);}
.ppp_ovfh h3{border-bottom: solid 1px;margin-bottom: 0.4em;font-size: 1.2em}
.ppp_ovfh h4{margin-top: 1em;color: var(--mao);font-size: 1.3em;}
.txt_r{text-align: right;margin-top: 2rem;}
.wpcf7 form .wpcf7-response-output{width: fit-content;
    margin: auto;
    font-size: 2rem;
    border: none;
    background: red;
    color: white;}
.wpcf7 form.sent .wpcf7-response-output{background: var(--mao);}
.wpcf7-response-output.wpcf7-validation-errors{display: block !important;}


.lp_sec_7 {padding: 6rem 0;}
.lp_sec_7 h2 {text-align: center;font-size: var(--h2);margin-bottom: 2rem;}
.lp_sec_7 h2 small {font-style: italic;}
.gaiyou {width: fit-content;padding: 2.2em calc(1.6em + 2vw);margin: auto;box-shadow: 0 0 20px var(--kage);border-radius: 3.8rem;}
.gaiyou tr {border-top: solid 1px var(--mao);}
.gaiyou tr:last-of-type{border-bottom: solid 1px var(--mao);}
.gaiyou th {vertical-align: middle;padding: 0.8em;font-weight: 700;}
.gaiyou td {vertical-align: middle;padding: 0.8em;}
.ft_p_cr {text-align: center;font-size: 1.4rem;padding: 1rem;}

.contact_link{position: fixed;bottom: 0;left: 5%;width: max(180px,12vw);z-index: 1000;}
.front_link{opacity: 0;transform: translateY(101%);transition: 0.33s ease-in-out;visibility: hidden;}
.front_link.show{transform: translateY(5px);visibility: visible;opacity: 0.8;}
.front_link.show:hover{opacity: 1;}

@media (max-width:1000px){
.s3_inner{grid-template-columns: 1fr;}
.s3_li:first-of-type{grid-column: unset;}
}

@media (max-width:769px){
.s3_in_ul{grid-template-columns: 1fr;}
.s5_con{flex-direction: column;gap: 0;padding: 3rem 0;background: linear-gradient(180deg, var(--shiro) 30%,var(--mao) 30%);}
.s5_p::after{display: none;}
.s4_con{width: 85%;}
}

@media (max-width:500px){
.fv_h1{writing-mode: vertical-rl;margin: auto;line-height: 1.8;}
.lp_sec_2{padding-top: 1.4rem;}
.s2_h2::after{display: none;}
.s3_li{grid-template-columns: 1fr;justify-items: center;padding: 1.4em 1em;}
.s3_li::after{bottom: unset;top: 0;transform: translateY(-1rem);height: 13%;min-height: 10rem;}
.s4_c_img{min-width: 345px;}
.lp_sec_5{border-radius: 1rem;}
.s5_inner{border-radius: 1rem;}
.s5_in_ul{grid-auto-flow: row;}
.s5_btn{width: 90%;padding: 2em 1em;flex-direction: column;}
.s5_img img:first-of-type{display: none;}
.s5_img{display: block;width: 90%;}
.s5_c_btn.on{transform: scale(0.7);}
.bk_ovfh.on{padding: 20vh 0;}
}

@media (hover:hover){
.s5_c_btn{transition: 0.33s ease-in-out;}
.s5_c_btn:hover{transform: translateY(4px);box-shadow: 0 1px var(--kage),inset 4px 4px 9px var(--inkage);}
}