@charset "utf-8";



/* #content */

.img_box img {width: 100%;}

.block {display: block;}

.m_color {color: #0C82FE;}

.highlight{color:#FFD852;}

.show-mobile{display: none;}

.visually-hidden {position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}

section .inner .title_text {font-weight: 700; font-size: 60px; letter-spacing: -0.02em; text-align: center; color: #000;}

section .inner .sub_text {font-weight: 700;font-size: 100px;line-height: 1.2;text-align: center;position: relative;}



section .inner .sub_explain p {font-weight: 300;font-size: 48px;line-height: 1.4;letter-spacing: -1px;text-align: center;color: #161718;margin-bottom: 1em;margin-top: 24px;}

section .inner .sub_explain p:last-of-type {margin-bottom: 0;}

section .inner .sub_explain p strong {font-weight: 500;}

section > .inner {padding: 90px 16.66%;box-sizing: border-box;}


.direct_list_name {background-color: #0C82FE; color:#fff; text-align: center; border-top-left-radius:20px; border-top-right-radius:20px; padding:15px 0; font-size:40px; font-weight:400}
.direct_list_name strong {font-weight: 600;}

.intro_banner {width: 100%; padding-top: calc(560/1920 *100%); position: relative;

    background-image: url('../images/img_intro_banner.png'); background-size: cover; background-repeat: no-repeat; background-position: center; 

    background-color: rgba(0, 0, 0, 0.7); background-blend-mode: darken;}

.intro_banner .inner {width: 100%; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.intro_banner .inner > span {display: block; font-size: 46px; font-weight: 500; letter-spacing: -2.4px; color: #fff; margin-bottom: .2em;}

.intro_banner .inner strong {display: inline-block; color: #BDF1FF;background-clip: text; font-size: 100px; font-weight: bold;  letter-spacing: -6.75px; line-height: 1;}





.definition .inner {width: 100%;padding: 0;margin: 0 auto; }

.definition .top_section {padding: 0 16.6%;background: linear-gradient(135deg, #0080ff 0%, #0066ff 100%);min-height: 600px;max-height: 720px;position: relative;display: flex;justify-content: center;clip-path: ellipse(100% 100% at 50% 0%);overflow: hidden;position: relative;}

.definition .top_section .text_box{display: flex; justify-content: center; align-items: center;}

.definition .top_section .text_box p{text-shadow:  4px 4px 10px rgba(0,0,0,0.25)}

.definition .main_heading{font-size: 90px;font-weight: 700;color:#fff;letter-spacing: -0.02em;}

.definition .main_heading .mark{background: #FFF4CE; color: #0C82FE; padding: 0 .1em;text-shadow:none; box-shadow:4px 4px 10px rgba(0,0,0,0.25); }

.definition .top_section .img_box{width: calc(800/1280* 100%);/* display: flex; *//* align-items: flex-end; */margin-left: -80px;/* justify-content: space-between; */}

.definition .main_text{font-size: 70px;line-height: 1.2; font-weight: 700; text-align: center; background-color: #fff; position: relative;z-index: 1;padding: 80px 20px 50px;text-align: center;}

.definition .top_section .img_box img{filter: drop-shadow(4px 4px 10px rgba(0,0,0,0.25));}

.definition .ai-text{font-size: clamp(8px, 2vw, 20px); color: rgba(255, 255, 255, 0.67); letter-spacing: -0.02em; position: absolute; top: 5%; right: 16.6%;}



.advantage {background: #F5F5F5;}

.advantage .venn-container{display: flex;justify-content: center;width: 900px;margin: 160px auto;position: relative;}

.advantage .venn-container::before{content:'';width: 88%;height: 130%;border-radius:300px;position:absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);border: 4px solid rgba(43, 77, 190, 0.50);}

.advantage .venn-container::after{content:'+';font-size:50px; font-weight:700;color: #2B4DBE;display: block;position: absolute;top: 50%;left: 50%; transform: translate(-50%, -50%);}

.advantage .circle{width: 38%; border-radius:50%; position: relative;}

.advantage .circle .text_box{width: 120%;height: 120%;object-fit: cover;text-align: center;border-radius: 50%;letter-spacing: -0.02em;gap: 30px;display: flex;

    flex-direction: column;align-items: center;justify-content: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background:rgba(255, 200, 21, 0.60);}

.advantage .circle .text_box p:first-of-type{font-size: 70px;font-weight: 700;}

.advantage .circle .text_box p{font-size: 35px;line-height: 1.2;}

.advantage .circle.top .text_box p:first-of-type{color: #0C82FE;}

.advantage .circle.left .text_box{background:rgba(58, 122, 242, 0.84);color: #fff;}

.advantage .circle::after {content: ''; display: block; padding-bottom: 100%;}

.advantage .inner .sub_explain p{line-height:1.6;}

.advantage .sub_explain .mark{background:#FFE661; font-weight: 700;padding: 0 .2em;}



.material ul{display: grid;grid-template-columns: repeat(4, 1fr);gap: 26px;margin: 60px auto;padding: 34px 0;}

.material ul img{width:100%}

.material .inner .sub_explain p{line-height:1.6;}

.material .sub_explain .mark{background:#FFE661; font-weight: 700;padding: 0 .2em;}



.point{background: #F5F5F5;}

section.point .inner .sub_text{font-size: 85px;}

.point .inner ul.point_list {display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px;margin-top:55px;}

.point .inner ul.point_list li p {font-weight: 700;font-size: 35px;line-height: 1.3;letter-spacing: -1px;color: #fff;text-align: center;border-radius: 20px 20px 0 0;padding: 14px 0;}

.point .inner ul.point_list li:nth-child(1) p {background: #161718;}

.point .inner ul.point_list li:nth-child(2) p {background: #0C82FE;}

.point .inner ul.point_list li .img_box img {border-radius: 0 0 20px 20px;}

.point .inner .notice {font-weight: 300;font-size: 28px;line-height: 44px;letter-spacing: -1px;color: #505050;text-align: center;margin-top: 22px;}

.point .inner .sub_explain p{line-height:1.6;text-wrap: balance;word-break: keep-all;}

.point .sub_explain .mark{background:#FFE661; font-weight: 700;padding: 0 .2em;}



.case{background: #0C82FE;}

.case .inner{padding: 150px 0 0; }

section.case .inner .sub_text{color:#FFE661;font-size: 85px; }

section.case .inner .title_text{color:#fff; }

.case .swiper{ width: 100%;margin-top: 80px;}

.case .swiper-wrapper{align-items: center;}

.case .swiper img{width: 100%; cursor: pointer;}

.case .text_box{position: absolute;z-index:99;top: 40%;left: 50%;transform:translate(-50%, -50%);  pointer-events: none; }

.case .text_box p{font-size: 30px;font-weight: 600;text-align: center;color: #fff;text-shadow: 0 4px 4px rgba(0,0,0,.45);}

.case .img_popup {position: fixed;inset: 0;display: none;align-items: center;justify-content: center;background: rgba(0,0,0,0.6);z-index: 9999;}

.case .img_popup.is-active {display: flex;}

.case .img_popup__content {position: relative;max-width: 90vw;max-height: 90vh;}

.case .img_popup__content img {max-width: 100%;max-height: 100%;display: block;}

.case .img_popup__close {position: absolute;top: -36px;right: -36px;width: 36px;height: 36px;border-radius: 50%;background: rgba(255, 255, 255, 0.85);cursor: pointer;border: none;outline: none;

    display: flex;align-items: center;justify-content: center;}

.img_popup__close::before,.img_popup__close::after {content: "";position: absolute;width: 20px;height: 2px;background: #333;border-radius: 1px;}

.img_popup__close::before {transform: rotate(45deg);}

.img_popup__close::after {transform: rotate(-45deg);}



.abutment{background: #0C82FE;}

section.abutment .inner .sub_text{color:#FFE661;font-size: 85px; }

section.abutment .inner .title_text{color:#fff; }

.abutment .notice{font-size: 28px; letter-spacing: -0.02em; color: #fff;text-align: center; line-height: 1.5; font-weight: 300;}

.abutment .video_box{margin: 50px auto;max-width: 1280px;}





.reason{background: radial-gradient(54.56% 47.77% at 50% 39.97%, #269AFA 0%, #003283 100%);}

section.reason .inner .sub_text{color:#fff; }

section.reason .inner .title_text{color:#fff; }

.reason .main_text{position: relative;  max-width: calc(968/1280 * 100%); margin: 50px auto 0;}

.reason .main_text p{font-size: 45px;text-align: center;line-height: 1.3;letter-spacing: -0.02em;color: #fff;font-weight: 700;}

.reason .main_text p .highlight{color:#FFD852; }

.reason .img_box{margin: 0 auto; max-width: 800px;}



.oneday{background: #0C82FE;}

section.oneday .inner .sub_text .lower_text{font-size: .6em; }

section.oneday .inner .title_text{color:#fff; }

.diagram_wrap {max-width: 600px;  margin: 0 auto} 

.diagram {position: relative;width: 600px;height: 600px;}

.oneday .content_box{display: flex; align-items:center;}

/* ì¤ì ì (378 -> 226.8) */

.center-circle {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 226.8px;height: 226.8px;background: #FFD852;border: 6px solid #0C82FE; /* 10 -> 6 */outline: 1.8px solid rgba(255, 216, 82, .79); /* 3 -> 1.8 */border-radius: 50%;z-index: 3;display: flex;flex-direction: column;justify-content: center;align-items: center;box-shadow: 1.2px 2.4px 2.4px rgba(0,0,0,0.05);}

.center-circle.flip { animation: flip 0.6s ease; }



@keyframes flip {

0%   { transform: translate(-50%, -50%) rotateY(0deg); }

100% { transform: translate(-50%, -50%) rotateY(360deg); }

}



.center-text-small {font-size: 27px; color: #1C1C1C;margin-bottom: 5px;}

.center-text-large {font-size: 42px;font-weight: 700;color: #1C1C1C;line-height: 1;}

/* ë°ê¹¥ ìë¤ (250 -> 150) */

.outer-circle {position: absolute;width: 150px;height: 150px;border-radius: 50%;display: flex;justify-content: center;align-items: center;font-size: 30px; font-weight: 700;color: #1C1C1C;z-index: 2;box-shadow: 1.2px 2.4px 2.4px rgba(0,0,0,0.05);text-align: center;line-height: 1.2;}

.circle-1 {top: 42px;left: 49.2px; background: #F0F7FF;}

.circle-2 {top: 42px;right: 49.2px;background: #A4D0FF;}

.circle-3 {bottom: 42px;right: 49.2px;background: #5CABFF;}

.circle-4 {bottom: 42px;left: 49.2px;background: #0150A2;color: #fff;}

.diagram_wrap svg {position: absolute;top: 0; left: 0;width: 100%; height: 100%;z-index: 0;}

.triangle {position: absolute;width: 0; height: 0;border-left: 16px solid transparent;border-right: 16px solid transparent;border-bottom: 30px solid #fff;z-index: 1;filter: drop-shadow(0 1.2px 2.4px rgba(0,0,0,0.2));transform: translate(-50%, -50%);}



.oneday .inner .notice {font-weight: 300;font-size: 28px;line-height: 1.6;letter-spacing: -1px;color: #161718;text-align: center;margin-top: 40px;}

.oneday  .main_text{text-align: center; margin: 24px 0 48px;}

.oneday  .main_text p{font-size: 45px; color: #fff; letter-spacing: -1px; background:#0066DB; display: inline-block; padding: 0 24px;}

.oneday .benefit_list{width: max-content; margin: 24px auto;}

.oneday .benefit_item .icon{display: inline-block;margin-right: 30px; width:40px; height: 33px; background: url('../images/icon_check.svg') no-repeat 50% 50%; }

.oneday .benefit_item .text{font-size: 50px; color: #fff; line-height: 1.6;}

.oneday .benefit_item .text strong{color: #FFD852; }



.sleep{background: #EAF2FF;}

.sleep .inner{background: url('../images/img_sleep_bg.png') no-repeat left bottom;background-size: 50% auto;}

.sleep .sub_text .mark{display: inline-block;color: #fff;background: linear-gradient(93deg, #47D7FF -3.04%, #0077F4 74.48%), #D9D9D9;padding: 0 24px;line-height: 1.5;}

.sleep .benefit_list{margin-top: 140px;display: flex;flex-direction: column;gap: 18px;margin-left: auto;width: fit-content;}

.sleep .benefit_list .benefit_item{font-size: 50px; letter-spacing:-0.02em; background: #FFFFFF;border: 1px solid #41cffe; border-radius: 300px; padding: 12px 40px;}

.sleep .benefit_list .benefit_item strong{color: #FF8419;}



.slogan .inner{padding: 60px 16.6%;}

.slogan .inner .title_text{color: #FF8419;}

.slogan .inner .sub_text{font-size: 80px;line-height: 1em;}

.slogan .inner .notice{font-size: 25px; line-height: 1.6; font-weight: 300; letter-spacing: -0.04em;color: #161718; text-align: center; margin-top: 60px;}





.global .img_grid_box{display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; width:  calc(1183/1280 * 100%); margin: 0 auto;}

section.global .inner .sub_text{font-size: 85px; }

section.global .inner .title_text{font-size: 50px; }

.global .direct_list{margin:60px auto;display: flex;flex-direction: column;gap: 0px; width: calc(840/1280 * 100%); align-items: stretch;}

.global .direct_item{display: flex;border-radius: 20px;overflow: hidden;height: 80px;}

.global .direct_item .name{font-size: 40px;font-weight: 700;color: #fff;background:#0C82FE;display: flex;justify-content: center;align-items: center;width: 45%;}

.global .direct_item .desc{font-size: 38px;background:#D6EAFF;display: flex;justify-content: flex-start;align-items: center;width: 55%;padding-left: 30px;}



.promotion{background: #EAF2FF;}

section.promotion .inner {padding: 80px 0;}

section.promotion .inner .sub_text {font-size: 85px;}

section.promotion .inner .sub_text .mark{color: #1925DE; background: linear-gradient(to top, #ffd852 30%, transparent 30%); display: inline-block;}

.promotion .benefit_list{width: calc(1012/1280* 100%);margin: 70px auto;max-width: 1084px;}

.promotion .benefit_item {position: relative;margin-bottom:40px;display: flex;}

.promotion .benefit_item:last-of-type{margin-bottom:0;}

.promotion .benefit_item .box{display: block;font-size: 60px;font-weight:  700;background: #A4D0FF;width: 100%;padding: 24px 40px 24px 200px;border-radius: 200px 20px 20px 220px;box-sizing: border-box;margin-left: auto;color: #003283;}

.promotion .benefit_item .icon{display: block;width: 150px;height: 150px;display: block;background: url('../images/icon_promotion_01.svg') no-repeat 50% 50%;position:absolute;left: 50p;top: 50%;transform: translate(0 , -50%);background-size:contain;}

.promotion .benefit_item:nth-of-type(2) .icon{background-image: url('../images/icon_promotion_02.svg');}

.promotion .benefit_item:nth-of-type(3) .icon{background-image: url('../images/icon_promotion_03.svg');}

.promotion .form_box form{position: relative;margin: 0 auto;background: url('../images/img_form_bg.png') no-repeat 50% bottom;background-size: contain;}

.promotion .promotion_footer{display: flex;justify-content: center;align-items: center;gap: 30px;margin-top: 60px;}

.promotion .promotion_footer p{flex-shrink:0;font-size: 80px; font-weight: 700;letter-spacing: -1px;}

.promotion .promotion_footer .img_box{max-width: 700px;}



.promotion .form_box form{margin-top: auto;width: 800px;padding: 200px 300px 60px 300px;display: flex;flex-direction: column;justify-content: center;align-items: center;}

.form_box form .table{width: 80%;box-sizing: border-box;}

.form_box form .table li{margin-bottom:12px;width: 100%;}

.form_box form .table li:last-of-type{margin-bottom:0;}

.form_box form .table input{width: 100%;font-size: 34px;border: 3px solid #3A7AF2;border-radius: 12px;height: 100px;box-sizing: border-box;padding: 0 32px;}

.form_box form .agree_box {margin: 20px 0 40px;width: 80%;padding: 40px 32px;border: 8px solid #3A7AF2;border-radius: 12px;box-sizing: border-box;}

.form_box form .agree_box ul li {margin-bottom: 14px;}

.form_box form .agree_box ul li:first-of-type{border-bottom: 1px solid #ddd;padding-bottom: 16px;}

.form_box form .agree_box ul li:last-child {margin-bottom: 0;}

.form_box form .agree_box ul li > div:first-of-type {position: relative;}

.form_box form .agree_box input[type="checkbox"] {appearance: none; position: absolute; top: 50%; left: 0; transform: translateY(-50%); margin: 0;}

.form_box form .agree_box input[name="allcheck"] + label {font-size: 20px;font-weight: 500;letter-spacing: -1px;}

.form_box form .agree_box label {display: inline-block;width: auto;height: 100%;vertical-align: middle;margin-left: 35px;}

.form_box form .agree_box input[class="agree"]::after {content:''; display: inline-block; width: 26px; height: 26px; 

    border-radius: 4px; border: 1px solid #A6A6A6; box-sizing: border-box; background-color: #fff; vertical-align: middle;

    background-image: url('../images/icon_chk.png'); background-repeat: no-repeat; background-position: center; background-size: 14px 11px;}

.form_box form .agree_box input[class="agree"]:checked::after {border-color: #0C82FE; background-color: #0C82FE;}

.form_box form .agree_box label .btn_agree {display: inline-block;font-size: 20px;line-height: 1.6;color: #161718;}

.form_box form .agree_box label .btn_agree i {font-style: normal; display: inline-block; font-size: 16px; font-weight: 400; letter-spacing: -1px;

    border-radius: 50px; border: 1px solid #AAADB0; background: #FFF; padding: 0 12px; height: 34px; line-height: 34px; margin-left: 6px;}

.form_box form .agree_box .privacy {display: inline-block; background: #fff; border: 1.5px solid #A6A6A6; box-shadow: 0px 2px 1px 0px rgba(44, 39, 56, 0.04); border-radius: 50px; 

    padding: 7px 20px; color: #272727; font-size: 17px; text-align: center; margin-left: 16px; vertical-align: middle;}

.form_box form .terms{position: fixed;inset: 0;display: none;align-items: center;justify-content: center;background: rgba(0,0,0,0.6);z-index: 9999;justify-content: center;align-items: center;}

.form_box form .terms .terms_content{position: relative;max-width: 100vw;max-height: 90vh;}

.form_box form .terms p{width: 100%;height: 360px;overflow-y: scroll;border-radius: 10px;padding: 25px 3%;margin: 14px 0;font-weight: 300;font-size: 15px;

    line-height: normal;color: #454545;background: #F9F9F9;border: 1px solid #D5D5D5;z-index: 1;display: block;box-sizing: border-box;}

.form_box form .terms.on {display: block;}

.form_box form .table_btn{width: 90%;border-radius: 20px;background:#0060F6;font-size: 68px;font-weight: 700;padding: 18px 0;box-sizing: border-box;color: #fff;margin: 0 auto;display: block;}

.terms .terms_popup__close {position: absolute;top: -36px;right: -36px;width: 36px;height: 36px;border-radius: 50%;background: rgba(255, 255, 255, 0.85);

    cursor: pointer;border: none;outline: none;display: flex;align-items: center;justify-content: center;/* transform: translate(-50%, -50%); */}

.terms .terms_popup__close::before,.terms_popup__close::after {content: "";position: absolute;width: 20px;height: 2px;background: #333;border-radius: 1px;}

.terms .terms_popup__close::before {transform: rotate(45deg);}

.terms .terms_popup__close::after {transform: rotate(-45deg);}

/* PC (í´ìë 1440px ~ 1540px) */

@media screen and (max-width:1540px) {

    section > .inner {padding: 150px 12%;}



    .definition .top_section{padding: 40px 5% 0;}

    .intro_banner .inner strong {font-size: 80px;}

    .intro_banner .inner p {font-size: 20px;}



    .material ul{min-width:800px;}

    .point .inner ul li p {font-size: 32px;}

    .point .inner .notice {font-size: 16px; line-height: 1.2em;}



    

}

/* PC (í´ìë 1058px ~ 1440px) */

@media screen and (max-width:1440px) {

    section > .inner {padding: 150px 8%;}

    .definition .top_section{min-height:400px}



    .promotion .form_box form{width: 640px;padding: 200px 200px 60px 200px;}

    .form_box form .table_btn{font-size: 40px;width: 90%;}

    .form_box form .agree_box{width: 90%;padding: 18px 24px;margin: 20px 0;}

    .form_box form .table{width:90%;}

    .form_box form .table input{height: 72px; font-size: 24px;}

}

/* PC (í´ìë 1024px ~ 1058px) */

@media screen and (max-width:1058px) {

    section > .inner {padding: 150px 6%;}

}





/* íë¸ë¦¿ (í´ìë 769px ~ 1024px) */

@media screen and (max-width: 1024px) {

    /* content */

    section .inner .title_text {font-size: 48px;text-wrap: balance;word-break: keep-all;}

    section .inner .sub_text {font-size: 64px;}

    section .inner .sub_text::before {width: 32px; height: 2px; margin-left: -16px;}

    section .inner .sub_explain p {font-size: 32px;line-height: 22px;}

    section > .inner {padding: 80px 5%;}

    

    .intro_banner .inner > span {font-size: 34px;}

    .intro_banner .inner strong { font-size: 68px;}



    .definition .main_heading{font-size: 64px}

    .definition .main_text{font-size: 48px;}

    .definition .ai-text{right: 5%;}    



    .advantage .venn-container{width:700px;margin: 100px auto;}

    .advantage .circle .text_box p:first-of-type{font-size:54px;}

    .advantage .circle .text_box p{font-size: 28px}



    section.point .inner .sub_text{font-size: 64px}



    section.case .inner .sub_text{font-size:64px;}

    .case .text_box p{font-size: 20px;}



    .slogan .inner{padding: 80px 5%}

    .slogan .inner .sub_text{font-size: 52px;}



    .oneday .benefit_item .text{font-size: 36px;}

    .oneday .benefit_item .icon{width: 24px; height: 32px; background-size: contain;}

    .oneday .inner .notice{font-size: 16px;}

    .diagram_wrap  { width: 80%; }

    .oneday .content_box{flex-direction:column;}

    section.global .inner .sub_text{font-size: 64px;}



    .global .direct_list{margin: 24px auto;}

    .direct_list_name{font-size: 24px; padding: 10px 0;}

    .global .direct_item{height: 60px;}

    .global .direct_item .name{font-size: 24px;}

    .global .direct_item .desc{font-size: 24px;}



    section.promotion .inner .sub_text{font-size: 64px;}



    .point .inner .sub_explain p .block {display: inline;}

    .point .inner .sub_explain p i {display: block;}

    .point .inner ul.point_list {gap: 16px;}

    .point .inner ul.point_list li p {font-size: 24px;padding: 12px 0;border-radius: 10px 10px 0 0;}

    .point .inner ul li .img_box img {border-radius: 0 0 10px 10px;}

    .point .inner .notice {font-size: 14px; line-height: 1em; margin-top: 16px;}



    .material ul{min-width:100%;grid-template-columns: repeat(2, 1fr);}

    section.abutment .inner .sub_text{font-size: 64px;}

    .abutment .notice{font-size: 14px;}



    .reason .main_text{max-width: 100%;}



    .sleep .inner{background-position:center; background-size:100% auto;}

    .sleep .benefit_list{width: 100%;margin-top: 100%;}

    .sleep .benefit_list .benefit_item{font-size: 36px;text-align:center}

    

    .promotion .benefit_list{margin: 40px auto;width: 90%;padding: 0 5%;box-sizing: border-box;}

    .promotion .benefit_item{margin-bottom: 24px;}

    .promotion .benefit_item .box{font-size: 36px;padding: 14px 60px 14px 120px;border-radius: 200px 18px 18px 200px;}

    .promotion .benefit_item .icon{width: 90px;height: 90px;}





    .promotion .form_box form{width:100%; padding:140px 0 40px ;}

    .form_box form .agree_box{width: 50%;}

    .form_box form .table{width:50%;}

    .form_box form .table_btn{width: 50%;}

    .form_box form .table input{font-size: 20px;}

    .form_box form .table_btn{font-size: 24px;border-radius: 12px;}

    .promotion .promotion_footer p{font-size: 64px;}

    .form_box form .agree_box label .btn_agree{font-size: 14px;}

    .form_box form .agree_box input[class="agree"]::after{width: 20px; height: 20px;}

    .form_box form .agree_box label{margin-left: 30px;}

    .form_box form .agree_box label .btn_agree i{font-size:12px; height:20px; line-height:18px }

    .form_box form .table li{margin-bottom:10px;}

    .form_box form .agree_box ul li:first-of-type{padding-bottom: 8px;}

    .form_box form .agree_box ul li{margin-bottom:8px;}



}

@media screen and (max-width:821px) {

    .promotion .form_box form{

        padding-bottom: 5%;

        padding: 120px 0 5%;

    }

}

/* ëª¨ë°ì¼ ê°ë¡, ëª¨ë°ì¼ ì¸ë¡ (í´ìë 375px ~ 768px)*/

@media screen and (max-width: 768px) {

    .wrap { min-width: 375px; }

    .show-mobile{display: block;}

    /* content */

    section .inner .title_text {font-size: 20px;line-height: 1.4;}

    section .inner .sub_text {font-size: 30px;}

    section.oneday .inner .sub_text .lower_text{font-size: 1em;}

    section .inner .sub_text::before {width: 32px; height: 2px; margin-left: -16px;}

    section .inner .sub_explain p {font-size: 18px;line-height: 22px;letter-spacing: -0.06em;}

    section > .inner {padding: 60px 5%;}



    .intro_banner {background-position: right bottom;padding-top: calc(166/375 * 100%);background-image: url('../images/img_intro_banner_mo.png');}

    .intro_banner .inner > span {font-size: 23px;letter-spacing: -1px;}

    .intro_banner .inner > span i {display: block;}

    .intro_banner .inner strong {font-size: 42px; letter-spacing: -1px; line-height: 50px;}

    .intro_banner .inner p {font-size: 14px;}



    .definition .top_section{min-height: 260px;padding: 0 5%;max-height: 260px;}

    .definition .main_heading{font-size: 28px;}



    .definition .inner .img_box {width: 60%;margin-left: -40px;}



    .definition .main_text{font-size: 23px;padding: 32px 5% 60px;}

   



    .advantage .venn-container {width: 100%;margin: 60px auto;}

    .advantage .circle .text_box{gap:12px}

    .advantage .circle .text_box p:first-of-type{font-size: 25px;}

    .advantage .circle .text_box p{font-size: 15px;}

    .advantage .venn-container::after{font-size: 24px;}



    .material ul{min-width: 90%;gap: 20px;margin: 24px auto;padding: 12px 0;}



    section.point > .inner {padding: 60px 0;}

    section.point .inner .sub_text{font-size: 30px;}

    .point .point_img_box .img_box{width:100%}

    .point .point_img_box .img_box img{width: 120%}

    .point .point_img_box .img_box:first-of-type img{transform: translateX(-14px);}

    .point .point_img_box .img_box:last-of-type img{transform: translateX(14px);}



    .case .inner{padding: 60px 0 0;}

    section.case .inner .sub_text{font-size: 30px;}

    .case .img_popup__close{top: -48px;right: 2%;}

    .case .swiper{margin-top:32px;}

    .case .text_box p{font-size: 16px;}



    section.abutment .inner .sub_text{font-size: 30px;}

    .abutment .notice{font-size: 9px;text-align:left;}

    

    .reason .main_text p{font-size: 20px;}

    .reason .main_text{margin-top:24px;}

    .reason .main_text .bracket{width: 12px;height: 48px;border-width: 3px;}

    .sleep .inner{background-position: center 45%;padding-bottom: 0;background-image: url('../images/img_sleep_bg_mo.png');}

    .sleep .benefit_list .benefit_item{font-size: 20px;padding: 12px 0;}

    .sleep .benefit_list{gap: 8px;margin-top: 50%;}

    .sleep .sub_text .mark{padding: 0 8px}

    .slogan .inner{padding: 30px 5%;background: #EAF2FF;}

    .slogan .inner .sub_text{font-size: 30px;}

    .slogan .inner .notice{font-size: 11px;margin-top: 32px;}



    .oneday .main_text p{font-size: 17px;padding: 4px 8px;}

    .oneday .benefit_item .text{font-size: 20px;}

    .oneday .benefit_item .icon{width: 13px; height: 12px;margin-right:12px;}

    .oneday .inner .notice{font-size: 9px;}

    .diagram_wrap { width: 100%;display: flex;justify-content: center;}

    .diagram {width: 300px;height: 300px;}

    .center-circle {width: 113.4px;height: 113.4px;border: 3px solid #0C82FE;outline: 0.9px solid rgba(255, 216, 82, .79);box-shadow: 0.6px 1.2px 1.2px rgba(0,0,0,0.05);}

    .center-text-small { font-size: 13.5px;margin-bottom: 2.5px;}

    .center-text-large { font-size: 21px; }

    .outer-circle {width: 75px;height: 75px;font-size: 15px;box-shadow: 0.6px 1.2px 1.2px rgba(0,0,0,0.05);}

    .circle-1, .circle-2 { top: 21px; }

    .circle-3, .circle-4 { bottom: 21px; }

    .circle-1, .circle-4 { left: 24.6px; }

    .circle-2, .circle-3 { right: 24.6px; }

    /* ì¼ê°í í¬ê¸° ì¡°ì  */

    .triangle {border-left: 5.4px solid transparent;border-right: 5.4px solid transparent;border-bottom: 9px solid #fff;filter: drop-shadow(0 0.6px 1.2px rgba(0,0,0,0.2));}



    section.global > .inner{padding: 30px 0;}

    section.global .inner .sub_text{font-size: 30px;}

    section.global .inner .title_text{font-size: 17px;}

    .global .direct_list{width: 90%;}

    .direct_list_name{font-size: 16px; padding: 8px 0; border-top-left-radius:8px; border-top-right-radius:8px;}

    .global .direct_item{height: 30px;border-radius:8px}

    .global .direct_item .name{font-size: 16px;}

    .global .direct_item .desc{font-size: 16px;padding-left: 14px;}

    .global .img_grid_box{width: 100%; gap: 5px}



    section.promotion .inner{padding: 30px 0;}

    section.promotion .inner .sub_text{font-size: 30px;}

    .promotion .benefit_list{margin: 24px auto 0;width: 100%;}

    .promotion .benefit_item{width: 100%;}

    .promotion .benefit_item .box{font-size: 18px;padding: 12px 24px 12px 80px;}

    .promotion .benefit_item .icon{width: 60px;height: 60px;}

    .form_box form .table li{margin-bottom:8px;}

    .form_box form .table input{height: 30px;font-size:15px;border-radius:6px;border-width: 2px;padding: 0 14px;}

    

    .promotion .promotion_footer{gap: 8px;margin-top: 24px;}

    .promotion .promotion_footer p{font-size: 28px;}

    .promotion .promotion_footer .img_box{width: 50%;}

    

    .point .inner .sub_explain p i {display: inline;}

    .point .inner .sub_explain p .block {display: block;}

    .point .inner ul.point_list {grid-template-columns: repeat(1, 1fr);gap: 20px;margin-top: 30px;padding: 0 5%;}

    .point .inner .notice {margin-top: 20px; line-height: 1.5em;}

    .point .inner .notice i {display: block;}





    .abutment .inner ul {flex-direction: column; gap: 20px; margin-top: 10px;}

    .abutment .inner ul li {width: 100%;}

}

@media(max-width: 580px){

    .form_box form .table{width: 65%;}

    .form_box form .agree_box{width: 65%;padding: 8px 12px;border-width: 2px;border-radius: 6px;margin: 8px 0;}

    .form_box form .agree_box label .btn_agree{font-size: 9px;line-height: 20px;}

    .form_box form .agree_box label .btn_agree i{font-size: 8px;height: 16px;line-height: 16px;}

    .form_box form .agree_box input[name="allcheck"] + label{font-size: 9px}  

    .form_box form .agree_box li:first-of-type label .btn_agree{font-size: 13px;}

    .form_box form .table_btn{font-size:25px;padding: 6px 0;width: 70%;}

    .form_box form .agree_box ul li:first-of-type{margin-bottom:4px; padding-bottom: 4px;}

}