@charset "utf-8";

.eth_sec1 {padding-bottom:120px}
.eth_sec1 > p {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 20px;
    font-weight: 400;
}
.eth_sec1 span {font-size:20px;font-weight: 700;color: var(--color-main);}
.sflow {
    display: flex;
    justify-content: space-between;
}
.sflow li{
    border: 1px solid var(--color-main2);
    width: 19%;
    padding: 1rem;
    text-align: center;
    border-radius: 10px;
    box-shadow: inset 1px 10px 50px rgba(255, 255, 255, 0.8), 0px 1px 5px rgba(0, 0, 0, 0.3);
}
.sflow li p {
    word-break: keep-all;
}
.sflow li strong {background-color: var(--color-main2);color: #fff;width: 100%;display: inline-flex;align-items: center;justify-content: center;padding: .5rem;border-radius: 2rem;margin-bottom: 1rem;}
.eth_sec2 {}
.eth_box {
    background-color: #ffffff;
    padding: 3rem 2rem;
    border-radius: 2rem;
    margin-top: 4rem;
    /* margin-bottom: 120px; */
    box-shadow: var(--boxshadow);
}
.eth_box  h4 {
    text-align: center;
    margin-bottom: 2rem;
    font-size: 30px;
    color: var(--color-main);
}
.eth_conts {
    background-color: #fff;
    padding: 3rem 2rem;
    margin-bottom: 3rem;
    border-radius: 1rem;
    border: 1px solid var(--color-main);
}
.eth_conts.noborder {border:unset;padding: 1rem;margin-bottom: 0;}
.eth_box h5 {font-size:24px;margin-bottom: 2rem;display: inline-flex;font-weight: 600;}
.eth_box h5 span {width: 33px;height: 33px;border: 1px solid var(--color-main);display:inline-flex;border-radius: 50%;align-items: center;margin-right: .5rem;font-size: 18px;color: var(--color-main);font-weight: 500;justify-content: center;}
.eth_conts p {}
.eth_conts p.ct {
    text-align: center;
    word-break: keep-all;
    font-weight: 500;
    color: #555;
    font-size: 18px;
}
.eth_conts strong {font-weight:500;display: inline-block;/* margin: 1rem 0 .5rem; */}
.eth_conts .conts_tit {
    margin-bottom: 3rem;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 3rem;
}
.eth_conts .conts_tit > h3 {margin-top:0}
.eth_conts .conts_tit > p {margin-bottom:2rem;font-size: 19px;}
.list_inner {
    padding-left: 1rem;
}
.list_inner h5 {font-size:30px;color:var(--color-main);font-family: var(--font-point);margin-bottom: 1rem;}
.conts_list {/* text-align: center; */display: flex;flex-wrap: wrap;}

.eth_conts dl {width: 100%;margin-bottom: 10px;display: flex;align-items: stretch;}
.eth_conts dl dt {
	display: inline-flex;
	/* color: var(--color-main); */
	font-weight: 500;
	/* font-size: 18px; */
	line-height: 1.6;
	width: 18%;
	word-break: keep-all;
	margin-right: 1rem;
	background-color: var(--color-bg-gray);
	padding: 1rem;
	justify-content: center;
	border-radius: 1rem;
	align-items: center;
	text-align: center;
	}
.eth_conts dl:last-of-type {margin-bottom:0}
.eth_conts dl dd {
    width: 78%;
    padding: 1rem 0;
    position: relative;
    padding-left: 35px;
}
.eth_conts dl dd:after {content:"";position:absolute;width:100%;height:1px;background-color:#ddd;bottom:0;left:0;margin-bottom: -5px;}
.eth_conts .check li {padding-top:.5rem;position: relative;word-break: keep-all;}
.eth_conts .check li:before {content:"\EB7B";position:absolute;font-family: 'remixicon';left:0;margin-left: -1.5rem;color: var(--color-main);font-weight: 600;}
.eth_conts .check li:first-child {padding-top:0}
.eth_conts dl.one_line {
    display: flex;
    align-items: center;
    width: 33.333%;
    margin-bottom: 0;
}
.eth_conts dl.one_line  dt {
    margin-right: 1rem;
    margin-bottom: 0;
}
.eth_conts dl.one_line  dd {
    /* width: 80%; */
}
.eth_conts .conts_group {
    padding-left: 10px;
}
.eth_conts .conts_group > li {
    margin-bottom: .5rem;
}
.eth_conts i {
    font-size: 22px;
    margin-right: 8px;
}
.eth_logo {
    text-align: center;
    margin-top: 3rem;
}

.eth_conts .decimal {
    list-style: decimal;
    margin-left: 25px;
}
.eth_conts .decimal li, .eth_conts .square li {
    /* padding: 0 0 .2rem .5rem; */
    padding: .2rem 0 .3rem;
    list-style: unset;
    letter-spacing: -1px;
}
.eth_conts .square {list-style: square;margin-left: 20px;}
.square li::marker {color: #bebaba;}
li.none {list-style:none;}
li.none::before {display:none;}
li.none ul {}
.eth_conts .bar {}
.eth_conts .bar li {
    position: relative;
}
.eth_conts .bar li:before {
	content:"";
	width:8px;
	height: 1px;
	background-color: #2f6988;
	position:absolute;
	left:-10px;
	top: 13px;
}

.subbox {
    margin: .5rem 0;
    background-color: #f5f5f5;
    padding: 1rem;
}
.subbox ul {}
.subbox p, .subbox ul li {/* margin-bottom:.5rem; */}
.subbox span {
    color: #5b5b5b;
    text-align: right;
    display: block;
    font-size: 16px;
}
.subbox ul li p {margin-bottom:0}
.step > ul {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin: 1rem 0;
}
.step ul li {
    text-align: center;
    letter-spacing: -1px;
}
.step .sflow {}
.step .sflow li {
    width: 30%;
    padding: 0 1rem 1rem;
}
.step .step_1 {position:relative;}
.step .step_1 li {
    width: 100%;
    margin-right: 3%;
}
.step .step_1 li:last-of-type {margin-right:0}
.step .step_2 li {
    /* background: #f7f7f7; */
    /* height: 5em; */
    display: flex;
    justify-content: center;
    align-items: center;
    /* border-radius: 0 0 1em 1em; */
    padding: .5rem 0;
}
.step ul.step_2 {position:relative;}
.step .step_2 li.tit {border: 1px solid var(--color-main2);box-shadow: inset 1px 10px 50px rgba(255, 255, 255, 0.8), 0px 1px 5px rgba(0, 0, 0, 0.3);background: -webkit-linear-gradient(top, #ffffff, #edf6ff);height: 76px;background-color: #edf6ff;color: var(--color-main2);font-weight: 500;border-radius: 10px;}
.step > ul.h_fix li.tit:after{content:'';position: absolute;top: 30px;right: 0;margin-right: -15%;width: 11px;height: 16px;background-image: url(/img/common/step.png);background-repeat: no-repeat;}
.step > ul.h_fix li:last-child .tit::after {display:none;}
.step .step_2 li.etc {position:relative;height: 220px;}
.step .step_2 li.etc div {position:absolute;width: 380px;text-align: left;background-color: #f8f8f8;padding: 1rem;bottom: 0;border-radius: 10px;border: 1px solid var(--color-main);box-shadow: inset 1px 10px 50px rgba(255, 255, 255, 0.8), 0px 1px 5px rgba(0, 0, 0, 0.3);}
.step .step_2 li.etc:before {
	content:"";
	position:absolute;
	width:1px;
	height: 50%;
	background-color:var(--color-main);
	top: 0;
}
.step .step_2 li.etc div span {
    color: var(--color-main);
    font-weight: 500;
    text-align: center;
    display: block;
    /* margin-bottom: 1rem; */
}
.step .step_2 li.etc div p {padding-top: .5rem;}


/* PC */ 
@media all and (min-width:1024px) and (max-width: 1400px) {
	.eth_conts {
    padding: 3rem 2rem;
}
	.eth_conts dl.one_line dt {width: 25%;margin-right: 0;}
	.eth_conts dl.one_line dd {width:80%}
	.step .step_2 li {word-break:keep-all}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/ 
@media all and (max-width:1023px) {
	.eth_sec1 {padding-bottom:10%}
	.eth_conts .conts_tit {padding: 2rem 0 0;}
	.eth_sec1 > p {word-break:keep-all}
	.eth_conts dl dt {width:20%; margin-right:0}
	.eth_conts dl dd {
    width: 80%;
}
	.sflow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}
	.sflow li {
    width: 30%;
    margin-bottom: 1rem;
}
	.step ul.sflow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
	.step ul.sflow li {
    width: 31%;
    margin-bottom: 1rem;
}
	.sflow li p {word-break:break-word;}
	.eth_box {
    /* margin: 3rem 0 10%; */
    padding: 3rem 1rem;
}
	.eth_conts {
    padding: 2rem 1rem;
}
	.eth_conts dl.one_line {
    width: 100%;
    display: flex;
    justify-content: flex-start;
}
	.eth_conts dl.one_line dt {}
	.eth_conts dl.one_line dd {
    font-size: 20px;
}
	.step > ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
	.step .step_1 > li {width: 30%;margin-right: 1.6rem;}
	.step .step_1 > li:nth-of-type(3n) {margin-right:0}
	.step > ul.h_fix li.tit:after {
    margin-right: -9%;
}
	.step .step_2 li {word-break:keep-all}
	.step .step_2 li.etc{
    margin-bottom: 1rem;
}
	.step ul.step_2 {margin-bottom:1rem}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
	.eth_conts dl {flex-wrap: wrap;margin: 1rem 0;}

	.eth_conts dl dt {width:100%;padding: .5rem;}
	.eth_conts dl dd {width:100%;padding-left: 25px;}
	.eth_conts dl dd:after {margin-bottom:0}
	.eth_box h5 {font-size: clamp(1.1rem, 5.5vw, 1.5rem);margin-bottom: 1rem;}
	.eth_box h5 span {width:25px; height:25px; font-size:16px}
	.eth_conts.noborder {padding:0}
}