@charset "utf-8";

#subVisual .wrapper{
	background:url(/img/subVisual/sub_02_bg.png) no-repeat;
	background-position:right bottom;
    background-size: auto 90%;
}

#banner{
	display:none;
}

#footer{
	border-top:2px solid var(--blue01);
}

/***********************

medical_info

***********************/

#medical_info_01 .wrapper{
	display:flex;
}

#medical_info_01 .tit{
	width:45%;
}

.medical_txt{
	width:55%;
}

.medical_txt .txt_box{
	margin-bottom:60px;
}

.medical_txt>div:last-child{
	margin-bottom:0;
}

.medical_txt .txt_box h3{
	font-size:1.25rem;
	position:relative;
	padding-bottom:20px;
	margin-bottom:20px;
	font-weight:600;
	color:var(--blue01);
	display:flex;
	align-items:center;
}

.medical_txt .txt_box h3 span{
	width:20px;
	height:20px;
	display:flex;
	justify-content:center;
	color:var(--white);
	font-size:0.875rem;
	font-weight:600;
	background-color:var(--blue01);
	border-radius:50%;
	align-items:center;
	margin-right:10px;
}

.medical_txt .txt_box h3:after{
	position:absolute;
	content:'';
	width:100%;
	height:1px;
	left:0;
	bottom:0;
	background-color:var(--gray01);
	display:block;
}

.medical_txt .txt_box p{
	color:var(--gray01);
	font-size:1.125rem;
	word-break:keep-all;
	line-height:1.5;
}

.scroll_txt{
	display:none;
}


#medical_info_02 .timetable{
	width:100%;
	padding:40px 100px;
	border-radius:30px;
	background-color:var(--white);
}

.timetable table{
	width:100%;
}

.timetable table thead tr{
	background-color:var(--blue04);
	border-radius:10px;
}

.timetable table thead tr th{
	font-size:1.25rem;
	font-weight:700;
	color:var(--white);
	padding:15px 0;
	width:calc(100% / 8);
	text-align:center;
}

.timetable table thead tr th:first-child{
	border-radius:10px 0 0 10px;
}

.timetable table thead tr th:last-child{
	border-radius:0 10px 10px 0;
}

.timetable table tbody tr td{
	width:calc(100% / 8);
	padding:20px 0;
	font-size:1.125rem;
	text-align:center;
	border-right:1px solid var(--gray02);
}

.timetable table tbody tr{
	border-bottom:1px solid var(--gray02);
}


.timetable table tbody tr td:last-child{
	border-right:0;
}

.time_check{
	display:flex;
}

.time_check .left{
	display:flex;
	width:50%;
}

.time_check .left img{
	width:30px;
	height:30px;
	margin-right:10px;
}

.time_check .left p{
	font-size:1.875rem;
	font-weight:700;
	color:var(--blue01);
}

.time_check .right{
	padding:10px 40px;
	width:50%;
	border-radius:10px;
	background-color:var(--white);
}

/* .time_check .right tr td:nth-child(odd){
	width:20%;
}

.time_check .right tr td:nth-child(even){
	width:30%;
} */

.time_check .right ul{
	display:flex;
	flex-wrap:wrap;
}

.time_check .right .right_info{
	width:50%;
}

.time_check .right .right_info strong,
.time_check .right .right_info span{
	font-size:1.125rem;
	color:#343434;
	line-height:1.5;
	font-weight:400;
}

.time_check .right .right_info span{
	padding-left:20px;
}

.time_check .right .right_info span.blue{
	padding:0;
}

#medical_info_03 .step_info{
	display:flex;
	flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
}

#medical_info_03 .step_info li{
	background-color:var(--blue03);
	padding:20px;
	border-radius:10px;
	width:calc((100% - 80px) / 5);
}

#medical_info_03 .step_info li .info_img{
	width:70px;
	height:70px;
	border-radius:50%;
	background-color:var(--white);
	display:flex;
	justify-content:center;
	align-items:center;
	margin-bottom:20px;
}

#medical_info_03 .step_info li h4{
	font-size:1.5rem;
	font-weight:600;
}

.step_info .step_tit{
	padding-bottom:20px;
	margin-bottom:20px;
	position:relative;
	display:flex;
	justify-content: space-between;
    align-items: flex-end;
}

.step_info .step_tit::before{
	display:block;
	position:absolute;
	width:100%;
	height:1px;
	background-color:var(--blue01);
	bottom:0;
	left:0;
	content:'';
}

#medical_info_03 .step_info li p{
	font-size:1rem;
	font-weight:600;
	color:var(--blue01);
}

#medical_info_03 .step_info .step_tit p{
	font-size:0.75rem;
	color:var(--blue01);
	font-family: 'GmarketSansMedium';
}

@media screen and (max-width:1300px){
	#medical_info_01 .tit{
		width:40%;
	}

	#medical_info_01 .medical_txt{
		width:60%;
	}

	.medical_txt .txt_box p br{
		display: none;
	}

	.time_check .right ul .right_info strong,
	.time_check .right ul .right_info span
	{
		font-size:1rem;
	}

	#medical_info_03 .step_info li h4{
		font-size:1.25rem;
	}

	#subVisual .wrapper{
		background-size:50% auto;
	}
}

@media screen and (max-width:1064px){
	.step_info .step_tit{
		padding-bottom:15px;
		margin-bottom:15px;
	}

	#medical_info_03 .step_info li{
		width: calc((100% - 60px) / 4);
	}

	#medical_info_03 .step_info{
		justify-content:flex-start;
	}

	#medical_info_02 .timetable{
		padding:30px 60px;
		border-radius:20px;
	}

	.timetable table thead tr th{
		font-size:1.125rem;
	}

	.timetable table tbody tr td{
		font-size:1rem;
		padding:15px 0;
	}

	.time_check .left{
		width:60%;
	}

	.time_check .right{
		width:100%;
	}

	.time_check{
		flex-direction:column;
		gap:40px;
	}

	#medical_info_03 .step_info li .info_img{
		width:60px;
		height:60px;
	}
}

@media screen and (max-width:969px){
	.medical_txt .txt_box p{
		font-size:1rem;
	}
	
	 #medical_info_03 .step_info li {
        width: calc((100% - 40px) / 3);
    }

	#medical_info_01 .wrapper{
		flex-direction:column;
	}

	#medical_info_01 .tit{
		width:100%;
	}

	#medical_info_01 .medical_txt{
		width:100%;
	}

	#medical_info_02 .timetable{
		padding:20px 30px;
		border-radius:10px;
	}

	.timetable table thead tr th{
		font-size:1rem;
	}

	.timetable table tbody tr td{
		font-size:0.85rem;
	}

	.time_check .left{
		width:100%;
	}

	.time_check .left img{
		width:25px;
		height:25px;
	}

	.time_check .left p{
		font-size:1.5rem;
	}
	
	#subVisual .wrapper{
		background-size:58% auto;
	}
}

@media screen and (max-width:640px){
	.medical_txt .txt_box h3{
		font-size:1.125rem;
		padding-bottom:10px;
		margin-bottom:10px;
	}

	.medical_txt .txt_box h3 span{
		width:18px;
		height:18px;
		font-size:0.7rem;
	}

	#medical_info_03 .step_info li{
		width:47%;
		margin-bottom:20px;
	}

	#medical_info_03 .step_info li:last-child{
		margin:0;
	}

	#medical_info_02 .timetable .timetable_box{
		overflow-x:scroll;
	}

	.timetable table{
		width:800px;
	}

	.scroll_txt{
		display:block;
		margin-bottom:20px;
		text-align:center;
		font-size:1rem;
	}

	.time_check .right ul{
		flex-direction:column;
	}

	.time_check .right ul .right_info{
		width:100%;
	}

	#subVisual .wrapper{
		background-size:77% auto;
	}

}

@media screen and (max-width:460px){
	.timetable table {
        width: 600px;
    }

	 .time_check .left p {
        font-size: 1.25rem;
    }

	 .time_check .left img {
        width: 20px;
        height: 20px;
    }

	.step_info .step_tit{
		flex-direction: column;
        align-items: flex-start;
        gap: 5px;
	}

	#medical_info_03 .step_info li h4{
		font-size:1.125rem;
	}

	#medical_info_03 .step_info li{
		width:46%;
	}

	#subVisual .wrapper{
		background-size:90% auto;
	}
}

@media screen and (max-width:320px){
	#medical_info_03 .step_info{
		flex-direction:column;
		gap:0;
	}

	.step_info .step_tit{
		flex-direction:row;
	}

	#medical_info_03 .step_info li{
		width:100%;
	}
}


/***********************

treatment

***********************/

.comp_info{
	display:flex;
	flex-flow:wrap;
	justify-content:space-between;
}

.comp_info>li{
	width:49%;
	padding:30px 20px;
	border-radius:20px;
	border:1px solid var(--blue05);
	display:flex;
	height:278px;
	margin-bottom:30px;
}

.comp_info>li:nth-child(5),
.comp_info>li:nth-child(6){
	margin-bottom:0;
}

.comp_info li figure{
	margin:0;
	padding:0;
	width:30%;
	display:flex;
	align-items:center;
}

.comp_info .comp_box{
	width:70%;
}

.comp_info .comp_box h5{
	font-size:1.25rem;
	font-weight:700;
	color:var(--blue01);
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid var(--gray01);
	display: flex;
    align-items: center;
}

.comp_info .comp_box h5 span{
	color:var(--white);
	font-size:0.75rem;
	width:20px;
	height:20px;
	text-align:center;
	margin-right:10px;
	background-color:var(--blue01);
	border-radius:50%;
	align-items: center;
    display: flex;
    justify-content: center;
}

.comp_info .comp_txt ul{
	display:flex;
	flex-direction: column;
	gap:20px;
}

.comp_info .comp_txt ul li{
	display:flex;
}

.comp_info .comp_txt ul li span{
	border-radius:20px;
	background-color:var(--blue01);
	color:var(--white);
	font-size:0.875rem;
	font-weight:700;
	margin-right:10px;
	width:60px;
	height:20px;
	text-align:center;    
	align-items: center;
    display: flex;
    justify-content: center;
}

.comp_info .comp_txt ul li p{
	font-size:1rem;
	color:var(--gray01);
	line-height:1.5;
	width: calc(100% - 70px);
	word-break:keep-all;
}

.pro_info{
	display:flex;
	flex-flow:wrap;
	justify-content:space-between;
}

.pro_info li{
	width: calc((100% - 60px) / 3);
	height:430px;
	border-radius:10px;
	margin-bottom:40px;
	overflow:hidden;
}

.pro_info li .pro_img_box{
	height:58%;
	background-position:center;
	background-repeat:no-repeat;
}

.pro_info li .pro_txt{
	height:42%;
	background-color:var(--white);
	padding:30px 10px 0 10px ;
	text-align:center;
}

.pro_info li .pro_txt h6{
	font-size:1.25rem;
	font-weight:700;
	margin-bottom:20px;
}

.pro_info li .pro_txt p{
	font-size:1rem;
	color:var(--gray01);
	line-height:1.5;
	word-break:keep-all;
}

.pro_img01{
	background:url(/img/info/program_01.png);
	background-color:#edecea;
}

.pro_img02{
	background:url(/img/info/program_02.png);
	background-color:#faf1d1;
}

.pro_img03{
	background:url(/img/info/program_03.png);
	background-color:#dbf3fb;
}

.pro_img04{
	background:url(/img/info/program_04.png);
	background-color:#ffe5af;
}

.pro_img05{
	background:url(/img/info/program_05.png);
	background-color:#99adc8;
}

.pro_img06{
	background:url(/img/info/program_06.png);
	background-color:#dae3f3;
}

.pro_img07{
	background:url(/img/info/program_07.png);
	background-color:#f8eee4;
}

.pro_img08{
	background:url(/img/info/program_08.png);
	background-color:#ffe8d6;
}

.pro_img09{
	background:url(/img/info/program_09.png);
	background-color:#fff5e8;
}

.pro_img10{
	background:url(/img/info/program_10.png);
	background-color:#e8f9ff;
}

.pro_img11{
	background:url(/img/info/program_11.png);
	background-color:#fff3dc;
}

.pro_img12{
	background:url(/img/info/program_12.png);
	background-color:#fee9e6;
}

.pro_img13{
	background:url(/img/info/program_13.png);
	background-color:#ffe8d6;
}

@media screen and (max-width:1300px){
	.comp_info>li{
		height:300px;
	}

	.pro_info li .pro_txt{
		padding:20px 10px 0 10px;
	}

	.pro_info li .pro_txt p br{
		display:none;
	}
}

@media screen and (max-width:1100px){
	.comp_info>li{
		flex-direction:column;
		height:auto;
	}

	.comp_info li figure{
		width:100%;
		justify-content:center;
		margin-bottom: 20px;
	}

	.comp_info .comp_box{
		width:100%;
	}

	.pro_info li .pro_img_box{
		background-position:center bottom;
		background-size:auto 80%;
	}

	.pro_info li{
		height:400px;
	}

	.pro_info li .pro_txt h6{
		font-size:1.125rem;
	}

	.pro_info li .pro_txt p{
		font-size:0.875rem;
	}

	.comp_info .comp_txt ul li p{
		font-size:0.875rem;
	}

	.comp_info .comp_box h5{
		font-size:1.125rem;
	}
}

@media screen and (max-width:989px){
	.pro_info li{
		height:390px;
		width:calc((100% - 40px) / 2);
	}
}

@media screen and (max-width:640px){
	.comp_info>li{
		width:48%;
		padding:20px 10px;
		border-radius:10px;
		margin-bottom:20px;
	}

	.comp_info li figure{
		width:60%;
		margin:0 auto 20px auto;
	}

	.comp_info .comp_txt ul li{
		flex-direction:column;
	}

	.comp_info .comp_txt ul li p{
		margin-top:10px;
		width:100%;
		font-size:0.8rem;
	}

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

	.pro_info li .pro_txt h6{
		margin-bottom:10px;
	}

	.pro_info li .pro_txt p{
		font-size:0.8rem;
	}
}

@media screen and (max-width:460px){
	.comp_info{
		flex-direction:column;
	}

	.comp_info>li{
		width:100%;
	}

	.comp_info>li:nth-child(5){
		margin-bottom:20px;
	}

	.pro_info li{
		width:100%;
		height:350px;
	}

	.pro_info li .pro_txt {
        padding: 20px 20px 0 20px;
    }
}

/***********************

doctor

***********************/

.doctor_info{
	display:flex;
	justify-content:space-between;
}

.doctor_info .doctor_img{
	/* width:500px;
	height:550px; */
	border-radius: 30px;
	width:40%;
	overflow:hidden;
	height: fit-content;
}

.doctor_info .doctor_img img{
	width:100%;
}

.doctor_info .doctor_txt{
	/* width:calc(100% - 560px); */
	padding-top:100px;
	width:53%;
}

.doctor_info .doctor_txt h5{
	font-size:1rem;
	color:var(--blue01);
	font-weight:700;
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid var(--blue01);
}

.doctor_info .doctor_txt h5 strong{
	font-size:2.1875rem;
	color:var(--black);
	font-weight:700;
}

.doctor_info .doctor_txt .career{
	display:flex;
	flex-direction:column;
	gap:20px;
}

.doctor_info .doctor_txt .career>li{
	padding-left:30px;
	word-break:keep-all;
}

.doctor_info .doctor_txt .career>li:first-child{
	position:relative;
}

.doctor_info .doctor_txt .career>li:first-child:before{
	position:absolute;
	content:'';
	width:25px;
	height:25px;
	border-radius:50%;
	left:0;
	top:0;
	background:url(/img/info/icn_career01.png) no-repeat var(--blue01);
	background-position: center;
}

.doctor_info .doctor_txt .career>li:last-child{
	position:relative;
}

.doctor_info .doctor_txt .career>li:last-child:before{
	position:absolute;
	content:'';
	width:25px;
	height:25px;
	border-radius:50%;
	left:0;
	top:0;
	background:url(/img/info/icn_career02.png) no-repeat var(--blue01);
	background-position: center;
}


.doctor_info .doctor_txt li h6{
	font-size:1.25rem;
	font-weight:700;
	color:var(--blue01);
}

.doctor_info .doctor_txt li ul li{
	font-size:1.125rem;
	color:var(--gray01);
	line-height:1.5;
}

.doctor_info .doctor_txt li ul li.blue{
	font-weight:700;
}

.switch{
	flex-direction: row-reverse;
}

/* .doctor01 .doctor_img{
	background:url(/img/doctor_01.png) no-repeat;
	background-position: top center;
} 

.doctor02 .doctor_img{
	background:url(/img/doctor_02.png) no-repeat;
	background-position: top center;
}

.doctor03 .doctor_img{
	background:url(/img/doctor_03.png) no-repeat;
	background-position: top center;
}

.doctor04 .doctor_img{
	background:url(/img/doctor_04.png) no-repeat;
	background-position: top center;
}

.doctor05 .doctor_img{
	background:url(/img/doctor_05.png) no-repeat;
	background-position: top center;
}

.doctor06 .doctor_img{
	background:url(/img/doctor_06.png) no-repeat;
	background-position: top center;
}
*/

@media screen and (max-width:1300px){
	.doctor_info .doctor_txt{
		padding-top:30px;
	}
}

@media screen and (max-width:1100px){
	/* .doctor_info .doctor_img{
		width:450px;
		height:500px;
	}
	
	.doctor_info .doctor_txt{
		width: calc(100% - 510px);
		padding-top:80px;
	} */

	.doctor_info .doctor_txt li h6{
		font-size:1.125rem;
	}

	.doctor_info .doctor_txt li ul li{
		font-size:1rem;
	}
}

@media screen and (max-width:989px){
	.doctors{
		display:flex;
		flex-flow:wrap;
		justify-content:space-between;
	}

	.doctor_info{
		flex-direction:column;
		width:48%;
		height: auto;
        align-self: flex-start;
	}

	.doctor_info .doctor_img{
		width:100%;
	}

	.doctor_info .doctor_txt{
		width:100%;
	}
}

@media screen and (max-width:640px){
	.doctor_info .doctor_txt h5 strong{
		font-size:1.75rem;
	}

	.doctor_info .doctor_txt .career>li:first-child:before{
		width:20px;
		height:20px;
		background-size:60%;
	}

	.doctor_info .doctor_txt .career>li:last-child:before{
		width:20px;
		height:20px;
		background-size:50%;
	}

	.doctor_info .doctor_txt li ul li {
        font-size: 0.875rem;
    }

	.doctor_info .doctor_txt .career>li {
		padding-left: 25px;
	}
}

@media screen and (max-width:460px){
	.doctor_info{
		width:100%;
	}

	.doctor_info .doctor_txt li ul li {
        font-size: 1rem;
    }
}

/***********************

discharge

***********************/

.dis_box .dis_tab_tit{
	display:flex;
	justify-content: center;
}

.dis_box .dis_tab_tit li{
	width:calc((100% - 50px) / 5);
}

.dis_box .dis_tab_tit li a{
	width:100%;
	padding:15px 20px;
	border:1px solid var(--blue03);
	border-radius:10px 10px 0 0;
	display:flex;
	justify-content:space-between;
}

.dis_box .dis_tab_tit li .dis_arr{
	width:20px;
	height:20px;
	border:1px solid var(--blue01);
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:50%;
}

.dis_box .dis_tab_tit li .dis_arr i{
	color:var(--blue01);
}

.dis_box .dis_tab_tit li .dis_tit{
	color:var(--gray01);
	font-size:1.125rem;
}

.dis_box .dis_tab_tit li.dis_open{
	background-color:var(--blue03);
}


.dis_box .dis_tab_tit li.dis_open .dis_tit{
	color:var(--black);
	font-weight:600;
}


.dis_box .dis_tab_tit li.dis_open .dis_arr{
	background-color:var(--blue01);
}


.dis_box .dis_tab_tit li.dis_open .dis_arr i{
	color:var(--white);
}

.tab_info_txt{
	display:flex;
	justify-content:space-between;
	padding:60px 30px;
	border-radius:30px;
	border:1px solid var(--blue03);
}

.caution{
	font-size:1.25rem;
	color:var(--blue01);
	font-weight:600;
	margin-bottom:20px;
	display: flex;
    gap: 10px;
    align-items: center;
	padding-bottom:20px;
	position:relative;
}

.caution:before{
	display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: var(--gray01);
    bottom: 0;
    left: 0;
    content: '';
}

.caution span{
	display:flex;
	width:20px;
	height:20px;
	background-color:var(--blue01);
	border-radius:50%;
	align-items:center;
	justify-content:center;
	color:var(--white);
	font-size:0.875rem;
	font-weight:600;
}

.tab_info_txt .left{
	width:39%;
}

.tab_info_txt .right{
	width:54%;
	position:relative;
}

.tab_info_txt .left ul{
	display:flex;
	flex-direction:column;
	gap:50px;
}

.tab_info_txt .left ul li p{
	font-size:1.125rem;
	color:var(--gray01);
	word-break: keep-all;
}

.tab_info_txt .right.right_only{
	width:80%;
	margin:0 auto;
}

.tab_info_txt .right .step_box{
	gap:20px;
	display:flex;
	flex-direction:column;
}

.tab_info_txt .right .step_box li{
	display:flex;
	align-items:center;
	justify-content:space-between;
}

.tab_info_txt .right .step_box li .circle{
	width:20px;
	height:20px;
	background-color:var(--white);
	border:1px solid var(--blue01);
	border-radius:50%;
    display: flex;
    justify-content: center;
    align-items: center;
	animation-name:circle_color;
	animation-duration:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
}

#discharge_admin .tab_info_txt .right .step_box li .circle,
#discharge_protect .tab_info_txt .right .step_box li .circle,

{
	animation-duration:4s;
}

#discharge_agree .tab_info_txt .right .step_box li .circle{
	animation-duration:3.5s;
}

#discharge_emergency .tab_info_txt .right .step_box li .circle{
	animation-duration:3s;
}


.tab_info_txt .right .step_box li:nth-child(1) .circle{
	animation-delay:0s;
}

.tab_info_txt .right .step_box li:nth-child(2) .circle{
	animation-delay:0.5s;
}

.tab_info_txt .right .step_box li:nth-child(3) .circle{
	animation-delay:1s;
}

.tab_info_txt .right .step_box li:nth-child(4) .circle{
	animation-delay:1.5s;
}

.tab_info_txt .right .step_box li:nth-child(5) .circle{
	animation-delay:2s;
}

.tab_info_txt .right .step_box li:nth-child(6) .circle{
	animation-delay:2.5s;
}

.tab_info_txt .right .step_box li:nth-child(7) .circle{
	animation-delay:3s;
}

.tab_info_txt .right .step_box li:nth-child(8) .circle{
	animation-delay:3.5s;
}

.tab_info_txt .right .step_box li:nth-child(9) .circle{
	animation-delay:4s;
}

@keyframes circle_color{
	100%{
		background-color:var(--blue01);
	}
}

.tab_info_txt .right .step_box li .circle i{
	color:var(--blue01);
	animation-name:circle_i_color;
	animation-duration:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
}

#discharge_admin .tab_info_txt .right .step_box li .circle i,
#discharge_protect .tab_info_txt .right .step_box li .circle i,

{
	animation-duration:4s;
}

#discharge_agree .tab_info_txt .right .step_box li .circle i{
	animation-duration:3.5s;
}

#discharge_emergency .tab_info_txt .right .step_box li .circle i{
	animation-duration:3s;
}

.tab_info_txt .right .step_box li:nth-child(1) .circle i{
	animation-delay:0s;
}

.tab_info_txt .right .step_box li:nth-child(2) .circle i{
	animation-delay:0.5s;
}

.tab_info_txt .right .step_box li:nth-child(3) .circle i{
	animation-delay:1s;
}

.tab_info_txt .right .step_box li:nth-child(4) .circle i{
	animation-delay:1.5s;
}

.tab_info_txt .right .step_box li:nth-child(5) .circle i{
	animation-delay:2s;
}

.tab_info_txt .right .step_box li:nth-child(6) .circle i{
	animation-delay:2.5s;
}

.tab_info_txt .right .step_box li:nth-child(7) .circle i{
	animation-delay:3s;
}

.tab_info_txt .right .step_box li:nth-child(8) .circle i{
	animation-delay:3.5s;
}

.tab_info_txt .right .step_box li:nth-child(9) .circle i{
	animation-delay:4s;
}

@keyframes circle_i_color{
	100%{
		color:var(--white);
	}
}

.tab_info_txt .right .step_box .step_icn{
	width:80px;
	height:80px;
	background-color:var(--blue03);
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:50%;
	margin: 0 20px 0 40px;
}

.tab_info_txt .right .step_box .step_txt{
	width:70%;
}

.tab_info_txt .right .step_box .step_txt h5{
	display:flex;
	gap:30px;
	border-bottom:1px solid var(--blue01);
	padding-bottom:20px;
	margin-bottom:10px;
	color:var(--black);
	font-size:1.25rem;
	font-weight:600;
	align-items:flex-end;
	word-break: keep-all;
	/* animation-name:txt_color01;
	animation-duration:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards; */
}

/* .tab_info_txt .right .step_box li:nth-child(1) .step_txt h5{
	animation-name:txt_color01;
	animation-duration:2s;
	animation-iteration-count:1;
	animation-fill-mode:forwards; 
	animation-delay:0s;
}

.tab_info_txt .right .step_box li:nth-child(2) .step_txt h5{
 animation-name:txt_color02;
	animation-duration:4s;
	animation-iteration-count:1;
	animation-fill-mode:forwards; 
	animation-delay:1s;
}

.tab_info_txt .right .step_box li:nth-child(3) .step_txt h5{
 animation-name:txt_color03;
	animation-duration:6s;
	animation-iteration-count:1;
	animation-fill-mode:forwards; 
	animation-delay:2s;
}*/

@keyframes txt_color01{
	100%{
		color:var(--black);
	}
}

.tab_info_txt .right .step_box .step_txt h5 span{
	font-size:0.75rem;
	font-weight:700;
	color:var(--blue01);
}

.tab_info_txt .right .line{
	width: 2px;
    height: 81%;
    background-color: var(--gray02);
    position: absolute;
    top: 50%;
    left: calc(19px / 2);
    transform: translateY(-50%);
    z-index: -1;
}

.tab_info_txt .right .line .in_line{
	width: 100%;
    height: 0;
    background-color: var(--blue01);
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.4s;
	animation-name:accent-color;
	animation-duration:3s;
	animation-iteration-count:1;
	animation-fill-mode:forwards;
}

@keyframes accent-color{
	0%{
		height:0%;
	}
	100%{
		height:100%;
	}
}

#discharge_agree .tab_info_txt .right .line{
	height:89%;
}


#discharge_admin .tab_info_txt .right .line{
	height:90%;
}

#discharge_emergency .tab_info_txt .right .line{
	height:86%;
}

#discharge_agree .tab_info_txt .right .line .in_line{
    animation-duration: 4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

#discharge_protect .tab_info_txt .right .line .in_line,
#discharge_admin .tab_info_txt .right .line .in_line{
	animation-duration:5s;
}

#discharge_emergency .tab_info_txt .right .line .in_line{
	animation-duration:4s;
}

#discharge_protect .tab_info_txt .right .line{
	height:91%;
}

.tab_info_txt .right .step_box .step_txt h5 br{
	display:none;
}



@media screen and (max-width:1064px){
	.tab_info_txt{
		gap:60px;
		flex-direction:column;
	}

	.tab_info_txt .left {
		width: 100%;
	}

	.tab_info_txt .right{
		width:100%;
	}

}

@media screen and (max-width:969px){
	.tab_info_txt .right .step_box .step_txt h5{
		gap:20px;
	}

	.dis_box .dis_tab_tit li .dis_tit{
		font-size:1rem;
	}

	.tab_info_txt .left ul li p{
		font-size:1rem;
	}

	.tab_info_txt{
		border-radius:10px;
	}

	.tab_info_txt .right.right_only{
		width:100%;
	}

	.tab_info_txt .right .step_box .step_txt h5{
		gap:10px;
		flex-direction: column;
        align-items: flex-start;
		padding-bottom:10px;
		margin-bottom:10px;
	}
}

@media screen and (max-width:640px){
	.caution{
		font-size:1.125rem;
	}

	.caution span{
		width:18px;
		height:18px;
		font-size:0.7rem;
	}

	.tab_info_txt .right .step_box .step_txt h5{
		font-size:1.125rem;
	}

	.dis_box{
		display:flex;
		gap:40px;
		flex-direction:column;
	}

	.dis_box .dis_tab_tit{
		flex-flow:wrap;
		gap:15px;
	}

	.dis_box .dis_tab_tit li{
		width:30%;
	}

	.dis_box .dis_tab_tit li{
		border-radius:10px;
	}

	.dis_box .dis_tab_tit li a{
		border-radius:10px;
	}

	.tab_info_txt{
		padding:20px 15px;
	}

	.tab_info_txt .right .step_box .step_icn{
		margin:0;
	}
}

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

	.tab_info_txt .right .step_box .step_txt{
		width:60%;
	}

	

	.tab_info_txt .right .step_box .step_icn{
		width:60px;
		height:60px;
	}

	.dis_box .dis_tab_tit li{
		width:45%;
	}
}

@media screen and (max-width:320px){
	 .caution {
        font-size: 1rem;
    }

	.tab_info_txt .right .step_box .step_icn{
		width:50px;
		height:50px;
	}

	.tab_info_txt .right .step_box .step_icn img{
		height:35%;
	}

	.tab_info_txt .right .step_box li .circle{
		width:18px;
		height:18px;
	}

	.tab_info_txt .right .line{
		left:calc(17px / 2);
	}

	.tab_info_txt .right .step_box .step_icn.emer img {
        height: 30%;
    }

	.tab_info_txt .right .step_box .step_icn.search img{
		height:41%;
	}
}