@charset "utf-8";



/*common*/

body { overflow-x: hidden; }

body::after { content: ''; width: 100vw; height: 100vh; background-image: url(../img/bg_galaxy.jpg); background-size: cover; position: fixed; left: 0; top: 0; z-index: -1; }

/*h1 { margin-top: 1em; font-size: 1.6em; text-align: center; color: #ccc; }*/

h2, h3 { font-family: 'Noto Sans JP', sans-serif; font-weight: 900; color: #fff; }

h2 span.new-line { display: block; }

h3 { max-width: 90%; margin: 0 auto; font-size: 1.5em; text-align: center; color: #222; }

whole-wrap p, whole-wrap li, whole-wrap dl, whole-wrap div a { color: #222; }

sup { font-size: 0.5em; }



.layered { position: relative; z-index: 10; }

.flex-box { display: flex; align-items: center; }

.cover { position: relative; overflow-x: hidden; }

.whole-wrap { overflow: hidden; }

.catch-wrap { width: 100%; margin-left: 8px; padding-top: 16em; position: relative; }

.h2-wrap { width: 100%; margin-bottom: 4.4em;

  display: block; 

}

.h2-wrap h2 { font-size: 12em; }

.h2-wrap h2 .folded-line-wrap { width: 70%; margin-bottom: 0.2em; display: flex; flex-wrap: wrap; line-height: 1; }

.h2-wrap h2 .folded-line-wrap .folded-line { display: block; line-height: 0; color: #fff; line-height: 1; }

.h2-wrap h2 .folded-line-wrap .folded-line span { line-height: 1.1; }

.h2-wrap h2 .folded-line-wrap p:nth-child(1) span:nth-child(2) { font-size: 0.66em; }

.h2-wrap h2 .folded-line-wrap p:nth-child(2) .a { font-size: 1em; line-height: 1.1; }

.h2-wrap h2 .folded-line-wrap p:nth-child(2) .a span { font-size: 0.833em; }

.h2-wrap h2 .new-line:nth-child(2) span:nth-child(1) { font-size: 1.5em; line-height: 0.66; color: #fff;}

.h2-wrap h2 .new-line:nth-child(2) span:nth-child(2) { font-size: 0.833em; color: #fff;}

.h2-wrap h2 .new-line:nth-child(3) { margin: -.125em 0; font-size: 1.33em; line-height: 1; color: #fff; }

.fv-menu { width: 98%; margin: 0 0 19.2em 1em; display: flex; flex-wrap: wrap; }

.fv-menu li a { margin: 0.4em 0.4em; padding: 0.73em 1.25em 0.6em; display: block; border-radius: 0.5em; font-size: 2.4em; font-weight: 600; letter-spacing: 0.1em; line-height: 1.3; color: #222; background-color: #fff; }

.fv-menu li a:hover { color: #fff; background-color: #e72; }

.fv-scroll { position: relative; width: 10em; margin: 0 auto 1em; font-size: 1.8em; font-weight: 400; line-height: 1.3; text-align: center; color: #fff; }

.fv-scroll::before { content: ""; width: 1em; height: 1em; rotate: 45deg; border-width: 0 4px 4px 0; border-style: solid; border-color: #fff; position: absolute; top: -1.8em; left: 4.5em;}



/*-- 大野さん：フロート --*/

.hero { width: 36%; position: fixed; top: 10%; right: -1.8%; z-index: 2; }

/*-- プロフィールバルーン --*/



.layered-about { margin: 16em 0 6em; }

.layered-about::before, .layered-about::after { content: ''; width: 0; height: 0; border-style: solid; display: block; position: absolute; }

.layered-about::before { border-width: 0 0 13vw 100vw; border-color: transparent transparent #FE9 transparent;  left: 0; top: -12.9vw; }

.layered-about::after { border-width: 13vw 100vw 0 0; border-color: #FE9 transparent transparent transparent;  left: 0; bottom: -12.9vw; }



.logo {

  width: 100%;

  height: 34em;

  background: #fe9 url(../img/logo_field-c_01.svg) no-repeat center;

}





.about { width: 100%; padding: 3.74em 0 4.75em 0; background-color: #fe9; }

.about h3 span { text-align: center; display: block; }



.about-wrap { min-width: 300px; max-width: 1080px; width: 80%; 

  margin-left: auto; margin-right: auto; 

  background-color: #fff; border-radius: 1.6em; 

}

.about-detail { width: 95%; margin: 0 auto; padding-top: 2.5em; }

.color-box { max-width: 50em; margin-left: auto; margin-right: auto; margin-top: 0.586em; padding: 0.47em 0; font-size: 0.9375em; text-align: center; color: #fff; background-color: #e72; }





.about-detail dl {

  max-width: 41.25em;

  margin-left: auto;

  margin-right: auto;

}



.merit {

  flex-wrap: wrap;

  margin-top: 0.9375em;

}



.merit-circle {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 6.67em;

  height: 6.67em;

  border-radius: 50%;

  background-color: #e72;

  font-weight: bold;

  font-size: 1.5em;

  color: #fff;

}



.merit-circle span {

  display: block;

  text-align: center;

  line-height: 1.17;

}



.about-detail dl dd {

  width: calc(100% - 11.6em); /*マイナスの値に注意*/

  margin-left: auto;

}



.merit li {

  padding-left: 1.33em;

  background: url(../img/ico/ico_check.svg) no-repeat 0 50%;

  background-size: 1em;

  font-size: 1.125em;

  font-weight: 700;

  line-height: 2;

}



.merit li span {

  color: #e72;

}



.about-image-box { width: 100%; margin: 1.2em auto 0 auto; display: flex; justify-content: center; flex-wrap: wrap; }



.about-image-box li { width: 24%; margin: 0.625em .5% 0 .5%; background-repeat: no-repeat; background-size: cover; }

.about-image-box li::before { content: ""; display: block; padding-top: 100%; }

.about-image-box li:nth-child(1) { background-image: url(../img/work_image_01.jpg); }

.about-image-box li:nth-child(2) { background-image: url(../img/work_image_02.jpg); }

.about-image-box li:nth-child(3) { background-image: url(../img/work_image_03.jpg); }

.about-image-box li:nth-child(4) { background-image: url(../img/work_image_04.jpg); }

.about .btn_link { margin-top: 3.25em; }



.flow { margin-top: 2.5em; }

.under-line { width: 11.66em; margin: 0 auto; position: relative; z-index: 10; }

.under-line::before { content: ""; width: 100%; height: 0.66em; background-color: #fe9;

  position: absolute; bottom: 0; left: 0; z-index: -1; rotate: -2deg;

}



.flow-text { min-width: 300px; max-width: 43.75em; width: 80%; margin: 1.875em auto 0 auto; padding-right: 1em; }

.flow-text { font-size: 1.125em; letter-spacing: 0.1em; line-height: 1.56; }

.flow-text span { display: block; }

.flow-text span.registered { font-size: 0.9em; transform: translateY(-0.4em); display: inline-block; }

.first-free { max-width: 600px; min-width: 280px; width: 60%; height: 86px; margin: 1em auto -0.7em;  font-size: 2.67em; font-weight: 700; color: #E53; text-align: center; display: flex; align-items: center; justify-content: center; position: relative; }

.first-free:hover { color: #04A; background-color: #FE9; }

.first-free::before { content: ''; width: 12px; height: 12px; border-style: solid; border-width: 2px 2px 0 0; border-color: #E53; position: absolute; top: calc(50% - 6px); right: 24px;  rotate: 45deg; }

.first-free:hover::before { border-color: #04A; }

.first-free span { margin: 0 0.25em 0; padding: 0.1em 0.5em 0; font-size: 0.47em; color: #FFF; background-color: #E53; }

.first-free:hover span { color: #FE9; background-color: #04A; }



.btn_link.blue a { border-color: transparent; }



.suggest { min-width: 300px; max-width: 43.75em; width: 80%; margin: 2.5em auto 0 auto; border: 2px solid #e72; border-radius: 0.7em; }

.suggest p { width: 19.075em; margin: 1.56em auto .75em auto; padding: .75em 0; color: #e72; background: url(../img/patient.svg) no-repeat 100% 50%; background-size: contain; }

.suggest ul { margin-top: 0.619em; margin-bottom: 2.625em; }

.suggest span { font-size: 1.5em; font-weight: 700; line-height: 1.33; display: block; }

.suggest span:nth-child(2) { font-size: 1.625em; line-height: 1.23; }

.patient { width: 10%; }

.alert { max-width: 32em; width: 100%; margin: 0 auto; padding-left: 1.8em;

  font-size: 1.125em; font-weight: 700; line-height: 2;

  background: url(../img/ico/ico_alert.svg) no-repeat 0 36%; background-size: 1.4em;

  display: flex; flex-wrap: wrap; }



.line-attention-wrap { width: 100%; background-color: #efefef; border-radius: 0 0 1.6em 1.6em; }

.line-attention { min-width: 300px; max-width: 54em; width: 80%; ; margin: 2.5em auto 0; padding: 1.25em 0 2.1em; display: flex; }

.line-attention dt { min-width: 140px; width: 22%; border-right: 2px solid #04a; text-align: center; }

.line-attention dt .about-line { width: 2.7em; height: 2.7em; margin: 0.5em auto 0.2em; }

.line-attention dt li { font-size: 1.5em; line-height: 1.2; letter-spacing: 0.1em; font-weight: 600; color: #04a; text-align: center; }

.line-attention dd { width: 78%; margin: 1em 0 0.3em; }

.line-attention dd p { width: 92%; margin: 0 auto; font-size: 1.125em; line-height: 1.3; letter-spacing: 0.1em; font-weight: 300; }

.line-attention dd a { width: 92%; margin: 0.3em auto 0; padding: 0.35em 0 0.25em; font-size: 1.25em; line-height: 1.2; letter-spacing: 0.2em; font-weight: 600; text-align: center; color: #fe9; background-color: #04a; border-radius: 0.4em; display: block;}

.line-attention dd a:hover { color: #fff; background-color: #e72 }

.line-attention dd a span { display: inline-block; }



.area { min-width: 300px; max-width: 820px; width: 72%;

  margin: 2.5em auto 0 auto; padding: 2.19em 0 1.875em 0; position: relative; z-index: 3;

  background-color: #fff; border-radius: 1em;

}

.area h3 { font-weight: 700; letter-spacing: 0.1em; line-height: 1.17; }

.area p { font-weight: 700; text-align: center; }

.area p.area-text { margin: 1em auto .5em auto; font-size: 1.25em; color: #e53; }

.map-image { width: 90.2%; margin: 1.25em auto 0 auto; background: url(../img/map_20230406.jpg) no-repeat; background-size: contain; border: 1px solid #666; }

.map-image::before { content: ""; padding-top: 78.33%; display: block; }

.area ul { width: 90.2%; margin: 0 auto; display: flex; }

.area li:nth-child(1) { width: 6.1em; margin: -0.2em 0 0 1em; height: 4.25em; background-color: #e53; 

  clip-path: polygon(100% 0, 100% 100%, 50% 80%, 0 100%, 0 0); }

.area li:nth-child(1) p { margin-top: 1em; font-size: 1.125em; line-height: 1.6; font-weight: 600; text-align: center; color: #fff; }

.area li:nth-child(2) { width: 9.3em; margin: 0.8em 0 0 0.5em; font-size: 1.25em; line-height: 1.4; font-weight: 600; color: #e53; }

.area li.map-alert { width: 50%; margin: 0.9em auto 0 auto; font-size: 1em; line-height: 1.25; font-weight: 300; display: flex; }

.area li.map-alert span { margin-top: -0.2em; display: block;}



.service-time { min-width: 300px; max-width: 820px; width: 72%;

  margin: 3.75em auto 0 auto; padding: 1.875em 0 1.9em 0;

  font-weight: 700; background-color: #fff; border-radius: 1em;

  position: relative; z-index: 3;

}

.service-time h3 { font-weight: 700; color: #e72; }

.time-table { width: 94%; margin: .625em auto 0 auto; display: flex; flex-wrap: wrap; justify-content: center; }

.time-table li { width: 5.826em; margin: .4em .6225em; font-size: 1.5em; color: #e72; }

.time-table li span { width: 1.5em; height: 1.5em; margin-right: 0.4em; padding-top: 0.1em; font-size: 0.83em; text-align: center; color: #fff; background-color: #e72; border-radius: 50%; display: inline-block; transform: translateY(-0.1em); }



/*

.service-button { min-width: 300px; max-width: 20.8em; width: 30%; margin: 2.5em auto 0; padding: 1.3em 0 1.1em; font-size: 1.5em; line-height: 1.2; letter-spacing: 0.1em; font-weight: 600; text-align: center; color: #fe9; background-color: #04a; display: block; position: relative; }

.service-button::before { content: ""; position: absolute; top: calc(50% - 0.25em); right: 1.25em; width: 0.5em; height: 0.5em; border-right: 2px solid #fe9; border-bottom: 2px solid #fe9; rotate: -45deg; }

.service-button:hover { color: #fff; background-color: #e72 }

.service-button:hover::before { border-right: 2px solid #fff; border-bottom: 2px solid #fff; }*/



.question { margin: 0 auto; padding: 11.875em 0 10em 0; }

.question h3 { width: 18.5em; font-size: 2.25em; line-height: 0.8; letter-spacing: 0.1em; text-align: center; color: #fff; filter: drop-shadow(0 2px 6px rgba(0,0,0,.6)); }

.question h3 span { margin: 0 .3em; font-size: .67em; }

.frequent-question { margin: 1em 0 3.2em; font-size: 1.5em; line-height: 1.2; letter-spacing: 0.1em; font-weight: 600; text-align: center; color: #fff; }





.question_btn-wrap { min-width: 300px; max-width: 820px; width: 80%; margin: 1.25em auto 0 ; border-radius: 2.5em; overflow: hidden; }

.question_btn { width: 100%; display: block; border: 1px solid #ccc; background-color: #fff; cursor: pointer; }

.question_btn:hover { background-color: #fe9; }



.question_btn h4 { width: 94%; padding: 1em 1.7em; font-size: 1.5em; line-height: 1.2; font-weight: 600; color: #e72; }



.question_btn .flex-box .question-btn-icon { width: 3em; height: 3em; margin: 0 1em 0 auto; background-color: #ccc; border-radius: 1.5em;}

.question_btn:hover .flex-box span { background-color: #e72; }



.question_btn .flex-box .question-btn-icon span { width: 3em; height: 3em; background: url(../img/ico/ico_down_white.svg) no-repeat 50%; background-size: 33%; transform: rotateX(0); transition: transform 0.25s; display: block; }



.question_btn-wrap .question-answer h5 { width: 90%; margin: 0em auto 0; font-size: 1.5em; line-height: 0em; font-weight: 600; color: #222; opacity: 0; transition: all .25s, opacity 0s; transform-origin: 0% 50%; }

.question_btn-wrap .question-answer p { width: 85%; margin: 0 auto; padding-bottom: 0em; font-size: 1.125em; line-height: 0em; font-weight: 300; color: #222; opacity: 0; transition: all 0.25s, opacity 0s ; }

.question_btn-wrap .question-answer h5 span, .question_btn-wrap .question-answer p span { display: block; line-height: 0; transition: all .25s }

.question_btn-wrap .question-answer a { display: none; }

.question_btn-wrap .question-answer p span { text-indent: 1em; }

.question_btn-wrap .question-answer p span:first-child { margin-top: 0; }



.question-button { min-width: 300px; max-width: 20.8em; width: 80%; margin: 0em auto 0; padding: 0em 0 0em; font-size: 1.25em; line-height: 0; letter-spacing: 0.1em; font-weight: 600; text-align: center; color: #e72; background-color: transparent; border: 2px solid #e72; display: block; position: relative; opacity: 0; transition: margin 0.25s, padding 0.25s, line-height 0.25s, opacity 0s, color 0s, background-color 0s; display: none; }

.question-button::before { content: ""; position: absolute; top: calc(50% - 0.25em); right: 1.25em; width: 0.5em; height: 0.5em; border-right: 2px solid #e72; border-bottom: 2px solid #e72; rotate: -45deg; opacity: 0; }

.question-button:hover { color: #fff; background-color: #e72 }

.question-button:hover::before { border-right: 2px solid #fff; border-bottom: 2px solid #fff; }



.question_btn-wrap input[type=checkbox] { display: none; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn:hover { background-color: #fff; transition: 0.25s; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .flex-box .question-btn-icon span { transform: rotateX(180deg); transition: 0.3s; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer h5 { margin: 1em auto 0; line-height: 1.25em; opacity: 1; transition: all .3s; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer p  { padding-bottom: 3.3em; line-height: 1.7em; opacity: 1; transition: all .3s; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer a { display: inline-block;}

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer h5 span { line-height: 1.25em; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer p span { line-height: 1.7em; }

.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer p span:first-child { margin-top: 1.2em; }



.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer .question-button { margin: 2em auto 0; padding: 1.3em 0 1.1em; line-height: 1.2; display:block; opacity: 1; transition: all 0.3s; }



.question_btn-wrap input[type=checkbox]:checked ~ .question_btn .question-answer .question-button::before { opacity: 1; }



.under-line { width: 11.66em; margin: 0 auto; position: relative; z-index: 10; }

.under-line::before { content: ""; width: 100%; height: 0.66em; background-color: #fe9;

  position: absolute; bottom: 0; left: 0; z-index: -1; rotate: -2deg;

}



.recommended-points { min-width: 300px; max-width: 1080px; width: 90%; padding: 3.8em 0 5em 0; margin: 3.75em auto 1.875em auto; border-radius: 1.4em; background-color: rgba(0, 0, 0, 0.8); }

.recommended-points h4 { width: 10em; max-width: 90%; margin: 0 auto; font-size: 1.5em; letter-spacing: 0.1em; text-align: center; color: #fff; }

.recommended-points .under-line::before { background-color: #666; }



.card { margin: 0 auto 0 auto; display: flex; flex-wrap: wrap; justify-content: center; }

.card { min-width: 300px; max-width: 820px; width: 100%; margin: 2.4em auto 0; }

.card li { width: 23.75em; height: 15.625em; margin: 0.625em; background-repeat: no-repeat; background-position: 0 0; background-size: cover; display: flex; }

.point1 { background-image: url(../img/img_point1.jpg); }

.point2 { background-image: url(../img/img_point2.jpg); }

.point3 { background-image: url(../img/img_point3.jpg); }

.point4 { background-image: url(../img/img_point4.jpg); }

.card li p { width: 100%; height: 86px; margin-top: auto; padding: 0.5em 0 0 0.7em; font-size: 1.5em; line-height: 1.25; letter-spacing: 0.1em; font-weight: 600; text-align: center; color: #fff; background: url(../img/ico/ico_asclepios_orange.svg) no-repeat 0.4em 50%; background-size: 2.67em; background-color: rgba(0, 0, 0, 0.8); }

.card li p span { display: block; text-align: center; }



.greeting { padding: 6.25em 0 3.75em 0; background: #fff url(../img/bg_washi.jpg) 0 0 repeat; background-size: 128px; }

.text-logo { width: 23.16em; height: 5.07em; margin: 0 auto; background: url(../img/logo_field-c_02_orange.svg) no-repeat 50%; background-size: cover auto; }

.greeting h3 { min-width: 300px; max-width: 820px; width: 70%; padding-bottom: 0.417em; margin-top: 10.2px; font-weight: 700; border-bottom: 2px solid #e72; }

.greeting-text { min-width: 300px; max-width: 700px; width: 60%; margin: 2.22em auto; font-size: 1.125em; }

.greeting-text p { margin: .75em auto; letter-spacing: .2em; line-height: 2em; }

.greeting-text p span.registered { font-size: 0.9em; transform: translateY(-0.4em); display: inline-block; }



.representative-name { padding-top: 1.7em; text-align: right; }

.representative-name span { margin-left: 1em; font-size: 1.125em; font-weight: 700; letter-spacing: 0.1em; }

.proverb { width: 16.875em; height: 25em; margin: 3.8em auto 5em; background: url(../img/idea.png) no-repeat; background-size: 100%; }



.greeting .btn_link { background-color: #FFF; }





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

  MediaQuery

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

/*-- iPad pro --*/

@media screen and (min-width:1024px) and (max-width:1200px){

  .layered-about { margin: 10em 0 2em; }

  .catch-wrap { padding-top: 12em; }

  .h2-wrap { margin-bottom: 2em; }

  .h2-wrap h2 { font-size: 10em; }

  .hero { width: 50% !important; position: fixed; top: 6% !important; right: -17% !important; }

  .line-circle-wrap { left: auto; right: -2em; }

  .contact-button { font-size: .9em; left: 1em; }

  .fv-menu { margin: 1em 0 4em 0.5em; }

  .fv-menu li a { margin-top: 1em; font-size: 2em; }



  .logo { height: 20em; }



  .about-image-box li { width: 49%; }

  .area p.map-alert { font-size: .8em; }

  .time-table { justify-content: flex-start; }

  .service-button { width: 50%; }

  .question_btn-wrap { width: 80%; }

  .greeting-text { margin-bottom: 0; }





  footer { padding: 1em 0 8em 0; }

  .footer-box { margin: 0 auto; }

}





/*-- iPad --*/

@media screen and (min-width:600px) and (max-width:1023px){

  .layered-about { margin: 6em 0 0em; }

  .catch-wrap { padding-top: 12em; }

  .h2-wrap { margin-bottom: 2em; }

  .h2-wrap h2 { font-size: 8em;  }

  .hero { width: 50% !important; position: fixed; top: 8% !important; right: -19% !important; }

  .line-circle-wrap { font-size: .8em; left: auto; right: -2em; }

  .contact-button { font-size: .8em; left: 1em; }

  .hero_prof { width: 70%; margin: 0 auto; font-size: .8em; transform: translateX(0); }

  .hero_prof dl { display: block; }

  .hero_prof dt { width: 40%; margin: 0 30%; }

  .hero_prof dd { width: 100%; }

  .hero_prof dl::before, .hero_prof dl::after { display: none; }

  .fv-menu { margin: 1em 0 4em 0.5em; }

  .fv-menu li a { margin-top: 1em; font-size: 2em; }



  .logo { height: 20em; }



  .about-wrap { width: 90%; }

  .about-image-box li { width: 49%; }

  .first-free { font-size: 2em; }

  .first-free::before { right: 24px; }

  .flow-table-box { font-size: .8em; }

  .suggest { width: 90%; }

  .line-attention { width: 90%; }

  .area { width: 90%; }

  .area p.map-alert { font-size: .8em; }

  .service-time { width: 82%; }

  .time-table { justify-content: flex-start; }

  .time-table li { font-size: 1.3em; }

  .service-button { width: 80%; }

  .question_btn-wrap { width: 90%; }

  .recommended-points { width: 80%; }

  .greeting-text { margin-bottom: 0; }



  footer { padding: 1em 0 7em 0; }

  .footer-box { margin: 0 auto; }

}



/*-- iPhone --*/

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

  .layered-about { margin: 3.5em 0 1em; }

  .catch-wrap { padding-top: 9em; }

  .h2-wrap h2 { font-size: 4em; letter-spacing: -.1em; }

  .hero { width: 50% !important; position: absolute; top: 9% !important; right: -14% !important; }

  .hero_prof { width: 90%; margin: 0 auto; font-size: .8em; transform: translateX(0); }

  .hero_prof dl { display: block; }

  .hero_prof dt { width: 40%; margin: 0 30%; }

  .hero_prof dd { width: 100%; }

  .hero_prof dl::before, .hero_prof dl::after { display: none; }

  .fv-menu { margin: .5em 0 4em 0em; }

  .fv-menu li a { font-size: 1.8em; }





  .line-circle-wrap { font-size: .6em; left: auto; right: -4em; }

  .contact-button { font-size: .6em; left: 2em; }

  .top-slice-border { height: 6em; }

  .bottom-slice-border { height: 6em; }



  .logo { height: 18em; }



  .about { padding: 4em 0; }

  .about-wrap { width: 96%;  border-radius: 1em; }

  .flex-box.merit { display: block; }

  .merit-circle { margin: 0 auto; }

  .about-detail dl dd { width: 100%; margin-top: 1em; }

  .merit li { margin: .25em 0; font-size: 1.3em; line-height: 1.2em; }

  .about-image-box li { width: 49%; }

  .first-free { margin: 1em auto -1.4em; height: 64px; font-size: 1.5em; }

  .first-free::before {  width: 9.6px; height: 9.6px; top: calc(50% - 4.8px); right: 19,2px; }

  .flow .btn_link a { font-size: 1.2em; }

  .flow-table-box { font-size: .8em; transform: none; }

  .flow-table { width: 100%; }

  .flow-line div:nth-child(1) { font-size: 1em; }

  .flow-circle { margin: -.5em auto 0 auto; }

  .flow-circle::before { border-width: 0 1em 1.5em 1em; border-color: transparent transparent #E72 transparent; top: -1em; left: 4em; }



  .suggest { width: 96%; margin: 2em auto 0 auto; border-radius: 1em; }

  .suggest p { max-width: 19em; width: 90%; margin: .5em auto; font-size: .8em; }

  .alert { width: 98%; margin: .5em auto; line-height: 1.2em; background-size: 1.22em;  }

  .line-attention { width: 96%; display: block; }

  .line-attention-wrap { width: 100%; background-color: #efefef; border-radius: 0 0 1em 1em; }

  .line-attention dt { width: 100%; border-right: none; border-bottom: 2px solid #04a; }

  .line-attention dd { width: 100%; }

  .line-attention dd a { font-size: 1em; }



  .area { width: 96%; padding: 5em .5em 1em .5em; margin-top: 1em; border-radius: 1em; }

  .area li.map-alert { font-size: .8em; }

  .map-image { width: 100%; margin: 1em auto 0 auto; }

  .area li:nth-child(1) { width: 6.1em; margin: -0.2em 0 0 0em; }

  .area li:nth-child(2) { font-size: 1em; }

  .service-button { width: 90%; }



  .service-time { width: 96%; margin-top: 1em; padding: 1em 0 1.5em 0; border-radius: 1em; }

  .time-table { justify-content: space-around; }

  .time-table li { font-size: 1.3em; }

  .btn_link.resize a { font-size: 1.2em; }

  .greeting-text { margin-bottom: 0; }



  .question { width: 96%; padding: 5em 0; font-size: .8em; }

  .question_btn-wrap { width: 100%; }

  .question h3 { width: 15em; font-size: 2.25em; }

  .recommended-points { width: 98%; }



  .card li {  display: flex; }

  .card li p { padding-top: 0.75em; }

  .greeting { padding: 6em 0; }

  .text-logo { width: 18em; height: 3.6em; }

  .greeting h3 { margin-top: 0; font-size: 1.2em; }

  .greeting-text { width: 90%; margin: 1em 2% 1em 8%; font-size: 1em; }

  .proverb { width: 12em; height: 20em; }



  footer { padding: 1em 0 14em 0; }

  .footer-box { width: 98%; margin: 0 auto; }



}