@charset 'UTF-8'; 

@media (max-width: 1340px) { 
 section { 
 padding-bottom: clamp(40px, 9.4vw, 110px); 
 } 

 .invisalign .center__bg,
 .angel .center__bg { 
 width: 960px; 
 height: 350px; 
 background-position-y: 70%; 
 } 

 .invisalign__center .center__bg,
 .invisalign__bottom,
 #angel .center__bg { 
 max-width: 90%; 
 margin-inline: auto; 
 } 

 .difference__bottom li { 
 padding-left: 4.75vw; 
 } 

 /* how */
 .ui-d3-box { 
 width: calc((100% / 4)); 
 } 

 /* resident */
 .resident__box-container { 
 max-width: 90%; 
 } 

 .resident__box-before { 
 width: 50%; 
 top: -16%; 
 right: 12%; 
 } 

 /* system */
 .system__box-wrap { 
 max-width: 940px; 
 } 
 } 

@media (max-width: 1024px) { 
 .pc-only { 
 display: none; 
 } 

 /* difference */
 .difference__bottom { 
 flex-direction: column; 
 } 

 .difference__bottom > div { 
 min-width: auto; 
 } 

 .difference__bottom > div * { 
 text-align: center !important; 
 } 

 .difference__bottom li { 
 padding: 2vw 5vw 2vw 10vw; 
 } 

 #difference .check-list-box > li:before { 
 top: 50%; 
 left: 25%; 
 transform: translateY(-50%); 
 } 

 .difference__bottom .bottom__title { 
 padding: 4vw; 
 margin: 0 4vw 2vw; 
 } 
 } 

@media (max-width: 968px) { 
 .mo-only { 
 display: block; 
 } 

 .container { 
 width: calc(100% - 100px); 
 } 

 .column__line { 
 height: 30px; 
 } 

 /* hero */
 .hero__image { 
 position: static; 
 margin: 5vw auto 0; 
 transform: none !important; 
 } 

 .hero__image--02 { 
 display: none; 
 } 

 .hero__para.hero__para--2,
 .hero__para.hero__para--3,
 #angel .bottom__para-1,
 #angel .bottom__para-2,
 .final-how__para--4,
 .system__para-1 { 
 line-height: 1.4; 
 } 

 .hero__box-wrap > .hero-box { 
 width: calc(((100% / 3)) - 20px); 
 } 

 .hero__box-wrap { 
 gap: 10px; 
 } 

 /* invisalign */
 .invisalign__center .center__bg { 
 background: url(../images/section/invisalign/invisalign-img-mo.png)
 no-repeat center/contain; 
 } 

 #angel .center__bg { 
 background: url(../images/section/angel/angel-img-mo.png) no-repeat
 center/contain; 
 } 

 .invisalign .bottom__box-wrap { 
 flex-wrap: wrap; 
 justify-content: center; 
 gap: 3vw; 
 margin-block: 5vw; 
 } 

 .invisalign .bottom__box { 
 width: calc((100% / 2.5)); 
 padding: 3vw; 
 } 

 .invisalign .bottom__para-1,
 .invisalign .bottom__para-2 { 
 line-height: 1.4; 
 } 

 /* special */
 .ui-d2 .container { 
 flex-direction: column; 
 align-items: center; 
 } 

 .ui-d2 .container > div { 
 width: 95%; 
 text-align: center; 
 } 

 .ui-d2 .right .star-ico { 
 left: 50%; 
 transform: translateX(-50%); 
 margin-top: 7vw; 
 } 

 .ui-d2 h2 { 
 margin-block: 3vw 4.5vw; 
 } 

 .check-list-box { 
 width: 95%; 
 margin: 0 auto; 
 } 

 .check-list-box > li { 
 text-align: left; 
 padding-left: 10vw; 
 } 

 .check-list-box > li:before { 
 left: 3%; 
 width: 20px; 
 } 

 /* how */
 .para--2 { 
 max-width: 90%; 
 margin-bottom: 6vw; 
 } 

 .ui-d3-bottom { 
 flex-wrap: wrap; 
 gap: 35px 20px; 
 margin-top: 55px; 
 } 

 .ui-d3-box .ico { 
 top: -20px; 
 width: 40px; 
 height: 40px; 
 } 

 .ui-d3-box { 
 width: calc((100% / 2) - 30px); 
 padding-block: 5.5vw 4vw; 
 } 

 /* resident */
 #resident { 
 margin-bottom: clamp(100px, 5vw, 5vw); 
 } 

 .resident__para-2,
 .system__para-2 { 
 max-width: 90%; 
 } 

 .resident__box-wrap { 
 flex-wrap: wrap; 
 justify-content: space-between; 
 } 

 .resident__box { 
 width: calc((100% / 2) - 20px); 
 } 

 .resident__arrow { 
 display: none; 
 } 

 .resident__box-before { 
 width: 50%; 
 top: 33%; 
 right: auto; 
 left: -2%; 
 width: 104%; 
 height: 70%; 
 } 

 .resident__box-before .before-text { 
 bottom: -75px; 
 } 

 /* system */
 .system__box-wrap { 
 justify-content: center; 
 flex-wrap: wrap; 
 gap: 0 20px; 
 } 

 .system__box { 
 width: calc((100% / 2) - 50px); 
 } 

 /* example */
 .example__para-1 { 
 margin-top: 4vw; 
 } 

 .example__para-2 { 
 margin-block: 2.5vw 3vw; 
 line-height: 1.4; 
 } 

 .example-box > div { 
 width: 100%; 
 max-width: 450px; 
 height: 120px; 
 } 

 .final-how__para--3,
 .final-how__para--4 { 
 margin-block: 6.5vw; 
 } 

 .link-btn { 
 padding-inline: 5.5vw; 
 } 
 } 

@media (max-width: 768px) { 
 .container { 
 width: calc(100% - 20px); 
 } 

 .hero__box-wrap > .hero-box { 
 width: calc(((100% / 2)) - 20px); 
 padding-block: 3.5vw; 
 } 

 /* invisalign */
 .invisalign__center .center__bg,
 #angel .center__bg { 
 height: 220px; 
 } 

 .check-list-box > li:not(:first-child) { 
 margin-top: 2vw; 
 } 

 /* difference */
 #difference .check-list-box > li:before { 
 left: 12%; 
 } 

 /* footer */
 .footer__inner { 
 padding: 28px 20px; 
 } 

 .footer__top { 
 flex-direction: column; 
 align-items: center; 
 gap: 20px; 
 } 

 .footer__selects { 
 width: 100%; 
 } 

 .fselect { 
 flex: 1; 
 } 

 .fselect__btn { 
 width: 100%; 
 min-width: 0; 
 } 

 .footer__info { 
 flex-direction: column; 
 margin-block: clamp(15px, 3vw, 3vw); 
 } 

 .info__inner { 
 display: flex; 
 } 

 .footer__info * { 
 margin-left: 0; 
 } 
 } 

@media (max-width: 480px) { 
 .sm-none { 
 display: none; 
 } 

 .sm-only { 
 display: block; 
 } 

 .check-list-box > li:before { 
 left: 3%; 
 } 

 .ui-d3-box .ico:after { 
 width: 20px; 
 height: 20px; 
 } 

 #difference .check-list-box > li:before { 
 left: 4%; 
 } 

 [class^="resident__para"],
 [class^="system__para"] { 
 padding-block: 7px; 
 line-height: 1.4; 
 } 

 .hero-container { 
 width: calc(100% - 5px); 
 } 

 .ab-box:after { 
 left: 51.2%; 
 } 

 .system__box { 
 width: calc((100% / 2) - 20px); 
 } 

 .footer__logo img { 
 width: 180px; 
 } 
 }