.centerTop { background: #f3f9fb; padding: 5%; } .centerTop h3 { font-size: 3.6rem; font-weight: 300; color:#000e35; margin-bottom: 0.5em; } .centerTop .t1 { font-size: 2.2rem; color:#212121; font-weight: 500; margin-bottom: 2em; line-height: 1.3em; } .centerTop .t1.mbs { margin-bottom: 0.2em; } .centerTop .t2 { font-size: 1.8rem; color:#585858; line-height: 1.8em; } @media all and (max-width:1080px) { .departTop .t2 br.mo, .centerTop .t2 br.mo { display: none; } } @media all and (max-width:976px) { .centerTop { padding: 7%; } } @media all and (max-width:568px) { .centerTop { padding: 9%; } } @media all and (max-width:480px) { .centerTop { padding: 11% 9%; } .centerTop h3 { font-size: 3.2rem; } } .titCont { position: relative; margin-top: 4%; border-top: 1px solid #dbe0e4; overflow: hidden; } .titCont::before { content:''; width: 24%; height: 1px; position: absolute; left:0; top:0; background: #2155ae; } .titCont > div { float: left; padding: 4rem 0 4rem 2rem; } .titCont .tit { width: 24%; } .titCont .tit h4 { font-size: 2.65rem; color:#212121; } .titCont .cont { width: 76%; padding-top: 4.5rem; } .titCont .cont p { } .titCont .cont.pd0 { padding:0 0 0 2rem; } .titCont.ver2 { border-top:0; } .titCont.ver2::before { display: none; } .titCont.ver2 > div { padding:0; } .titCont.ver2 .cont { padding-top:0; padding-left: 2rem; } @media all and (max-width:1280px) { .titCont { padding: 4% 2%; } .titCont > div { padding: 0; } .titCont .tit { width: 100%; } .titCont .cont { width: 100%; } .titCont .tit h4 br { display: none; } .titCont.ver2 { padding: 2% 0; } .titCont.ver2 .cont { padding-top: 2%; padding-left: 0; } } @media all and (max-width:480px) { .titCont { padding: 6% 2%; } } .titCont2 { position: relative; margin-top: 1%; border-top: 1px solid #dbe0e4; overflow: hidden; } .titCont2::before { content:''; width: 28%; height: 5px; position: absolute; left:0; top:0; background: #19ccd4; } .titCont2 > div { float: left; padding: 1.8rem 0; } .titCont2 .tit { font-size: 0; width: 28%; } .titCont2 .tit img { display: inline-block; vertical-align: middle; } .titCont2 .tit h4 { display: inline-block; vertical-align: middle; font-size: 2.2rem; color:#000e35; font-weight: 500; line-height: 1.25em; width: calc(100% - 90px); padding: 0.4em 0 0 1em; } .titCont2 .tit h4 .em { font-size: 1.6em; font-weight: 500; line-height: 1.25em; } .titCont2 .tit p { font-size: 1.7rem; color:#455a7e; margin-top: 1.5em; line-height: 1.5em; width: 75%; } .titCont2 .cont { width: 72%; padding-left: 3rem; } @media all and (max-width:1280px) { .titCont2 { padding: 4rem 0; } .titCont2::before, .titCont2 .tit { width: 100%; } .titCont2 .tit h4 { padding-left: 0.5em; } .titCont2 .tit h4 .em { font-size: 1.5em; } .titCont2 > div { padding:0; } .titCont2 .cont { width: 100%; padding:0; padding-top: 4rem; } } @media all and (max-width:767px) { .titCont2 .tit img { width: 70px; } .titCont2 .tit h4 { width: calc(100% - 70px); } } .titCont100 { position: relative; margin-top: 1%; border-top: 1px solid #dbe0e4; overflow: hidden; } .titCont100::before { content:''; width: 33.333%; height: 5px; position: absolute; left:0; top:0; background: #19ccd4; } .titCont100 > div { float: left; padding: 1.8rem 0; } .titCont100 .tit { font-size: 0; width: 33.333%; } .titCont100 .tit img { display: inline-block; vertical-align: middle;width: 100%;padding: 0 8%;} .titCont100 .tit h4 { display: inline-block; vertical-align: middle; font-size: 2.2rem; color:#000e35; font-weight: 300; line-height: 1.25em; width: calc(100% - 90px); padding: 0.4em 0 0 1em; } .titCont100 .tit h4 .em { font-size: 1.6em; font-weight: 500; line-height: 1.25em; } .titCont100 .tit p { font-size: 1.7rem; color:#455a7e; margin-top: 1.5em; line-height: 1.5em; width: 75%; } .titCont100 .cont { width: 66.666%; padding-left: 3rem; } @media all and (max-width:1280px) { .titCont100 { padding: 4rem 0; } .titCont100::before, .titCont100 .tit { width: 100%; } .titCont100 .tit h4 { padding-left: 0.5em; } .titCont100 .tit h4 .em { font-size: 1.5em; } .titCont100 > div { padding:0; } .titCont100 .cont { width: 100%; padding:0; padding-top: 4rem; } } @media all and (max-width:767px) { .titCont100 .tit img { width: 70px; } .titCont100 .tit h4 { width: calc(100% - 70px); } } .PTS { position: relative; width: 100%; overflow: hidden; display: table; table-layout: fixed; } .PTS li { counter-increment: number; display: table-cell; } .PTS li:before {color:#09c8bd; font-size: 0.93em; font-weight: 700; font-family: 'Poppins'; letter-spacing: 0.1em; margin-bottom: 1em; display: block; } .PTS li h3 {font-size: 1.2rem; line-height: 2.5em; padding: 0 1.5em; display: inline-block; background: #094d93; color:#fff;font-weight:500;width:90%; border-radius: 3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;margin-bottom:0.5em;font-family:'Montserrat', 'S Dream',sans-serif} .PTS li p { font-size: 1.05em; font-weight:400; color:#333; line-height: 1.55em; padding: 1.2em 0.8em; border-left: 1px solid #cef4f2; font-family:'Montserrat', 'S Dream',sans-serif } @media all and (max-width:976px){ .PTS li p { font-size: 1.4em; } } @media all and (max-width:767px){ .PTS { display: block; } .PTS li { display: block; float: left; width: 50%; margin: 1em 0; } .PTS li p { font-size: 1.625em; text-align: center; } } @media all and (max-width:568px){ .PTS li p { font-size: 1.35em; } } @media all and (max-width:480px){ .PTS li p { font-size: 1.2em; } } .PTS li { padding:0 1%; } .PTS li img {width:100%;} .PTS li:before {display:none} .PTS li p { font-size: 1.225em; font-weight: 500; color:#353535; line-height: 1.15em;margin-top:1em; text-align:center;padding: 0.8em 1em; border-radius: 3em;background: #094d93; color:#fff;width:100%;font-weight:500 } .PTS li p.s100{ font-size: 1.15em; font-weight: 300; color:#656565; line-height: 1.65em; padding: 0.7em 1em; border-left: 0px solid #cef4f2;} .PTS li p.lt1 {font-size:2.2em; padding: 0em 0.8em} .PTS li p.num {margin:0 0 ; color:#e9e9e9; font-size: 3.23em; padding: 0; border-left:0; font-weight: 700; font-family: 'Poppins'; letter-spacing:0; } @media all and (max-width:976px){ .PTS li p { font-size: 1.4em; } } @media all and (max-width:767px){ .PTS { display: block; } .PTS li { display: block; float: left; width: 50%; margin: 1em 0; } .PTS li p { font-size: 1.625em; text-align: center; } } @media all and (max-width:480px){ .PTS.pL_imp1 li { height: auto} } .ttbrov2 { position: relative; width: 100%; display: table; table-layout: fixed; overflow: hidden;margin-top:3% } .ttbrov2 li { position: relative; width:50%; display: table-cell; vertical-align: top; counter-increment: number;vertical-align: middle; } .ttbrov2 li::after { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; right: 0; bottom:0; } .ttbrov2 li:first-child::before { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbrov2 li:first-child {width: 18%;} .ttbrov2 li .img { width: 100%; padding: 8% 8% 0; } .ttbrov2 li .img img { max-width: 100%; } .ttbrov2 li .img::after { content:''; display: block; position: absolute; right:-10px; top: 50%; width: 20px; height:50%; transform: translateY(-50%); font-family: 'Linearicons-Free'; } .ttbrov2 li:last-child .img::after { display: none; } .ttbrov2 li dl { padding:2%; } @media all and (max-width:767px){ .ttbrov2 { position: relative; width: 100%; display: table; table-layout: fixed; overflow: hidden;margin-top:3% } .ttbrov2 li { position: relative; width:100%; display: table-cell; vertical-align: top; counter-increment: number;vertical-align: middle; } .ttbrov2 li::after { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; right: 0; bottom:0; } .ttbrov2 li:first-child::before { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbrov2 li:first-child {width:50%;} .ttbrov2 li .img { width: 100%; padding:0; } .ttbrov2 li .img img { max-width: 100%; } .ttbrov2 li .img::after { content:''; display: block; position: absolute; right:-10px; top: 50%; width: 20px; height:50%; transform: translateY(-50%); font-family: 'Linearicons-Free'; } .ttbrov2 li:last-child .img::after { display: none; } .ttbrov2 li dl { padding:2% 5%; } } @media all and (max-width:480px){ } .ttbro { position: relative; width: 100%; display: table; table-layout: fixed; overflow: hidden;margin-top:3% } .ttbro li { position: relative; width:33.333%; display: table-cell; vertical-align: top; counter-increment: number;vertical-align: middle; } .ttbro li::after { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; right: 0; bottom:0; } .ttbro li:first-child::before { content:''; width: 1px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbro li .img { width: 100%; padding: 5% 5% 0; } .ttbro li .img img { max-width: 100%; } .ttbro li .img::after { content:''; display: block; position: absolute; right:-10px; top: 50%; width: 20px; height:50%; transform: translateY(-50%); font-family: 'Linearicons-Free'; } .ttbro li:last-child .img::after { display: none; } .ttbro li dl { padding: 10%; } .ttbro100 { position: relative; width: 100%; display: table; table-layout: fixed; overflow: hidden;margin-top:3% } .ttbro100 li { position: relative; width:33.333%; display: table-cell; vertical-align: top; counter-increment: number;vertical-align: middle; } .ttbro100 li::after { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; right: 0; bottom:0; } .ttbro100 li:first-child::before { content:''; width: 1px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbro100 li .img { width: 100%; padding: 5% 5% 0; } .ttbro100 li .img img { max-width: 100%; } .ttbro100 li .img::after { content:''; display: block; position: absolute; right:-10px; top: 50%; width: 20px; height:50%; transform: translateY(-50%); font-family: 'Linearicons-Free'; } .ttbro100 li:last-child .img::after { display: none; } .ttbro100 li dl { padding: 10%; } .ttbro101 { position: relative; width: 100%; display: table; table-layout: fixed; overflow: hidden;margin-top:3% } .ttbro101 li { position: relative; width:33.333%; display: table-cell; vertical-align: top; counter-increment: number;vertical-align: middle; } .ttbro101 li::after { content:''; width: 0px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; right: 0; bottom:0; } .ttbro101 li:first-child::before { content:''; width: 1px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbro101 li .img { width: 49.5%; padding:0.5% 0.5% 3%;display: inline-block; } .ttbro101 li .img img { max-width:100%;} .ttbro101 li .img::after { content:'';display: flex; display: block; position: absolute; right:-10px; top: 50%; width: 20px; height:50%; transform: translateY(-50%); font-family: 'Linearicons-Free'; } .ttbro101 li:last-child .img::after { display: none; } .ttbro101 li dl { padding:10%; } /* 여기*/ .nt1000List {margin-top:0;padding-top:0} .nt1000List > h4 { width: 100%; float: left; border: 0px solid #f3f9fb; background:#eee;border:0; border-radius: 16px / 18px; padding:1.5em 1em; margin: 0;vertical-align: middle; } .nt1000List > h4::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background:#004082 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .nt1000List > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); font-size: 1.4rem; font-family:'Montserrat', 'S Dream',sans-serif;font-weight:600;letter-spacing:-0.06em;color:#333;} .nt1000List > h4 span{ display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.1rem; font-family:'Montserrat', 'S Dream',sans-serif;font-weight:300;letter-spacing:-0.02em;color:#333;line-height:200%} .nt1000List > h3 { width: 100%; float: left; border: 0px solid #f3f9fb; background:#eee;border:0; border-radius: 16px / 18px; padding:1.5em 0em 1.5em 1em; margin: 0;vertical-align: middle; } .nt1000List > h3::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background:#004082 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .nt1000List > h3 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); font-size: 1.4rem; font-family:'Montserrat', 'S Dream',sans-serif;font-weight:600;letter-spacing:-0.06em;color:#333;} .nt1000List > h3 span{ display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.05rem; font-family:'Montserrat', 'S Dream',sans-serif;font-weight:300;letter-spacing:-0.02em;color:#333;line-height:180%} /* 여기*/ /* 여기*/ .nt100List {margin-top:0;padding-top:0} .nt100List > h4 { width: 100%; float: left; border: 0px solid #f3f9fb; background:#45bdc2; border:0; border-radius: 70px; padding: 0.9em 1.1em; margin: 8px 0;vertical-align: middle; } .nt100List > h4::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background:url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .nt100List > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.1rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:500;letter-spacing:-0.02em;color:#fff;} @media all and (max-width:1024px){ .nt100List > h4 { width:100%; float:center; border: 0px solid #f3f9fb;background: #45bdc2; border:0; border-radius: 70px; padding: 0.9em 1.1em; margin: 8px 0;vertical-align: middle; } .nt100List > h4::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background:url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .nt100List > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.2em; font-size: 0.9rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:500;letter-spacing:-0.02em;color:#fff;} } @media all and (max-width:767px){ .nt100List > h4 { width:100%; float:center; border: 0px solid #f3f9fb;background: #45bdc2; border:0; border-radius: 10px; padding: 0.9em 0.5em; margin: 8px 0;vertical-align: middle; } .nt100List > h4::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background:url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .nt100List > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 40px); padding-left: 0em; font-size: 0.9rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:500;letter-spacing:-0.02em;color:#fff;} } /* 여기*/ /* font content: 'STEP ' counter(number, decimal-leading-zero);*/ .ttbro li dl::before {color:#09c8bd; font-size: 0.93em; font-weight: 700; font-family: 'Poppins'; letter-spacing: 0.1em; display: block; } .ttbro li dl dt { color:#353535; font-weight: 300; font-size: 1.3em; letter-spacing: -0.07em; margin-bottom: 0.5em; } .ttbro li dl dd .point {border-bottom:0px solid rgba(9,200,189,0.3);} .ttbro.imp2_ttbro li dl dt { color:#353535; font-weight: 400; font-size: 1.5em; letter-spacing: -0.07em; margin-bottom: 0.5em; } .ttbro.imp3_ttbro li dl dt { color:#353535; font-weight: 400; font-size: 1.5em; letter-spacing: -0.07em; margin-bottom: 0.5em; } .ttbro.imp5_ttbro li dl dt { color:#353535; font-weight: 400; font-size: 1.5em; letter-spacing: -0.07em; margin-bottom: 0.5em; } /* @media all and (max-width:976px){ .ttbro, .ttbro li { display: block; } .ttbro li { width:50%; float: left; } .ttbro li:nth-child(odd)::before { content:''; width: 1px; height: 60%; border-right: 0px dashed #e5e5e5; position: absolute; left: 0; bottom:0;} .ttbro li:nth-child(even) .img::after { display: none; } } */ @media all and (max-width:1024px){ .ttbro li { width: 100%; display: table; table-layout: fixed; padding: 5% 0; border-bottom: 1px dashed #e5e5e5; } .ttbro li:first-child { padding-top:0; } .ttbro li .img, .ttbro li dl { display: table-cell; vertical-align: middle; } .ttbro li .img {padding: 0; width: 100%;text-align:center} .ttbro li .img::after { display: none; } .ttbro li dl { width: 100%; border:0 !important; padding: 0 0 0 5%; text-align: left; } .ttbro li::after { width: 100%; height: 1px; border:0; border-right: 1px dashed #e5e5e5;} .ttbro li::before { display: none !important; } } .titCont3 { position: relative; margin-top: 1%; border-top: 1px solid #dbe0e4; overflow: hidden; } .titCont3::before { content:''; width: 32%; height: 5px; position: absolute; left:0; top:0; background: #19ccd4; } .titCont3 > div { float: left; padding: 1.8rem 0; } .titCont3 .tit { font-size: 0; width: 32%; } .titCont3 .tit img { display: inline-block; vertical-align: middle; } .titCont3 .tit h4 { display: inline-block; vertical-align: middle; font-size: 2.2rem; color:#000e35; font-weight: 300; line-height: 1.25em; width: calc(100% - 90px); padding: 0.4em 0 0 1em; } .titCont3 .tit h4 .em { font-size: 1.6em; font-weight: 500; line-height: 1.25em; } .titCont3 .tit p { font-size: 1.7rem; color:#455a7e; margin-top: 1.5em; line-height: 1.5em; width: 75%; } .titCont3 .cont { width: 68%; padding-left: 3rem; } @media all and (max-width:1280px) { .titCont3 { padding: 4rem 0; } .titCont3::before, .titCont3 .tit { width: 100%; } .titCont3 .tit h4 { padding-left: 0.5em; } .titCont3 .tit h4 .em { font-size: 1.5em; } .titCont3 > div { padding:0; } .titCont3 .cont { width: 100%; padding:0; padding-top: 4rem; } } @media all and (max-width:767px) { .titCont3 .tit img { width: 70px; } .titCont3 .tit h4 { width: calc(100% - 70px); } } .my_checkList { overflow: hidden; text-align: left; } .my_checkList > li { width: 100%; float: left; border: 0px solid #f3f9fb;background:#f2f2f2; border:0; border-radius: 70px; padding: 0.9em 1.1em; margin: 5px 0; } .my_checkList > li::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background: #19ccd4 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .my_checkList > li p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.1rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:500;letter-spacing:-0.02em;color:#212121 } .my_checkList.col2 > li { width: 48%; } .my_checkList.col2 > li:nth-child(even) { float: right; } .my_checkList.col2 > li:nth-child(odd) { clear: both; } .my_checkList.col2 > h4 { width: 48%; } .my_checkList.col2 > h4:nth-child(even) { float: right; } .my_checkList > h4 { width: 100%; float: left; border: 0px solid #f3f9fb; padding: 0.9em 1.1em; margin: 5px 0; } .my_checkList > h4::before { display: inline-block; vertical-align: middle;} .my_checkList > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.3rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:600;letter-spacing:-0.02em;color:#39659f } .my_checkList.col3 > li { width: calc(94% / 3); float: left; } .my_checkList.col3 > li + li { margin-left: 2%; } .my_checkList.col2 > li:nth-child(2n+1) { clear: both; margin-left:0; } .my_checkList.ver2 > li { border:0; border-bottom: 3px solid #f3f9fb; border-radius: 0; padding: 0.8em 1em;} .my_checkList.ver2 > li:first-child { padding-top:0; } @media all and (max-width:976px) { .my_checkList.col3 > li { width: calc(94% / 2); } .my_checkList.col3 > li:nth-child(odd) { clear: both; margin-left: 0; } } @media all and (max-width:640px) { .my_checkList.col2.wide > li { width: 100%; } .my_checkList.col3 > li { width: 100%; } .my_checkList.col3 > li + li { margin-left: 0; } } @media all and (max-width:480px) { .my_checkList > li { border-radius: 10px; } .my_checkList > li::before { width: 22px; height: 22px; } .my_checkList > li p { max-width: calc(100% - 22px); } .my_checkList.col2 > li { width: 100%; } } .chblue { overflow: hidden; text-align: left; } .chblue > li { width: 100%; float: left; border: 0px solid #f3f9fb;background:#f2f2f2; border:0; border-radius: 70px; padding: 0.9em 1.1em; margin: 5px 0; } .chblue > li::before { content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background: #094d93 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .chblue > li p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.1rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:500;letter-spacing:-0.02em;color:#212121 } .chblue.col2 > li { width: 48%; } .chblue.col2 > li:nth-child(even) { float: right; } .chblue.col2 > li:nth-child(odd) { clear: both; } .chblue.col2 > h4 { width: 48%; } .chblue.col2 > h4:nth-child(even) { float: right; } .chblue > h4 { width: 100%; float: left; border: 0px solid #f3f9fb; padding: 0.9em 1.1em; margin: 5px 0; } .chblue > h4::before { display: inline-block; vertical-align: middle;} .chblue > h4 p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.2em; font-size: 1.1rem;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:600;letter-spacing:-0.02em;color:#094d93 } .chblue.col3 > li { width: calc(94% / 3); float: left; } .chblue.col3 > li + li { margin-left: 2%; } .chblue.col2 > li:nth-child(2n+1) { clear: both; margin-left:0; } .chblue.ver2 > li { border:0; border-bottom: 3px solid #f3f9fb; border-radius: 0; padding: 0.8em 1em;} .chblue.ver2 > li:first-child { padding-top:0; } @media all and (max-width:976px) { .chblue.col3 > li { width: calc(94% / 2); } .chblue.col3 > li:nth-child(odd) { clear: both; margin-left: 0; } } @media all and (max-width:640px) { .chblue.col2.wide > li { width: 100%; } .chblue.col3 > li { width: 100%; } .chblue.col3 > li + li { margin-left: 0; } } @media all and (max-width:480px) { .chblue > li { border-radius: 10px; } .chblue > li::before { width: 22px; height: 22px; } .chblue > li p { max-width: calc(100% - 22px); } .chblue.col2 > li { width: 100%; } } .my_checkList90 { overflow: hidden; text-align: left; } .my_checkList90 > li { width: 100%; float: left; border: 0px solid #f3f9fb;background:#f2f2f2; border:0; border-radius: 70px; padding: 0.9em 1.1em; margin: 5px 0; } .my_checkList90 > li::before {content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background: #19ccd4 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .my_checkList90 > li p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.5rem;font-weight:600 } .my_checkList90 > li span{ font-size: 1.1rem;font-weight:300;text-align: justify; word-break: break-all } .my_checkList90.col2 > li { width: 48%; } .my_checkList90.col2 > li:nth-child(even) { float: right; } .my_checkList90.col2 > li:nth-child(odd) { clear: both; } .my_checkList90.col3 > li { width: calc(94% / 3); float: left; } .my_checkList90.col3 > li + li { margin-left: 2%; } .my_checkList90.col2 > li:nth-child(2n+1) { clear: both; margin-left:0; } .my_checkList90.ver2 > li { border:0; border-bottom: 3px solid #f3f9fb; border-radius: 0; padding: 0.8em 1em;} .my_checkList90.ver2 > li:first-child { padding-top:0; } @media all and (max-width:976px) { .my_checkList90.col3 > li { width: calc(94% / 2); } .my_checkList90.col3 > li:nth-child(odd) { clear: both; margin-left: 0; } } @media all and (max-width:640px) { .my_checkList90.col2.wide > li { width: 100%; } .my_checkList90.col3 > li { width: 100%; } .my_checkList90.col3 > li + li { margin-left: 0; } } @media all and (max-width:480px) { .my_checkList90 > li { border-radius: 10px; } .my_checkList90 > li::before { width: 22px; height: 22px; } .my_checkList90 > li p { max-width: calc(100% - 22px); } .my_checkList90.col2 > li { width: 100%; } } .check900 { overflow: hidden; text-align: left; } .check900 > li { width: 100%; float: left; border: 0px solid #f3f9fb;background:#f2f2f2; border:0; border-radius: 18px /20px; padding: 1.9em 1.6em; margin: 5px 0; } .check900 > li::before {content: ''; width: 30px; height: 30px; border-radius: 100%; display: inline-block; vertical-align: middle; background: #19ccd4 url("/images/sub/ico_check2.png") no-repeat center; background-size: 100% auto; } .check900 > li p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1.4rem;font-weight:600;letter-spacing:-0.06em } .check900 > li span{ font-size: 1.1rem;font-weight:300;text-align: justify; word-break: break-all;line-height:200% } .check900.col2 > li { width: 48%; } .check900.col2 > li:nth-child(even) { float: right; } .check900.col2 > li:nth-child(odd) { clear: both; } .check900.col3 > li { width: calc(94% / 3); float: left; } .check900.col3 > li + li { margin-left: 2%; } .check900.col2 > li:nth-child(2n+1) { clear: both; margin-left:0; } .check900.ver2 > li { border:0; border-bottom: 3px solid #f3f9fb; border-radius: 0; padding: 0.8em 1em;} .check900.ver2 > li:first-child { padding-top:0; } @media all and (max-width:976px) { .check900.col3 > li { width: calc(94% / 2); } .check900.col3 > li:nth-child(odd) { clear: both; margin-left: 0; } } @media all and (max-width:640px) { .check900.col2.wide > li { width: 100%; } .check900.col3 > li { width: 100%; } .check900.col3 > li + li { margin-left: 0; } } @media all and (max-width:480px) { .check900 > li { border-radius: 10px; } .check900 > li::before { width: 22px; height: 22px; } .check900 > li p { max-width: calc(100% - 22px); } .check900.col2 > li { width: 100%; } } .bgBox { background: #f6f7f9; padding: 2em; border-radius: 5px; } .bdBox { border: 1px solid #d7dde8; padding: 2.5em;} .dsline { border-top: 1px dashed #ccc; padding-top: 2.5%; margin-top: 2.5%;} .dsline.pms { padding-top: 4%; margin-top: 4%; } .dsline.pms2 { padding-top: 2em; margin-top: 2em; } .dsline.pmb { padding-top: 2em; margin-top: 6em; } .slsline { padding-top: 2em; margin-top: 2em; background: url("/images/sub/slsline.png") repeat-x top; } .slsline.pms { padding-top: 1em; margin-top: 1em; } .slsline.pmb { padding-top: 5em; margin-top: 5em; } .s-section.slsline { padding-top: 5%; margin-top: 5%; } .bdBox .dsline { padding-top: 2em; margin-top: 2em; } @media all and (max-width:1280px) { .s-section { padding: 7% 0; } .s-section.pdb { padding: 10% 0; } .dsline.pmb { padding-top: 2em; margin-top: 3em; } .s-section.slsline { padding-top: 7%; margin-top: 7%; } } @media all and (max-width:767px) { .bgBox { padding: 1.5em; } .bdBox { padding: 1.8em; } .slsline.pmb { padding-top: 4em; margin-top: 4em; } } @media all and (max-width:568px) { .s-section { padding: 10% 0; } .s-section.pdb { padding: 12% 0; } .s-section.slsline { padding-top: 10%; margin-top: 10%; } } .titBox { position: relative; width: 100%; border: 0px solid #d7dde8; padding: 0 2.5em 2.5em; margin-top: 3em;background:#e4ecfb;border-radius:2em; } .titBox .tit { margin-top: -1.25em; margin-bottom: 1.2em; } .titBox .tit h6 { font-size: 1.4rem; line-height: 2.2em; padding: 0 1.5em; display: inline-block; background: #094d93; color:#fff;letter-spacing:0; border-radius:3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width:100%;font-family:'Montserrat', 'GowunBatang',sans-serif} .titBox.ver2 { border-color:#f6f9fd; background: #f6f9fd; } .titBox.navy .tit h6 { background: #094d93; } .titBoxList { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: -1.5em; } .titBoxList .titBox { width: calc((100% - 20px) / 2); padding-bottom: 2em; margin-top: 2.5em; } .titBoxList dl.titBox p.num {margin:0 0 ; color:#2a6bbf; font-size: 3.23em; padding: 0; border-left:0; font-weight: 700; font-family:'Barlow'; letter-spacing:-0.06em;text-align:right } .titBoxList dl.titBox span {margin:0 0 ; color:#2a6bbf; font-size: 1.25em; padding: 0; border-left:0; font-weight: 300; letter-spacing:-0.06em;text-align:right } .titBoxList dl.titBox dd {font-size:1.06rem; color:#222; font-weight:500;} .titBoxList dl.titBox p {font-weight:400;line-height:170%;} .titBoxList.col1 .titBox { width: calc((100% - 20px) / 1); } .titBoxList.col3 .titBox { width: calc((100% - 40px) / 3); } .titBoxList.col4 .titBox { width: calc((100% - 30px) / 4); } .titBoxList .titBox.wid100 { width: 100%; } .titBoxList.autoW .titBox.w4 { width: 40%; } .titBoxList.autoW .titBox.w6 { width: calc(60% - 20px); } .titBoxList.autoW .titBox.w3 { width: 30%; } .titBoxList.autoW .titBox.w7 { width: calc(70% - 20px); } .bdBox .titBox { border-color:#f9fafc; background: #f9fafc; } @media all and (max-width:1280px) { .titBoxList.col4 { text-align: left !important; } .titBoxList.col4 .titBox { width: calc((100% - 10px) / 2); } } @media all and (max-width:976px) { .titBoxList.autoW .titBox.w3, .titBoxList.autoW .titBox.w7, .titBoxList.autoW .titBox.w4, .titBoxList.autoW .titBox.w6 { width: 100%; } .bdBox .titBoxList .titBox { width: 100%; } } @media all and (max-width:640px) { .titBox .tit { margin-left: -1em; } .titBoxList .titBox { width: 100%; } .titBoxList.col4 .titBox { width: 100%; } } .tBx { position: relative; width: 100%; border: 0px solid #d7dde8; padding: 0 2.5em 2.5em; margin-top: 3em;background:#e4ecfb;border-radius:2em; } .tBx .tit {margin-bottom: 1.2em; } .tBx h1 { font-size:2rem; line-height: 2.2em; padding:0 1.5em; display: inline-block;color:#2a6bbf;letter-spacing:0;} .tBx .tit h6 { font-size: 1.4rem; line-height: 2.2em; padding:0 1.5em; display: inline-block; background: #094d93; color:#fff;letter-spacing:0; border-radius:3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width:100%;font-family:'Montserrat', 'GowunBatang',sans-serif} .tBx.ver2 { border-color:#f6f9fd; background: #f6f9fd; } .tBx.navy .tit h6 { background: #094d93; } .tBxList { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: -1.5em; } .tBxList .tBx { width: calc((100% - 20px) / 2); padding-bottom: 2em; margin-top: 2.5em; } .tBxList dl.tBx p.num {margin:0 0 ; color:#2a6bbf; font-size: 3.23em; padding: 0; border-left:0; font-weight: 600; font-family:'Montserrat', 'S Dream',sans-serif; letter-spacing:-0.06em;text-align:center} .tBxList dl.tBx span {margin:0 0 ; color:#2a6bbf; font-size: 0.65em; padding: 0; border-left:0; font-weight: 500;letter-spacing:-0.06em;font-family:'Montserrat', 'S Dream',sans-serif;} .tBxList dl.tBx dd {font-size:1.06rem; color:#222; font-weight:500;} .tBxList dl.tBx p {font-weight:400;line-height:170%;} .tBxList.col1 .tBx { width: calc((100% - 20px) / 1); } .tBxList.col3 .tBx { width: calc((100% - 40px) / 3); } .tBxList.col4 .tBx { width: calc((100% - 30px) / 4); } .tBxList .tBx.wid100 { width: 100%; } .tBxList.autoW .tBx.w4 { width: 40%; } .tBxList.autoW .tBx.w6 { width: calc(60% - 20px); } .tBxList.autoW .tBx.w3 { width: 30%; } .tBxList.autoW .tBx.w7 { width: calc(70% - 20px); } .bdBox .tBx { border-color:#f9fafc; background: #f9fafc; } @media all and (max-width:1280px) { .tBxList.col4 { text-align: left !important; } .tBxList.col4 .tBx { width: calc((100% - 10px) / 2); } } @media all and (max-width:976px) { .tBxList.autoW .tBx.w3, .tBxList.autoW .tBx.w7, .tBxList.autoW .tBx.w4, .tBxList.autoW .tBx.w6 { width: 100%; } .bdBox .tBxList .tBx { width: 100%; } } @media all and (max-width:640px) { .tBx .tit { margin-left: -1em; } .tBxList .tBx { width: 100%; } .tBxList.col4 .tBx { width: 100%; } } .cList { overflow: hidden; text-align: left; } .cList > li { width: 100%; float: left; border: 0px solid #f3f9fb;background:#fff; border:0; border-radius:0px; padding: 0.4em 1.1em; margin: 2px 0; } .cList > li::before {content: ''; width: 21px; height: 20px; border-radius: 100%; display: inline-block; vertical-align: middle; background: #fff url("/images/circlecheck-b.png") no-repeat center; background-size: 100% auto; } .cList > li p { display: inline-block; vertical-align: middle; max-width: calc(100% - 30px); padding-left: 0.7em; font-size: 1rem;font-weight:300 } .cList > li span{ font-size: 1.1rem;font-weight:300;text-align: justify; word-break: break-all } .cList.col2 > li { width: 48%; } .cList.col2 > li:nth-child(even) { float: right; } .cList.col2 > li:nth-child(odd) { clear: both; } .cList.col3 > li { width: calc(94% / 3); float: left; } .cList.col3 > li + li { margin-left: 2%; } .cList.col2 > li:nth-child(2n+1) { clear: both; margin-left:0; } .cList.ver2 > li { border:0; border-bottom: 3px solid #f3f9fb; border-radius: 0; padding: 0.8em 1em;} .cList.ver2 > li:first-child { padding-top:0; } @media all and (max-width:976px) { .cList.col3 > li { width: calc(94% / 2); } .cList.col3 > li:nth-child(odd) { clear: both; margin-left: 0; } } @media all and (max-width:640px) { .cList.col2.wide > li { width: 100%; } .cList.col3 > li { width: 100%; } .cList.col3 > li + li { margin-left: 0; } } @media all and (max-width:480px) { .cList > li { border-radius: 10px; } .cList > li::before { width: 22px; height: 22px; } .cList > li p { max-width: calc(100% - 22px); } .cList.col2 > li { width: 100%; } } .orderList { overflow: hidden; text-align: left; counter-reset: orderList; } .orderList > li { position: relative; counter-increment: orderList; padding: 0.6em 0.5em; border-bottom: 1px dashed #dedede; } .orderList > li::before { content: counter(orderList, decimal-leading-zero); color:#fff; width: 34px; line-height: 34px; display: inline-block; margin-right: 1.4em; background:#455a7e; border-radius: 5px; text-align: center; font-size: 1.3rem; font-weight: 700; vertical-align: middle; } .orderList > li p { display: inline-block; max-width: calc(100% - 34px - 1.4em); vertical-align: middle; line-height: 1.3em; font-size: 1.7rem; } .orderList.fs-s li p { font-size: 1.6rem; } .orderList.col2 > li { width: 48%; float: left; } .orderList.col2 > li:nth-child(even) { float: right; } @media all and (max-width:860px) { .orderList.col2 > li { width: 100%; } } .dotList > li { position: relative; padding-left: 1em; margin: 0.7em 0; } .dotList > li:before { content:''; width: 4px; height: 4px; background:#28cbd5; position: absolute; left:0; top: 0.6em;} .dotList > li p { line-height: 1.3em; } .dotList.col3 { font-size:0; } .dotList.col3 > li { display: inline-block; min-width: calc(100%/3); font-size: 1.6rem; } .dotList.col2 { font-size:0; } .dotList.col2 > li { display: inline-block; min-width: calc(100%/2); font-size: 1.6rem; } @media all and (max-width:767px) { .dotList.col3 > li { min-width: calc(100%/2); margin: 0.4em 0; } .dotList.col2 > li { min-width: 100%; margin: 0.3em 0; } } #wellbeing1 .in-box {display:flex; border-top:1px dashed #ddd; padding:3em 1em 0 1em; margin-top:3em; align-items: center; } #wellbeing1 .in-box:first-child {margin-top:0; } #wellbeing1 .in-box #imgWrap {width:400px; text-align:center} #wellbeing1 .in-box #imgWrap img { width:100%; max-width:500px } #wellbeing1 .in-box #contWrap { width:calc(100% - 400px); padding-left:3em; margin:1em 0} #wellbeing1 .in-box .cont dt {font-size:28px; font-weight:700; color:#222; } #wellbeing1 .in-box .cont dd {margin-top:0.7em; font-size:18px; line-height:1.6em } #wellbeing1 .in-box .adv {margin-top:2.4em;} #wellbeing1 .in-box .adv dt {font-size:20px;padding:0.4em 1.5em; background:#5d9af3; border-radius:30px; display:inline-block; color:#FFF; font-weight:600;} #wellbeing1 .in-box .adv dd {padding-top:0.7em;font-size:18px;font-weight:500;color:#333 } @media all and (max-width:1360px) { #wellbeing1 .in-box #imgWrap {width:300px;} #wellbeing1 .in-box #contWrap { width:calc(100% - 300px); } #wellbeing1 .in-box .adv dd {padding-top:0.7em;font-size:17px;font-weight:500;color:#333 } #wellbeing1 .in-box .adv dd br{display:none } } @media all and (max-width:1280px) { #wellbeing1 .in-box #imgWrap {width:300px;} #wellbeing1 .in-box #contWrap { width:calc(100% - 300px); } #wellbeing1 .in-box .adv dd {padding-top:0.7em;font-size:16px;font-weight:500;color:#333 } #wellbeing1 .in-box .adv dd br{display:none } } @media all and (max-width:976px) { #wellbeing1 .in-box {flex-wrap: wrap} #wellbeing1 .in-box #imgWrap {width:100%;} #wellbeing1 .in-box #contWrap { padding-top:2em; padding-left:0; width:100%; margin:0 } #wellbeing1 .in-box .adv dd {padding-top:0.7em;font-size:14px;font-weight:500;color:#333 } #wellbeing1 .in-box .adv dd br{display:none } } @media all and (max-width:976px) { #wellbeing1 .in-box {flex-wrap: wrap} #wellbeing1 .in-box #imgWrap {width:100%;} #wellbeing1 .in-box #imgWrap img {display:none } #wellbeing1 .in-box #contWrap { padding-top:2em; padding-left:0; width:100%; margin:0 } #wellbeing1 .in-box .adv dd {padding-top:0.7em;font-size:14px;font-weight:500;color:#333 } #wellbeing1 .in-box .adv dd br{display:none } } #circleList { display:flex; justify-content:center; gap:-20px} #circleList li {width:180px; text-align:center} #circleList li dl dt {width:200px; line-height:200px; font-size:20px; font-weight:600; background:#5b9bf1; border-radius:100%; color:#FFF; margin:0 auto; border:0px solid #dafaff;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:0 } #circleList li:nth-child(2) dl dt {background:#5082d1; border:0px solid #e3ffe7} #circleList li:nth-child(3) dl dt {background:#476fad; border:0px solid #e3ffe7} #circleList li:nth-child(4) dl dt {background:#395885; border:0px solid #e3ffe7} #circleList li:nth-child(5) dl dt {background:#2a456c; border:0px solid #e3ffe7} #circleList li dl dd {margin-top:1em; font-size:18px;} #circleList li dl dd span {display:inline-block; margin:5px 0.5em; color:#222; line-height:1.6em; border-bottom:1px dashed #e3e3e3} #circleList.none-dd {gap:-20px} #circleList.none-dd li {width:200px } #circleList.num li dl dt {position:relative; overflow:hidden} #circleList.num li dl dt p.num { font-size:50px; color:#FFF; font-weight:900; opacity:.2; position:absolute; right:0.4em; bottom:0.4em; line-height:1.0em;} #circleList.disease2 {flex-wrap:wrap; max-width: 1180px; margin:0 auto; width:100%} /* @media all and (max-width:1399px){ #circleList { gap:30px} #circleList.none-dd {width:100%;max-width: 1070px; margin:0 auto; flex-wrap:wrap} #circleList.none-dd li {width:220px } #circleList.disease2 { gap:30px} } */ @media all and (max-width:1399px){ #circleList { width:100%;max-width:1280px; margin:0 auto; flex-wrap:wrap;} #circleList li dl dt {width:180px; line-height:180px; font-size:22px; font-weight:600; background:#5b9bf1; border-radius:100%; color:#FFF; margin:0 auto; border:0px solid #dafaff;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:0 } } @media all and (max-width:767px){ #circleList { width:100%;max-width:968px; margin:0 auto; flex-wrap:wrap;} #circleList li dl dt {width:170px; line-height:170px; font-size:17px; font-weight:600; background:#5b9bf1; border-radius:100%; color:#FFF; margin:0 auto; border:0px solid #dafaff;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:0 } #circleList li dl dd {margin-top:1em; font-size:15px;} } @media all and (max-width:480px){ #circleList li {width:50%;} #circleList li dl dt {width:42vw; line-height:calc(42vw - 10px); } #circleList li dl dt {width:170px; line-height:170px; font-size:17px; font-weight:600; background:#5b9bf1; border-radius:100%; color:#FFF; margin:0 auto; border:0px solid #dafaff;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:0 } #circleList li dl dd {margin-top:1em; font-size:15px;} #circleList.none-dd {gap:10px 0} #circleList.none-dd li {width:50% } } #circleList2 { display:flex;justify-content:center; flex-wrap:wrap;gap:10px;} #circleList2 li {position:relative; counter-increment: number;} #circleList2 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr2.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-40px; top:50%; margin-top:-35px} #circleList2 li:nth-child(4n+1) {margin-left:0} #circleList2 li:nth-child(4n+1)::before {display:none} #circleList2 li dl dt {width:260px;line-height:30px; font-size:24px; font-weight:600; background:#57bfe1; border-radius:20%; color:#FFF; margin:0 auto;padding:70px 10px} #circleList2 li dl dt span{opacity:.2;font-size:2.4rem;font-weight:600;font-family:'Barlow';} #circleList2 li dl p{font-size:1rem;font-weight:400;} #circleList2 li:nth-child(even) dl dt {background:#3895b4; border:0px solid #e3ffe7;margin-top:20px} #circleList2 li dl dd {margin-top:1em; font-size:18px;} #circleList2 li dl dd span {display:inline-block; margin:5px 0.5em; color:#222; line-height:1.6em; border-bottom:1px dashed #e3e3e3} #circleList2.none-dd {gap:20px} #circleList2.none-dd li {width:220px } #circleList2.num li dl dt {position:relative; overflow:hidden} #circleList2.num li dl dt p.num { font-size:50px; color:#FFF; font-weight:900; opacity:.2; position:absolute; right:0.4em; bottom:0.4em; line-height:1.0em;} #circleList2.disease2 {flex-wrap:wrap; max-width: 1180px; margin:0 auto; width:100%} @media all and (max-width:1399px){ #circleList2 { gap:30px} #circleList2.none-dd {width:100%;max-width: 1070px; margin:0 auto; flex-wrap:wrap} #circleList2.none-dd li {width:220px } #circleList2.disease2 { gap:30px} } @media all and (max-width:1280px){ #circleList2 { width:100%;max-width: 750px; margin:0 auto; flex-wrap:wrap} } @media all and (max-width:976px){ #circleList2 { gap:20px 0 } #circleList2 li {width:220px;} #circleList2 li dl dt {width:200px; line-height:180px;} #circleList2.none-dd {gap:20px 0} #circleList2.disease2 { gap:20px 0} } @media all and (max-width:480px){ #circleList2 li {width:50%;} #circleList2 li dl dt {width:42vw; line-height:calc(42vw - 10px); border:5px solid #e8eff0; } #circleList2 li:nth-child(even) dl dt {border:5px solid #e8f0e9} #circleList2 li dl dd {margin-top:0.5em; } #circleList2.none-dd {gap:10px 0} #circleList2.none-dd li {width:50% } } #circleList3 { display:flex;justify-content:center; flex-wrap:wrap;gap:10px;} #circleList3 li {position:relative; counter-increment: number;} #circleList3 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr2.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-40px; top:50%; margin-top:-35px} #circleList3 li:nth-child(4n+1) {margin-left:0} #circleList3 li:nth-child(4n+1)::before {display:none} #circleList3 li dl dt {width:400px;line-height:30px; font-size:24px; font-weight:600; background:#57bfe1; border-radius:12% / 14%; color:#FFF; margin:0 auto;padding:40px} #circleList3 li dl dt span{opacity:.4;font-size:3rem;font-weight:600;font-family:'Barlow';} #circleList3 li dl p{font-size:1rem;font-weight:400;margin-top:30px;text-align:left;line-height:150%} #circleList3 li:nth-child(even) dl dt {background:#3895b4; border:0px solid #e3ffe7;margin-top:20px} #circleList3 li dl dd {margin-top:1em; font-size:18px;} #circleList3 li dl dd span {display:inline-block; margin:5px 0.5em; color:#222; line-height:1.6em; border-bottom:1px dashed #e3e3e3} #circleList3.none-dd {gap:20px} #circleList3.none-dd li {width:220px } #circleList3.num li dl dt {position:relative; overflow:hidden} #circleList3.num li dl dt p.num { font-size:50px; color:#FFF; font-weight:900; opacity:.2; position:absolute; right:0.4em; bottom:0.4em; line-height:1.0em;} #circleList3.disease2 {flex-wrap:wrap; max-width: 1180px; margin:0 auto; width:100%} @media all and (max-width:1399px){ #circleList3 { gap:20px} #circleList3.none-dd {width:100%;max-width: 1280px; margin:0 auto; flex-wrap:wrap} #circleList3.none-dd li {width:220px } #circleList3.disease2 { gap:30px} } @media all and (max-width:1280px){ #circleList3 { width:100%;max-width: 1100px; margin:0 auto; flex-wrap:wrap} #circleList3 li dl dt {width:340px;line-height:30px; font-size:18px; font-weight:600; background:#57bfe1; border-radius:8% / 6%; color:#FFF; margin:0 auto;padding:30px} } @media all and (max-width:976px){ #circleList3 { gap:20px 0 } #circleList3 li {width:220px;} #circleList3 li dl dt {width:200px; line-height:180px;} #circleList3.none-dd {gap:20px 0} #circleList3.disease2 { gap:20px 0} } @media all and (max-width:480px){ #circleList3 li {width:50%;} #circleList3 li dl dt {width:42vw; line-height:calc(42vw - 10px); border:5px solid #e8eff0; } #circleList3 li:nth-child(even) dl dt {border:5px solid #e8f0e9} #circleList3 li dl dd {margin-top:0.5em; } #circleList3.none-dd {gap:10px 0} #circleList3.none-dd li {width:50% } } #clinicTop2 {display:flex; margin:5% 0;background: #ffe3a8;color: #212121;text-align: center;border-top-right-radius:60px; } #clinicTop2 > div {width:49.5%;} #clinicTop2 #imgWrap {} #clinicTop2 #imgWrap .img {position:relative; width:fit-content;} #clinicTop2 #imgWrap img {width:100%; max-width:690px;border-bottom-right-radius:60px;} #clinicTop2 #contWrap {padding:0 25px;display:flex; align-items:center;justify-content:center;} #clinicTop2 #contWrap h3 {font-size:52px; color:#111; font-weight:normal;} #clinicTop2 #contWrap .eng {margin:1em 0 1.8em; font-size:15px;font-weight:700; opacity:.3; text-transform:uppercase; letter-spacing:-0.06em.3em} #clinicTop2 #contWrap .t1 {font-size:18px; line-height:1.6em} #clinicTop2 #contWrap ul.cdc {font-size:18px; line-height:1.6em; width: 260px; margin: 10px auto; text-align: left;} @media all and (max-width:1399px){ #clinicTop2 { flex-wrap:wrap; } #clinicTop2 #imgWrap {width:100%;} #clinicTop2 #imgWrap .img {margin:0 auto} #clinicTop2 #imgWrap img {border-top-right-radius:50px; } #clinicTop2 #contWrap { margin-top:4em; width:100%; padding:0 20px 50px; text-align:center} } @media all and (max-width:976px){ #clinicTop2 #imgWrap .img:before {left:-8px; bottom:-8px;} } @media all and (max-width:787px){ #clinicTop2 #contWrap h3 {font-size:30px;} #clinicTop2 #contWrap .eng {font-size:13px;} #clinicTop2 #contWrap .t1 {font-size:15px; line-height:1.6em} #clinicTop2 #contWrap ul.cdc {font-size:15px;width: 220px;} } #checkList2 {display:flex; flex-wrap:wrap; gap:10px} #checkList2 li {border-radius:100px; border:8px solid #eff5f2; padding:1em 2em 1em 1em; position:relative; width: 49%;} #checkList2 li:before {content:''; width:17px; height:16px; background:url('/images/sub/check-dot.png')no-repeat left center; position:absolute; left:1.5em; top:50%; transform:translateY(-50%); background-size:100% auto;filter: invert(59%) sepia(7%) saturate(3820%) hue-rotate(122deg) brightness(142%) contrast(88%);} #checkList2 li p {padding-left:1.9em; font-size:17px} #checkList2.clinic {justify-content:space-between;} #checkList2.clinic li p {font-size:18px} @media all and (max-width:976px){ #checkList2 { gap:5px} #checkList2 li { border:5px solid #eff5f2; padding:0.7em 1em 0.7em 0.7em;} #checkList2 li p {font-size: 16px;} #checkList2.clinic li p {font-size:16px} #checkList2 li:before {left:1em;} } @media all and (max-width:787px){ #checkList2 li {width: 100%;} } @media all and (max-width:480px){ #checkList2 li:before { width:13px;} #checkList2 li p {padding-left:1.5em; font-size:14px} #checkList2.clinic li p {font-size:14px} } #stepList {display:flex; flex-wrap:wrap;margin-bottom:5% } #stepList li {border:1px solid rgba(245,180,58,0.2); position:relative; counter-increment: number; } #stepList li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr1.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-40px; top:50%; margin-top:-35px} #stepList li img {width:100%} #stepList li dl {padding:2em 1em 1em 1em; position:relative;} #stepList li dl:after {} /* #stepList li dl:after {content: counter(number, decimal-leading-zero); font-size:4.0rem; color:#edc27e; font-family:'Barlow'; font-weight:300; position:absolute; right:5%; top:-4.55em; } */ #stepList li dl dt {font-size:1.3rem; color:#222; font-weight:600;letter-spacing:-0.06em;} #stepList li dl dd {margin-top:1em;font-size:1rem; line-height:1.7em;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:400;letter-spacing:-0.06em;} #stepList li h4 {padding:10px 5px 8px;width:150px;background:#45bdc2;color:#fff;vertical-align:top;font-weight:500;border-radius : 100px 100px 100px 100px;font-family:'Montserrat', 'S Dream',sans-serif} #stepList.w3 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #stepList.w3 li:nth-child(4n+1) {margin-left:0} #stepList.w3 li:nth-child(4n+1)::before {display:none} #stepList.w3 li dl dd {font-size: 1.1em;line-height:1.625em;font-weight:400;color:#333} #stepList.w7 li {width:calc(33.333% - 33.333px); margin-left:30px; margin-bottom:50px } #stepList.w7 li:nth-child(3n+1) {margin-left:0} #stepList.w7 li:nth-child(3n+1)::before {display:none} #stepList.w5 li {width:calc(20% - 20px); margin-left:20px; margin-bottom:50px } #stepList.w5 li:nth-child(5n+1) {margin-left:0} #stepList.w5 li:nth-child(5n+1)::before {display:none} @media all and (max-width:1170px) { #stepList li:before { width:60px; height:60px; line-height:60px; background-size: cover} #stepList li dl dd { line-height:1.6em;} #stepList.w3 li dl dd br{display:none} } @media all and (max-width:1024px) { #stepList.w3 li {width:calc(50% - 25px); } #stepList.w3 li:nth-child(3n+1) {} #stepList.w3 li:nth-child(3n+1)::before {display:block} #stepList.w3 li:nth-child(2n+1) {margin-left:0} #stepList.w3 li:nth-child(2n+1)::before {display:none} } @media all and (max-width:580px) { #stepList li:before {position:absolute; left:50%; top:unset; bottom:-20px; transform:translateX(-50%) rotate(90deg); margin-top:unset} #stepList li:last-child::before {display:none} #stepList li dl {padding-bottom:3.2em} #stepList.w3 li {width:100%; margin-left:0;margin-bottom:30px;margin-top:30px} #stepList.w3 li:nth-child(3n+1) {margin-left:0;} #stepList.w3 li:nth-child(2n+1)::before {display:block} #stepList.w3 li dl dd br{display:none} } @media all and (max-width:480px) { #stepList li:before {width:12vw; height:12vw; line-height:12vw; } } #step2 {display:flex; flex-wrap:wrap;margin-bottom:5% } #step2 li {border:0px solid rgba(245,180,58,0.1); position:relative; counter-increment: number; } #step2 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr1.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-50px; top:30%; margin-top:-35px} #step2 li img {width:100%;border-radius:15px;} #step2 li dl {padding:2em 1em 1em 1em; position:relative;} #step2 li dl:after {content: counter(number, decimal-leading-zero); font-size:4.0rem; color:#edc27e; font-family:'Barlow'; font-weight:600; position:absolute; left:5%; top:-4.15em; } #step2 li dl dt {font-size:1.4rem; color:#222; font-weight:600} #step2 li dl dd {margin-top:1em; line-height:1.4em;} #step2 li h4 {padding:13px 5px 8px;width:150px;background:#45bdc2;color:#fff;vertical-align:top;font-weight:300;border-radius : 100px 100px 100px 100px;} #step2.w3 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #step2.w3 li:nth-child(4n+1) {margin-left:0} #step2.w3 li:nth-child(4n+1)::before {display:none} #step2.w7 li {width:calc(33.333% - 33.333px); margin-left:30px; margin-bottom:50px } #step2.w7 li:nth-child(3n+1) {margin-left:0} #step2.w7 li:nth-child(3n+1)::before {display:none} #step2.w5 li {width:calc(20% - 20px); margin-left:20px; margin-bottom:50px } #step2.w5 li:nth-child(5n+1) {margin-left:0} #step2.w5 li:nth-child(5n+1)::before {display:none} @media all and (max-width:1170px) { #step2 li:before { width:60px; height:60px; line-height:60px; background-size: cover} #step2 li dl dd { line-height:1.6em;} } @media all and (max-width:1024px) { #step2.w3 li {width:calc(50% - 25px); } #step2.w3 li:nth-child(3n+1) {margin-left:50px} #step2.w3 li:nth-child(3n+1)::before {display:block} #step2.w3 li:nth-child(2n+1) {margin-left:0} #step2.w3 li:nth-child(2n+1)::before {display:none} } @media all and (max-width:580px) { #step2 li:before {position:absolute; left:50%; top:unset; bottom:-20px; transform:translateX(-50%) rotate(90deg); margin-top:unset} #step2 li:last-child::before {display:none} #step2 li dl {padding-bottom:3.2em} #step2.w3 li {width:100%; margin-left:0; margin-bottom:30px} #step2.w3 li:nth-child(3n+1) {margin-left:0} #step2.w3 li:nth-child(2n+1)::before {display:block} } @media all and (max-width:480px) { #step2 li:before { width:12vw; height:12vw; line-height:12vw; } } #step55 {display:flex; flex-wrap:wrap;margin-bottom:5% } #step55 li {border:1px solid rgba(245,180,58,0.1); position:relative; counter-increment: number; } #step55 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr1.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-50px; top:30%; margin-top:-145px} #step55 li img {width:100%;} #step55 li dl {padding:2em 1em 1em 1em; position:relative;} #step55 li dl:after {content: counter(number, decimal-leading-zero); font-size:4.0rem; color:#edc27e; font-family:'Barlow'; font-weight:100; position:absolute; left:5%; top:-3.65em; } #step55 li dl dt {font-size:1.4rem; color:#222; font-weight:600} #step55 li dl dd {margin-top:1em; line-height:1.4em;} #step55 li h4 {padding:10px 5px 8px;width:150px;background:#45bdc2;color:#fff;vertical-align:top;font-weight:500;border-radius : 100px 100px 100px 100px;font-family:'Montserrat', 'S Dream',sans-serif} #step55.w3 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #step55.w3 li:nth-child(4n+1) {margin-left:0} #step55.w3 li:nth-child(4n+1)::before {display:none} #step55.w7 li {width:calc(33.333% - 33.333px); margin-left:30px; margin-bottom:90px } #step55.w7 li:nth-child(3n+1) {margin-left:0} #step55.w7 li:nth-child(3n+1)::before {display:none} #step55.w5 li {width:calc(20% - 20px); margin-left:20px; margin-bottom:50px } #step55.w5 li:nth-child(5n+1) {margin-left:0} #step55.w5 li:nth-child(5n+1)::before {display:none} @media all and (max-width:1170px) { #step55 li:before { width:60px; height:60px; line-height:60px; background-size: cover} #step55 li dl dd { line-height:1.6em;} } @media all and (max-width:1024px) { #step55.w3 li {width:calc(50% - 25px); } #step55.w3 li:nth-child(3n+1) {margin-left:50px} #step55.w3 li:nth-child(3n+1)::before {display:block} #step55.w3 li:nth-child(2n+1) {margin-left:0} #step55.w3 li:nth-child(2n+1)::before {display:none} } @media all and (max-width:580px) { #step55 li:before {position:absolute; left:50%; top:unset; bottom:-20px; transform:translateX(-50%) rotate(90deg); margin-top:unset} #step55 li:last-child::before {display:none} #step55 li dl {padding-bottom:3.2em} #step55.w3 li {width:100%; margin-left:0; margin-bottom:30px} #step55.w3 li:nth-child(3n+1) {margin-left:0} #step55.w3 li:nth-child(2n+1)::before {display:block} } @media all and (max-width:480px) { #step55 li:before { width:12vw; height:12vw; line-height:12vw; } } #step77 {display:flex; flex-wrap:wrap;margin-bottom:5% } #step77 li {border:1px solid rgba(245,180,58,0.1); position:relative; counter-increment: number; } #step77 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr1.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-50px; top:30%; margin-top:35px} #step77 li img {width:100%;} #step77 li dl {padding:2em 1em 1em 1em; position:relative;} #step77 li dl:after {content: counter(number, decimal-leading-zero); font-size:4.0rem; color:#edc27e; font-family:'Barlow'; font-weight:100; position:absolute; left:5%; top:-3.95em; } #step77 li dl dt {font-size:1.4rem; color:#222; font-weight:600} #step77 li dl dd {margin-top:1em; line-height:1.4em;} #step77 li h4 {padding:10px 5px 8px;width:150px;background:#45bdc2;color:#fff;vertical-align:top;font-weight:500;border-radius : 100px 100px 100px 100px;font-family:'Montserrat', 'S Dream',sans-serif} #step77.w3 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #step77.w3 li:nth-child(4n+1) {margin-left:0} #step77.w3 li:nth-child(4n+1)::before {display:none} #step77.w7 li {width:calc(33.333% - 33.333px); margin-left:30px; margin-bottom:90px } #step77.w7 li:nth-child(3n+1) {margin-left:0} #step77.w7 li:nth-child(3n+1)::before {display:none} #step77.w5 li {width:calc(20% - 20px); margin-left:20px; margin-bottom:50px } #step77.w5 li:nth-child(5n+1) {margin-left:0} #step77.w5 li:nth-child(5n+1)::before {display:none} @media all and (max-width:1170px) { #step77 li:before { width:60px; height:60px; line-height:60px; background-size: cover} #step77 li dl dd { line-height:1.6em;} } @media all and (max-width:1024px) { #step77.w3 li {width:calc(50% - 25px); } #step77.w3 li:nth-child(3n+1) {margin-left:50px} #step77.w3 li:nth-child(3n+1)::before {display:block} #step77.w3 li:nth-child(2n+1) {margin-left:0} #step77.w3 li:nth-child(2n+1)::before {display:none} } @media all and (max-width:580px) { #step77 li:before {position:absolute; left:50%; top:unset; bottom:-20px; transform:translateX(-50%) rotate(90deg); margin-top:unset} #step77 li:last-child::before {display:none} #step77 li dl {padding-bottom:3.2em} #step77.w3 li {width:100%; margin-left:0; margin-bottom:30px} #step77.w3 li:nth-child(3n+1) {margin-left:0} #step77.w3 li:nth-child(2n+1)::before {display:block} } @media all and (max-width:480px) { #step77 li:before { width:12vw; height:12vw; line-height:12vw; } } #step90 {display:flex; flex-wrap:wrap;margin-bottom:5% } #step90 li {border:0px solid rgba(245,180,58,0.1); position:relative; counter-increment: number; } #step90 li:before {content:''; width:70px; height:70px; line-height:70px; border-radius:50%; background:rgba(255,255,255,0.95) url('/images/sub/arr1.png'); box-shadow:3px 3px 10px rgba(0,0,0,0.1); position:absolute; left:-50px; top:30%; margin-top:0px} #step90 li img {width:100%;border-radius:15px;} #step90 li dl {padding:2em 1em 1em 1em; position:relative;} #step90 li dl:after { font-size:4.0rem; color:#edc27e; font-family:'Barlow'; font-weight:600; position:absolute; left:5%; top:-4.15em; } #step90 li dl dt {font-size:1.4rem; color:#222; font-weight:600} #step90 li dl dd {margin-top:1em; line-height:1.4em;} #step90 li h4 {padding:13px 5px 8px;width:150px;background:#45bdc2;color:#fff;vertical-align:top;font-weight:300;border-radius : 100px 100px 100px 100px;} #step90.w3 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #step90.w3 li:nth-child(4n+1) {margin-left:0} #step90.w3 li:nth-child(4n+1)::before {display:none} #step90.w7 li {width:calc(25% - 25px); margin-left:30px; margin-bottom:50px } #maptxt ul li:first-child {width:25%} #step90.w7 li:nth-child(2) {width:25%} #step90.w7 li:nth-child(3) {width:40%} #step90.w5 li {width:calc(20% - 20px); margin-left:20px; margin-bottom:50px } #step90.w5 li:nth-child(5n+1) {margin-left:0} #step90.w5 li:nth-child(5n+1)::before {display:none} @media all and (max-width:1170px) { #step90 li:before { width:60px; height:60px; line-height:60px; background-size: cover} #step90 li dl dd { line-height:1.6em;} } @media all and (max-width:1024px) { #step90.w3 li {width:calc(50% - 25px); } #step90.w3 li:nth-child(3n+1) {margin-left:50px} #step90.w3 li:nth-child(3n+1)::before {display:block} #step90.w3 li:nth-child(2n+1) {margin-left:0} #step90.w3 li:nth-child(2n+1)::before {display:none} } @media all and (max-width:580px) { #step90 li:before {position:absolute; left:50%; top:unset; bottom:-20px; transform:translateX(-50%) rotate(90deg); margin-top:unset} #step90 li:last-child::before {display:none} #step90 li dl {padding-bottom:3.2em} #step90.w3 li {width:100%; margin-left:0; margin-bottom:30px} #step90.w3 li:nth-child(3n+1) {margin-left:0} #step90.w3 li:nth-child(2n+1)::before {display:block} } @media all and (max-width:480px) { #step90 li:before { width:12vw; height:12vw; line-height:12vw; } } /* special */ .special{background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url(/images/new/bg004.jpg) no-repeat center top / cover; padding: 50px 0 50px;} .special .s-inner{} .special .s-inner .m_tit h3{color: #fff; font-size: var(--fz50);} .special .s-inner .m_tit h3 span{color: #1dffec;} .special .s-inner .m_tit p{color: #fff;} .special .s-inner .list{margin-top: 45px; display: flex; justify-content: center; gap:0 10px;} .special .s-inner .list li{text-align: center;} .special .s-inner .list li .img{} .special .s-inner .list li .img img{max-width: 100%;padding:20px;height:320px;background:linear-gradient(-45deg, transparent 15px, #fff 0);} .special .s-inner .list li h2{font-size:1.3em;text-align:center;font-weight:500;line-height: 1.5em; margin-top: 30px;max-width:250px;padding:0 3%;font-family:'Montserrat', 'S Dream',sans-serif;letter-spacing:-0.06em } .special .s-inner .list li p{font-size:1.1em;text-align:center; color: #fff; line-height: 1.6em; margin-top: 30px;max-width:250px;padding:0 5% } .special .s-inner .list li p b{word-break:keep-all; } @media all and (max-width:1400px){ .special .s-inner .list{margin-top: 55px; gap:0 40px;} .special .s-inner .list li p{max-width: 280px; font-size: var(--fz18); margin-left: auto; margin-right: auto;} .special .s-inner .list li p br{display: none;} } @media all and (max-width:1280px){ .special{padding: 90px 0 80px;} .special .s-inner .m_tit h3{font-size: var(--fz40);} } @media all and (max-width:976px){ .special{background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url(/images/new/bg004.jpg) no-repeat center top / cover; padding: 50px 0 50px;} .special .s-inner .list{flex-wrap: wrap; gap:40px 20px; margin-top: 40px;} .special .s-inner .list li{width: calc(100% / 2 - 20px / 2);} .special .s-inner .list li p{margin-top: 15px;} .special .s-inner .list li .img{max-width: 36vw; margin: 0 auto;} } #check50 {display:flex; flex-wrap:wrap; /* justify-content:center*/;} #check50 li {width:calc(50% - 6px); margin:5px; padding:20px ;border-radius:50px; border:1px solid rgba(74,156,160,0.3); position:relative} #check50 li:before {content:''; width:21px; height:20px; background:url('/images/sub/circlecheck.png')no-repeat left center; position:absolute; left:20px; top:22px; } #check50 li p {padding-left:30px; font-size:1.4rem; color:#4a9ca0; font-weight:500} #check50.mri3 {justify-content:center;} #check50.mri3 li {width: auto; margin:5px} @media all and (max-width:1220px) { #check50 li {width:100%; margin:3px 0 ; } } @media all and (max-width:1024px) { #check50 li {width:calc(50% - 6px); margin:3px; padding:15px } #check50 li:before {left:15px; top:17px;} } @media all and (max-width:767px) { #check50 li {width:100%; margin:3px 0 ; } } #check50.sample1 {justify-content:center; gap:5px 10px} #check50.sample1 li {width:auto; background:#5078e9; border:0; text-align:left;} #check50.sample1 li:before {background:url('/images/circlecheck-w.png')no-repeat left center; } #check50.sample1 li p { color:#FFF; font-size:1.35rem} #check50.sample1.w3 li {width:25%;} #check50.sample2 {width:100%; max-width:1280px; margin:0 auto} #check50.sample2 li {width:49%; background:#f5f9fb; border:0; text-align:left;} #check50.sample2 li:before {background:url('/images/circlecheck-b.png')no-repeat left center; } #check50.sample2 li p { color:#686868; font-size:0.98rem;vertical-align:center} #check50.sample2.w3 li {width:calc(33.3333% - 6px) !important; } #check50.sample2.wauto {justify-content:center;} #check50.sample2.wauto li {width:auto} #check50.sample2.bg2 li { background:#5078e9; } #check50.sample2.bg2 li:before {background:url('/images/circlecheck-w.png')no-repeat left center; } #check50.sample2.bg2 li p {color:#FFF} @media all and (max-width:1024px) { #check50.sample2 li {width:99%; } } @media all and (max-width:976px) { #check50.sample2.w3 li {width:calc(50% - 6px) !important; margin:3px } } @media all and (max-width:580px) { #check50.sample2.w3 li {width:100% !important; margin:3px 0 } } .table-scroll { position: relative; width: 100%; overflow-x: auto; } .table-one { position: relative; width: 100%; border-top: 2px solid #6076a4; text-align: center; } .table-one th { background: #f6f9fd; color:#2d527c; font-weight: 600; width: 20%; } .table-one th, .table-one td { padding: 1.2em 0; border-bottom: 1px solid #d7dde8; } .table-one.left th { text-align: center; } .table-one.left td { padding-left: 1.5em; } @media all and (max-width:767px) { .table-one th { width: 23%; } } @media all and (max-width:480px) { .table-one th { width: 40%; display: inline-block; } .table-one td { width: 60%; display: inline-block; } .table-one .nbsp { display: none; } } .table-2th { position: relative; width: 100%; border-top: 2px solid #6076a4; } .table-2th th, .table-2th td { padding: 1.2em 0; border-bottom: 1px solid #d7dde8; } .table-2th thead th { background: #f6f9fd; color:#2d527c; font-weight: 700; line-height: 1.2em; } .table-2th th { color:#094d93; line-height: 1.5em; text-align: center; } .table-2th td { border-left: 1px solid #d7dde8; padding: 1.2em 2em; line-height: 1.5em; } .table-2th tfoot th, .table-2th tfoot td { background: #4369b8; color:#fff; } .table-2th tfoot td { border-left-color:rgba(255,255,255,0.2); } .table-2th tbody td.result { color:#4369b8; font-weight: 800; } .table-2th.pds thead th { padding: 1em 0; } .table-2th.pds th { padding: 0.5em 0; } .table-2th.pds td { padding: 0.5em 2em; } .table-2th.center td { padding: 1.2em 0; } .table-2th.center.pds td { padding: 0.5em 0; } .table-2th.th2 { font-size: 1.1rem; } .table-2th.th2 thead th { border-left: 1px solid #d7dde8; padding: 1em 0; } .table-2th .bl { border-left: 1px solid #d7dde8; } .table-2th .bl0 { border-left:0 !important; } #nround li {position:relative; counter-increment: number; height:80px; display:flex;border-bottom:0px dotted #d9dee8} #nround li:before {content: counter(number, decimal-leading-zero); font-size:1.4rem; width:50px; height:50px; line-height:50px; position:absolute; left:0; top:13px; font-family:'Barlow'; color:#FFF; background:#004387; border-radius:100%; font-weight:400; text-align:center} #nround li p {padding-left:60px;align-content: center; font-size:1.2rem; color:#222; font-weight:400; display:flex; align-items: center;font-family:'Montserrat', 'GowunBatang',sans-serif } @media all and (max-width:1310px){ #nround li { height:70px; } #nround li:before { width:50px; height:50px; line-height:50px; } #nround li p {padding-left:60px} } @media all and (max-width:1280px){ #nround {display:flex; flex-wrap:wrap} #nround li { width:49%; margin:0.5% } #nround li:before { width:50px; height:50px; line-height:50px; } #nround li p {padding-left:60px} } @media all and (max-width:640px){ #nround li { width:100%; margin:0.5% 0 } } @media all and (max-width:480px){ #nround li { height:25vw; } #nround li:before { width:10vw; height:10vw; line-height:10vw } #nround li p {padding-left:12vw;line-height:5vw} } #roundtxt1 {display:flex; flex-wrap:wrap} #roundtxt1 .imgwrap {width:50%} #roundtxt1 .imgwrap img {width:100%} #roundtxt1 .contwrap {padding:0 8%; width:50%; background:#f9f9f9; display:flex; justify-content:center; align-items: center; } #roundtxt1 .contwrap h3 {font-size:5.0rem; color:#222; font-weight:800} #roundtxt1 .contwrap .t1 {margin-top:1em; font-size:2.0rem; line-height:1.6em} @media all and (max-width:1499px){ #roundtxt1 .contwrap {padding:0 4%;} } @media all and (max-width:1212px){ #roundtxt1 .contwrap h3 {font-size:4.5rem;} #roundtxt1 .contwrap .t1 { font-size:1.9rem; line-height:1.4em} } @media all and (max-width:1024px){ #roundtxt1 .imgwrap {width:100%} #roundtxt1 .contwrap {padding:8% 5%; width:100%; text-align:center} #roundtxt1 .contwrap h3 {font-size:5.0rem;} #roundtxt1 .contwrap .t1 {font-size:2.0rem; } } @media all and (max-width:480px){ #roundtxt1 .contwrap h3 {font-size:4.5rem; line-height:1.1em} #roundtxt1 .contwrap .t1 {font-size:1.9rem; } } #roundtxt1-2 {display:flex; justify-content:center; } #roundtxt1-2 ul {width:360px; height:360px; border-radius:100%; text-align:center; color:#FFF; margin:0 -20px; display:flex; justify-content:center; align-items: center;} #roundtxt1-2 ul li .t1 { font-size:2.2rem; font-weight:600} #roundtxt1-2 ul li .t2 { font-size:3.2rem; font-weight:700;} #roundtxt1-2 ul li .line {width:1px; height:30px; background:rgba(255,255,255,0.1); margin:10px auto} #roundtxt1-2 ul li h3 {display:block; font-size:3.2rem; color:#FFFF00; font-weight:700; font-style:italic} #roundtxt1-2 ul.bg1 {background:rgba(38,124,209,0.95)} #roundtxt1-2 ul.bg2 {background:rgba(0,134,158,0.95)} #roundtxt1-2 ul.bg3 {background:rgba(10,74,152,0.95)} #roundtxt1-2 ul.bg4 {background:rgba(65,182,143,0.95)} #roundtxt1-2 ul.bg5 {background:rgba(32,157,188,0.95)} #roundtxt1-2 ul.bg6 {background:rgba(0,134,158,0.95)} #roundtxt1-2 ul.bg7 {background:rgba(10,74,152,0.95)} #roundtxt1-2.polic4 ul {width:280px; height:280px; } #roundtxt1-2.polic4 ul li {padding:0 20%} #roundtxt1-2.polic4 ul li .t2 { font-size:2.6rem; } #roundtxt1-2.polic3 {flex-wrap:wrap} #roundtxt1-2.polic3 ul {width:210px; height:210px; margin:-20px -10px; } #roundtxt1-2.polic3 ul li .t2 { font-size:1.3rem;font-weight:300; } #roundtxt1-2.polic3 ul li .t2 span { font-size:1.4rem; font-weight: 400;} #roundtxt1-2.polic3 ul li .t3 { font-size:1.8rem; font-weight:700; margin-top:0.3em; } #roundtxt1-2.mri2 {flex-wrap:wrap} #roundtxt1-2.mri2 ul {width:230px; height:230px; margin:-10px -10px; } #roundtxt1-2.mri2 ul li .t2 { font-size:2.6rem; } #roundtxt1-2.mri2 ul li .t3 { font-size:3.2rem; font-weight:700; margin-top:0.3em; } @media all and (max-width:1499px){ #roundtxt1-2.mri2 ul {width:200px; height:200px; } } @media all and (max-width:1280px){ #roundtxt1-2.polic4 ul {width:230px; height:230px; } } @media all and (max-width:1140px){ #roundtxt1-2 ul {width:30vw; height:30vw; margin:0 -1.5vw; } #roundtxt1-2 ul li .line { height:3vw;} #roundtxt1-2 ul li h3 { font-size:3vw} } @media all and (max-width:976px){ #roundtxt1-2 ul {width:30vw; height:30vw; margin:0 -1.5vw; } #roundtxt1-2 ul li .t1 { font-size:1.8rem;} #roundtxt1-2 ul li .t2 { font-size:2.8rem;} #roundtxt1-2 ul li h3 { font-size:3vw} #roundtxt1-2.polic4 ul {width:24vw; height:24vw; } } @media all and (max-width:767px){ #roundtxt1-2.polic3 ul {width:30vw; height:30vw; } } @media all and (max-width:720px){ #roundtxt1-2 {flex-wrap:wrap; } #roundtxt1-2 ul {width:43vw; height:43vw; } #roundtxt1-2 ul:last-child {margin-top:-7.5vw} #roundtxt1-2 ul li .t1 { font-size:2.8vw;} #roundtxt1-2 ul li .t2 { font-size:3.5vw;} #roundtxt1-2 ul li .line { height:4vw; margin:5px auto} #roundtxt1-2 ul li h3 { font-size:4.0vw} #roundtxt1-2.polic4 ul {width:230px; height:230px; } #roundtxt1-2.polic4 ul:nth-child(3), #roundtxt1-2.polic4 ul:nth-child(4) {margin-top:-20px} #roundtxt1-2.polic3 ul { margin:-20px -10px; } #roundtxt1-2.mri2 ul {width:180px; height:180px; } #roundtxt1-2.mri2 ul { margin:-20px -8px; } } @media all and (max-width:510px){ #roundtxt1-2.polic4 ul {width:45vw; height:45vw; } #roundtxt1-2.polic4 ul:nth-child(3), #roundtxt1-2.polic4 ul:nth-child(4) {margin-top:-4vw} #roundtxt1-2.polic3 ul {width:45vw; height:45vw; } } @media all and (max-width:480px){ #roundtxt1-2 ul li .t1 { font-size:3.2vw;} #roundtxt1-2 ul li .t2 { font-size:4.2vw;} #roundtxt1-2 ul li h3 { font-size:4.8vw} #roundtxt1-2.mri2 ul {width:30vw; height:30vw; margin: -10px -5px } #roundtxt1-2.mri2 ul li .t3 { font-size:2.8rem; margin-top:0} } #roundtxt1-2_ {display:flex; justify-content:center; width: 1000px; margin: 0 auto; flex-wrap:wrap; position: relative;} #roundtxt1-2_ h1{position: absolute; top: 46%; left: 50%; transform:translate(-50%, -50%);z-index: 999; text-align: center; color: #fff; font-size: 4rem; line-height: 4rem;} #roundtxt1-2_ h1 span{font-size: 3.5rem; font-family:'Montserrat', 'S Dream',sans-serif;} #roundtxt1-2_ h1 span.ok{font-family:'Montserrat', 'S Dream',sans-serif; font-size: 5rem; line-height: 6rem;} #roundtxt1-2_ ul {width:580px; height:580px; border-radius:100%; text-align:center; color:#FFF; margin:0 -110px; display:flex; justify-content:center; align-items: center; position: relative;} #roundtxt1-2_ ul:last-child {margin-top:-30%} #roundtxt1-2_ ul li h2 {font-size:3.5rem; color:#FFF; font-weight:800;line-height: 4rem;} #roundtxt1-2_ ul li h2 span{font-family:'Montserrat', 'S Dream',sans-serif;margin-top: 5px; display:inline-block; font-size: 3rem;} #roundtxt1-2_ ul.bg1_ li {position: absolute; left: 13%;top: 25%;} #roundtxt1-2_ ul.bg2_ li {position: absolute; right: 13%;top: 25%;} #roundtxt1-2_ ul.bg3_ li {position: absolute; left: 50%; bottom: 15%; transform:translatex(-50%); width: 100%;} #roundtxt1-2_ ul.bg1_ {background:#00a8b0} #roundtxt1-2_ ul.bg2_ {background:#003f7a; mix-blend-mode: multiply;} #roundtxt1-2_ ul.bg3_ {background:#3b8cd5; mix-blend-mode: multiply;} @media all and (max-width:1020px){ #roundtxt1-2_ {width: 95%;} #roundtxt1-2_ ul {width:58vw; height:58vw; margin: 0 -12vw;} #roundtxt1-2_ h1{font-size: 4vw; line-height: 4.5vw;} #roundtxt1-2_ h1 span{font-size: 3.5vw;} #roundtxt1-2_ h1 span.ok{font-size: 5vw; line-height: 6vw;} #roundtxt1-2_ ul li h2 {font-size:3.5vw; line-height: 4vw;} #roundtxt1-2_ ul li h2 span{font-size: 3vw;} } #roundtxt1-3 {} #roundtxt1-3 .boxWrap {padding:20px; display:flex; align-items: center; border:10px solid #f6fafd; margin-bottom:30px; position:relative} #roundtxt1-3 .boxWrap img { width:45%; } #roundtxt1-3 .num { font-size:130px; font-weight:800; color:#f6fafd; font-family:'Oswald'; text-align:center; position:absolute; right:-0.1em; top:-0.1em; } #roundtxt1-3 .txt {padding:0 5%} #roundtxt1-3 .txt h3 {margin-bottom:1em; font-size:3.0rem; color:#222; font-weight:800;} #dotList.roundtxt1 li { margin-bottom:0.7em} #dotList.roundtxt1 li:last-child {margin-bottom:0} #dotList.roundtxt1 li:before {top:0.7em} #dotList.roundtxt1 li p {font-size:1.8rem; line-height:1.4em} @media all and (max-width:1024px){ #roundtxt1-3 .boxWrap {padding:10px; margin-bottom:20px;} #roundtxt1-3 .num { font-size:100px; } } @media all and (max-width:976px){ #roundtxt1-3 .boxWrap { flex-wrap:wrap; } #roundtxt1-3 .boxWrap img { width:100%; } #roundtxt1-3 .txt {width:100%; padding:3em 10px 2em } #roundtxt1-3 .num {top:unset; bottom: -0.1em} } @media all and (max-width:480px){ #roundtxt1-3 .txt h3 { font-size:2.6rem; } } #amar1 {display:flex; align-items: center; justify-content:space-between;} #amar1 #imgWrap { width:695px; padding-bottom:0; position:relative} #amar1 #imgWrap .img2 {position:absolute; right:0; bottom:0; z-index:3} #amar1 #imgWrap .img2 img {width:100% } #amar1 #imgWrap .img3 { position:absolute; right:-20%; top:20%; animation: 4000s 0s infinite rotate; z-index:-1 } #amar1 #contWrap {width:50%; text-align:left;margin-left:60px} #amar1 #contWrap h3 {padding-bottom:1.3em; font-size:2.6rem; color:#333; font-weight:300; line-height:1.3em;font-family:'Montserrat', 'GowunBatang',sans-serif} #amar1 #contWrap h4 {padding-bottom:1em; font-size:1.5em; color:#333; font-weight:600; line-height:1.3em;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:-0.05em} #amar1 #contWrap .top{padding-bottom:2em; font-size:1.3em; color:#333; font-weight:400; line-height:1.6em;font-family:'Montserrat', 'GowunBatang',sans-serif;letter-spacing:-0.05em} #amar1 #contWrap .t1 { line-height:2.0em; margin-bottom:2em;font-size:1.2rem;line-height:150%;color:#333;font-family:'Montserrat', 'GowunBatang',sans-serif;font-weight:600; } #amar1 #contWrap .tank2 {font-size: 1.2rem; line-height: 2em; padding: 0 1.5em; display: inline-block; background: #094d93; color:#fff;font-weight:600;width:300px; border-radius: 3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;margin-bottom:0.5em;font-family:'Montserrat', 'GowunBatang',sans-serif } #amar1 #contWrap dl {padding-top:1.5em; display:flex; } #amar1 #contWrap dl dd {font-size:1.8rem; font-weight:600; color:#434343; text-align:left;font-family:'Montserrat', 'GowunBatang',sans-serif} #amar1 #contWrap dl dt { margin-left:20px; font-size:2.0rem; font-family: 'ROEHOE-CHAN'; color:#434343; } @keyframes rotate { from {transform: rotate(0deg);} to {transform: rotate(99999deg);} } @media all and (max-width: 1599px){ #amar1 { align-items: start; } #amar1 #imgWrap {width:40%; padding-bottom:6vw;} #amar1 #imgWrap img {width:90%} #amar1 #imgWrap .img2 {width:80%} #amar1 #imgWrap .img3 { right:-5vw; top:6vw; } #amar1 #contWrap h3 {padding-bottom:1.0em; } #amar1 #contWrap .t1 { margin-bottom:1.0em; } #amar1 #contWrap .tank2 {font-size: 1rem; line-height: 2.5em; padding: 0 1.5em; display: inline-block; background: #094d93; color:#fff; border-radius: 3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; margin-bottom:0.5em} } @media all and (max-width: 1399px){ #amar1 #contWrap {width:55%} } @media all and (max-width: 1150px){ #amar1 { flex-wrap:wrap } #amar1 #imgWrap {width:50%; margin:0 auto 4em} #amar1 #imgWrap .img3 {width:50%; right:-5vw; top:8vw; } #amar1 #imgWrap .img3 img {width:100%} #amar1 #contWrap {width:100%} } @media all and (max-width: 580px){ #amar1 #contWrap .t1 br {display:none} #amar1 #contWrap .tank2 {font-size: 0.9rem; line-height: 1.8em; padding: 0 1.5em; display: inline-block; background: #094d93; color:#fff; border-radius: 3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;margin-bottom:0.3em } } #amar2 { position:relative} #amar2:after {content:''; width:95%; height:79%; background:#fefbfb; position:absolute; left:0; bottom:0; z-index:-1} #amar2:before {content:''; width: 488px; height: 530px; background:url('/images/sub/amar2-sb.png') no-repeat right bottom; position:absolute; right:0; bottom:0 } #amar2 .inner {display:flex;} #amar2 .inner > div {width:50%} #amar2 #contWrap dl {padding-bottom:3em} #amar2 #contWrap dl dd {font-size: 2.0rem; font-weight:600; } #amar2 #contWrap dl dt {font-size: 4.6rem; font-weight:300; color:#434343} #amar2 #contWrap .t1 { margin-bottom:0.5em; padding-top:45px; font-size:4.6rem; color:#f98b8b; font-family: 'SangSangShin'; background:url('/images/sub/amar2-qq.png')no-repeat right top; display:inline-block;} #amar2 #contWrap .t1 br.br1280 {display:none} #amar2 #contWrap .cont {width:700px; display:flex; flex-wrap:wrap; justify-content: start; } #amar2 #contWrap .cont ul:nth-child(2) {margin-left:60px} #amar2 #contWrap .cont ul:last-child {width:450px} @media all and (max-width: 1599px){ #amar2 #imgWrap {width:40%} #amar2 #imgWrap img {width:83%} #amar2 #contWrap {width:60%; padding-bottom:3em} #amar2 #contWrap .cont {width:auto; } } @media all and (max-width: 1280px){ #amar2:after { height:84%;} #amar2 #imgWrap {width:50%} #amar2 #contWrap {width:50%} #amar2 #contWrap .t1 {line-height:0.8em; background:none } #amar2 #contWrap .t1 br.br1280 {display:block} #amar2 #contWrap .cont ul {width:100%} #amar2 #contWrap .cont ul:nth-child(2) {margin-left:0} } @media all and (max-width: 1024px){ #amar2:after { height:86%;} #amar2 #contWrap dl {padding-bottom:1em} #amar2 #contWrap .t1 {margin-bottom:0.3em} } @media all and (max-width: 976px){ #amar2:after {width:100%; } #amar2 .inner {flex-wrap:wrap;} #amar2 #imgWrap {width:100%; text-align:center} #amar2 #imgWrap img {width:50%} #amar2 #contWrap {padding-top:3em} #amar2 #contWrap dl {padding-bottom:2em} #amar2 #contWrap .t1 {padding-top:0} #amar2 #contWrap {width:100%} } @media all and (max-width:767px){ #amar2 #imgWrap img {width:70%} } @media all and (max-width:480px){ #amar2 #contWrap dl dd {font-size: 1.8rem; } #amar2 #contWrap dl dt {font-size: 4.0rem;} #amar2 #contWrap .t1 { font-size:4.4rem;} } #dotList.ab2 {padding-top:2em;} #dotList.clinic1-2 li {padding-bottom:15px} #dotList li {padding-left:10px; position:relative; margin-bottom:7px} #dotList li:last-child {margin-bottom:0} #dotList li:before {content:''; width:3px; height:3px; background:#f98b8b; position:absolute; left:0; top:0.7em; border-radius:10px} #dotList li p {line-height:1.6em} #dotList.man li:before {background:#63c2c7 } #dotList li h4 {padding-bottom:0.3em; font-size:1.8rem; color:#434343; font-weight:500} #dotList.winline {display:flex; flex-wrap:wrap} #dotList.winline li {margin-right:2em} #dotList.winline li:last-child {margin-right:0} @media all and (max-width: 1024px){ #dotList.ab2 {padding-top:1.3em;} } #amar3 {width:100%; display:flex; align-items: start; padding:5em 0; background:#fdf8f8 url('/images/sub/clinic1-2-5-sb.png') no-repeat right bottom; background-size:auto 90%; position:relative} #amar3:before {content:''; width:8%; height:100%; background:#FFF; position:absolute; left:0; top:0;} #amar3 #imgWrap {position:relative} #amar3 #imgWrap img {width:100%; max-width:960px} #amar3 #contWrap {padding:0 3% 0 5%; width:50%; max-width:800px;} #amar3 #contWrap #sTitle { text-align:left; margin-bottom:2.3em} @media all and (max-width:1599px){ #amar3:before { width:5%;} #amar3 #imgWrap {width:calc(100% - 550px);} #amar3 #contWrap {width:550px; padding:0 3% } } @media all and (max-width:1024px){ #amar3 { flex-wrap:wrap; background-size:40% auto; } #amar3:before { width:5%;} #amar3 #imgWrap {width:100%;} #amar3 #imgWrap img {width:95%; } #amar3 #contWrap {text-align:center; margin:4em auto 0; width: fit-content; padding:0 } #amar3 #contWrap #sTitle { text-align:center; } } @media all and (max-width:640px){ #amar3 { padding:3em 0 5em } #amar3:before {display:none} } /* drchep2 */ .drchep2{} .drchep2 .bg{background: #f8f8f8 url(ooo) no-repeat right 30px bottom 30px;padding:5% 3% 0 } .drchep2 .bg .inner{display: flex; gap:0 40px; align-items: center;} .drchep2 .bg .mt10p{margin-right:20%} .drchep2 .bg .img{margin-top: -30px;} .drchep2 .bg .img img{max-width: 100%;} .drchep2 .bg .txt{width:80%} .drchep2 .bg .txt .name{margin-bottom:20px;} .drchep2 .bg .txt .name h4{font-size: 1.3rem;margin-bottom: 7px;font-weight: 300;font-family:'Montserrat', 'S Dream',sans-serif;letter-spacing:-0.03em} .drchep2 .bg .txt .name h3{font-size: 2.4rem; font-weight: 400; color: #000;font-family:'Montserrat', 'S Dream',sans-serif;letter-spacing:-0.03em} .drchep2 .bg .txt .name h3 span{font-weight: 700;} .drchep2 .bg .txt .name h4 span{color:#c9c9c9;font-weight:500;font-family:'Barlow';} .drchep2 .bg .txt .boxs{display: flex; gap:0 60px;} .drchep2 .bg .txt .boxs .box{} .drchep2 .bg .txt .boxs .box h3{background-color:#2a6bbf; color: #fff; font-size: 1.2em; font-weight:300; padding: 10px; text-align: center; border-radius: 30px; width: 160px; margin-bottom: 20px; border-bottom-left-radius: 0;} .drchep2 .bg .txt .boxs .box p{font-size: 0.95rem; color: #333; line-height: 1.7em;font-family:'Montserrat', 'S Dream',sans-serif;font-weight:400;letter-spacing:-0.03em} .drchep2 .bg + .s-inner{margin-top: 100px;} .drchep2 .boxs2{display: flex; gap:0 40px; margin-top: 20px;} .drchep2 .boxs2 .box{width: 100%;margin-left:100px} .drchep2 .boxs2 .box .img{} .drchep2 .boxs2 .box .img img{max-width: 100%;} .drchep2 .boxs2 .box .txt{background-color: #f8f8f8; padding: 50px;} /*.drchep2 .boxs2 .box:nth-child(2) .txt{text-align: right;}*/ .drchep2 .boxs2 .box .txt h4{font-size: 20px; color: var(--c02); font-weight: 600; margin-bottom: 5px;} .drchep2 .boxs2 .box .txt h3{color: #000; font-size: 28px; margin-bottom: 20px;} .drchep2 .boxs2 .box .txt p{font-size: 0.95rem; color: #333; line-height: 1.7em} @media all and (max-width:1600px){ .drchep2 .bg .img{max-width: 560px;} .drchep2 .bg .txt .name{margin-bottom: 40px;} .drchep2 .bg .txt .boxs{gap: 40px;} } @media all and (max-width:1400px){ .drchep2 .bg .inner{gap:0 20px;} .drchep2 .bg .img{max-width: 38vw;} .drchep2 .bg .txt .name{margin-bottom: 30px;} .drchep2 .bg .txt .name h4{font-size: 20px; margin-bottom: 5px;} .drchep2 .bg .txt .name h3{font-size: 30px;} .drchep2 .bg .txt .boxs{gap: 30px;} .drchep2 .bg .txt .boxs .box h3{font-size: 18px; width: 140px;margin-bottom: 15px;} .drchep2 .bg .txt .boxs .box p{font-size: 17px;} } @media all and (max-width:1280px){ .drchep2 .bg{padding-bottom: 80px; background-size: 20vmax;} .drchep2 .bg .inner{flex-direction: column;} .drchep2 .bg .mt10p{margin-top: 0%;} .drchep2 .bg .img{margin-top: -20px; order: 1;} .drchep2 .bg .img{max-width: 100%;} .drchep2 .bg .txt{ order: 2;} .drchep2 .bg .txt .name{margin-top: 30px; text-align: center; margin-bottom: 40px;} .drchep2 .bg .txt .boxs{gap: 50px;} .drchep2 .bg + .s-inner{margin-top: 80px;} .drchep2 .boxs2 .box .txt{padding: 40px;} .drchep2 .boxs2 .box .txt h4{font-size: 19px;} .drchep2 .boxs2 .box .txt h3{font-size: 26px;} .drchep2 .boxs2 .box .txt p{font-size: 17px;} } @media all and (max-width:976px){ .drchep2 .bg .txt .boxs{flex-direction: column; gap:30px; text-align: center;} .drchep2 .bg .txt .name h4{font-size: 18px;} .drchep2 .bg .txt .name h3{font-size: 26px;} .drchep2 .bg .txt .boxs .box h3{margin-left: auto; margin-right: auto; font-size: 17px; width: 120px;} .drchep2 .bg .txt .boxs .box p{line-height: 1.7em;} .drchep2 .bg + .s-inner{margin-top: 70px;} .drchep2 .boxs2{margin-top: 50px; flex-direction: column; align-items: center;} .drchep2 .boxs2 .box{text-align: center;} .drchep2 .boxs2 .box + .box{margin-top: 40px;} .drchep2 .boxs2 .box .img{max-width: 640px; margin-left: auto; margin-right: auto;} .drchep2 .boxs2 .box .txt{max-width: 640px; margin-left: auto; margin-right: auto;} .drchep2 .boxs2 .box .txt h4{font-size: 18px;} .drchep2 .boxs2 .box .txt p{line-height: 1.7em;} } @media all and (max-width:640px){ .drchep2 .bg{padding-bottom: 55px;} .drchep2 .bg + .s-inner{margin-top: 60px;} .drchep2 .boxs2{margin-top: 40px;} .drchep2 .boxs2 .box .txt{padding: 35px 20px;} .drchep2 .bg .txt .boxs .box p, .drchep2 .boxs2 .box .txt p{font-size: 16px; word-break: keep-all;} } /* drchep3 */ .drchep3{} .drchep3 .m_txt{margin-bottom: 60px;} .drchep3 .s-inner{display:flex; justify-content: space-between; align-items: center;} .drchep3 .img{background: url(http://seoultop.kr/images/sub/drchep3_img.webp) no-repeat center center / cover; width: 50%; height: 480px;} .drchep3 .cont{width: 50%;background-color: #f8f8f8; padding: 50px 70px; height: 480px;} .drchep3 .cont h3{font-size: 32px; margin-bottom: 15px; color: #000;} .drchep3 .cont h2{font-size: 32px; font-family: 'Poppins', sans-serif; margin-bottom: 10px; color: var(--c02);} .drchep3 .cont .dl_box{display: flex; flex-direction: column; gap:5px;} .drchep3 .cont .dl_box dl{display: flex;align-items: center;} .drchep3 .cont .dl_box dl dt{font-size: 18px; width: 46px; text-align: justify; height: 23px; color: #444; font-weight: 700;} .drchep3 .cont .dl_box dl dt::after{content: ''; width: 100%; display: inline-block;} .drchep3 .cont .dl_box dl dd{padding-left: 10px; font-size: 18px; font-weight: 500;} .drchep3 .cont .dl_box dl dd span{color: var(--c02); font-weight: 700;} .drchep3 .cont .bottom{padding-top: 30px; margin-top: 30px; border-top: 1px dashed #ccc;} .drchep3 .cont .bottom h4{color: #000; font-size: 24px; margin-bottom: 20px;} .drchep3 .cont .bottom .info{display: flex; gap:5px; flex-wrap: wrap;} .drchep3 .cont .bottom .info span{} .drchep3 .cont .bottom .info span a{background-color: var(--c02); color: #fff; font-size: 18px; font-weight: 600; padding: 6px 16px; display: block; border-radius: 6px;} @media all and (max-width:1280px){ .drchep3 .cont{padding: 40px 50px;} .drchep3 .m_txt{margin-bottom: 50px;} .drchep3 .cont h3{font-size: 28px; margin-bottom: 12px;} .drchep3 .cont h2{font-size: 30px; margin-bottom: 8px;} } @media all and (max-width:976px){ .drchep3 .m_txt{margin-bottom: 40px;} .drchep3 .s-inner{flex-direction: column;} .drchep3 .img{width: 100%; height: 50vw;} .drchep3 .cont{width: 100%; height: auto; padding: 30px 40px;} .drchep3 .cont h3{font-size: 24px; margin-bottom: 10px;} .drchep3 .cont h2{font-size: 26px; margin-bottom: 6px;} .drchep3 .cont .dl_box dl dt{font-size: 17px; width: 44px;} .drchep3 .cont .dl_box dl dd{font-size: 17px; padding-left: 8px;} .drchep3 .cont .bottom{padding-top: 25px; margin-top: 25px;} .drchep3 .cont .bottom h4{font-size: 22px; margin-bottom: 15px;} .drchep3 .cont .bottom .info span a{font-size: 17px; padding: 5px 13px; border-radius: 4px;} } @media all and (max-width:640px){ .drchep3 .m_txt{margin-bottom: 30px;} .drchep3 .cont{padding: 30px 30px;} .drchep3 .cont h3{font-size: 22px; margin-bottom: 0px;} .drchep3 .cont h2{font-size: 24px; margin-bottom: 10px;} .drchep3 .cont .dl_box {gap:13px 0;} .drchep3 .cont .dl_box dl{flex-direction: column; align-items: flex-start} .drchep3 .cont .dl_box dl dt{font-size: 16px; width: 42px;} .drchep3 .cont .dl_box dl dd{font-size: 16px; padding-left: 0px;} .drchep3 .cont .bottom{padding-top: 20px; margin-top: 20px;} .drchep3 .cont .bottom h4{font-size: 20px; margin-bottom: 12px;} .drchep3 .cont .bottom .info span a{font-size: 16px; padding: 4px 11px; border-radius: 3px;} } /* drchep4 */ .drchep4{} .drchep4 .list{display: flex; flex-wrap: wrap; gap:60px 30px; margin-top: 60px;} .drchep4 .list li{width: calc(100% /4 - 90px /4); box-shadow: 15px 12px 36px rgba(0,0,0,0.08); border: 1px solid #eee;} .drchep4 .list li .img{background-color: #fafafa;} .drchep4 .list li .img img{max-width: 100%;} .drchep4 .list li .txt{text-align: center; margin-top: -53px;} .drchep4 .list li .txt h3{display: inline-block; background-color: rgba(36, 54, 103,0.95); color: #fff; font-size: 20px; padding: 14px 20px; width: 100%;} .drchep4 .list li:nth-child(even) .txt h3{ background-color: rgba(25, 39, 77, 0.95);} .drchep4 .list li .txt p{font-size: 17px; color: #666; line-height: 1.6em; padding: 20px; word-break: keep-all;} @media all and (max-width:1280px){ .drchep4 .list{margin-top: 50px;} .drchep4 .list li{width: calc(100% / 3 - 60px /3);} .drchep4 .list li .txt{margin-top: -43px;} .drchep4 .list li .txt h3{font-size: 18px; padding: 10px 16px;} .drchep4 .list li .txt p{font-size: 16px; padding: 16px;} } @media all and (max-width:976px){ .drchep4 .list{gap:50px 20px; margin-top: 40px;} .drchep4 .list li{width: calc(100% / 2 - 20px /2);} } @media all and (max-width:640px){ .drchep4 .list{margin-top: 35px;} .drchep4 .list li{width: calc(100% / 1 - 0px /2);} .drchep4 .list li .img{text-align: center;} } #rndtop {width:100%; height:380px; background:linear-gradient( rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45) ),url('/images/rnd1.jpg')no-repeat right center; display:table; background-size:cover; overflow:hidden} #rndtop .in-box {padding-left:5%; display:table-cell; vertical-align:middle; color:#FFF; position:relative} #rndtop .eng {font-size:4.0rem; font-weight:900; letter-spacing:-0.06em.05em; font-family:'Montserrat'; opacity:.1; position:absolute; left:0; bottom:-20px} #rndtop h3 {width:100%; font-size:2.4rem; font-weight:500; line-height:1.3em;text-align:center} #rndtop .t1 {font-size:1.8rem; margin-top:1em} @media all and (max-width:1024px) { } @media all and (max-width:976px) { #rndtop .eng {font-size:7.0rem;} } @media all and (max-width:740px) { #rndtop {height:45vw; } } @media all and (max-width:640px) { #rndtop h3 { font-size:3.2rem; } #rndtop .t1 {font-size:1.6rem;} } @media all and (max-width:480px) { #rndtop {height:50vw; } #rndtop .eng {font-size:5.0rem;} } .rnd {overflow:hidden; box-sizing:border-box; position:relative; } .rnd:before{content:""; position:absolute; top:0; left:50%; margin-left:-0.5px; width:1px; height:100%; background:#ddd; z-index:1;} .rnd .his_bx{box-sizing:border-box; padding-top:5em; position:relative; overflow:hidden;} .rnd .his_bx .in{clip: rect(auto, auto, auto, auto); top:0; left:0; width:100%; height:100%; position:absolute; z-index:0; overflow:hidden;} .rnd .his_bx .in .bg{position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; background-repeat:no-repeat; background-position:center center; transform: translateZ(0); will-change: transform; } .rnd .his_bt{padding-bottom:8em} .rnd li {position:relative; z-index:2; width:50%; float:right; text-align:left; padding:0 0 3em 50px; box-sizing:Border-box;} .rnd li+li{clear:both;} .rnd li .t { position:relative; font-size:3.0rem; margin-bottom:1em; color:#2d5fa5 ; font-weight:600; font-family:'Barlow';} .rnd li .t:before {content:""; position:absolute; top:0.45em; left:-60px; width:20px; height:20px; border-radius:100%; background:#118cce; border:6px solid #dff4ff;} .rnd li .c .stit {font-size:1.6rem; color:#222; padding-bottom:2em; font-weight:600} .rnd li .c dt{ width:60px; display:inline-block; vertical-align:top; margin-bottom:20px; color:#212121; font-weight:200; line-height: 1.1em; font-size:1.6rem; font-family:'Barlow';} .rnd li .c dd{width:calc(100% - 20px); display:inline-block; vertical-align:top; margin-bottom:30px; line-height: 1.4em; font-size:1.1rem; } .rnd li .c p { margin-bottom:0.5em;font-weight:500;letter-spacing:-0.03em;font-family:'Montserrat', 'S Dream',sans-serif;line-height: 1.6em;} .rnd li:nth-of-type(2n) {float:left; text-align:right; padding:0 50px 3em 0;} .rnd li:nth-of-type(2n) .t:before{left:unset; right:-60px;} .rnd li:nth-of-type(2n) dt{float:right; } .rnd li:nth-of-type(2n) .c p::before { left: unset; right:0; } @media all and (max-width:767px) { .rnd .his_bx{ padding-left:10px;} .rnd:before{ margin-left:0; left:10px; } .rnd li{ width:100%; padding:0 0 3em 20px;} .rnd li .t { font-size: 3.0rem; } .rnd li .t:before { top:0.35em; left:-30px; } .rnd li .c dt{ width:50px; } .rnd li .c dd{width:calc(100% - 50px); } .rnd li:nth-of-type(2n){float:right; text-align:left; padding:0 0 3em 20px;} .rnd li:nth-of-type(2n) .t:before{left:-30px; right:inherit;} .rnd li:nth-of-type(2n) dt{float:left; } .rnd li:nth-of-type(2n) .c p::before { right:unset; left: 0; } } @media all and (max-width:568px) { .history-top { padding: 12% 0; } .history-top h4 { font-size: 2.5rem; } } #amarmap .root_daum_roughmap .wrap_controllers {display:none} #amarmap .root_daum_roughmap .wrap_map { height: 400px !important;} @media all and (max-width:1024px) { #amarmap .root_daum_roughmap .wrap_map { height: 420px !important;} } @media all and (max-width:767px) { #amarmap .root_daum_roughmap .wrap_map { height: 360px !important;} } #maptxt { padding:3%; background:#143f74 url('/images/sub/company8-bg.png') no-repeat right center; background-size:auto 100%;color:#FFF } #maptxt h3 {margin-bottom:0.7em; font-size:2rem; font-weight:600;font-family:'Montserrat', 'GowunBatang',sans-serif } #maptxt h3 .eng { font-size:1.3rem; font-family:'Barlow'; font-weight:300; opacity:.3} #maptxt ul {display:flex; gap:40px;} #maptxt ul li {font-size:1.3rem; font-weight:300; color:#7cdbff} #maptxt ul li i {padding-right:7px;} #maptxt ul li span {padding-left:1em; color:#FFF; font-size:1.1rem; } @media all and (max-width:1030px) { #maptxt ul { gap:20px;} #maptxt ul li span {padding-left:0.5em;} } @media all and (max-width:910px) { #maptxt ul { gap:20px; flex-wrap:wrap} #maptxt ul li {width:calc(50% - 20px)} #maptxt ul li:first-child {width:100%} } @media all and (max-width:580px) { #maptxt { padding:2.5em } #maptxt ul { gap:10px 0; } #maptxt ul li {width:100%} #maptxt h3 .eng {margin-top:1em; display:block } } @media all and (max-width:480px) { #maptxt { padding:2em } } #mapset {margin-top:3em; display:flex; flex-wrap:wrap} #mapset .tit { padding:10px 30px; width:300px; border-top:2px solid #222; font-size:1.2rem; color:#143f74;font-weight:600;} #mapset .cont {padding:10px 30px; width:calc(100% - 300px); border-top:1px solid #222} #mapset .cont dl {display:flex; margin-bottom:0.5em; padding-bottom:0.5em; border-bottom: 1px dashed #e9e9e9 } #mapset .cont dl:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0} #mapset .cont dl dt {width:280px; font-size:1.1rem; color:#222; font-weight:400} #mapset .cont dl dd {width:calc(100% - 280px); font-size:1.1rem; word-break: normal;font-weight:400;color:#222;} #mapset .cont dl dd span {padding-right:1em; display:inline-block} @media all and (max-width:1399px) { #mapset .tit { width:230px; padding:30px 20px} #mapset .cont { width:calc(100% - 230px);} #mapset .cont dl dt {width:260px;} #mapset .cont dl dd {width:calc(100% - 260px);} } @media all and (max-width:1100px) { #mapset .cont dl {display:flex; flex-wrap:wrap} #mapset .cont dl dt {width:100% ; font-size:2.2rem;} #mapset .cont dl dd {margin-top:0.5em; width:100%;} } @media all and (max-width:800px) { #mapset .tit { width:100%; padding:20px} #mapset .cont { width:100%; padding:20px; border-top:1px dotted #143f74} #mapset .cont dl dd span {padding-right:0.8em} } @media all and (max-width:480px) { #mapset .tit { padding:15px} #mapset .cont { padding:15px; } } #mri4-2 {width:100%; max-width:1280px; margin: 0 auto} #mri4-2 .boxWrap {padding:25px; display:flex; align-items: center; border:10px solid #f7f7f7; margin-bottom:30px; position:relative} #mri4-2 .boxWrap img { width:25%;border-radius:15px / 17px;} #mri4-2 dl {padding: 0 5%; } #mri4-2 dl dt {margin-bottom:0.8em; font-size:1.4rem; color:#222; font-weight:600;} @media all and (max-width:1024px){ #mri4-2 .boxWrap {padding:10px; margin-bottom:20px;} #mri4-2 dl dt {margin-bottom:0.8em;font-size:1.3rem;} } @media all and (max-width:976px){ #mri4-2 .boxWrap {flex-wrap:wrap} #mri4-2 .boxWrap img {width:100%} #mri4-2 dl {padding:5% 2% 2% } #mri4-2 dl dt {margin-bottom:0.5em;font-size:1.3rem;text-align:center; } } @media all and (max-width:480px){ #mri4-2 dl dt {font-size:1.1rem;text-align:center;} } #mri4-3 {width:100%; max-width:1280px; margin: 0 auto} #mri4-3 .boxWrap {padding:25px; display:flex; align-items: center; border:10px solid #f7f7f7; margin-bottom:30px; position:relative} #mri4-3 .boxWrap img { width:25%;border-radius:15px / 19px;} #mri4-3 dl {padding: 0 5%; } #mri4-3 dl dt {margin-bottom:0.8em; font-size:1.4rem; color:#222; font-weight:600;} @media all and (max-width:1024px){ #mri4-3 .boxWrap {padding:10px; margin-bottom:20px;} } @media all and (max-width:976px){ #mri4-3 .boxWrap {flex-wrap:wrap} #mri4-3 .boxWrap img {width:100%} #mri4-3 dl {padding:5% 2% 2% } #mri4-3 dl dt {margin-bottom:0.5em; } } @media all and (max-width:480px){ #mri4-3 dl dt { font-size:1.1rem; } } #mri4-4 {width:100%; max-width:1280px; margin: 0 auto} #mri4-4 .boxWrap {padding:25px; display:flex; align-items: center; border:10px solid #f7f7f7; margin-bottom:30px; position:relative} #mri4-4 .boxWrap img { width:35%;} #mri4-4 dl {padding: 0 5%; } #mri4-4 dl dt {margin-bottom:0.8em; font-size:1.4rem; color:#222; font-weight:600;} @media all and (max-width:1024px){ #mri4-4 .boxWrap {padding:10px; margin-bottom:20px;} } @media all and (max-width:976px){ #mri4-4 .boxWrap {flex-wrap:wrap} #mri4-4 .boxWrap img {width:100%} #mri4-4 dl {padding:5% 2% 2% } #mri4-4 dl dt {margin-bottom:0.5em; } } @media all and (max-width:480px){ #mri4-4 dl dt { font-size:1.1rem; } } #mri4none {width:100%; max-width:1280px; margin: 0 auto} #mri4none .boxWrap {padding:25px 0; display:flex; align-items: center; border:10px solid #f7f7f7; margin-bottom:30px; position:relative} #mri4none dl {padding: 0 3%; } #mri4none dl dt {margin-bottom:0.8em; font-size:1.4rem; color:#222; font-weight:600;} @media all and (max-width:1024px){ #mri4none .boxWrap {padding:10px; margin-bottom:20px;} } @media all and (max-width:976px){ #mri4none .boxWrap {flex-wrap:wrap} #mri4none .boxWrap img {width:100%} #mri4none dl {padding:5% 3% 3% } #mri4none dl dt {margin-bottom:0.5em; } } @media all and (max-width:480px){ #mri4none dl dt { font-size:2.6rem; } } #numList {margin-top:1.5em} #numList li {position:relative; counter-increment: number; position:relative; margin-bottom:0.7em ;} #numList li:before {content: counter(number, decimal-leading); width:22px; line-height:22px; border-radius:100%; font-size:1.4rem; color:#FFF; background:#555; position:absolute; left:0; top:0; text-align:center; font-family:'Osward'; font-weight:700} #numList li p {padding-left:30px; font-size:1.8rem; } #numList2 {position:relative} #numList2 li {margin:10px 0; padding-bottom:10px; border-bottom:1px dashed #e4eaf1; counter-increment: number; display:flex; align-items: center;} #numList2 li:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0} #numList2 li:before {content: counter(number); font-size:18px; font-family:'Jost'; font-weight:600; width:40px; height:40px; line-height:40px; text-align:center; color:#FFF; display:inline-block ;background:#094d93;border-radius:100%; } #numList2 li p {width:calc(100% - 20px); padding-left:30px; font-size:1.05rem; line-height:1.5em; word-break: keep-all;font-weight:400;letter-spacing:0} @media all and (max-width:1280px) { #numList2 li p {padding-left:20px; font-size:1rem;text-align: justify; word-break: break-all } #numList2 li:before {content: counter(number); font-size:15px; font-family:'Jost'; font-weight:600; width:35px; height:35px; line-height:35px; text-align:center; color:#FFF; display:inline-block ;background:#094d93;border-radius:100%;margin-bottom:1% } } @media all and (max-width:1024px) { #numList2 li p {padding-left:15px; font-size:0.9rem;text-align: justify; word-break: break-all } #numList2 li:before {content: counter(number); font-size:15px; font-family:'Jost'; font-weight:600; width:30px; height:30px; line-height:30px; text-align:center; color:#FFF; display:inline-block ;background:#094d93;border-radius:100%;margin-bottom:1% } } @media all and (max-width:976px) { #numList2 li:before {content: counter(number); font-size:14px; font-family:'Jost'; font-weight:600; width:30px; height:30px; line-height:30px; text-align:center; color:#FFF; display:inline-block ;background:#094d93;border-radius:100%; } #numList2 li p {width:calc(100% - 20px); padding-left:20px;font-size:0.9rem;text-align: justify; word-break: break-all } } #numnone {position:relative} #numnone li {margin:10px 0; padding-bottom:10px; border-bottom:1px dashed #e4eaf1;display:flex; align-items: center;} #numnone li:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0} #numnone li:before { font-size:18px; font-family:'Jost'; font-weight:600; width:40px; height:40px; line-height:40px; text-align:center; color:#FFF; display:inline-block ;background:#094d93;border-radius:100%; } #numnone li p {width:100%; font-size:1.05rem; line-height:1.5em; word-break: keep-all;font-weight:400;letter-spacing:0} @media all and (max-width:976px) { #numnone li:before { width:50px; height:50px; line-height:50px; } #numnone li p {width:calc(100% - 50px); padding-left:20px; } } /* ----------------------------------------------------------------------------------------------- ///////////////////////////////////////////// RF Needle 특징 ////////////////////////////////////// --------------------------------------------------------------------------------------------------*/ .sec05CntBox { margin-top:60px; display:flex; justify-content:space-between; gap:24px; } .sec05CntBox .dotLineBox { border:2px dotted var(--pink); border-radius:3.0rem; box-shadow:0 0 20px rgba(0,0,0,0.1); background:#fff; width:calc(50% - 12px); position:relative; padding:80px 80px 35px; display:flex; justify-content:center; align-items:center; font-size:1.2rem; color:var(--dkgrey); } .sec05CntBox .dotLineBox .boxTit { width:260px; height:52px; line-height:52px; border-radius:26px; background:#19ccd4; text-align:center; color:#fff; font-size:1.5rem; position:absolute; top:0; left:50%; transform:translate(-50%, -50%); z-index:2;font-family:'Montserrat', 'S Dream',sans-serif } .sec05CntBox .dotLineBox .sec05Img_left { display:flex; justify-content:space-between; gap:60px; } .sec05CntBox .dotLineBox .sec05Img_left figure { margin:0; text-align:center;} .sec05CntBox .dotLineBox .sec05Img_left figcaption { margin-top:5px; } .sec05CntBox .dotLineBox .sec05Img_left figure img { border-radius:10px; overflow:hidden; } .sec05CntBox .dotLineBox .sec05Img_right figure { margin:0;} .sec05CntBox .dotLineBox .sec05Img_right figcaption { margin-top:5px; text-align:right; } @media all and (max-width: 1560px) { .sec05CntBox { margin-top:50px } .sec05CntBox .dotLineBox { padding:50px 30px 15px; } .sec05CntBox .dotLineBox .sec05Img_left { gap:30px; } } /* ================================== Laptop css ================================== */ @media all and (max-width: 1280px) { /* #section5 .fp-tableCell { vertical-align:top !important; height:auto !important; } */ .sec05CntBox .dotLineBox .boxTit { font-size:2.7rem; } .sec05CntBox .dotLineBox { padding:50px 20px 15px; } .sec05CntBox .dotLineBox .sec05Img_left { gap:20px; } } /* ================================== Tablet css ================================== */ @media all and (max-width: 1080px) { .sec05CntBox { flex-wrap:wrap; justify-content:center; gap:60px 0; padding:0 64px; } .sec05CntBox .dotLineBox { width:100%; max-width:800px; } } /* ================================== Mobile css ================================== */ @media all and (max-width: 767px) { .sec05CntBox { gap:50px 0; padding:0 24px; font-size:1.8rem; } .sec05CntBox .dotLineBox .boxTit { font-size:2.5rem; height:46px; line-height:46px; border-radius:23px; width:auto; padding:0 24px; } .sec05CntBox .dotLineBox { border-radius:20px; } } @media all and (max-width: 559px) { .sec05CntBox { margin-top:40px; } .sec05CntBox .dotLineBox { font-size:1.6rem; } .sec05CntBox .dotLineBox .boxTit { font-size:2.0rem; height:40px; line-height:40px; border-radius:20px; } } /* ----------------------------------------------------------------------------------------------- ///////////////////////////////////////////// HIFU ////////////////////////////////////// --------------------------------------------------------------------------------------------------*/ #section7 { background:#efefef; padding-right:0 !important; } .sec07Cnt { height:100%; position:relative; } .sec07Cnt .secTitWrap { position:absolute; top:20%; left:0; width:100%; text-align:center; z-index:3; } .sec07CntBox { display:flex; justify-content:flex-end; align-items:flex-end; height:100%; position:relative; } .sec07CntBox .leftBox { position:relative; max-width:770px; text-align:center; z-index:2; width:35%; padding-left:50px; } .sec07CntBox .leftBox img { width:494px; } .sec07CntBox .rightBox { position:relative; z-index:2; width:65%; text-align:right; display:flex; justify-content:flex-end; } .sec07CntBox .rightBox { mix-blend-mode:multiply; } .sec07CntBox .rightBox img { } .sec07CntBox:before { content:''; position:absolute; bottom:0; left:0; width:70%; height:calc(100% - 40px); background:#fff; border-radius:0 30.0rem 0 0; z-index:1; } .sec07CntBox:after { content:''; position:absolute; bottom:0; right:0; width:30%; background:url(../images/main/section3_rightBottom.png) no-repeat left bottom; height:198px; background-size:auto 100%; z-index:1; } .hifuVideoWrap { width:100%; max-width:710px; aspect-ratio:710 / 720; position:relative; z-index:2; /*mix-blend-mode:multiply;*/ } .hifuVideoWrap .hifuVideo { position:absolute; width:100%; height:100%; bottom:0; right:0;} .hifuVideoWrap .hifuVideo video { height:100%; width:100%; object-fit:cover; background:transparent; } @media (min-width: 1281px) and (max-height: 749px) { .sec07Cnt .secTitWrap {top:0; } .sec07CntBox { height:auto; } .sec07CntBox:before {height:calc(100% - 140px); } .sec07CntBox .rightBox { } } /* ================================== Laptop css ================================== */ @media all and (max-width: 1280px) { .sec07CntBox:before { width:40%; border-radius:0 20.0rem 0 0; height:calc(100% - 40px); } .sec07CntBox:after { width:60%; } .sec07Cnt .secTitWrap { position:relative; left:auto; top:0; transform:translate(0,0); } .sec07CntBox { height:auto; } .sec07CntBox .leftBox { width:35% } .sec07CntBox .leftBox img { width:100%; } .sec07CntBox .rightBox { width:65%; } .sec07CntBox .rightBox img { max-width:80%; } } /* ================================== Tablet css ================================== */ @media all and (max-width: 1080px) { #section7 .sec07Bg { display:none; } .sec07CntBox { flex-wrap:wrap; } .sec07CntBox:before, .sec07CntBox:after { display:none; } .sec07CntBox .leftBox { text-align:center; margin-top:30px; width:100%; max-width:100%; padding-left:0; } .sec07CntBox .leftBox img { width:40%; } .sec07CntBox .rightBox { width:100%; max-width:100%; position:relative; padding-top:0; } .sec07CntBox .rightBox { text-align:right; padding-left:50px; padding-top:30px; } .sec07CntBox .rightBox:before {content:''; display:block; width:100%; height:calc(100% - 0px); background:#fff; position:absolute; left:0; bottom:0; border-radius:10rem 0 0 0; z-index:1; } .sec07CntBox .rightBox img { z-index:2; position:relative; } } /* ================================== Mobile css ================================== */ @media all and (max-width: 767px) { .sec07CntBox .rightBox { padding-top:0;} } @media all and (max-width: 559px) { .sec07CntBox .rightBox { padding-left:0px; } } /* ----------------------------------------------------------------------------------------------- ///////////////////////////////////////////// 다양한 HIFU 카트리지 ////////////////////////////////////// --------------------------------------------------------------------------------------------------*/ #section8 { background:#fff; position:relative; } #section8:after { display:block; content:''; width:100%; height:calc(100% - 10px); position:absolute; top:0; left:0; background:#fff; z-index:1; } .sec08Cnt { position:relative; z-index:2; } .sec08CntBox { text-align:center; position:relative; width:100%; max-width:1275px; margin:0 auto 30px; } .sec08CntBox.for_pc span { display:block; width:100%; } .sec08CntBox.for_pc span img { max-width:100%; } .sec08CntBox.for_pc .img { position:absolute; top:0; left:0; width:100%; } .sec08CntBox.for_pc .imgBg { position:relative; } .sec08CntBox.for_pc { display:block; } .sec08CntBox.for_m { display:none; } @media (min-width: 1281px) and (max-height: 749px) { .sec08Cnt { padding-bottom:120px;} } /* ================================== Laptop css ================================== */ @media all and (max-width: 1280px) { .sec08Cnt { padding-bottom:100px;} } /* ================================== Mobile css ================================== */ @media all and (max-width: 767px) { #section8:after { border-radius:0 0 0 5.0rem; } .sec08CntBox.for_pc { display:none; } .sec08CntBox.for_m { display:flex; flex-direction:column; gap:30px; justify-content:center; margin-top:50px; } .sec08CntBox.for_m img { width:100%; max-width:460px; margin:0 auto; } } @media all and (max-width: 559px) { }