@charset "UTF-8";
/* =====================================
	support-emt
===================================== */

#wrapper{
    background-image: url("../img/common/bg02.png"), url("../img/common/bg03.png");
    background-repeat: no-repeat, no-repeat;
    background-position: top -217px left, top 2343px right;
}

main{
    width: 100%;
    padding: 162px 50px 206px;
}

main .emt h1{
    font-size: 6.0rem;
    font-weight: 250;
    text-align: center;
    line-height: 1;
    color: #5ac0c9;
    display: table;
    width: 100%;
    margin: 0 auto 28px;
    padding-bottom: 38px;
    background: url("../img/support/emt/huki01.svg") no-repeat center bottom;
    position: relative;
    z-index: 3;
    letter-spacing: 0.025em;
}

main .emt h1 small{
    font-size: 2.5rem;
    font-weight: normal;
    display: block;
    color: #232323;
    margin-top: -3px;
    letter-spacing: 0;
}

main .emt .lead{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
}

main .emt .lead::before{
    content: "";
    background: url("../img/support/emt/illust01.png") no-repeat center;
    background-size: contain;
    width: 305px;
    height: 289px;
    position: absolute;
    top: -117px;
    right: -178px;
}

main .emt .lead::after{
    content: "";
    background: url("../img/support/emt/illust02.png") no-repeat center;
    background-size: contain;
    width: 844px;
    height: 512px;
    position: absolute;
    bottom: -273px;
    right: 5.9167%;
}

main .emt .lead > p{
    text-align: center;
    line-height: 1.625;
    margin-bottom: 34px;
}

main .emt .lead > img{
    margin: 0 auto;
    border-radius: 60px 0 60px 0;
}

main .emt .lead .txtArea{
    margin: -193px auto 0;
    width: 100%;
    background: #fff;
    padding: 230px 100px 80px;
}

main .emt .lead .txtArea h2{
    font-size: 3.5rem;
    line-height: 1.42857;
    color: #5ac0c9;
    margin-bottom: 10px;
}

main .emt .lead .txtArea p{
    width: 75%;
}

main .emt .lead .txtArea h3{
    font-size: 2.0rem;
    line-height: 1;
    color: #5ac0c9;
    margin: 38px 0 -23px -20px;
    border: 1px solid #5ac0c9;
    background: #fff;
    padding: 9px 20px 11px;
    display: table;
    position: relative;
    z-index: 3;
}

main .emt .lead .txtArea h3 + p{
    font-size: 1.6rem;
    line-height: 1.625;
    width: 75%;
    border: 1px solid #5ac0c9;
    padding: 33px 30px 20px;
}

main .emt .overview{
    width: 100%;
    max-width: 1200px;
    margin: 336px auto 0;
    position: relative;
}

main .emt .overview h2{
    position: relative;
    text-align: center;
    display: table;
    margin: 0 auto 52px;
}

main .emt .overview h2::before{
    content: "";
    background: url("../img/common/line01.svg") no-repeat center;
    background-size: 78px auto;
    width: 78px;
    height: 91px;
    position: absolute;
    top: 50%;
    left: -98px;
    transform: translateY(-50%);
}

main .emt .overview h2::after{
    content: "";
    background: url("../img/common/line01.svg") no-repeat center;
    background-size: 78px auto;
    width: 78px;
    height: 91px;
    position: absolute;
    top: 50%;
    right: -98px;
    transform: translateY(-50%);
}

main .emt .overview h2 span{
    font-size: 5.0833rem;
    font-weight: 250;
    line-height: 1;
    color: #5ac0c9;
}

main .emt .overview h2 small{
    font-size: 2.5rem;
    line-height: 1;
    display: block;
    margin-top: 8px;
}

main .emt .overview ul > li{
    width: 100%;
    position: relative;
}

main .emt .overview ul li.emergency{
    background: #fff;
    padding: 50px;
    display: flex;
    justify-content: space-between;
}

main .emt .overview ul li.emergency::before{
    content: "";
    background: url("../img/support/emt/illust03.png") no-repeat center;
    background-size: contain;
    width: 377px;
    height: 474px;
    position: absolute;
    top: 336px;
    left: -184px;
    z-index: 3;
}

main .emt .overview ul li.emergency .txtArea{
    width: 31.82%;
}

main .emt .overview ul li.emergency .txtArea h3{
    font-size: 3.0rem;
    line-height: 1;
    color: #5ac0c9;
}

main .emt .overview ul li.emergency .txtArea p{
    margin-top: 14px;
}

main .emt .overview ul li.emergency .txtArea ul{
    margin-top: 22px;
}

main .emt .overview ul li.emergency .imgArea{
    width: 64.545%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    row-gap: 50px;
}

main .emt .overview ul li.emergency .imgArea li{
    width: 46.47887%;
    position: relative;
}

main .emt .overview ul li.emergency .imgArea li img{
    width: 100%;
}

main .emt .overview ul li.emergency .imgArea li span{
    font-size: 1.7rem;
    font-weight: 500;
    color: #fff;
    line-height: 1;
    padding: 10px 32px 13px 20px;
    background: #c7a977;
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
    position: absolute;
    bottom: 20px;
    left: 0;
}

main .emt .overview ul li.prehospital{
    background: #fff;
    padding: 43px 50px 50px 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 40px;
    position: relative;
}

main .emt .overview ul li.prehospital::before{
    content: "";
    background: url("../img/support/emt/illust04.png") no-repeat center;
    background-size: contain;
    width: 382px;
    height: 270px;
    position: absolute;
    top: -48px;
    right: -11px;
    z-index: 3;
}

main .emt .overview ul li.prehospital .ttlArea{
    width: 100%;
}

main .emt .overview ul li.prehospital .ttlArea h3{
    font-size: 3.0rem;
    line-height: 1.33;
    color: #5ac0c9;
}

main .emt .overview ul li.prehospital .ttlArea h3 small{
    font-size: 76.67%;
    display: block;
}

main .emt .overview ul li.prehospital .ttlArea p{
    margin-top: 18px;
    width: 58.55856%;
}

main .emt .overview ul li.prehospital .txtArea{
    width: 32.432%;
    margin-top: 25px;
}

main .emt .overview ul li.prehospital .txtArea h3{
    font-size: 2.0rem;
    line-height: 1;
    color: #5ac0c9;
    padding: 10px 20px;
    border: 1px solid #5ac0c9;
    display: table;
}

main .emt .overview ul li.prehospital .txtArea ul{
    margin-top: 10px;
}

main .emt .overview ul li.prehospital .imgArea{
    width: 64.865%;
    margin-top: 35px;
    display: flex;
    justify-content: space-between;
}

main .emt .overview ul li.prehospital .imgArea li{
    width: 45.833%;
}

main .emt .overview ul li.prehospital .imgArea li img{
    width: 100%;
}

main .emt .overview .education-training{
    margin-top: 160px;
}

main .emt .overview .education-training h3{
  font-size: 2.5rem;
  line-height: 1;
  text-align: center;
  color: #5ac0c9;
  width: 514px;
  height: 159px;
  background: #fff5b7;
  border-radius: 60px 0 60px 0;
  filter: drop-shadow(-14px -14px 0px #c7e7ea);
  margin: 0 40px -72px auto;
  padding-top: 48px;
  position: relative;
  z-index: 10;
}

main .emt .overview .education-training h3 span{
  font-size: 3.7rem;
  font-weight: normal;
  display: block;
  margin-bottom: 16px;
}

main .emt .overview .education-training .education-training-cnt{
    width: 100%;
    background: #fff;
    padding: 0 50px 50px 40px;
    margin-top: -72px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

main .emt .overview .education-training .education-training-cnt .illust{
    width: 27.9279%;
    margin: -65px 0 0 4px;
}

main .emt .overview .education-training .education-training-cnt .illust img{
    width: 100%;
}

main .emt .overview .education-training .education-training-cnt .ttlArea{
    width: 63.964%;
    padding-top: 92px;
}

main .emt .overview .education-training .education-training-cnt .ttlArea h4{
    font-size: 3.0rem;
    line-height: 1.33;
    color: #5ac0c9;
}

main .emt .overview .education-training .education-training-cnt .ttlArea h4 small{
    font-size: 76.67%;
    display: block;
}

main .emt .overview .education-training .education-training-cnt .ttlArea p{
    margin-top: 10px;
}

main .emt .overview .education-training .education-training-cnt .txtArea{
    width: 40.54%;
    margin-top: 60px;
}

main .emt .overview .education-training .education-training-cnt .txtArea h5{
    font-size: 2.0rem;
    line-height: 1;
    color: #5ac0c9;
    padding: 10px 20px;
    border: 1px solid #5ac0c9;
    display: table;
}

main .emt .overview .education-training .education-training-cnt .txtArea ul{
    margin-top: 10px;
}

main .emt .overview .education-training .education-training-cnt .txtArea p{
    margin-top: 15px;
}

main .emt .overview .education-training .education-training-cnt .txtArea p + h5{
    margin-top: 46px;
}

main .emt .overview .education-training .education-training-cnt .imgArea{
    width: 42.34234%;
    margin-top: 80px;
}

main .emt .overview .education-training .education-training-cnt .imgArea img{
    width: 100%;
}

main .emt .overview .education-training .education-training-cnt .imgArea img + img{
    margin-top: 50px;
}

main .emt .appeal{
    width: 100%;
    max-width: 1200px;
    margin: 146px auto 0;
    padding-bottom: 503px;
    position: relative;
}

main .emt .appeal::before{
    content: "";
    background: url("../img/support/emt/illust05.png") no-repeat center;
    background-size: contain;
    width: 1058px;
    height: 394px;
    position: absolute;
    bottom: 60px;
    right: 13.167%;
    z-index: 3;
}

main .emt .appeal h2{
    position: relative;
    text-align: center;
    display: table;
    margin: 0 auto 45px;
}

main .emt .appeal h2::before{
    content: "";
    background: url("../img/common/line01.svg") no-repeat center;
    background-size: 78px auto;
    width: 78px;
    height: 91px;
    position: absolute;
    top: 50%;
    left: -98px;
    transform: translateY(-50%);
}

main .emt .appeal h2::after{
    content: "";
    background: url("../img/common/line01.svg") no-repeat center;
    background-size: 78px auto;
    width: 78px;
    height: 91px;
    position: absolute;
    top: 50%;
    right: -98px;
    transform: translateY(-50%);
}

main .emt .appeal h2 span{
    font-size: 5.0833rem;
    font-weight: 250;
    line-height: 1;
    color: #5ac0c9;
}

main .emt .appeal h2 small{
    font-size: 2.5rem;
    line-height: 1;
    display: block;
    margin-top: 8px;
}

main .emt .appeal ul{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

main .emt .appeal ul li{
    width: 23%;
    border: 1px solid #ef90b9;
    background: #fff;
    padding: 18px;
    font-size: 1.8rem;
    line-height: 1.56;
    color: #ef90b9;
    text-align: center;
}

main .emt .cv > p{
    font-size: 2.0rem;
    font-weight: 500;
    line-height: 1;
    color: #fff;
    text-align: center;
    width: 350px;
    height: 40px;
    margin: 0 auto 35px;
    background: #5ac0c9;
    padding-top: 9px;
}

main .emt .cv ul{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

main .emt .cv ul li{
    width: 47.11%;
}

main .emt .cv ul li a{
    width: 100%;
    height: 100px;
    position: relative;
    display: table;
    z-index: 3;
}

main .emt .cv ul li a:hover{
    opacity: 1;
}

main .emt .cv ul li a span{
    font-size: 2.0rem;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    width: 100%;
    height: 100px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #232323;
    position: relative;
    z-index: 3;
    letter-spacing: 0.08em;
}

main .emt .cv ul li a::before{
    content: "";
    width: 100%;
    height: 100px;
    position: absolute;
    top: 7px;
    left: 7px;
    background-image: linear-gradient(90deg, rgba(230, 196, 185, .5), rgba(232, 185, 221, .5) 25%, rgba(226, 195, 255, .5) 50%, rgba(185, 212, 254, .5) 75%, rgba(187, 226, 238, .5));
    border-radius: 10px;
    z-index: -1;
    transition: 0.3s all ease;
}

main .emt .cv ul li a:hover::before{
    top: 0;
    left: 0;
}

main .emt .cv ul li .note{
    text-align: center;
    margin-top: 16px;
    display: block;
    letter-spacing: 0.08em;
}

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

main .emt .lead::before{
    display: none;
}

}


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

#wrapper{
    background-image: url("../img/common/bg02.png"), url("../img/common/bg03.png");
    background-repeat: no-repeat, no-repeat;
    background-position: top -28.933vw left, top 312.4vw right;
}

main{
    padding: 21.6vw 0 27.467vw;
}

main .emt h1{
    font-size: 12.2vw;
    line-height: 0.8;
    max-width: 86.979167vw;
    margin: 0 auto 6.4vw;
    padding-bottom: 8vw;
    background: url("../img/support/emt/huki01.svg") no-repeat center bottom;
    background-size: auto 2.4vw;
}

main .emt h1 small{
    font-size: 5vw;
    line-height: 1;
    margin-top: 3vw;
}

main .emt .lead{
    width: 86.979167vw;
}

main .emt .lead::before{
    width: 40.667vw;
    height: 38.533vw;
    top: -40vw;
    right: 61.67vw;
    display: block;
}

main .emt .lead::after{
    width: 112.533vw;
    height: 68.267vw;
    bottom: -60vw;
    right: -2.777vw;
}

main .emt .lead > p{
    line-height: 1.625;
    margin-bottom: 5.6vw;
}

main .emt .lead > img{
    width: 86.979167vw;
    border-radius: 8vw 0 8vw 0;
}

main .emt .lead .txtArea{
    width: 86.979167vw;
    margin: -25.733vw auto 0;
    padding: 31.067vw 6.67vw 10.67vw;
}

main .emt .lead .txtArea h2{
    font-size: 6vw;
    line-height: 1.35;
    margin-bottom: 2.267vw;
}

main .emt .lead .txtArea p{
    width: 100%;
}

main .emt .lead .txtArea h3{
    font-size: 4.8vw;
    line-height: 1.3;
    margin: 6.4vw 0 -3.067vw -2.67vw;
    padding: 1.2vw 2.67vw 1.467vw;
}

main .emt .lead .txtArea h3 + p{
    width: 100%;
    padding: 4.4vw 4vw 3.2vw;
}

main .emt .overview{
    width: 86.979167vw;
    margin: 70vw auto 0;
}

main .emt .overview h2{
    margin: 0 auto 9.6vw;
}

main .emt .overview h2::before{
    background-size: 10.4vw auto;
    width: 10.4vw;
    height: 12.133vw;
    left: -13.067vw;
}

main .emt .overview h2::after{
    background-size: 10.4vw auto;
    width: 10.4vw;
    height: 12.133vw;
    right: -13.067vw;
}

main .emt .overview h2 span{
    font-size: 8vw;
}

main .emt .overview h2 small{
    font-size: 5vw;
    line-height: 1.3;
    margin-top: 1.067vw;
}

main .emt .overview ul li.emergency{
    padding: 6.67vw 5.33vw 8vw;
    display: block;
}

main .emt .overview ul li.emergency::before{
    display: none;
}

main .emt .overview ul li.emergency .txtArea{
    width: 100%;
}

main .emt .overview ul li.emergency .txtArea h3{
    font-size: 6vw;
    line-height: 1.3;
}

main .emt .overview ul li.emergency .txtArea p{
    margin-top: 2.4vw;
}

main .emt .overview ul li.emergency .txtArea ul{
    margin-top: 3.2vw;
}

main .emt .overview ul li.emergency .imgArea{
    width: 100%;
    margin-top: 5.33vw;
    row-gap: 4vw;
}

main .emt .overview ul li.emergency .imgArea li{
    width: 47.5%;
}

main .emt .overview ul li.emergency .imgArea li span{
    font-size: 3.4vw;
    padding: 1.6vw 4.8vw 1.733vw 2.667vw;
    bottom: 2.667vw;
    clip-path: polygon(0 0, calc(100% - 2.667vw) 0, 100% 50%, calc(100% - 2.667vw) 100%, 0 100%);
}

main .emt .overview ul li.prehospital{
    padding: 6.67vw 5.33vw 6.67vw;
    display: block;
    margin-top: 8vw;
}

main .emt .overview ul li.prehospital::before{
    width: 50.933vw;
    height: 36vw;
    top: -16vw;
    right: -13.467vw;
}

main .emt .overview ul li.prehospital .ttlArea h3{
    font-size: 6vw;
    line-height: 1.33;
}

main .emt .overview ul li.prehospital .ttlArea h3 small{
    font-size: 72%;
}

main .emt .overview ul li.prehospital .ttlArea p{
    width: 100%;
    margin-top: 2.4vw;
}

main .emt .overview ul li.prehospital .txtArea{
    width: 100%;
    margin-top: 5.33vw;
}

main .emt .overview ul li.prehospital .txtArea h3{
    font-size: 4.8vw;
    line-height: 1.3;
    padding: 1.333vw 2.667vw;
}

main .emt .overview ul li.prehospital .txtArea ul{
    margin-top: 2vw;
}

main .emt .overview ul li.prehospital .imgArea{
    width: 100%;
    margin-top: 5.33vw;
    gap: 4vw;
}

main .emt .overview ul li.prehospital .imgArea li{
    width: calc(50% - 2vw);
}

main .emt .overview .education-training{
    margin-top: 21.33vw;
}

main .emt .overview .education-training h3{
    font-size: 5vw;
    width: 70vw;
    height: auto;
    border-radius: 11.71875vw 0 11.71875vw 0;
    filter: drop-shadow(-2vw -2vw 0px #c7e7ea);
    margin: 0 auto -9.6vw;
    padding: 6.133vw 0 4.8vw;
}

main .emt .overview .education-training h3 span{
    font-size: 7.4vw;
    margin-bottom: 2.133vw;
}

main .emt .overview .education-training .education-training-cnt{
    width: 86.979167vw;
    margin: -9.733vw auto 0;
    padding: 0 6vw 6vw;
    display: block;
}

main .emt .overview .education-training .education-training-cnt .illust{
    width: 50%;
    margin: 0 auto 4vw;
    padding-top: 14vw;
}

main .emt .overview .education-training .education-training-cnt .ttlArea{
    width: 100%;
    padding-top: 0;
}

main .emt .overview .education-training .education-training-cnt .ttlArea h4{
    font-size: 6vw;
    line-height: 1.33;
}

main .emt .overview .education-training .education-training-cnt .ttlArea h4 small{
    font-size: 76.67%;
}

main .emt .overview .education-training .education-training-cnt .ttlArea p{
    margin-top: 2.4vw;
}

main .emt .overview .education-training .education-training-cnt .txtArea{
    width: 100%;
    margin-top: 6vw;
}

main .emt .overview .education-training .education-training-cnt .txtArea h5{
    font-size: 4.8vw;
    line-height: 1.3;
    padding: 1.333vw 2.667vw;
}

main .emt .overview .education-training .education-training-cnt .txtArea ul{
    margin-top: 2vw;
}

main .emt .overview .education-training .education-training-cnt .txtArea p{
    margin-top: 2.4vw;
}

main .emt .overview .education-training .education-training-cnt .txtArea p + h5{
    margin-top: 6.133vw;
}

main .emt .overview .education-training .education-training-cnt .imgArea{
    width: 100%;
    margin-top: 6vw;
}

main .emt .overview .education-training .education-training-cnt .imgArea img + img{
    margin-top: 4vw;
}

main .emt .appeal{
    width: 86.979167vw;
    margin: 20vw auto 0;
    padding-bottom: 62vw;
}

main .emt .appeal::before{
    width: 141.067vw;
    height: 52.533vw;
    bottom: 5.33vw;
    right: -9.067vw;
}

main .emt .appeal h2{
    margin: 0 auto 9.6vw;
}

main .emt .appeal h2::before{
    background-size: 10.4vw auto;
    width: 10.4vw;
    height: 12.133vw;
    left: -13.067vw;
}

main .emt .appeal h2::after{
    background-size: 10.4vw auto;
    width: 10.4vw;
    height: 12.133vw;
    right: -13.067vw;
}

main .emt .appeal h2 span{
    font-size: 8vw;
}

main .emt .appeal h2 small{
    font-size: 5vw;
    line-height: 1.3;
    margin-top: 1.067vw;
}

main .emt .appeal ul{
    flex-direction: column;
    gap: 4vw;
}

main .emt .appeal ul li{
    width: 100%;
    padding: 3.2vw;
    font-size: 4vw;
}

main .emt .cv{
    width: 86.979167vw;
    margin: 0 auto;
}

main .emt .cv > p{
    font-size: 4vw;
    width: 70vw;
    height: 8vw;
    margin: 0 auto 4.67vw;
    padding-top: 1.6vw;
}

main .emt .cv ul{
    width: 84.8vw;
    flex-direction: column;
    gap: 4vw;
}

main .emt .cv ul li{
    width: 100%;
}

main .emt .cv ul li a{
    height: 18.23vw;
}

main .emt .cv ul li a span{
    font-size: 4vw;
    height: 18.23vw;
    border-radius: 1.8229167vw;
}

main .emt .cv ul li a::before{
    height: 18.23vw;
    top: 0.91145833vw;
    left: 0.91145833vw;
    border-radius: 1.8229167vw;
}

main .emt .cv ul li a:hover::before{
    top: 0.91145833vw;
    left: 0.91145833vw;
}

main .emt .cv ul li .note{
    margin-top: 2.133vw;
}

}