.intro_top_heaer{
  max-width: 1920px; width: 100%;
}
#ocare_intro{background: url(../images/bg_login.svg) no-repeat center center;
  background-size: cover; margin:0;     width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;    padding-bottom: 60px;}

.intro_util{display:flex;align-items:center;justify-content:flex-end;}
.intro_inner{position:relative;width:1060rem;margin:0 auto; display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex: 1;
}
.intro_header{display:flex;justify-content:space-between;align-items:center;_position:absolute;_bottom:calc(100% + 20rem);width:100%;}
.logo_onecare{width:140rem;height:27rem;background:url('../images/logo_MYONECARE.png') no-repeat 0 0;background-size:100% auto;}
.intro_contents{display:flex;overflow:hidden;border-radius:20rem;background:#fff;box-shadow:0 50rem 80rem 0 rgba(0, 0, 0, 0.2);}
.intro_contents .intro_visual{flex:none;width:360rem;position:relative;background-color:#27267b;}
.intro_contents .intro_visual:after{display:block;content:'';position:absolute;left:0;bottom:0;width:380rem;height:308rem;background:url('../images/visual_login_01.png') no-repeat 0 100%;background-size:100% auto !important;}
.intro_contents .intro_visual.visual02:after{background:url('../images/visual_login_02.png') no-repeat 0 100%;}
.intro_contents .intro_visual .intro_swiper ul{width:100%;padding:60rem 40rem 20rem;font-size:24rem;color:#fff;line-height:1.3;}
.intro_contents .intro_visual .intro_swiper strong{font-weight:700;}
.intro_contents .intro_visual .intro_pagination{padding:0 40rem;}
.intro_contents .intro_visual .intro_pagination .swiper-pagination-bullet{border-radius:4rem;background:#fff;opacity:1;}
.intro_contents .intro_visual .intro_pagination .swiper-pagination-bullet-active{width:30rem;background:#00d689;}
.intro_contents .intro_info{width:100%;padding:80rem 150rem;text-align:center;}
.intro_contents .title_intro{font-weight:400;font-size:40rem;color:#000;line-height:1.3;white-space: nowrap;}
.intro_contents .intro_info .txt_sub{margin:40rem 0 20rem;font-size:18rem;color:#000;line-height:1.3;}
.intro_contents .intro_info .txt_sub strong{display:block;font-weight:700;}
.intro_contents .intro_info .txt_sub strong span{color:#4170f4;}
.intro_contents .intro_info .box_period{display:flex;flex-direction:column;align-items:center;justify-content:center;width:400rem;margin:20rem auto 60rem;font-size:14rem;line-height:1.2;border-radius:6rem;background:#edf9ff; gap: 20px; padding:20px;}
.intro_contents .intro_info .box_period .title_period{margin-bottom:6rem;color:#747d97;}
.intro_contents .intro_info .box_period strong{display:block;font-weight:700;color:#3f4450;}
.intro_contents .intro_info .btns{position:relative;width:400rem;margin:0 auto;}
.intro_contents .intro_info .btns button{position:relative;z-index:1;width:100%;height:50rem;margin-top:10rem;}
.intro_contents .intro_info .btns .btns--guest{display:flex;column-gap:10rem;}
.intro_contents .intro_info .btns .btns--guest button{margin-top:0;height:80rem;}
.intro_contents .intro_info .btns button:first-child{margin-top:0;}
.intro_contents .intro_info .btns .comment{position:absolute;z-index:2;left:50%;top:-22rem;width:150rem;height:25rem;font-size:12rem;text-align:center;line-height:25rem;border:1rem solid #ffcf72;border-radius:100rem;background:#ffcf72;transform:translateX(-50%);}
.intro_contents .intro_info .btns .comment:after{display:block;content:'';position:absolute;bottom:-5rem;left:50%;width:10rem;height:10rem;background:#ffcf72;transform:translateX(-50%) rotate(45deg);}
.intro_contents .intro_info .btns .comment strong{font-weight:700;}
#ocare_intro.gate .intro_inner .intro_util,
#ocare_intro.certify .intro_inner .intro_util,
#ocare_intro.terms .intro_inner .intro_util,
#ocare_intro.join .intro_inner .intro_util{display:none;}
.intro_footer{font-size:14rem;color:#b5b9c3;text-align:center;line-height:1.2;}
.intro_top_heaer .intro_util{
  max-width: 1920px;
  margin: 0 auto;
  padding: 30rem;
  font-size: 14rem;
}
input[type=text],
input[type=password],
input[type=number],
input[type=rang],
input[type=email],
input[type=url],
input[type=date],
input[type=datetime],
input[type=tel],
input[type=search],
input[type=color],
select{height:50rem;font-size:14rem;}
html,body{min-height:100%;}
#ocare_intro{    width: 100%;
  min-height: 100vh;
  max-width: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; display: flex;
  align-items: center;
  justify-content: start;
  flex-direction: column;}
.intro_util{ margin-bottom:265rem;padding:30rem;font-size:14rem;}
.intro_util button{margin-left:15rem;}
.intro_header{padding:0 20rem;}
.intro_contents{width:1060rem;min-height:568rem;margin:20px auto 50rem;}
/* html,body{height:100%;}
body{background-size:1024rem auto;}
.intro_util{margin-bottom:103rem;padding:20rem 20rem 0;font-size:12rem;} */
/* .intro_util .btn01_md{height:25rem;margin-left:10rem;font-size:13rem;} */
/* .intro_header{padding:0 20rem;} */
/* .intro_inner{width:880rem;} */

/* .intro_contents{width:880rem;min-height:480rem;margin:20px auto 30rem;} */
/* .intro_contents .intro_visual{width:310rem;}
.intro_contents .intro_visual:after{width:320rem;height:260rem;}
.intro_contents .intro_visual .intro_swiper ul{padding:50rem 40rem 20rem;font-size:20rem;}
.intro_contents .title_intro{font-size:34rem;}
.intro_contents .intro_info{padding:70rem 125rem;}
.intro_contents .intro_info .title_intro{font-size:34rem;}
.intro_contents .intro_info .txt_sub{margin:28rem 0;font-size:16rem;line-height:1.2;}
.intro_contents .intro_info .box_period{width:320rem;margin:28rem auto 40rem;}
.intro_contents .intro_info .btns{width:320rem;}
.intro_contents .intro_info .btns button{height:40rem;font-size:14rem;} */
@media screen and (min-width:1080px){

}
@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:880px){
	body{background:none;}
	#ocare_intro{padding:20rem 20rem 40rem; background: #fff;}
	#ocare_intro.gate{padding:40rem 20rem;}
	#ocare_intro>.intro_util{display:none;}
	.intro_util{justify-content:flex-start;margin-top:20rem;font-size:14rem;}
	.intro_util a{margin-left:10rem;font-size:14rem;color:#4170f4;}
	.intro_util a:after{display:inline-block;content:'';width:7rem;height:12rem;margin-left:4rem;vertical-align:center;background:url('../images/arr_md_r.svg') no-repeat 0 0;background-size:100% 100%;}
	.intro_inner{width:100%;}
	.intro_header{display:flex;align-items:center;justify-content:flex-start;position:relative;height:42rem;margin:0;}
	.logo_onecare{width:110rem;height:22rem;background-size:100% 100%;}
	.logo_corp{display:inline-flex;align-items:center; width: auto;height: 42rem;object-fit: contain;}
	.logo_corp:before{flex:none;display:block;content:'';width:1rem;height:16rem;margin:0 10rem;background:#dbdbe4;}
	.logo_corp img{width:100%;}
	.intro_contents{box-shadow:none;}
	.intro_contents .intro_visual{display:none;}
	.intro_contents .title_intro{font-size:34rem;}
	.intro_contents .intro_info{padding:80rem 0;}
	.intro_contents .intro_info .title_intro{font-size:30rem;}
	.intro_contents .intro_info .box_period{width:100%;margin:20rem auto 37rem;}
	.intro_contents .intro_info .btns{width:100%;}
  .intro_contents .intro_info .btns .btns--guest button{height:50rem;}
	.intro_contents .intro_info .intro_util{display:flex;}
	#ocare_intro.gate .intro_header{justify-content:center;}
	#ocare_intro.gate .intro_inner .intro_util,
	#ocare_intro.certify .intro_inner .intro_util,
	#ocare_intro.terms .intro_inner .intro_util,
	#ocare_intro.join .intro_inner .intro_util{display:flex;}
  .intro_top_heaer{display: none;}
  .form_login .btns button{
    height: 50rem;
  }
}

/* form */

@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:800px){
	input[type=text],
	input[type=password],
	input[type=number],
	input[type=rang],
	input[type=email],
	input[type=url],
	input[type=date],
	input[type=datetime],
	input[type=tel],
	input[type=search],
	input[type=color],
	select{height:50rem;font-size:16rem;}
	textarea{font-size:16rem;}
}

.inp_social{display:flex;align-items:center;justify-content:space-between;height:50rem;border:1rem solid #dddeea;border-radius:6rem;background:#fff;}
.inp_social .txt_dash{flex:none;width:44rem;font-size:14rem;text-align:center;}
.inp_social input{width:calc(50% - 22rem);height:100%;text-align:center;text-indent:0;border:0;}
.inp_social .inp_gender{display:inline-flex;align-items:center;justify-content:center;width:calc(50% - 22rem);}
.inp_social .inp_gender input{width:0;}
.inp_email{display:flex;align-items:center;justify-content:space-between;height:50rem;border:1rem solid #dddeea;border-radius:6rem;background:#fff;}
.inp_email .txt_at{flex:none;width:44rem;font-size:14rem;text-align:center;}
.inp_email input:first-child{width:43%;}
.inp_email input:last-child{width:50%;text-indent:0;}
.inp_email.error{border-color:#ff3030;}
.inp_email input,
.inp_pw input{width:100%;height:100%;border:0;}
.inp_pw{padding-right:15rem;}
.inp_pw{display:flex;align-items:center;justify-content:space-between;height:50rem;border:1rem solid #dddeea;border-radius:6rem;background:#fff;}
.inp_pw .btn_pw{border:0;width:18rem;height:18rem;background:url('../images/ico_pw_hide.svg') no-repeat 0 0;}
.inp_pw .btn_pw.visible{border:0;width:18rem;height:18rem;background:url('../images/ico_pw_show.svg') no-repeat 0 0;}
.inp_pw.error{border-color:#ff3030;}
.inp_pw.error .btn_pw{display:none;}
.inp_pw.error:after{display:inline-block;content:'';flex:none;width:18rem;height:18rem;background:url('../images/ico_inp_error.svg') no-repeat 0 0;}
.inp_phone{display:flex;align-items:center;justify-content:space-between;gap:10rem;}
.inp_phone.disabled{color:#b5b9c3;background:#f4f4f8;}
.inp_phone>select{flex:none;width:120rem;}
.inp_phone .inp_num{display:inline-flex;align-items:center;justify-content:space-between;flex:1;height:50rem;border:1rem solid #dddeea;border-radius:6rem;}
.inp_phone .inp_num input{width:100%;height:100%;padding:0;text-align:center;text-indent:0;border:0;}
.inp_phone .txt_dash{flex:none;width:33rem;font-size:14rem;text-align:center;}
.inp_comment{margin-top:4rem;font-size:12rem;color:#747d97;line-height:1.2;}
.inp_comment.txt_error{height:auto;margin:4rem 0 0;}
.txt_error{height:0;margin:4rem 0 -4rem;font-size:12rem;color:#ff3030;}

@media screen and (min-width:1080px){
}
@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:880px){
}

/* join */
.intro_contents .intro_steps{flex:none;position:relative;width:360rem;padding:60rem 40rem;color:#fff;background-color:#27267b;}
.intro_contents .intro_steps>.title{margin-bottom:60rem;font-size:24rem;line-height:1.3;}
.intro_contents .intro_steps>.title strong{display:block;font-weight:700;}
.steps li{display:flex;align-items:center;position:relative;margin-top:31rem;font-size:16rem;color:#dddeea;}
.steps li:first-child{margin-top:0;}
.steps li:before{display:block;content:'';position:absolute;left:13rem;bottom:100%;width:1rem;height:31rem;background:#161560;}
.steps li:first-child:before{display:none;}
.steps li .num{display:inline-flex;align-items:center;justify-content:center;flex:none;width:26rem;height:26rem;margin-right:10rem;font-weight:700;font-size:16rem;color:#fff;border-radius:50%;background:#161560;}
.steps li.current{font-weight:700;color:#fff;}
.steps li.current .num{background:#4170f4;}
.steps li.pass:after{display:block;content:'';width:18rem;height:18rem;margin-left:5rem;background:url('../images/ico_done.svg') no-repeat 0 0;}
.box_agree .list_agree{margin-top:20rem;border-top:1rem solid #dddeea;}
.box_agree .list_agree li{display:flex;align-items:center;justify-content:space-between;margin-top:20rem;}
.box_agree .list_agree li .txt_require{font-style:normal;color:#4170f4;}
.box_agree .list_agree li .txt_elect{font-style:normal;color:#747d97;}

/* .intro_contents .intro_steps{width:310rem;} */
@media screen and (min-width:1080px){

}
@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:880px){
	.intro_contents{flex-direction:column;width: 100%;}
	.intro_contents .intro_steps{width:100%;padding:60rem 0 0;background:none;}
	.intro_contents .intro_steps>.title{display:none;}
	.steps{display:flex;}
	.steps li{margin:0;}
	.steps li>*{display:none;}
	.steps li:before{display:none;}
	.steps li .num{display:inline-flex;margin-right:5rem;background:#dddeea;}
	.intro_contents .intro_steps+.login_info{padding-top:20rem;}
	.steps li.pass:after{display:none;}
	.steps li.pass .num{font-size:0;background:url('../images/ico_pass.svg') #27267b no-repeat 50% 50%;}
}

/* login */
.intro_contents .login_info{width:100%;}
.intro_contents .login_info .title_intro{margin-bottom:30rem;}
.intro_contents .login_info .title_intro .user_name{font-weight:700;}
.form_login dt{margin:20rem 0 8rem;font-weight:700;font-size:14rem;line-height:1.2;}
.form_login dl dt:first-child{margin-top:0;}
.form_login .inp_social,
.form_login .inp_email,
.form_login .inp_pw{width:100%;}
.form_login .btns{margin-top:60rem;}
.form_login .inp_social.disabled{color:#b5b9c3;background-color:#f4f4f8;}
.form_login .btns button{width:100%;}
.form_login .info_done{margin-bottom:40rem;}
.form_login .info_done dt{display:none;}
.form_login .info_done dd{margin-top:20rem;}
.intro_inner .intro_util{justify-content:flex-start;margin:20rem 0 0;padding:0;font-size:14rem;}
.intro_inner .intro_util a{margin-left:10rem;font-size:14rem;color:#4170f4;}
.intro_inner .intro_util a:after{display:inline-block;content:'';width:7rem;height:12rem;margin-left:4rem;vertical-align:center;background:url('../images/arr_md_r.svg') no-repeat 0 0;background-size:100% 100%;}
.box_warning{margin:30rem 0;padding:11rem 0;text-align:center;border-radius:6rem;background:#ffebeb;}
.box_warning span{display:flex;align-items:center;justify-content:center;font-size:14rem;line-height:1.2;}
.box_warning span:before{display:inline-block;content:'';flex:none;width:18rem;height:18rem;margin-right:5rem;background:url('../images/ico_inp_error.svg') no-repeat 0 0;}
.intro_contents .login_info{padding:80rem 150rem;}
.login_info{min-height:551rem;}
/* .form_login .btns button[class*='_xl']{height:40rem;} */
/* .intro_contents .login_info{padding:80rem 150rem;} */
.login_info{min-height:600rem;}
@media screen and (min-width:1080px){

}
@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:880px){
	.intro_contents .login_info .title_intro{margin-bottom:20rem;}
	.intro_contents .login_info{padding:60rem 0 170rem;}
}

/* password */
.comment_intro{margin-bottom:30rem;font-size:14rem;color:#747d97;line-height:1.55;}
.comment_intro.join_finished:after{display:block;content:'';width:80rem;height:80rem;margin:80rem auto 0;background:url('../images/ico_input_success.svg') no-repeat 50% 50%;background-size:100% 100%;}
.comment_intro.join_finished:after{margin-top:60rem;}
@media screen and (min-width:880px) and (max-width:1080px){

}
@media screen and (max-width:880px){
	.comment_intro{margin-bottom:60rem;}
	.comment_intro.join_finished{margin-bottom:80rem;}
}

/* includesys 2024-1016 */
.intro_contents .intro_info .btns,
.intro_contents .intro_info .box_period {width: 100%;}
.intro_sns .intro_sns_title {
  display: block;
  position: relative;
  font-size: 18rem;
  font-weight: 600;
  margin-top: 40rem;
  margin-bottom: 20rem;
  overflow: hidden;
  text-align: center;
}

.intro_sns .intro_sns_title::before,
.intro_sns .intro_sns_title::after {
  content: '';
  position: absolute;
  width: 100%; height: 1px; background-color: #2b2b77;
  top: calc(50% - 1px);
  width: 36%;
}

.intro_sns .intro_sns_title::before {
  left: 0;
}
.intro_sns .intro_sns_title::after {
  right: 0;
}

.intro_sns .intro_sns_list {
  display: flex;
  gap: 10rem;
  justify-content: center;
}

.intro_sns .intro_sns_list .sns-icon {
  width: 46px; height: 46px;
}


.intro_contents .login_info .login_utils { margin-top:16rem; display: flex; justify-content: center; font-size: 14rem; gap: 29rem; }
.intro_contents .login_info .login_utils .item { position: relative; }
.intro_contents .login_info .login_utils .item:not(:first-child)::before {content: ''; position: absolute; display: inline-block; width: 2px; top: 4px; height: 70%; background-color: #b4b7c1; left: -15px;}
.intro_contents .login_info .login_utils .item .link { opacity: 60%; }
.intro_contents .login_info .login_utils .item .link:hover { opacity: 100%; }

.popup .pop_cont .pop_cont_list { font-size: 18rem; }
.popup .pop_cont .pop_cont_list .item { position: relative; padding-left: 20rem; }
.popup .pop_cont .pop_cont_list .item+.item { margin-top: 16rem;}
.popup .pop_cont .pop_cont_list .item em { position: absolute; left: 0; font-style: normal; }
.popup .pop_cont .pop_cont_list .item .btns {margin-top: 20rem;}
.popup .pop_cont .pop_cont_list .item .btns button { height: 80rem; width: 100%; }
.popup .pop_cont .pop_cont_list .item .btns .btns--guest { display: flex; column-gap: 10rem; }

.popup .pop_cont .pop_cont_list+.intro_util { justify-content: flex-start; margin: 20rem 0 10rem; padding: 0; font-size: 14rem; }
.popup .pop_cont .pop_cont_list+.intro_util a { margin-left: 10rem; font-size: 14rem; color: #4170f4; }
.popup .pop_cont .pop_cont_list+.intro_util a::after { display: inline-block; content: ''; width: 7rem; height: 12rem; margin-left: 4rem; vertical-align: center; background: url(../images/arr_md_r.svg) no-repeat 0 0; background-size: 100% 100%; }

@media screen and (max-width: 880px) {
  .popup .pop_cont .pop_cont_list .item .btns button { height: 50rem; }
}