

/* sub */
.con-box{margin:80px 0}
.con-sbox{margin:50px 0}
.h3-tit{color:var(--color-h);font-size:1.25rem;margin-bottom:20px}

.item-num-flex li{display:flex;gap:10px;align-items:flex-start}
.item-num-flex .num{flex-shrink:0}

.text-secondary{opacity:.8}
.s1_1_con dl dt{line-height:1.2}
.s1_1_con dl::before{display:none; }
.item-arrow > li{position:relative;padding-left:20px;margin:10px 0}
.item-arrow > li:before{position:absolute;display:block;content:"";left:0;top:3px;background:url('/_res/deu/www/img/sub/ico-arrow.png') center/8px no-repeat;width:10px;height:18px}
.item-arrow .subject{font-weight:600;font-size:1.125rem;line-height:1.4;margin:5px 0}
.txt-arrow{position:relative;padding-left:20px;margin:10px 0}
.txt-arrow:before{position:absolute;display:block;content:"";left:0;top:3px;background:url('/_res/deu/www/img/sub/ico-arrow.png') center/8px no-repeat;width:10px;height:18px}
.tit-badge{border:2px dashed #ddd; border-radius:5px; padding:10px 10px 30px; text-align:center}
.tit-badge .tit{transform: translateY(-25px)}
.tit-badge .tit span{background-color:var(--color-m);color:#fff;font-size:1.25rem;border-radius:50px;font-weight:500;padding:10px 50px;border-top-left-radius:0}
.tit-badge span{color:var(--color-m)}
.tit-badge .con{text-align:center}

.item-flow{display:flex;gap:80px;flex-direction:column;counter-reset:section}
.item-flow > li{position:relative;}
.item-flow .inner{position:relative;overflow:hidden;border-top-left-radius:15px;height:100%;;border:1px solid #D4DAE6}
.item-flow .inner::before{color:#fff;counter-increment:section;content:counter(section) " 단계";background-color:var(--color-m);height:50px;width:100px;display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0}
.item-flow .con{padding:50px 20px;text-align:center;height:calc(100% - 50px);display:flex;align-items:center;justify-content:center}
.item-flow .subject{font-size:1.25rem;padding:5px 5px 5px 120px;font-family:'Paperlogy';font-weight:600;height:50px;display:flex;align-items:center;background-color:#e3f1ff}
.item-flow > li:not(:last-child)::after{position:absolute;width:56px;height:56px;content:"";background:url('/_res/deu/www/img/sub/ico-flow-arrow.png') center no-repeat;bottom:-65px;transform:translateX(-50%) rotate(90deg);left:50%}

.txt-gray-box{background:#f8f8f8;padding:30px;border:1px solid #ddd;text-align:center}
.txt-warning{background:url('/_res/deu/www/img/sub/ico-warning.png') #FDF5F5 20px 22px no-repeat;padding:20px 20px 20px 50px;color:var(--color-red);margin:10px 0;font-weight:500}

.tabs-wrap{display:flex;border-radius:50px;background-color:#F7F8F9;padding:10px;overflow:hidden;margin:80px 0}
.tabs-wrap .tab-item{position:relative;flex:1;height:60px;display:flex;align-items:center;justify-content:center;font-weight:400;text-align:center;padding:10px;word-break:keep-all;border-radius:50px}
.tabs-wrap .tab-item:hover{color:var(--color-m)}
.tabs-wrap .tab-item.on{background-color:var(--color-m);color:#fff}

.s1_1_con .img{width:40%;}
.s1_1_con dl{width:60%;}

.fr-video{position:static;}
.li_dot > li:last-of-type{margin-bottom: 0;}

.li-dash{margin-bottom:10px;text-align:left}
.li-dash > li{position:relative;padding-left:10px; font-size: 1rem; color: #555}
.li-dash > li::before{position:absolute;top:13px;left:0;width:5px;height:2px;content:'';background-color:#333;}

.mint-title{color: #17a2b8; font-size: 1.125rem; margin-bottom: 10px;}

.link-box-list{display: flex; flex-wrap: wrap; gap: 30px;}
.link-box-list li{width: calc((100% / 3) - (60px / 3));}
.link-box-list .item{display: block; padding: 20px; background-color: #f4f7fc; border: 1px solid transparent; border-radius: 0 30px; transition: 0.3s;}
.link-box-list .item .img-box{width: 100%; height: 100px; background-color: white; position: relative; margin-bottom: 20px; border-radius: 0 20px;}
.link-box-list .item .img-box img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.link-box-list .subject{font-size: 1.125rem; text-align: center;}
.link-box-list .item:hover{border-color: var(--color-m); text-decoration: none;}
.link-box-list .item:hover p{color: var(--color-m);}

/* login */
.login-wrap{max-width:500px;margin:0 auto;width:100%}
.login-wrap .flex-column{position:relative;aspect-ratio:108/119;background:url('/_res/deu/www/img/sub/character-04.png') center/contain no-repeat;padding:350px 50px 0 50px;display:flex;gap:5px;flex-direction:column}
.login-wrap .input-text{background-color:rgba(255,255,255,.25);color:#fff;border:1px solid #a2a4a7;width:100%;margin:0}
.login-wrap .check-wrap{display:flex;justify-content:flex-end}
.login-wrap .check-box label{font-size:.97rem}
.login-wrap .check-box input[type="checkbox"] + label:before{top:2px}
.login-wrap .btn-base{width:100%}
.login-wrap .flex-justify-spc{width:100%}
.login-wrap .flex-justify-spc > *{text-decoration:underline}
.login-wrap .flex-column .point{font-family:'Paperlogy';font-size:1.25rem;text-align:center;display:flex;width:100%;aspect-ratio:2.3/1;justify-content:center;align-items:center}
.flex-justify-spc{display:flex;gap:10px;align-items:center;justify-content:space-between;margin:10px 0}
.btn-base{padding:5px 15px;min-width:140px;height:48px;font-size:1rem;font-weight:400;text-align:center;text-decoration:none;cursor:pointer;transition:.3s;border:1px solid var(--color-m);background-color:var(--color-m);color:#fff;border-top-left-radius:15px;display:flex;gap:2px;align-items:center;justify-content:center;word-break:keep-all}
.btn-base:hover{background-color:var(--color-h);border-color:var(--color-h)}

/*찾아오시는 길 지도*/
.map_box .text_box {text-align:left; padding:40px; border:1px solid #ddd;}
.map_box .text_box > span{display:block;margin-bottom:10px;}
.map_box .text_box > strong{display:block;margin-bottom:10px;font-weight:700;}
.map_box .text_box > span em{display:inline-block;width:40px;font-weight: 600; padding-right: 20px; position: relative; margin-right: 10px;}
.map_box .text_box > span em:after{position: absolute; top: 50%; margin-top: -10px; right: 0; width: 2px; height: 20px; background: #ddd; content: '';}
.gray_inner{padding:20px;background:#f5f5f5;margin-top:10px;}
.location_box span{display:inline-block;background:url('/_res/deu/www/img/sub/ico-arrow.png') right center/8px no-repeat;padding-right:20px;margin-right:10px;}
.location_box span:last-child{background:none;padding-right:0;margin-right:0;}

@media all and (max-width:1200px){
	.s1_1_con .img{float:none; width:100%; text-align:center;}
	.s1_1_con dl{width:100%;}
	.s1_1_con .img{padding-right:0}
}

@media all and (max-width:1024px){
	.link-box-list{gap: 20px;}
	.link-box-list li{width: calc(50% - 10px);}
}

@media all and (max-width:640px){
	.map_box .text_box{padding:20px}
	.link-box-list li{width: 100%;}
		
	.con-box{margin:50px 0}
	.txt-arrow:before{top:0}
	.tit-badge .tit span{font-size:1.125rem}
	.item-flow .subject{font-size:1rem}
	.item-flow .con{padding:20px}
	.s1_1_con dl dt{font-size:1.25rem}
	.s1_1_con dl dt b::after{display:none}
	.s1_2_con ol li .list-dot > li{padding-left:0;margin:5px 0}
	
	.login-wrap{max-width:280px}
	.login-wrap .flex-column{padding:250px 20px 0 20px}
	.login-wrap .input-text{height:35px}
	.login-wrap .check-box input[type="checkbox"] + label:before{width:18px;height:18px}
	.login-wrap .btn-base{margin-top:20px}
}