@charset "utf-8";
.movescroll { position: relative; width: 3px; height: 2.5rem; z-index: 5; background-color: #4f5e7c; margin: 4rem auto 3rem; border-radius: .125rem; overflow: hidden; }
.movescroll.point { background-color: #e5e9f0; }
.movescroll::after { position: absolute; content: ''; width: 3px; height: .85rem; left: 0; top: 0; background-color: #8b97ab; border-radius: .125rem; animation: scrollAni 1.4s infinite; }
.movescroll.point::after { background-color: var(--pointcolor); }
@keyframes scrollAni {
    0% { top: 0%; }
    100% { top: 100%; }
}

@media(max-width:990px){
    .checkblock li p:not(:first-child) { width: 100%; margin-left: 0; margin-top: .5rem; }
}

#case .flexList .box { aspect-ratio: 1/1; padding: 2rem; }
#case .flexList[boxCount="3"] .box { aspect-ratio: 1/.75; padding: 2.5rem; }
@media(max-width:990px){
    #case .flexList[boxCount="3"] .box { aspect-ratio: 1/1; padding: 2rem; }
    #case .flexList .box .ico { align-items: center; }
    #case .flexList .box .ico img { max-width: 30%; }
}

#startWithUs .imgbox { width: 60%; }
#startWithUs .contbox { width: 35%; }
@media(max-width:990px){
    #startWithUs > article.flex-between { flex-wrap: wrap; padding-right: 0; }
    #startWithUs .imgbox { width: 100%; }
    #startWithUs .contbox { width: 85%; margin: 4rem auto 0; }
}

#oneStopSystem { background-image: url(../img/sub/bg_criterion_oneStopSystem.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; }
#oneStopSystem .Tit + aside { max-width: 250px; opacity: .2; }
#oneStopSystem .systemCase { position: relative; max-width: 1140px; margin: auto; text-align: center; }
#oneStopSystem .systemCase .systemBubble { position: relative; min-width: 24vw; display: inline-flex; align-items: center; background-color: #fff; border-radius: 3rem; padding: .5rem; }
#oneStopSystem .systemCase .systemBubble::before { position: absolute; content: ''; width: 0; height: 0; left: 50%; top: -1rem; transform: translateX(-50%); border-style: solid; border-width: 0px 1rem 1rem 1rem; border-color: transparent transparent #ffffff transparent; }
#oneStopSystem .systemCase .systemBubble.middler { margin: auto; }
#oneStopSystem .systemCase .systemBubble .img { overflow: hidden; aspect-ratio: 1/1; }
#oneStopSystem .systemCase .systemBubble p { width: 100%; text-align: center; }
@media(max-width:1140px){
    #oneStopSystem .systemCase { max-width: 90%; }
    #oneStopSystem .systemCase > .flex-between { flex-wrap: wrap; }
    #oneStopSystem .systemCase .systemBubble { min-width: 100%; }
    #oneStopSystem .systemCase .systemBubble::before { border-width: 0 1.5rem 1.5rem 1.5rem; }
    #oneStopSystem .systemCase > .flex-between .systemBubble:not(:first-child) { margin-top: 2.5rem; }
}
@media(max-width:768px){
    #oneStopSystem { background-image: url(../img/sub/bg_criterion_oneStopSystem_m.jpg); }
    #oneStopSystem .movescroll { width: 6px; height: 5rem; border-radius: .5rem; margin: 7.5rem auto 5rem; }
    #oneStopSystem .movescroll::after { width: 6px; height: 2rem; border-radius: .5rem; }
}

#hearingTest .flexList { --y-gap: 5rem; }
@media(max-width:990px){
    #hearingTest .flexList li.box.txt { justify-content: flex-start; padding-left: 5%; }
}

#examSpace .info, #examSpace .view { width: 50%; }
#examSpace .info { position: relative; padding: 4rem; }
#examSpace .view { position: relative; }
#examSpace .view .flexList { --x-gap: .5rem; }
#examSpace .view .examSpaceThumbs { position: absolute; left: 2rem; bottom: 2rem; z-index: 5; }
#examSpace .view .examSpaceThumbs .box img { aspect-ratio: 16/9; object-fit: cover; filter: grayscale(1); border: 3px solid transparent; transition: .3s; }
#examSpace .view .examSpaceThumbs .box.on img { filter: grayscale(0); border-color: var(--pointcolor); } 
@media(max-width:990px){
    #examSpace .container_mini { width: 90%; }
    #examSpace .cont { flex-wrap: wrap; }
    #examSpace .info, #examSpace .view { width: 100%; }
    #examSpace .info { aspect-ratio: 1/.75; }
}

@media(max-width:990px){
    #sixthTests .swiper-slide .info { opacity: 0; transition: .5s; }
    #sixthTests .swiper-slide-active .info { opacity: 1; }
}

#fitting { background-image: linear-gradient(to bottom, var(--backcolor), #fff); }
#fitting .Cont .txt { position: absolute; left: 1.5rem; bottom: 1.5rem; }
@media(max-width:990px){
    #fitting .Cont { margin-top: 2.5rem; }
    #fitting .Cont .txt { left: 2.5rem; bottom: 2rem; }
}

#access h2 { position: absolute; top: 4rem; left: 4rem; z-index: 5; }
#access .container ul.flex li { width: 33.3%; padding: 1.5rem 0; }
#access .container ul.flex li:first-child { border-bottom-left-radius: .5rem; }
#access .container ul.flex li:last-child { border-bottom-right-radius: .5rem; }
@media(max-width:990px){
    #access h2 { position: absolute; top: 2rem; left: 2rem; }
    #access .container ul.flex { flex-wrap: wrap; }
    #access .container ul.flex li { width: 100%; padding: 2rem 0; }
    #access .container ul.flex li:first-child { border-bottom-left-radius: 0; }
    #access .container ul.flex li:last-child { border-bottom-right-radius: 0; }
    #access .container ul.flex li svg { width: 2rem; height: 2rem; }
}

#analysis .box.txt { padding-left: 5rem; }
@media(max-width:990px){
    #analysis .box.txt { padding-left: 0; padding-top: 3rem; }
    #analysis .checklist li { display: flex; }
}

#brands .box { position: relative; background-color: #fff; padding: 2rem 2.5rem; }
#brands .box .logo { max-width: 50%; object-fit: cover; }
#brands .box h3 { margin-top: 4rem; }
@media(max-width:990px){
    #brands .box { aspect-ratio: 1/.75; padding: 2rem; }
    #brands .box .logo { max-width: 75%; }
}

#aidTypes .aidsSwiper .box.txt { padding-left: 5rem; }
#aidTypes .aidsSwiper .swiperCtrls { position: absolute; min-width: 12.5%; right: 0; bottom: 0; }
#aidTypes .aidsSwiper .swiperCtrls .swiper-pagination { position: relative; width: 100px; height: 3px; background-color: #ebeff1; margin-right: 2rem; }
#aidTypes .aidsSwiper .swiperCtrls .swiper-pagination .swiper-pagination-progressbar-fill { background-color: var(--quickcolor2); }
#aidTypes .aidsSwiper .swiperCtrls .arrow { margin: 0 .5rem; cursor: pointer; }
#aidTypes .aidsThumbSwiper .swiper-slide { border-radius: .25rem; overflow: hidden; }
#aidTypes .aidsThumbSwiper .swiper-slide h4 { position: absolute; left: 1rem; bottom: 1rem; opacity: 1; transition: .3s; z-index: 5; }
#aidTypes .aidsThumbSwiper .swiper-slide::after { position: absolute; content: ''; width: 100%; height: 50%; bottom: 0; left: 0; right: 0; background-image: linear-gradient(to bottom, transparent, rgba(var(--pointcolor-rgb),.75)); opacity: 1; transition: .3s; z-index: 3; }
#aidTypes .aidsThumbSwiper .swiper-slide-active h4 { opacity: 0; }
#aidTypes .aidsThumbSwiper .swiper-slide-active::after { opacity: 0; }
@media(max-width:990px){
    #aidTypes .aidsSwiper .box.txt { padding-left: 0; padding-top: 3rem; }
    #aidTypes .aidsSwiper .box.txt > img { max-height: 60px; }
    #aidTypes .aidsSwiper .swiperCtrls { display: none; }
}

#important { background-image: url(../img/sub/bg_experience_important.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; }

#aidFitting .flexList { --y-gap: 5rem; }
@media(max-width:990px){
    #aidFitting .flexList li.box.txt { justify-content: flex-start; padding-left: 5%; }
}

#fittingProcess .Tit { position: absolute; bottom: 4rem; left: 4rem; z-index: 5; }
#fittingProcess .container ul.flex li { width: 25%; padding: 1.5rem 0; }
#fittingProcess .container ul.flex li:first-child { border-bottom-left-radius: .5rem; }
#fittingProcess .container ul.flex li:last-child { border-bottom-right-radius: .5rem; }
@media(max-width:990px){
    #fittingProcess .Tit { position: absolute; bottom: 2rem; left: 2rem; }
    #fittingProcess .container ul.flex { flex-wrap: wrap; }
    #fittingProcess .container ul.flex li { width: 100%; padding: 2rem 0; }
    #fittingProcess .container ul.flex li:first-child { border-bottom-left-radius: 0; }
    #fittingProcess .container ul.flex li:last-child { border-bottom-right-radius: 0; }
    #fittingProcess .container ul.flex li svg { width: 2rem; height: 2rem; }
}

#difference .differenceList { --x-gap: 1rem; --y-gap: 1rem; }
#difference .differenceList .box { padding: 1.5rem 0; border-radius: .25rem; }
#difference .differenceList .box.color-deep-gray { background-color: #efefef; }
#difference .differenceList .box.point-color { background-color: #f0f2f6; }
@media(max-width:1240px){
    #difference .max1240 { width: 85%; }
}

#useful { background-image: url(../img/sub/bg_experience_useful.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; }
@media(max-width:768px){
    #useful { background-image: url(../img/sub/bg_experience_useful_m.jpg); }
}

#meaningGood .Cont .txt { position: relative; left: 7.5%; top: -7.5rem; display: inline-block; padding: 4rem; border-radius: 1.25rem; background-image: url(../img/sub/bg_yourSelect_meaningGood.jpg); background-position: center; background-repeat: no-repeat; background-size: 100% auto; }
@media(max-width:768px){
    #meaningGood .Cont .txt { left: 0; top: 0; display: block; padding: 3rem 2.5rem; border-radius: 0 0 1rem 1rem; background-image: url(../img/sub/bg_yourSelect_meaningGood_m.jpg);  }
}

#realSound .Tit { width: 35%; }
#realSound .Cont { width: 60%; }
#realSound .Cont .txt { position: absolute; left: 1.5rem; bottom: 1.5rem; }
@media(max-width:990px){
    #realSound .container_mini > .flex-between { flex-wrap: wrap; }
    #realSound .Tit, #realSound .Cont { width: 100%; }
    #realSound .Cont { margin-top: 2.5rem; }
    #realSound .Cont .txt { left: 2.5rem; bottom: 2rem; }
}

#worth .flexList .box { padding: 3rem; }

#theStandard { background-image: url(../img/sub/bg_yourSelect_theStandard.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; }
@media(max-width:768px){
    #theStandard { background-image: url(../img/sub/bg_yourSelect_theStandard_m.jpg); }
    #theStandard h2 { flex-direction: column; }
    #theStandard h2 img { max-width: 10%; margin-bottom: .5rem; }
}

#nowNthen .flexList { --y-gap: 5rem; }
@media(max-width:990px){
    #nowNthen .flexList li.box.txt { justify-content: flex-start; padding-left: 5%; }
}

#theResult .flexList .txt { position: absolute; top: 2rem; left: 2rem; }
@media(max-width:990px){
    #theResult .flexList { --x-gap: .75rem; --y-gap: .75rem; }
    #theResult .flexList .txt { position: absolute; top: 1rem; left: 1rem; }
}

#typings .typingList article.box, #promise .contentBoxes article.box { width: 45%; }
#typings .typingList article.box:nth-child(n+3) { margin-top: 4rem; }
#typings .typingList article.box:nth-child(1) { order: 1; }
#typings .typingList article.box:nth-child(2) { order: 2; }
#typings .typingList article.box:nth-child(3) { order: 3; }
#typings .typingList article.box:nth-child(4) { order: 4; }
#typings .typingList article.box:nth-child(5) { order: 5; }
#typings .typingList article.box:nth-child(6) { order: 6; }
@media(max-width:990px){
    #typings .typingList article.box, #promise .contentBoxes article.box { width: 100%; }
    #typings .typingList article.box:nth-child(n+3) { margin-top: 0; }
    #typings .typingList article.box:nth-child(1) { order: 2; }
    #typings .typingList article.box:nth-child(2) { order: 1; }
    #typings .typingList article.box:nth-child(5) { order: 6; }
    #typings .typingList article.box:nth-child(6) { order: 5; }
    #typings .typingList article.box.img, #promise .contentBoxes article.box.img { margin-bottom: 2.5rem; }
    #typings .typingList article.box.txt { margin-bottom: 5rem; }
}

#step1-3-6 { background-image: linear-gradient(to bottom, var(--quickcolor1), #051e4e); }
#step1-3-6 .step1-3-6List li:not(:first-child) { margin-top: 4rem; }
#step1-3-6 .step1-3-6List li > p { position: relative; width: 8rem; height: auto; aspect-ratio: 1/1; border-radius: 50%; margin-right: 4rem; background-color: #4d5970; transition: .3s; }
#step1-3-6 .step1-3-6List li.active > p { background-color: #fff; }
#step1-3-6 .step1-3-6List li:not(:last-child) > p::before { position: absolute; content: ''; left: 50%; top: 100%; transform: translateX(-50%); width: 2px; height: 250%; border-left: 2px dotted rgba(255,255,255,.5); transition: .3s; }
#step1-3-6 .step1-3-6List li.active:not(:last-child) > p::before { border-left-style: solid; border-left-color: rgba(255,255,255,1); }
#step1-3-6 .step1-3-6List li .content img { border-radius: .5rem .5rem 0 0; }
#step1-3-6 .step1-3-6List li .content p { border-radius: 0 0 .5rem .5rem; }
@media(max-width:990px){
    #step1-3-6 .flexList { --y-gap: 3rem; }
    #step1-3-6 .Tit { text-align: center; }
    #step1-3-6 .step1-3-6List li { justify-content: space-between; }
    #step1-3-6 .step1-3-6List li > p { width: 20%; margin-right: 0; }
    #step1-3-6 .step1-3-6List li > .content { width: 70%; }
    #step1-3-6 .step1-3-6List li:not(:last-child) > p::before { height: 200%; }
}

#experts .box.txt { padding-left: 8rem; }
@media(max-width:990px){
    #experts .box.txt { padding-left: 0; padding-top: 3rem; }
}

#AVT .Cont > * { width: 50%; }
#AVT .Cont .txt { padding: 4rem; border-radius: .25rem 0 0 .25rem; }
@media(max-width:990px){
    #AVT .Cont > * { width: 100%; }
    #AVT .Cont .txt { padding: 2.5rem; border-radius: 0 0 .25rem .25rem; }
    #AVT .Cont .img { position: relative; border-radius: .25rem .25rem 0 0; overflow: hidden; }
}