/* 온라인 문의 스킨 공통 */
.online-form{}
.online-form .ess-txt{font-size:17px;font-weight:normal;letter-spacing:-.5px;color:#222;line-height:1.8;word-break:keep-all;position:relative;padding-left:15px;}
.online-form span.ess{color:#f65354;position:absolute;left:0;top: -4px;font-size:22px;}
.online-form .sec-box{}
.online-form dl.choice{border-top:1px solid #e2e3e5; display:flex; flex-wrap:wrap; font-size:17px; line-height:1.8; color:#222; margin-top:-1px;}
.online-form dl.choice > dt{
	padding:15px 25px;
	background:#fafafa;
	border-bottom:1px solid #e2e3e5;
	border-right:1px solid #e2e3e5;	
	font-weight: normal;
	display:flex;
	align-items:center;
	justify-content: center;
	gap:2px;
	flex:1 1 20%;
}
.online-form dl.choice > dt .ess-color{color:#f65354; font-size:22px;}
.online-form dl.choice > dd{padding:15px 25px;background:#fff;border-bottom:1px solid #e2e3e5;flex:1 1 80%;text-align:left;display: flex;font-weight:400;align-items: center;}
.online-form dl.choice > dd.flex-dd{display:flex; align-items:center; gap:30px;}
.online-form dl.choice > dd.column-dd{display:flex;align-items: flex-start;gap: 10px;flex-direction: column;}
.online-form dl.choice > dd.column-dd li > b{color:#000;}
.online-form dl.choice > dd.column-dd li{font-size:16px;}
.online-form.online-view{background: #fff;border: 1px solid #fafafa;padding: 7px;border-radius:10px;display: flex;flex-direction: column;gap: 5px;}
.online-form.online-view .sec-box:first-child{border-radius:10px 10px 0 0; overflow:hidden;}
.online-form.online-view dl.choice{gap: 5px;flex-wrap: nowrap;}
.online-form.online-view dl.choice,
.online-form.online-view dl.choice > dt,
.online-form.online-view dl.choice > dd{border:0;}
.online-form.online-view dl.choice > dt{background:#00000008;border-radius:10px;flex: 1 1 20%;}
.online-form.online-view dl.choice > dd{border-radius:10px;}
.online-form .sch_input {
    height: 45px;
	min-width:240px;
    padding: 10px;
    border-radius:0px;
    border: 1px solid #E1E1E1;
    background: url(/images/common/arrow-down-s-line.png) no-repeat top 11px right 10px #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
}
.cate-title{display: inline-block;color: #242424;font-size:30px;font-weight: bold;letter-spacing: -1px;position: relative;}
.cate-title:before{position:absolute;top: -4px;right: -17px;content:'';display:block;width: 9px;height: 9px;border-radius:50%;background:#86c981;transition:all ease .3s;}

.in-fo-top{position:relative;margin-bottom: 15px;padding-left: 34px;font-size:18px;font-weight:normal;letter-spacing:-.5px;color:#666;line-height:1.8;word-break:keep-all;}
.in-fo-top i{font-size:26px;position:absolute;left:0px;top: 3px;color:#cfcfcf;}

.btn-zoom{background: #383838;font-size: 13px;color: #fff;border-radius:30px;padding:2px 20px;margin:0 3px;transition:.2s ease-out;}
.btn-zoom:hover{background: #505050;}

.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt25{margin-top:25px;}

#online .bottom-btn-wrap{margin:30px auto; text-align:center;}
#online .bottom-btn-wrap ul{display:inline-flex; margin:0 auto; gap:10px;}
#online .bottom-btn-wrap ul > li{}
#online .bottom-btn-wrap ul > li > a{width:160px;border-radius: 50px;font-size:17px;text-align:center;background:#f9f9f9;display:inline-block;padding:15px;transition:.2s ease-out;}
#online .bottom-btn-wrap ul > li > a.btn-o{color:#fff; background:#56af7f;}
#online .bottom-btn-wrap ul > li > button{border:0; width:160px; border-radius:50px; font-size:17px; text-align:center; background:#f9f9f9; display:inline-block;  padding:15px; transition:.2s ease-out;}
#online .bottom-btn-wrap ul > li > button.btn-o{color:#fff; background:#56af7f;}
#online .bottom-btn-wrap ul > li > input{cursor:pointer; border:0; width:160px; border-radius:50px; font-size:17px; text-align:center; background:#f9f9f9; display:inline-block;  padding:15px; transition:.2s ease-out;}
#online .bottom-btn-wrap ul > li > input.btn-o{color:#fff; background:#56af7f;}

.bottom-btn-wrap a{border:0 !important;width:160px;border-radius: 50px !important;font-size:17px;text-align:center;background:#f9f9f9;display:inline-block;padding: 15px !important;transition:.2s ease-out;}
.bottom-btn-wrap a.btn-o{color:#fff !important;background: #56af7f;}
.bottom-btn-wrap a.btn-o:hover{color:#fff !important;background: #369160 !important;transform:translateY(-5px);}

/* 온라인 신청 탭*/
.online-tab{position:relative; margin-bottom:70px;}
.online-tab{display:flex;}
.online-tab.tab2 > li{width:50%;}
.online-tab.tab3 > li{width:33.33333333%;}
.online-tab > li .tab-item{cursor:pointer;position:relative;text-align:center;display:inline-flex;border: 1px solid #d9d9d9;border-left: 0;background:#fff;width: 100%;line-height: 1;transition:.2s ease-out;justify-content: center;align-items: center;flex-direction: column;padding: 30px 20px 25px;gap: 20px;height: 100%;}
.online-tab > li.on .tab-item:after{
    content:""; position:absolute; bottom:-21px; left:calc(50% - 7px); display:block; width:0; height:0; transform:rotate(90deg);
    border-width:14px 0px 14px 14px; border-style:solid; border-color:transparent transparent transparent #228550;    
}
.online-tab > li:first-child .tab-item{border-radius:10px 0 0 10px;}
.online-tab > li:last-child .tab-item{border-radius:0 10px 10px 0;}
.online-tab > li .tab-item big{position:relative;font-weight:normal;color: #999;font-size: 26px;transition:.2s ease-out;}
.online-tab > li .tab-item small{display:inline-flex;gap:10px;flex-wrap:wrap;justify-content: center;}
.online-tab > li .tab-item small span{background:rgb(45, 157, 215,.1); border-radius:30px; color:#228550; padding:8px 17px; font-size:16px;}
.online-tab > li.on .tab-item{background:#228550;}
.online-tab > li.on .tab-item big{color:#fff;}
.online-tab > li.on .tab-item small span{background:rgb(255,255,255,.1); color:#fff;}
.online-tab > li .tab-item .btn-wr{
	transition:.2s ease-out; text-align:center; border:1px solid rgb(255,255,255,.5); font-size:17px; border-radius:5px;
	 font-weight:normal; display:block; padding:13px; width:100%; color:#fff;
}
.online-tab > li:hover .tab-item big{color:#228550;}
.online-tab > li.on:hover .tab-item big{color:#fff;}
.online-tab > li.on .tab-item{background: #228550;border-color: #228550;}

.top-txt{text-align:center; display:block; font-size:19px;color:#646464; margin-bottom:20px;}

#online .bottom-btn-wrap ul > li > a.btn-c{}
#online .bottom-btn-wrap ul > li > a:hover{transform:translateY(-5px);}
#online .bottom-btn-wrap ul > li > button:hover{transform:translateY(-5px);}
#online .bottom-btn-wrap ul > li > input:hover{transform:translateY(-5px);}
#online .right-btn-wrap{margin: 0 auto 15px;display: flex;justify-content: space-between;}
#online .right-btn-wrap ul{display:inline-flex;gap:10px;}
#online .right-btn-wrap ul > li{}
#online .right-btn-wrap ul > li > a{border-radius: 50px;font-size: 17px;text-align:center;background:#f9f9f9;display:inline-block;font-weight: normal;padding: 15px 35px 15px;transition:.2s ease-out;width: auto;}
#online .right-btn-wrap ul > li > a.btn-o{color:#fff;background: #228550;}
#online .right-btn-wrap ul > li > a.btn-c{}
#online .right-btn-wrap ul > li > a:hover{transform:translateY(-5px);}

#online .gray-box{position:relative; border:1px solid #f9f9f9; border-radius:30px; padding:30px 35px; text-align:left; color:#383838; letter-spacing:-1px; line-height:1.5; word-break:keep-all;}
#online .gray-box h3.top-tit{padding-bottom:10px; color:#222; text-align:left; font-size:22px;  font-weight:normal; position:relative;}
#online .table-di{background:#fff;}
#online .table-di th, #online .table-di td{ text-align:center; padding:15px 25px; font-size:17px; border:1px solid #e2e3e5;}
#online .table-di thead th{font-weight:normal; background:#fafafa;}
#online .table-di tbody th{background:#fafafa;}
#online .table-di tbody td{}
#online .table-di thead th:first-child, #online .table-di tbody td:first-child{border-left:none;}
#online .table-di thead th:last-child, #online .table-di tbody td:last-child{border-right:none;}
#online .edit{
	border:0; width:160px; border-radius:22px; font-size:17px; text-align:center; display:inline-block;
	 padding:13px 10px 10px; transition:.2s ease-out;
	color:#fff; background:#56af7f;
}


.online-form .ch-tit{font-weight:600; color:#0f49ad;}

/* 온라인 문의 글쓰기 */
.online-wr{}
.sInput{line-height:inherit; height:38px; padding:0 10px; border:1px solid #ddd;}
.w05{width:5%;}
.w10{width:10%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w50{width:50%;}
.w60{width:60%;}
.w70{width:70%;}
.w80{width:80%;}
.w90{width:90%;}
.w100 {width:100%;}
.w10.type{width:10%;}
.w15.type{width:15%;}
.w20.type{width:20%;}
.w25.type{width:25%;}
.w30.type{width:30%;}
.w35.type{width:35%;}
.w40.type{width:40%;}
.w50.type{width:50%;}
.w90.type{width:90%;}
.h100{height:100px;}
.h300{height:300px;}
.input-list{display:inline-flex; gap:20px; flex-wrap:wrap;}
.input-list.column{flex-direction:column; row-gap:5px;}
.input-list > li{display:inline-flex; gap:5px; align-items:center;}
.input-list > li > span{display:inline-block; width:105px;}
.input-list > li input{}
.age{display:inline-block; margin-left:30px;}
.br{/*color:#f65354;*/color:#666;display:inline-block;padding-left:20px;position:relative;font-weight:300;letter-spacing:-.5px;margin:0 10px;}
.br:before{content:"※";font-size:20px;position:absolute;line-height: 1;left:0;top: 4px;display:inline-block;}
.check-box{}
.check-box ul{display:flex;justify-content: center;gap:40px;font-size:17px;letter-spacing:-.5px;line-height:1.6;color:#535353;text-align:left;}
.check-box ul > li{vertical-align: top; padding-left: 22px; position: relative;}
.check-box ul > li > input{position:absolute; left:0; top:7px;}

.online-form .contTit{text-align:center;}
.online-form .contTit input.top-tit{text-align:center; width:100%; color:#145ba2; border:0; padding:0; margin:0; display:inline-block; font-family: 'GmarketSansBold'; font-weight:normal; font-size:28px; letter-spacing:-0.5px; line-height:1.2;}

/* 온라인 문의 뷰 */
.online-view{}

@media (max-width: 1240px){
}
@media (max-width: 1170px){
}
@media (max-width: 1024px){
}
@media (max-width: 767px){
	.online-tab{gap:10px; flex-direction:column; align-items:center; margin-bottom:40px;}
	.online-tab.tab2 > li,
	.online-tab.tab3 > li{width:100%;}
	.online-tab > li .tab-item{flex-direction:column; padding:15px; gap:10px;}
	.online-tab > li .tab-item big{font-size:20px;}
	.online-tab > li .tab-item small span{padding:6px 12px; font-size:13px;}

	#online .right-btn-wrap{margin:0 auto 10px; align-items:center; text-align:center; gap:10px; flex-direction:column;}
	#online .right-btn-wrap ul{gap:0; width:100%;}
	#online .right-btn-wrap ul > li{width:100%;}
	#online .right-btn-wrap ul > li > a{font-size:15px; width:100%;}
	#online .right-btn-wrap ul > li > a{padding:10px;}

	.cate-title{font-size:22px;}

	.check-box ul{justify-content:flex-start; gap:8px; font-size:14px; line-height:1.4; padding-right:0; flex-direction:column; align-items:flex-start;}
	.check-box ul > li{padding-left:21px;}
	.check-box ul > li > input{top:3px;}

	.input-list > li.flex-btn{flex-wrap: wrap;}
	.btn-zoom{width:100%;}

	.online-form .ess-txt{font-size:15px; line-height:1.4;}
	/*.online-form span.ess{top:0;}*/
	.online-form dl.choice{font-size:15px; line-height:1.6; flex-direction:column;}
	.online-form dl.choice > dt{padding:10px 20px 5px; border-right:0; align-items:center; justify-content:flex-start; flex:1;}
	.online-form dl.choice > dd{padding:10px;font-size:15px; line-height:1.6;}
	.online-form dl.choice > dd.flex-dd{align-items:flex-start; gap:5px; flex-direction:column;}
	
	.input-list{gap:5px; flex-direction:column;}
	.input-list > li > input.w70{width:65%;}

	.age{margin-left:0px;}
	.age .w30{width:30%;}

	.br{padding-left:15px; margin:0; font-size:14px; line-height:1.4;}
	.br:before{top:-1px;}

	.sInput{height:35px;}
	.w10{width:20%;}
	.w30{width:100%;}
	.w70{width:100%;}
	.w90{width:100%;}

	.in-fo-top{padding-left:30px; font-size:15px; line-height:1.5;}
	.in-fo-top i{font-size:22px; top:1px;}

	#online .bottom-btn-wrap ul > li > input,
	#online .bottom-btn-wrap ul > li > input.btn-om, 
	#online .bottom-btn-wrap ul > li > button, 
	#online .bottom-btn-wrap ul > li > a{width:95px; font-size:15px; padding:12px;}
}
@media (max-width: 640px){
}
@media (max-width: 520px){
}