@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@700&display=swap');

:root {
--color-01:#07699f;
--color-02:#dd5e3a;
--color-03:#013a59;
}

/*==================================================
共通
==================================================*/
html {
/* touch-action: manipulation; */
user-select: none;
font-size: 100%!important;
}
body {
background:#F5F5F5;
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-style: normal;
line-height: 1.8em;
text-size-adjust: 100%;
}

img {
display:inline-block;
max-width: 100%;
height: auto;
/*image-rendering: -webkit-optimize-contrast;*/
}
a,a:link,a:visited {
text-decoration: none;
transition: all ease 0.3s;
outline: none;
color:#000;
}
a:hover,a:active {
opacity: 0.8;
}
@media screen and (max-width: 600px) {
    .spNone {
    display: none;
    }
}/* max-width: 600px */
@media screen and (min-width: 601px) {
    .pcNone {
    display: none;
    }
}/* max-width: 600px */

main.wrap {
max-width:800px;
margin:0 auto;
background-color:#FFF;
text-align: center;
}


/*
CTA
------------------------------- */
.cta {
background: #ddeffe;
padding-bottom: 2rem;
}
.cta h6 {
margin-bottom:1rem;
}
.cta.cta1 h6 {
margin-bottom:0;
}
.cta.cta1 h6 img {
display:none;
}
.cta .inner {
padding:25px 1rem 20px;
background-color: #FFF;
margin:0 3%;
}
.cta .inner > p {
padding:10px 0;
}
.cta ul {
margin:1rem auto 0;
}
.cta ul li {
margin-top:15px;
}
@media screen and (min-width: 601px) {
  .cta ul {
  margin:2rem auto;
  }
  .cta ul li {
  margin-top:2rem;
  }
}/* min-width: 601px */




/*==================================================
head
==================================================*/
#header .OFname {
text-align: center;
height:40px;
line-height:42px;
font-size:1rem;
font-weight:bold;
}
#header h1 {
background-color: var(--color-01);
color:#FFF;
font-weight:600;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
padding:0.2em 7%;
font-size:16px;
position: relative;
}
#header h1::before,
#header h1::after {
display:block;
content:'';
width:2px;
height:60%;
background-color: #FFF;
position: absolute;
top:20%;
}
#header h1::before {
left:10%;
transform:skewX(30deg);
}
#header h1::after {
right:10%;
transform:skewX(-30deg);
}
@media screen and (min-width: 601px) {
  #header h1 {
  font-size:24px;
  }
  #header h1::before {
  left:25%;
  }
  #header h1::after {
  right:25%;
  }
}/* min-width: 601px */



/*==================================================
Contens
==================================================*/
.intro {
background: #ddeffe;
}

.choice {
background-color: #fff8f4;
padding:2rem 2%;
position: relative;
}
.choice::after {
content:'';
display:block;
width:100%;
height:0;
padding-top:13.875%;
background:url(../img/saimu19_dh/choice_bgarrw.svg) no-repeat center bottom;
background-size: contain;
position: absolute;
left:0; top:99.99%;
}
.choice h2 {
padding:2rem 5%;
}
.choice ol {
margin:0 4%;
counter-reset: number 0;
}
.choice ol li {
background-color: #FFF;
box-shadow:0 0 12px rgba(211,47,0,0.2);
padding:1.5rem 1rem;
text-align: left;
position: relative;
}
.choice ol li:not(:first-child) {
margin-top:1.5rem;
}
.choice ol li::before {
counter-increment: number 1;
content: "0" counter(number);
position: absolute;
left:10px; top:-0.1em;
font-weight:bold;
color:var(--color-02);
font-family: "Montserrat", sans-serif;
font-weight:600;
font-style: italic;
font-size:45px;
}
.choice ol li h3 {
color:var(--color-02);
padding:0.5em 0;
}
.choice ol li > p {
margin-top:0.5em;
}
.choice ol li > p mark {
background: linear-gradient(to bottom,  rgba(238,230,30,0) 70%,rgba(238,230,30,1) 71%,rgba(238,230,30,1) 73%,rgba(238,230,30,1) 100%);
margin:0 0.25em;
font-style: normal;
}
@media screen and (min-width: 601px) {
  .choice ol {
  margin:0 10%;
  }
  .choice ol li {
  padding:3rem 2rem;
  }
  .choice ol li:not(:first-child) {
  margin-top:3rem;
  }
  .choice ol li::before {
  font-size:80px;
  }
  .choice ol li h3 {
  font-size:2rem;
  }
  .choice ol li > p {
  font-size:1.3rem;
  line-height: 2rem;
  }
}/* min-width: 601px */


.officepoint {
background:var(--color-02);
padding:3rem 4% 1rem;
}
.officepoint h2 {
margin:0 10% 1rem;
}
.officepoint ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom:1.5rem;
}
.officepoint ul li {
width:50%;
}
.officepoint > p {
margin: 0 3%;
}
@media screen and (min-width: 601px) {
  .officepoint {
  padding:6rem 4% 5rem;
  }
}/* min-width: 601px */


.jirei h2 {
margin:2rem 10%;
}
.jirei ul {
background:var(--color-01);
padding:2rem 1rem;
margin:0 3% 3rem;
}
.jirei ul li {
background-color: #FFF;
}
.jirei ul li:not(:first-child) {
margin-top:2rem;
}
.jirei ul li h3 {
position: relative;
top:-15px;
}
.jirei ul li dl {
padding:8px 1em 1.5em;
text-align: left;
}
.jirei ul li dl dt {
position: relative;
font-weight:bold;
padding:0.5em 30px 0.5em 1em;
cursor: pointer;
background:#ECF2F7;
}
.jirei ul li dl dt::before,
.jirei ul li dl dt::after {
content:'';
display: block;
width:14px;
height:2px;
background: var(--color-01);
position: absolute;
right:10px; top:calc(50% - 1px);
transition: all ease 300ms;
}
.jirei ul li dl dt::before {
transform: rotate(90deg);
}
.jirei ul li dl dt.active::before {
transform: rotate(0deg);
}
.jirei ul li dl dd {
display: none;
padding:0.5em;
font-size:0.95rem;
}
@media screen and (min-width: 601px) {
  .jirei ul li dl {
  font-size:1.5rem;
  }
  .jirei ul li dl dd {
  font-size:1.5rem;
  line-height: 1.5em;
  }
}/* min-width: 601px */


.flow {
padding-bottom:3rem;
}
.flow h2 {
padding:1rem 20%;
}
.flow ol {
padding:0 3% ;
}


.faq .inner {
background:var(--color-01);
padding: 2rem 1rem;
text-align: left;
}
.faq dl:not(:first-child) {
margin-top: 2rem;
}
.faq dl dt {
position: relative;
padding-left:84px;
margin-bottom:8px;
color:#FFF;
font-weight:bold;
min-height:50px;
line-height: 1.3em;
font-size:1.1rem;
}
.faq dl dt::before {
content:'';
display:block;
width:24px;
height:24px;
background:url(../img/saimu19_dh/faq_q.png) no-repeat center center;
background-size:contain;
position: absolute;
left:52px; top:-2px;
}
.faq dl:nth-child(1) dt {
background:url(../img/saimu19_dh/faq_icon1.png) no-repeat left top;
background-size:50px;
}
.faq dl:nth-child(2) dt {
background:url(../img/saimu19_dh/faq_icon2.png) no-repeat left top;
background-size:50px;
}
.faq dl:nth-child(3) dt {
background:url(../img/saimu19_dh/faq_icon3.png) no-repeat left top;
background-size:50px;
}
.faq dl:nth-child(4) dt {
background:url(../img/saimu19_dh/faq_icon4.png) no-repeat left top;
background-size:50px;
}
.faq dl:nth-child(5) dt {
background:url(../img/saimu19_dh/faq_icon5.png) no-repeat left top;
background-size:50px;
}
.faq dl dd {
position: relative;
background-color: #FFF;
padding:0.8rem 0.5rem 1rem 44px;
font-size:0.95rem;
border-radius: 10px;
line-height: 1.8em;
}
.faq dl dd b {
color:var(--color-02);
}
.faq dl dd::before {
content:'';
display:block;
width:24px;
height:24px;
background:url(../img/saimu19_dh/faq_a.png) no-repeat center center;
background-size:contain;
position: absolute;
left:10px; top:calc(1em - 2px);
}
@media screen and (min-width: 601px) {
  .faq .inner {
  padding: 4rem 3rem;
  }
  .faq dl:not(:first-child) {
  margin-top: 3rem;
  }
  .faq dl dt {
  font-size:160%;
  /*font-size:98%;*/
  padding-left:100px;
  min-height:80px;
  display: flex;
  align-items: center;
  }
  .faq dl:nth-child(1) dt,
  .faq dl:nth-child(2) dt,
  .faq dl:nth-child(3) dt,
  .faq dl:nth-child(4) dt,
  .faq dl:nth-child(5) dt {
  background-size:80px auto;
  }
  .faq dl dt::before {
  width:30px;
  height:30px;
  left:80px; top:-10px;
  }
  .faq dl dd {
  font-size:130%;
  /*font-size:79%;*/
  line-height:1.5em;
  padding:1.2rem 1rem 1.6rem 48px;
  }
  .faq dl dd::before {
  width:30px;
  height:30px;
  top:calc(1.2em - 6px);
  }
}/* min-width: 601px */


.info .aisatsu {
padding:2rem 1.5rem;
text-align: left;
}
.info .aisatsu::after {
content:'';
display:block;
width:50%;
height:0;
padding-top:41.74757281553398%;
background:url(../img/saimu19_dh/info_01.png) no-repeat center bottom;
background-size: contain;
aspect-ratio: 103 / 86;
margin:0 auto;
}
.info .aisatsu p {
margin-bottom:1em;
font-size:0.9rem;
line-height: 1.5rem;
}
.info ul.foot_link {
display: table;
border-top:#CCC solid 1px;
width:100%;
}
.info ul.foot_link li {
display: table-cell;
width:50%;
text-align: center;
}
.info ul.foot_link li a {
text-decoration: none;
font-size:14px;
line-height: 1.2em;
display: block;
padding:1rem 0;
}
@media screen and (min-width: 601px) {
  .info .aisatsu {
  padding:3rem calc(30% + 3em) 3rem 3rem;
  position: relative;
  }
  .info .aisatsu::after {
  content:'';
  display:block;
  width:30%;
  height:0;
  padding-top:27.83171521035599%;
  position: absolute;
  right:1rem; top:3rem;
  }
  .info .aisatsu p {
  font-size:1rem;
  }
  .info ul.foot_link li a {
  font-size:16px;
  padding:1em 0;
  }
  .info ul.foot_link {
  box-sizing: border-box;
  padding:10px 20%;
  }
}/* min-width: 601px */




/*==================================================
foot
==================================================*/
#footer {
background:#444;
color:#FFF;
padding-bottom:min(28vw, 150px);
padding-top:1rem;
}
#footer table {
width:96%;
margin:0 auto;
}
#footer table :is(th,td) {
padding:0.5em;
text-align: left;
font-weight:normal;
font-size:12px;
line-height: 1.2em;
}
#footer table th {
/*width:4em;*/
width:6em;
}
#footer .copyRight {
display: block;
text-align: center;
font-size:10px;
margin-top:20px;
}
@media screen and (min-width: 601px) {
  #footer table {
  width:80%;
  }
  #footer table :is(th,td) {
  font-size:14px;
  line-height: 1.5em;
  }
  #footer .copyRight {
  font-size:12px;
  }
}/* min-width: 600px */

@media screen and (max-width: 600px) {
.choice ol li h3 {
    font-size: 1.2rem;
}
.choice ol li > p {
    font-size: 1rem;
    line-height: 1.8rem;
}
.jirei ul li dl dt {
    font-size: 0.9rem;
}

}/* max-width: 600px */

/*div.Img_message {
  padding:3%;
}*/


/*==================================================
下部固定ボタン
==================================================*/
#fixBtn {
width:100%;
margin:0 auto;
text-align: center;
position: fixed;
left:0; bottom:0;
z-index:100;
background:rgba(255,255,255,1);
}
#fixBtn ul {
max-width:800px;
margin:0 auto;
}
#fixBtn ul li {
width: 80%;
margin:0 auto 4px;
}
@media screen and (min-width: 601px) {
  #fixBtn ul li {
  width: 60%;
  }
}/* min-width: 601px */
