@charset "utf-8";
/*modal*/
#colorbox{ width: 100% !important; left: 50% !important; transform: translateX(-50%) !important;}
#cboxWrapper{ width: 100% !important;}
#cboxContent{ width: 100% !important;}
#cboxLoadedContent{ width: 100% !important;}
.modal_wrap_test{ padding: 40px 0; background: rgba(0,0,0,0.4);}
.modal_wrap{ display: none; /*display: block;*/ width: 100vw; height: 100vh; overflow: auto; z-index: 999; background: rgba(0,0,0,0.4); position: fixed; left: 0; top: 0;}
.modal_box_wrap{ width: 100vw; height: 100vh; overflow: auto !important; position: relative; z-index: 1;}
.modal_box_wrap .modal_box_bg{ width: 100%; height: 100%; background: rgba(0,0,0,0); position: absolute; left: 0; top: 0; cursor: pointer; z-index: -1;}
.modal_box{ background: #fff; padding: 48px 60px 40px; width: 750px; margin: 60px auto; position: relative;}
@media screen and (max-width:768px){
.modal_box{ padding: 10vw 3.75vw 7.5vw; width: 92.5%; /*margin: 12.5vw auto;*/}
}

.modal_box .modal_close{ text-align: center; font-size: 1rem; font-weight: bold; margin-top: 40px;}
.modal_box .modal_close span{ display: flex; align-items: center; justify-content: center; margin: auto; background: #7AAE9B; color: #fff; width: 150px; height: 50px; padding: 0 0 0.125em 16px; border-radius: 6px; position: relative; cursor: pointer; transition: 0.3s;}
.modal_box .modal_close span:before{ content: ""; width: 20px; height: 2px; background: #fff; position: absolute; left: 30px; top: 50%; transform: translateX(-50%) rotate(45deg);}
.modal_box .modal_close span:after{ content: ""; width: 20px; height: 2px; background: #fff; position: absolute; left: 30px; top: 50%; transform: translateX(-50%) rotate(-45deg);}
.modal_box .modal_close span:hover{ opacity: 0.7;}
.modal_box .modal_close2{ position: absolute; right: 4px; top: 4px; z-index: 9;}
.modal_box .modal_close2 span{ display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: #7AAE9B; cursor: pointer; transition: 0.3s;}
.modal_box .modal_close2 span:before{ content: ""; width: 20px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg);}
.modal_box .modal_close2 span:after{ content: ""; width: 20px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(-45deg);}
.modal_box .modal_close2 span:hover{ opacity: 0.7;}
@media screen and (max-width:768px){
.modal_box .modal_close{ font-size: 0.8rem; margin-top: 7.5%;}
.modal_box .modal_close span{ width: 25vw; height: 7.5vw; padding: 0 0 0.125em 3.75vw; border-radius: 1.25vw;}
.modal_box .modal_close span:before{ width: 3.75vw; height: 2px; left: 5vw;}
.modal_box .modal_close span:after{ width: 3.75vw; height: 2px; left: 5vw;}
.modal_box .modal_close span:hover{ opacity: 1.0;}
.modal_box .modal_close2{ right: 1.25vw; top: 1.25vw}
.modal_box .modal_close2 span{ width: 7.5vw; height: 7.5vw;}
.modal_box .modal_close2 span:before{ width: 5vw; height: 2px;}
.modal_box .modal_close2 span:after{ width: 5vw; height: 2px;}
}

.modal_box .copyright{ margin-top: 60px;}
.modal_box .copyright dl{ display: flex; justify-content: space-between; align-items: center;}
.modal_box .copyright dl dt{ display: flex; align-items: center;}
.modal_box .copyright dl dt figure img{ height: 40px;}
.modal_box .copyright dl dt p{ font-size: 0.65rem; line-height: 1.5em; margin-left: 1em;}
.modal_box .copyright dl dd{ display: flex; align-items: center;}
.modal_box .copyright dl dd figure{ margin-left: 16px;}
.modal_box .copyright dl dd figure img{ height: 40px;}
.modal_box .copyright p.copy{ font-size: 0.65rem; padding-top: 10px; margin-top: 10px; border-top: 1px solid #E7E8E7;}
@media screen and (max-width:768px){
.modal_box .copyright{ margin-top: 7.5%;}
.modal_box .copyright dl{ display: block; text-align: center;}
.modal_box .copyright dl dt{ display: block;}
.modal_box .copyright dl dt figure img{ height: 7.5vw;}
.modal_box .copyright dl dt p{ font-size: 0.7rem; margin: 5% auto 0; text-align: left;}
.modal_box .copyright dl dd{ margin-top: 5%; justify-content: center;}
.modal_box .copyright dl dd figure{ margin: 0 1.875vw;}
.modal_box .copyright dl dd figure img{ height: 7.5vw;}
.modal_box .copyright p.copy{ text-align: center; font-size: 0.7rem; padding-top: 3.75%; margin-top: 5%;}
}

h3.modal_tit_h3{ text-align: center; margin-bottom: 40px;}
h3.modal_tit_h3 span.ico{ display: block; margin-bottom: 0.25em;}
h3.modal_tit_h3 span.ico img{ width: 48px;}
h3.modal_tit_h3 strong{ display: block; font-size: 1.4rem; line-height: 1.25em; color: #7AAE9B;}
h3.modal_tit2_h3{ text-align: center; font-size: 1.4rem; margin-bottom: 40px; position: relative;}
h3.modal_tit2_h3 strong{ display: inline-block; padding-bottom: 0.25em; position: relative;}
h3.modal_tit2_h3 strong:after{ content: ""; width: 100%; height: 3px; background: url("../images/popup/tit_line.png") center center no-repeat; background-size: 100% 100%; position: absolute; left: 0; right: 0; bottom: 0; margin: auto;}
h3.modal_tit3_h3{ text-align: center; font-size: 1.2rem; margin: 60px auto 20px; position: relative;}
h3.modal_tit3_h3 strong{ display: inline-block; padding-bottom: 0.25em; position: relative;}
h3.modal_tit3_h3 strong:after{ content: ""; width: 100%; height: 3px; background: url("../images/popup/tit_line.png") center center no-repeat; background-size: 100% 100%; position: absolute; left: 0; right: 0; bottom: 0; margin: auto;}
@media screen and (max-width:768px){
h3.modal_tit_h3{ margin-bottom: 5%;}
h3.modal_tit_h3 span.ico{ display: block; margin-bottom: 0.25em;}
h3.modal_tit_h3 span.ico img{ width: 7.5vw;}
h3.modal_tit_h3 strong{ font-size: 1.1rem;}
h3.modal_tit2_h3{ font-size: 1rem; margin-bottom: 5%;}
h3.modal_tit3_h3{ margin: 10% auto 5%; font-size: 0.9rem;}
h3.modal_tit3_h3 strong{ display: block; text-align: left;}
}



.modal_cont p.lead{ font-size: 0.9rem; text-align: justify;}
@media screen and (max-width:768px){
.modal_cont p.lead{ font-size: 0.8rem;}
}



/*camp*/
#modal_camp{ padding-bottom: 0;}
#modal_camp .modal_camp_info dl{ margin: 40px auto 0;}
#modal_camp .modal_camp_info dl dt{ background: #7AAE9B; color: #fff; font-size: 1.2rem; padding: 0.33em 0.5em 0.5em; margin-bottom: 20px;}
#modal_camp .modal_camp_info dl dd p{ font-size: 0.9rem; text-align: justify; margin: 0;}
#modal_camp .modal_camp_info dl dd ul li{ font-size: 0.9rem; line-height: 1.75em; padding-left: 1em; position: relative;}
#modal_camp .modal_camp_info dl dd ul li:before{ content: "※"; position: absolute; left: 0; top: 0;}
#modal_camp .modal_camp_info dl dd ol li{ font-size: 0.9rem; line-height: 1.75em; padding-left: 1em; position: relative;}
#modal_camp .modal_camp_info dl dd ol li span{ position: absolute; left: 0; top: 0;}
@media screen and (max-width:768px){
#modal_camp{ padding-bottom: 0;}
#modal_camp .modal_camp_info dl{ margin: 10% auto 0;}
#modal_camp .modal_camp_info dl dt{ font-size: 0.9rem; margin-bottom: 5%;}
#modal_camp .modal_camp_info dl dd p{ font-size: 0.8rem;}
#modal_camp .modal_camp_info dl dd ul li{ font-size: 0.8rem;}
#modal_camp .modal_camp_info dl dd ol li{ font-size: 0.8rem;}
}

/*cv*/
#modal_camp .modal_camp_cv{ background: #F2F3EE; width: calc(100% + 120px); margin: 60px 0 0 -60px; padding: 60px 60px 60px 210px; position: relative;}
#modal_camp .modal_camp_cv:before{ content: ""; background: url("../images/cv_ill_pc.png") center bottom no-repeat; background-size: 100%; width: 160px; height: 301px; position: absolute; left: 40px; top: 150px;}
#modal_camp .modal_camp_cv h3{ display: flex; align-items: center; justify-content: center; text-align: center; margin-bottom: 20px;}
#modal_camp .modal_camp_cv h3 strong{ display: flex; align-items: center; justify-content: center; background: #fff; border: 3px solid #7AAE9B; width: 340px; height: 60px; border-radius: 30px; font-size: 1rem; line-height: 1em; padding-bottom: 0.125em; position: relative;}
#modal_camp .modal_camp_cv h3 strong:before{ content: ""; width: 0; height: 0; border-style: solid; border-color: #7aae9b transparent transparent transparent; border-width: 16px 8px 0px 8px; position: absolute; left: 0; right: 0; bottom: -16px; margin: auto;}
#modal_camp .modal_camp_cv h3 strong:after{ content: ""; width: 0; height: 0; border-style: solid; border-color: #fff transparent transparent transparent; border-width: 12px 5px 0px 5px; position: absolute; left: 0; right: 0; bottom: -10px; margin: auto;}

#modal_camp .modal_camp_cv .modal_camp_cv_box{ background: #fff; margin: auto; padding: 30px; border-radius: 12px; position: relative; z-index: 1;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h4{ text-align: center; font-size: 1.0rem; line-height: 1.5em; margin-bottom: 20px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h4 strong{ font-size: 1.3rem; line-height: 1.5em; color: #C8982D; margin-right: 0.5em;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h5{ text-align: center; font-size: 0.9rem; line-height: 1.75em; margin: 30px auto 15px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc dl{ display: flex; align-items: center; justify-content: center; margin: auto;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc dl dt{ display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: #EF3F15; color: #fff; border-bottom: 2px solid #A52000; border-radius: 50%;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc dl dt img{ width: 36px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc dl dd{ font-size: 2.6rem; line-height: 1em; font-weight: bold; color: #EF3E15; margin-left: 10px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc p{ font-size: 0.7rem; margin-top: 10px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn_tel_pc p strong{ color: #EF3E15;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn a{ display: flex; justify-content: center; margin: auto; width: 320px; height: 70px; background: #EF3F15; color: #fff; border-bottom: 2px solid #B42706; padding: 12px 0; border-radius: 12px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn.tel a{ background: #EF3F15; color: #fff; border-bottom: 2px solid #B42706;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn.mail a{ background: #FF7602; color: #fff; border-bottom: 2px solid #BC5600;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn.mail{ margin-top: 20px;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl{ display: flex; width: 100%;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dt{ display: flex; align-items: center; justify-content: center; width: 72px; padding: 0 16px; border-right: 1px solid #fff;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dd{ display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc(100% - 62px); font-size: 1rem; font-weight: bold; text-shadow: 0px 1px 2px rgba(0,0,0,0.16);}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dd span{ display: flex; align-items: center; justify-content: center; background: #fff; color: #313131; font-size: 0.6rem; font-weight: bold; padding: 0 1em 0.125em; border-radius: 4px; margin-top: 0.5em; text-shadow: none;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dd span strong{ color: #E60001;}
@media screen and (max-width:768px){
#modal_camp .modal_camp_cv{ width: calc(100% + 7.5vw); margin: 10% 0 0 -3.75vw; padding: 12.5% 5% 7.5%;}
#modal_camp .modal_camp_cv:before{ display: none;}
#modal_camp .modal_camp_cv h3{ padding-left: 25vw; width: calc(100% - 2.5vw); margin-bottom: 5vw;}
#modal_camp .modal_camp_cv h3 strong{ border: 3px solid #7AAE9B; width: 100%; height: 10vw; border-radius: 10vw; font-size: 0.8rem;}
#modal_camp .modal_camp_cv h3 strong:before{ content: ""; width: 0; height: 0; border-style: solid; border-color: #7aae9b transparent transparent transparent; border-width: 16px 8px 0px 8px; position: absolute; left: 0; right: 0; bottom: -16px; margin: auto;}
#modal_camp .modal_camp_cv h3 strong:after{ content: ""; width: 0; height: 0; border-style: solid; border-color: #fff transparent transparent transparent; border-width: 12px 5px 0px 5px; position: absolute; left: 0; right: 0; bottom: -10px; margin: auto;}

#modal_camp .modal_camp_cv .modal_camp_cv_box{ width: 100%; padding: 5% 5% 7.5%; border-radius: 1.25vw;}
#modal_camp .modal_camp_cv .modal_camp_cv_box:before{ content: ""; width: 22.5vw; height: 22.5vw; background: url("../images/cv_ill.png") center center no-repeat; background-size: 100%; position: absolute; left: 0; top: -21.25vw;}
#modal_camp .modal_camp_cv .modal_camp_cv_box:before{ width: 22.5vw; height: 22.5vw; left: 0; top: -21.25vw;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h4{ font-size: 0.8rem; margin-bottom: 3.75%;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h4 strong{ font-size: 1rem;}
#modal_camp .modal_camp_cv .modal_camp_cv_box h5{ font-size: 0.8rem; margin: 7.5% auto 3.75%;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn a{ width: 100%; height: 17.5vw; padding: 1.875vw 0; border-radius: 1.25vw;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dt{ width: 20%; padding: 0 2.5vw;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dd{ width: 80%; font-size: 1rem;}
#modal_camp .modal_camp_cv .modal_camp_cv_box figure.cv_btn dl dd span{ font-size: 0.6rem; padding: 0 1em 0.125em; border-radius: 0.625vw;}
}



/*attention*/
#modal_attention .modal_box{ padding: 0;}
#modal_attention .modal_box .modal_cont{ padding: 40px;}
#modal_attention h3{ padding: 40px 0; background: #F7EFDB; color: #896811; text-align: center; font-size: 1.4rem; font-weight: bold;}
#modal_attention h4{ padding: 0 0 0.5em; font-size: 1rem; color: #896811; border-bottom: 1px solid #896811; margin: 60px auto 20px;}
#modal_attention h4:first-child{ margin-top: 0;}
#modal_attention p{ font-size: 0.8rem;}
#modal_attention p.caution{ font-size: 0.6rem; color: #E31A1A; position: relative; padding-left: 30px;}
#modal_attention p.caution:before{ content: ""; width: 20px; height: 20px; background: url("../images/ico/caution.png"); background-size: 100%; position: absolute; left: 0; top: 0;}
#modal_attention .list{ background: #F9F5EB; padding: 20px;}
#modal_attention .list ul{ display: flex; flex-wrap: wrap; align-items: center; width: 100%; font-size: 0.8rem; font-weight: bold; border-radius: 12px;}
#modal_attention .list ul li{ width: calc(50% - 20px); margin: 10px; padding-left: 30px; position: relative;}
#modal_attention .list ul li:before{ content: ""; width: 24px; height: 24px; background: url("../images/popup/attention/checkbox.png"); background-size: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
#modal_attention .list2 dl{ display: flex; align-items: center; justify-content: space-between; margin-top: 20px;}
#modal_attention .list2 dl dt{ width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; background: #f9eec7;}
#modal_attention .list2 dl dt img{ width: 60px;}
#modal_attention .list2 dl dd{ width: calc(100% - 140px);}
#modal_attention .list2 dl dd h5{ font-size: 0.9rem; margin-bottom: 0.5em;}
#modal_attention .list2 dl dd p{ font-size: 0.75rem; line-height: 1.5em; text-align: justify;}
#modal_attention .att_box{ background: #F9F5EB; margin-top: 60px; padding: 20px; border-radius: 12px;}
#modal_attention .att_box h5{ font-size: 0.9rem; margin-bottom: 0.5em;}
#modal_attention .att_box p{ font-size: 0.7rem; line-height: 1.5em; text-align: justify;}
#modal_attention .att_box dl{ margin-top: 10px; display: flex; align-items: center; background: #fff; border: 1px solid #DFD2B0; padding: 20px; border-radius: 12px;}
#modal_attention .att_box dl dt{ font-size: 0.9rem; font-weight: bold; margin-right: 1em;}
#modal_attention .att_box dl dd p{ font-size: 0.75rem;}
@media screen and (max-width:768px){
.modal_box#modal_attention .modal_cont{ padding: 3.75vw 3.75vw 7.5vw;}
#modal_attention h3{ padding: 5vw 3.75vw; font-size: 1.2rem;}
#modal_attention h4{ font-size: 0.9rem; margin: 10% auto 3.75%;}
#modal_attention p{ font-size: 0.8rem;}
#modal_attention p.caution{ font-size: 0.7rem; padding-left: 5vw;}
#modal_attention p.caution:before{ width: 3.75vw; height: 3.75vw; top: 0.9375vw;}
#modal_attention .list{padding: 2.5vw;}
#modal_attention .list ul{ display: block; font-size: 0.8rem; border-radius: 1.25vw;}
#modal_attention .list ul li{ width: 100%; margin: 0 auto 3.75%; padding-left: 5vw;}
#modal_attention .list ul li:last-child{ margin-bottom: 0;}
#modal_attention .list ul li:before{ width: 3.75vw; height: 3.75vw;}
#modal_attention .list2 dl{ display: block; margin-top: 7.5%;}
#modal_attention .list2 dl dt{ width: 100%; height: auto; padding: 3.75%; justify-content: flex-start; border-radius: 1.25vw;}
#modal_attention .list2 dl dt img{ width: 10vw;}
#modal_attention .list2 dl dt h5{ font-size: 1rem; margin-left: 3.75%;}
#modal_attention .list2 dl dd{ width: 100%; margin-top: 2.5%;}
#modal_attention .list2 dl dd p{ font-size: 0.8rem;}
#modal_attention .att_box{ margin-top: 10%; padding: 5% 3.75%; border-radius: 1.25vw;}
#modal_attention .att_box h5{ font-size: 0.8rem;}
#modal_attention .att_box p{ font-size: 0.7rem;}
#modal_attention .att_box dl{ margin-top: 3.75%; display: block; padding: 2.5%; border-radius: 1.25vw;}
#modal_attention .att_box dl dt{ font-size: 0.8rem; margin: 0 0 0.25em;}
#modal_attention .att_box dl dd p{ font-size: 0.7rem;}
}



/*modal01*/
#modal01 .modal01_box{ margin: 50px auto 0;}
#modal01 .modal01_box h4{ display: flex; align-items: center; border-bottom: 1px solid #7AAE9B; margin-bottom: 30px;}
#modal01 .modal01_box h4 span{ display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; font-size: 1.4rem; background: #7AAE9B; color: #fff; border-radius: 4px 4px 0 0;}
#modal01 .modal01_box h4 strong{ font-size: 1.3rem; padding: 0.25em 0.5em 0.33em;}
#modal01 .modal01_box dl{ display: flex; justify-content: space-between;}
#modal01 .modal01_box dl dt{ width: 360px;}
#modal01 .modal01_box dl dt p{ font-size: 0.9rem; font-weight: 400; text-align: justify;}
#modal01 .modal01_box dl dd{ width: 240px;}
#modal01 .modal01_box dl dd img{ border-radius: 4px;}
#modal01 .modal01_box .recom{ margin-top: 20px; border: 2px solid #7AAE9B; border-radius: 8px; overflow: hidden;}
#modal01 .modal01_box .recom h5{ background: #7AAE9B; color: #fff; text-align: center; padding: 0.25em 0.25em 0.33em; font-size: 0.8rem;}
#modal01 .modal01_box .recom ul{ padding: 20px 30px;}
#modal01 .modal01_box .recom ul li{ padding-left: 30px; font-size: 0.8rem; line-height: 1.5em; font-weight: 400; margin-bottom: 0.5em; position: relative;}
#modal01 .modal01_box .recom ul li:last-child{ margin-bottom: 0;}
#modal01 .modal01_box .recom ul li:before{ content: ""; width: 16px; height: 16px; background: url("../images/ico/check.png"); background-size: 100%; position: absolute; left: 0; top: 0.25em; line-height: 1.5em;}
#modal01 p.txt_link{ text-align: center; margin-top: 40px; font-size: 0.9rem;}
#modal01 p.txt_link a{ font-weight: bold; color: #0671C0; text-decoration: underline;}
#modal01 p.txt_link a:hover{ text-decoration: none;}
@media screen and (max-width:768px){
#modal01 .modal01_box{ margin: 10% auto 0;}
#modal01 .modal01_box h4{ margin-bottom: 5%;}
#modal01 .modal01_box h4 span{ width: 10vw; height: 10vw; font-size: 1.2;}
#modal01 .modal01_box h4 strong{ font-size: 1rem;}
#modal01 .modal01_box dl{ display: flex; justify-content: space-between;}
#modal01 .modal01_box dl dt{ width: calc(100% - 33.75vw);}
#modal01 .modal01_box dl dt p{ font-size: 0.8rem;}
#modal01 .modal01_box dl dd{ width: 30vw;}
#modal01 .modal01_box dl dd img{ width: 30vw; height: 27.5vw; object-fit: cover;}
#modal01 .modal01_box .recom{ margin-top: 5%; border-radius: 1.25vw;}
#modal01 .modal01_box .recom h5{ font-size: 0.8rem;}
#modal01 .modal01_box .recom ul{ padding:3.75% 5%;}
#modal01 .modal01_box .recom ul li{ padding-left: 6.25vw; font-size: 0.8rem;}
#modal01 .modal01_box .recom ul li:before{ width: 3.75vw; height: 3.75vw;}
#modal01 p.txt_link{ margin-top: 7.5%; font-size: 0.7rem;}
}



/*modal02*/
#modal02 .modal02_box{ margin: 50px auto 0;}
#modal02 .modal02_box h4{ display: flex; align-items: center; border-bottom: 1px solid #7AAE9B; margin-bottom: 30px;}
#modal02 .modal02_box h4 span{ display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; font-size: 1.4rem; background: #7AAE9B; color: #fff; border-radius: 4px 4px 0 0;}
#modal02 .modal02_box h4 span img{ width: 40px;}
#modal02 .modal02_box h4 strong{ font-size: 1.3rem; padding: 0.25em 0.5em 0.33em;}
#modal02 .modal02_box p{ font-size: 0.8rem; text-align: justify;}
#modal02 .modal02_message{ background: #F2F3EE; padding: 30px 15px; margin: 50px auto;}
#modal02 .modal02_message h4{ text-align: center; font-size: 1.3rem; margin-bottom: 30px; position: relative;}
#modal02 .modal02_message h4 strong{ display: inline-block; padding-bottom: 0.25em; position: relative;}
#modal02 .modal02_message h4 strong:after{ content: ""; width: 100%; height: 3px; background: url("../images/popup/tit_line.png") center center no-repeat; background-size: 100% 100%; position: absolute; left: 0; right: 0; bottom: 0; margin: auto;}
#modal02 .modal02_message p{ font-size: 0.8rem;}
#modal02 .modal02_message .info{ background: #fff; padding: 15px; border-radius: 4px;}
#modal02 .modal02_message .info h5{ font-size: 0.9rem; margin-bottom: 0.25em;}
#modal02 .modal02_message .info p{ font-size: 0.8rem;}
#modal02 p.txt_link{ text-align: center; margin-top: 40px; font-size: 0.9rem;}
#modal02 p.txt_link a{ font-weight: bold; color: #0671C0; text-decoration: underline;}
#modal02 p.txt_link a:hover{ text-decoration: none;}
@media screen and (max-width:768px){
#modal02 .modal02_box{ margin: 10% auto 0;}
#modal02 .modal02_box h4{ margin-bottom: 5%;}
#modal02 .modal02_box h4 span{ width: 10vw; height: 10vw; font-size: 1.2;}
#modal02 .modal02_box h4 strong{ font-size: 1rem;}
#modal02 .modal02_message{ padding: 5% 3.75%; margin: 10% auto;}
#modal02 .modal02_message h4{ font-size: 1rem; margin-bottom: 5%;}
#modal02 .modal02_message p{ font-size: 0.7rem;}
#modal02 .modal02_message .info{ padding: 3.75%;}
#modal02 .modal02_message .info h5{ font-size: 0.8rem;}
#modal02 .modal02_message .info p{ font-size: 0.7rem;}
#modal02 p.txt_link{ margin-top: 7.5%; font-size: 0.7rem;}
}



/*modal03*/
#modal03 p.lead{ text-align: center;}
#modal03 p.lead2{ text-align: center; font-size: 0.8rem;}
#modal03 .modal03_box{ margin: 40px auto 0;}
#modal03 .modal03_box h4{ font-size: 1.1rem; margin-bottom: 10px;}
#modal03 .modal03_box dl{ display: flex; justify-content: space-between;}
#modal03 .modal03_box dl dt{ width: 360px;}
#modal03 .modal03_box dl dt p{ font-size: 0.9rem; text-align: justify;}
#modal03 .modal03_box dl dd{ width: 240px;}
#modal03 .modal03_box dl dd img{ border-radius: 8px;}
@media screen and (max-width:768px){
#modal03 p.lead2{ text-align: justify;}
#modal03 .modal03_box{ margin: 10% auto 0;}
#modal03 .modal03_box h4{ font-size: 0.9rem; margin-bottom: 2.5%;}
#modal03 .modal03_box dl{ display: block;}
#modal03 .modal03_box dl dt{ width: 100%; margin-bottom: 5%;}
#modal03 .modal03_box dl dt p{ font-size: 0.8rem;}
#modal03 .modal03_box dl dd{ width: 100%;}
#modal03 .modal03_box dl dd img{ border-radius: 1.25vw; width: 100%;}
}



/*modal04*/
#modal04 p.lead{ text-align: center;}
#modal04 .modal04_box dl{ display: flex; justify-content: space-between;}
#modal04 .modal04_box dl dt{ width: 360px;}
#modal04 .modal04_box dl dt p{ font-size: 0.9rem; text-align: justify;}
#modal04 .modal04_box dl dd{ width: 240px;}
#modal04 .modal04_box dl dd img{ border-radius: 8px;}
#modal04 .info{ margin-top: 60px; background: #F2F3EE; padding: 30px 40px; border-radius: 12px; position: relative;}
#modal04 .info span.ico{ display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: #fff; border: 4px solid #F2F3EE; position: absolute; left: 0; right: 0; top: -24px; margin: auto; border-radius: 50%;}
#modal04 .info span.ico:before{ content: ""; width: 16px; height: 2px; background: #7AAE9B; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); margin: auto;}
#modal04 .info span.ico:after{ content: ""; width: 16px; height: 2px; background: #7AAE9B; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) rotate(90deg); margin: auto;}
#modal04 .info h4{ font-size: 1.1rem; color: #7AAE9B; margin-bottom: 0.25em;}
#modal04 .info p{ font-size: 0.9rem;}
@media screen and (max-width:768px){
#modal04 .modal04_box dl{ display: block;}
#modal04 .modal04_box dl dt{ width: 100%; margin-bottom: 5%;}
#modal04 .modal04_box dl dt p{ font-size: 0.8rem;}
#modal04 .modal04_box dl dd{ width: 100%;}
#modal04 .modal04_box dl dd img{ border-radius: 1.25vw; width: 100%;}
#modal04 .info{ margin-top: 10%; padding: 7.5% 5% 5%; border-radius: 1.25vw;}
#modal04 .info span.ico{ width: 10vw; height: 10vw; top: -5vw;}
#modal04 .info span.ico:before{ width: 3.75vw;}
#modal04 .info span.ico:after{ width: 3.75vw;}
#modal04 .info h4{ font-size: 0.8rem; margin-bottom: 0.5em;}
#modal04 .info p{ font-size: 0.7rem;}
}



/*modal05*/
#modal05 p.lead{ text-align: center;}
#modal05 p{ font-size: 0.9rem; text-align: justify;}
#modal05 figure.pmark{ margin: 60px auto;}
#modal05 figure.pmark img{ width: 300px;}
@media screen and (max-width:768px){
#modal05 p{ font-size: 0.8rem;}
#modal05 figure.pmark{ margin:10% auto;}
#modal05 figure.pmark img{ width: 75%;}
}



/*modal06*/
#modal06 p.lead{ text-align: center;}
#modal06 p{ font-size: 0.9rem; text-align: justify;}
@media screen and (max-width:768px){
#modal06 p{ font-size: 0.8rem;}
}



/*modal07*/
#modal07 p.lead{ text-align: center;}
#modal07 .modal07_box{ margin: 40px auto 0;}
#modal07 .modal07_box h4{ font-size: 1.1rem; margin-bottom: 10px;}
#modal07 .modal07_box dl{ display: flex; justify-content: space-between;}
#modal07 .modal07_box dl dt{ width: 360px;}
#modal07 .modal07_box dl dt p{ font-size: 0.9rem; text-align: justify;}
#modal07 .modal07_box dl dd{ width: 240px;}
#modal07 .modal07_box dl dd img{ border-radius: 8px;}
@media screen and (max-width:768px){
#modal07 .modal07_box{ margin: 10% auto 0;}
#modal07 .modal07_box h4{ font-size: 0.9rem; margin-bottom: 2.5%;}
#modal07 .modal07_box dl{ display: block;}
#modal07 .modal07_box dl dt{ width: 100%; margin-bottom: 5%;}
#modal07 .modal07_box dl dt p{ font-size: 0.8rem;}
#modal07 .modal07_box dl dd{ width: 100%;}
#modal07 .modal07_box dl dd img{ border-radius: 1.25vw; width: 100%;}
}



/*system_kit*/
.modal_box#system_kit{ padding: 48px 0 40px;}
@media screen and (max-width:768px){
.modal_box#system_kit{ padding: 10vw 0 7.5vw;}
}


