.sanita img {
    width: 100%;
}

.sanita {
	width:100%;
    overflow: hidden;
    position: relative;
	background:#f8f8f8;
}

.sanitaContainer {
	width:100%; 
	max-width:1030px;
	margin:0 auto;
    position: relative;
}

.sanitaHeader h1 {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaVisual h2, .sanitaVisual p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaInfo p, .sanitaInfo dt, .sanitaInfo dd {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaInfo .infoVisual {
    position: relative;
    padding: 0 7.76699%;
}

.sanitaInfo .swiper-button-prev,
.sanitaInfo .swiper-button-next {
    top: 0;
    width: 7.76699%;
    height: calc(100% - 22px);
    margin: 0;
    background-color: transparent;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 60% auto;
}

.sanitaInfo .swiper-button-prev {
    left: 0;
    background-image: url(./images/button_prev.png);
}

.sanitaInfo .swiper-button-next {
    right: 0;
    background-image: url(./images/button_next.png);
}

.sanitaInfo button span {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaInfo .swiper-pagination {
    margin-top: 2%;
    position: relative;
}

.sanitaInfo .swiper-pagination span {
	width: 18px;
	height: 18px;
	margin: 0 10px;
	border: 3px solid #c9c9c9;
	border-radius: 9px;    
    background: transparent;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    opacity: 1;
}

@media all and (min-width: 768px) {
    .sanitaInfo .swiper-pagination span {
		width: 36px;
		height: 36px;
		margin: 0 33px;
		border: 4px solid #c9c9c9;
		border-radius: 18px;
	}
}

.sanitaInfo .swiper-pagination .swiper-pagination-bullet-active {
    border: 0;
    background: #58cfff;
}

.sanitaInfo a {
    position: relative;
    z-index: 100;
    display: block;
    width: 40.7767%;
    margin: 4% auto 0;
}

.sanitaMain {
    position: relative;
    margin-top: -11%;
}

.sanitaMain .video {
    position: absolute;
    top: 21.45549%;
    left: 7.76699%;
    width: 84.46602%;
    padding-top: 49.51456%;
}

.sanitaMain .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.sanitaMain .participation,
.sanitaMain .notice {
    display: block;
    position: absolute;
    background: #000;
    opacity: 0;
}

.sanitaMain .participation span,
.sanitaMain .notice span {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaMain .participation {
    top: 38.27196%;
    left: 16.99029%;
    width: 66.01942%;
    height: 3.76921%;
}

.sanitaMain .notice {
    top: 95.7089%;
    left: 29.61165%;
    width: 40.7767%;
    height: 2.20354%;
}

.sanitaMain .sanitaMainContents {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaCouncel {
    position: relative;
}

.sanitaCouncel h3 {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaCouncel dt {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaCouncel .nameArea {
    position: absolute;
    top: 16.5%;
    left: 27%;
    width: 44%;
    height: 8%;
    border-radius: 3px;
    background: #fff;
}

.sanitaCouncel .name,
.sanitaCouncel .phone1,
.sanitaCouncel .phone2,
.sanitaCouncel .phone3,
.sanitaCouncel .product {
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 6px;
    border: 0;
    background: transparent;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    font-size: 16px;
    color: #737475;
}

@media all and (min-width: 768px) {
    .sanitaCouncel .name,
    .sanitaCouncel .phone1,
    .sanitaCouncel .phone2,
    .sanitaCouncel .phone3,
    .sanitaCouncel .product {
        padding-left: 10px;
        font-size: 32px;
    }
}

.sanitaCouncel .phone1Area,
.sanitaCouncel .phone2Area,
.sanitaCouncel .phone3Area {
    position: absolute;
    top: 28.9%;
    width: 19.9%;
    height: 8%;
    border-radius: 5px;
    background: #fff;
}

.sanitaCouncel .phone1Area {
    left: 27%;
}

.sanitaCouncel .phone2Area {
    left: 49.9%;
}

.sanitaCouncel .phone3Area {
    left: 72.6%;
}

.sanitaCouncel .phone1,
.sanitaCouncel .product {
    background: url(./images/icon_select.jpg) no-repeat right 10px center/12px auto;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

.sanitaCouncel .phone1::-ms-expand,
.sanitaCouncel .product::-ms-expand {
    display: none;
}

.sanitaCouncel .productArea {
    position: absolute;
    top: 51.3%;
    left: 25%;
    width: 44%;
    height: 8%;
    border-radius: 5px;
    background: #fff;
}

.sanitaCouncel .agreeArea span span,
.sanitaCouncel .agreeArea p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaCouncel .agreeLabel {
    display: block;
    position: absolute;
    top: 41.5%;
    left: 18%;
    width: 51%;
    height: 7.3%;
	
}

.sanitaCouncel .agreeLabel input {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.sanitaCouncel .agreeLabel input:checked + span {
    background-image: url(images/img_checked.png);
}

.sanitaCouncel .agreeLabel > span {
    display: block;
    height: 100%;
    background-image: url(images/img_check.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 13.63636% auto;
}

.sanitaCouncel .privacy {
    display: block;
    position: absolute;
    top: 42%;
    left: 65.7%;
    width: 16%;
    height: 7%;
    background: #000;
    opacity: 0;
}

.sanitaCouncel .submit {
    display: block;
    position: absolute;
    top: 61.25%;
    left: 17.5%;
    width: 65%;
    height: 10%;
    border: 0;
    background: #000;
    opacity: 0;
	cursor:pointer;
}

.sanitaModal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 500;	
}

.sanitaModal .sanitaModalWrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    min-height: 100%;
    z-index: 10;
}

.sanitaModal .sanitaModalBackdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

.sanitaModal .sanitaModalContainer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    pointer-events: auto;
}

.sanitaModal .sanitaModalContents {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 7.5%;
    text-align: center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

.sanitaModal .sanitaModalContents:before {
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    content: "";
}

.sanitaModal .sanitaModalClose {
    position: absolute;
    bottom: 100%;
    right: -2%;
    width: 14.11765%;
}

.modalActive {
    display: block;
}

.noticeModal .sanitaModalContainer {
    /*top: 71.56105%;*/
	overflow-y: scroll;
}

.noticeModal h3, .noticeModal li {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.noticeModal .noticeModalContainer {
    display: inline-block;
    position: relative;
}

.noticeModal .noticeModalContents {
    position: relative;
}

.noticeModal .noticeModalContents img {
    /*border-radius: 5%;
	width:100%;*/
}

.privacyModal .sanitaModalContainer {
    /*top: 80.37094%;*/
	overflow-y: scroll;
}

.privacyModal h3 {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.privacyModal .privacyModalContainer {
    display: inline-block;
    position: relative;
}

.privacyModal .privacyModalContents {
    position: relative;
}

.privacyModal .privacyModalContents img {
    border-radius: 5%;
}

.privacyModal .privacyModalText {
    overflow: auto;
    position: absolute;
    top: 16.1194%;
    left: 7.52941%;
    right: 7.52941%;
    bottom: 8.35821%;
    color: #707070;
    font-size: 16px;
    text-align: left;
}

@media all and (min-width: 768px) {
    .privacyModal .privacyModalText {
        font-size: 18px;
    }
}

.formModal .sanitaModalContainer {
    /*top: 42.81298%;*/
	overflow-y: scroll;
}

.formModal ul, .formModal li, .formModal dt {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.formModal .sanitaModalContents {
    max-width: 930px;
}

.formModal .formModalContents {
    position: relative;
}

.formModal .formModalContents img {
    border-radius:15px;
}

.formModal .formModalText {
    overflow: auto;
    position: absolute;
    top: 59%;
	height:15%;
    left: 5.37634%;
    right: 5.37634%;
    bottom: 29.6129%;
    padding: 5.37634%;
    color: #707070;
    font-size: 16px;
    text-align: left;
    border-radius: 4px;
    background: #fff;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

.formModal .nameArea {
    position: absolute;
    top: 12.09677%;
    left: 17.95699%;
    width: 51.6129%;
    height: 5.80645%;
    border-radius: 3px;
    background: #999;
}

.formModal .urlArea {
    position: absolute;
    top: 47.3%;
    left: 17.95699%;
    width: 75.7%;
    height: 5.80645%;
    border-radius: 3px;
    background: #fff;
}

.formModal .name,
.formModal .url,
.formModal .phone1,
.formModal .phone2,
.formModal .phone3,
.formModal .postcode,
.formModal .address,
.formModal .detailAddress {
    display: block;
    width: 100%;
    height: 100%;
    padding-left: 6px;
    border: 0;
    background: transparent;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    font-size: 16px;
    color: #737475;
}

@media all and (min-width: 768px) {
    .formModal .name,
	.formModal .url,
    .formModal .phone1,
    .formModal .phone2,
    .formModal .phone3,
    .formModal .postcode,
    .formModal .address,
    .formModal .detailAddress {
        padding-left: 10px;
        font-size: 18px;
    }
}

.formModal .phone1Area,
.formModal .phone2Area,
.formModal .phone3Area {
    position: absolute;
    top: 19%;
    width: 23.65591%;
    height: 5.80645%;
    border-radius: 5px;
    background: #fff;
}

.formModal .phone1Area {
    left: 17.95699%;
}

.formModal .phone1 {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background: url(./images/icon_select.jpg) no-repeat right 10px center/12px auto;
}

.formModal .phone1::-ms-expand {
    display: none;
}

.formModal .phone2Area {
    left: 43.97849%;
}

.formModal .phone3Area {
    left: 69.89247%;
}

.formModal .postcodeSearch {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.formModal .address1Area {
    opacity: 0;
    position: absolute;
    top: 25.9%;
    left: 17.95699%;
    width: 23.8%;
    height: 5.80645%;
    border-radius: 5px;
    background: #999;
	z-index:10000;
}

.formModal .address2Area {
    position: absolute;
    top: 25.9%;
    left: 17.95699%;
    width: 23.65591%;
    height: 5.80645%;
    border-radius: 5px;
    background: #fff;
}

.formModal .address3Area {
    position: absolute;
    top: 32.9%;
    left: 17.95699%;
    width: 75.69892%;
    height: 5.80645%;
    border-radius: 5px;
    background: #fff;
}

.formModal .address4Area {
    position: absolute;
    top: 39.9%;
    left: 17.95699%;
    width: 75.69892%;
    height: 5.80645%;
    border-radius: 5px;
    background: #fff;
}

.formModal .agreeArea span span,
.formModal .agreeArea p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.formModal .agreeLabel {
    display: block;
    position: absolute;
    top: 81.22581%;
    height: 4.12903%;
}

.formModal .agreeLabel1 {
	top:82.8%;
    left: 17.5%;
    width: 23.87097%;
}

.formModal .agreeLabel2 {
	top:82.8%;
    left: 53%;
    width: 31.6129%;
}

.formModal .agreeLabel input {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.formModal .agreeLabel input:checked + span {
    background-image: url(./images/img_checked.png);
}

.formModal .agreeLabel > span {
    display: block;
    height: 100%;
    background-image: url(./images/img_check.png);
    background-repeat: no-repeat;
    background-position: 0 0;
}

.formModal .agreeLabel1 > span {
    background-size: 32.43243% auto;
}

.formModal .agreeLabel2 > span {
    background-size: 24.4898% auto;
}

.formModal .button {
    position: absolute;
    top: 89.7%;
    left: 31.29032%;
    width: 37.63441%;
    height: 6.45161%;
    opacity: 0;
    cursor: pointer;
}

@media all and (min-width: 768px) {
    .formModal .formModalText {
        font-size: 18px;
    }
}

.postcodeListModal {
    z-index: 600;
}

.postcodeListModal .sanitaModalContainer {
    top: 20%;
}

.postcodeListModal .sanitaModalContents {
    width: 300px;
    padding: 0;
}

.correctModal .sanitaModalContainer {
    top: 46.36785%;
}

.correctModal h3, .correctModal p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.correctModal .correctModalContents {
    position: relative;
	width: 100%;
    max-width: 830px;
    margin: 0 auto;
}
.correctModal .correctModalContents img {
    border-radius: 15px;
}

.correctModal .correctModalClose {
    opacity: 0;
    position: absolute;
    top: 81.26195%;
    left: 29.03614%;
    width: 42.16867%;
    height: 9.56023%;
}

.correctModal .correctModalShare {
    opacity: 0;
    position: absolute;
    top: 60.42065%;
    left: 39.63855%;
    width: 21.08434%;
    height: 17.30402%;
    cursor: pointer;
}

.incorrectModal .sanitaModalContainer {
    top: 46.36785%;
}

.incorrectModal h3, .incorrectModal p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.incorrectModal .incorrectModalContents {
    position: relative;
	width: 100%;
    max-width: 830px;
    margin: 0 auto;
}

.incorrectModal .incorrectModalContents img {
    border-radius:15px;
}

.incorrectModal .incorrectModalClose {
    opacity: 0;
    position: absolute;
    top: 77.51479%;
    left: 29.03614%;
    width: 42.16867%;
    height: 11.83432%;
}

.quizModal .sanitaModalContainer {
    top: 46.36785%;
}

.quizModal h3 {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.quizModal .quizModalContents {
    position: relative;
    width: 100%;
    max-width: 830px;
    margin: 0 auto;
}

.quizModal .quizModalContents img {
    border-radius : 15px;
}

.quizModal .quizModalClose {
    opacity: 0;
    position: absolute;
    top: 78.10651%;
    left: 29.03614%;
    width: 42.16867%;
    height: 11.83432%;
}

.quizModal .checkArea span span,
.quizModal .checkArea p {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.quizModal .checkLabel {
    display: block;
    position: absolute;
    top: 61.89349%;
    height: 7.57396%;
}

.quizModal .checkLabel1 {
    left: 10.60241%;
    width: 20.72289%;
}

.quizModal .checkLabel2 {
    left: 39.39759%;
    width: 20.60241%;
}

.quizModal .checkLabel3 {
    left: 67.10843%;
    width: 20.36145%;
}

.quizModal .checkLabel4 {
    left: 26.86747%;
    width: 17.83133%;
}

.quizModal .checkLabel5 {
    left: 55.3012%;
    width: 16.86747%;
}

.quizModal .checkLabel input {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(0 0 99.9% 99.9%);
            clip-path: inset(0 0 99.9% 99.9%);
}

.quizModal .checkLabel input:checked + span {
    background-image: url(./images/icon_checked.png);
}

.quizModal .checkLabel > span {
    display: block;
    height: 100%;
    background-image: url(./images/icon_check.png);
    background-repeat: no-repeat;
    background-position: 0 0;
}

.quizModal .checkLabel1 > span {
    background-size: 41.86047% auto;
}

.quizModal .checkLabel2 > span {
    background-size: 42.10526% auto;
}

.quizModal .checkLabel3 > span {
    background-size: 42.60355% auto;
}

.quizModal .checkLabel4 > span {
    background-size: 48.64865% auto;
}

.quizModal .checkLabel5 > span {
    background-size: 51.42857% auto;
}
