﻿@charset "utf-8";
/* CSS Document */
/* 스크롤바 전체 */ /*::-webkit-scrollbar { width: 8px!important; background-color: #cecfd0!important; }*/
/* 스크롤바 막대 */ /* ::-webkit-scrollbar-thumb { background-color: #9e9fa2!important; }*/
/* 스크롤바 외부 */ /*::-webkit-scrollbar-track { background-color: #cecfd0!important; } */

/*::-webkit-scrollbar { width: 12px; -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px); background-color:transparent!important; }
::-webkit-scrollbar-thumb {-webkit-border-radius: 15px; border-radius: 15px; background-color: #3A856C79; border: 2px solid transparent;  background-clip: padding-box;}
::-webkit-scrollbar-thumb:hover{ border: 0; background-color: #285C57; }
::-webkit-scrollbar-track { -webkit-border-radius: 15px; border-radius: 15px; background-color:transparent!important; margin-top: 150px}*/
#index_page::-webkit-scrollbar-track { margin-top: 60px}

/* Flex */
.flexwrap { display: -webkit-box!important; display: -moz-box!important; display: -ms-flexbox!important; display: -webkit-flex!important; display: flex!important; }
.jc_cen { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.jc_r { -webkit-box-pack: right; -ms-flex-pack: right; justify-content: right; }
.jc_sb { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.ai_cen { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.ai_stt { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.ai_stc { -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; }
.ai_en { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }

/* Wrap */
.wrap { width: 100%; max-width: 1400px; margin: 0 auto; word-break: keep-all; overflow-x: hidden; overflow-y: hidden; }

/* 모바일 표시 */
.m_ver { display: none!important; }
.p_ver { display: inline-block!important; }

/* 포지션 중앙 정렬 */
.pos_cen { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

/* 배경 컬러 */
.bc_point_01 { background-color: #6e45f3; }
.bc_gray_01 { background-color: #f7f7f7; }
.bc_dark_green { background-color: #285C57; }

/* 폰트 컬러 */
.fc_point {color: #3A856C!important;}
.fc_point_01 { color: #6e45f3!important; }
.fc_gray_01 { color: rgba(24,24,24,0.7)!important; }
.fc_gray_02 { color: rgba(24,24,24,0.85)!important; }
.fc_white_01 { color: rgba(255,255,255,0.7)!important; }
.fc_red { color: #ff5247!important; }

/* 테이블 넓이 */
.tw_235 { width: 23.5%!important; } .tw_29 { width: 29%!important; } .tw_49 { width: 49%!important; } .tw_100 { width: 100%!important; }

/* 텍스트 밑줄 */
.under { background: linear-gradient(to bottom, rgba(255,255,255,0) 94%, rgba(24,24,24,1) 94%, rgba(24,24,24,1) 100%); padding: 0; }
.ta_cen{text-align: center;}
/* 버튼 스타일 */
.btn_style_01 { transition: all 0.3s ease-out; background-color: #285C57; color: #fff; font-size: 1.1em; line-height: 1; font-weight: 600; width: 100%; max-width: 200px; height: 66px; border-radius: 0.5rem; }
	.btn_style_01:hover { background-color: #3A856C; }
/*버튼색상*/
.btn_style_red { background-color: #DB535F; }
	.btn_style_red:hover { background-color: #D33F4C; }
.btn_style_gray { background-color: #828282;}
	.btn_style_gray:hover { background-color: #6A6A6A; }
.btn_style_blue { background-color: #1973E8; }
	.btn_style_blue:hover { background-color: #125CBD; }
.btn_style_lgreen { background-color: #3A856C; animation: glowing 1800ms infinite;}
	.btn_style_lgreen:hover { background-color: #285C57; }


@keyframes glowing {
  0% { background-color: #3A856C; box-shadow: 0 0 3px #3A856C; }
  50% { background-color: #53AB8E; box-shadow: 0 0 15px #53AB8E; }
  100% { background-color: #3A856C; box-shadow: 0 0 3px #3A856C; }
}
.board_btn { font-size: 0.95em; height: 56px; width: auto; padding: 0 25px; float: right; display: flex; align-items: center; justify-content: center; margin: 60px 0 0 0; }
	.board_btn:first-of-type { margin: 60px 0 0; }
.board_btn * { line-height: 1; display: inline-block!important; align-items: center; justify-content: center; }
.board_btn .icon { font-size: 1em; margin-left: 5px; }
.board_btn + .board_btn {margin-left: 2%;}

/* 박스 */
.box_01, .box_02 { background-color: #fff; border-radius: 0.5rem; text-align: center; }
.box_01 { padding: 80px; }
.box_02 { padding: 60px; }
	.box_02::after { content: ''; display: block; clear: both; }
.num_box { width: 80px; height: 80px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; border: solid 2px #285C57; font-size: 0.9em; border-radius: 0.5rem; font-weight: 700; background-color: #fff; color: #285C57; }
.num_box span { font-size: 1.6em; line-height: 1; font-weight: bold; }

/* 리스트 보더 스타일 */
.dot_border_li li { margin-bottom: 80px; padding-bottom: 80px; border-bottom: dotted 1px #e6e6e6; }
	.dot_border_li li:last-of-type { margin-bottom: 0!important; padding-bottom: 0!important; border: none!important; }

/* 폰트 스타일 */
.fs_01 { font-size: 44px; font-weight: 700; margin-bottom: 40px; line-height: 1.4; }
.fs_02 { font-size: 24px; font-weight: 600; margin-bottom: 40px; }
.fs_03 { display: inline-block; font-size: 1.05em; font-weight: 600; margin-bottom: 20px; background-color: #285C57; color: #fff; padding: 0.5rem 1.2rem 0.4rem; border-radius: 500px; }
.fs_04 { font-size: 1.1em; font-weight: normal; }
.bold{font-weight: bold;}
/* 테이블 스타일 */
.table_style_01 { border-collapse: collapse; margin: 25px 0; font-size: 0.9em; box-shadow: 8px 8px 15px 0 rgb(51 51 51 / 15%); width: 100%; }
.table_style_01 tr { border-bottom: solid 1px #e6e6e6; }
	.table_style_01 tr:last-of-type { border-bottom: solid 1px #e6e6e6; }
.table_style_01 th { background-color: #3A856C; color: #fff; font-weight: bold; text-align: center; }
.table_style_01 th, .table_style_01 td { padding: 12px 15px; }
.table_style_01 td { border-right: solid 1px #e6e6e6; text-align: center; white-space: normal; background-color: #fff; }
.table_style_01 .point { color: #285C57; font-weight: bold; }
.table_style_01 .p_ver { display: table-cell!important; }
.table_style_02 { width: 100%; }
.table_style_02 tr { border-bottom: solid 1px #e6e6e6; }
	.table_style_02 tr:first-of-type { border-top: solid 1px #e6e6e6; }
.table_style_02 th, .table_style_02 td { padding: 12px 15px; vertical-align: top; }
.table_style_02 th { font-weight: bold; width: 30%; }
.table_style_02 td { width: 70%; }

/* 유튜브 영상 */
.video_wrap { display: inline-block; width: 100%; max-width: 1000px; }
.video { margin: 60px auto 0; position: relative; height: 0; padding-bottom: 56.25%; overflow: hidden; }
.video iframe { position: absolute; width: 100%; height: 100%; top: 0%; left: 0%; }

/* 이미지 */
.content_img { margin-top: 60px; }
/* 유튜브 썸네일 이미지*/
.you_th{position: relative;display: block; border-radius: 0.5rem; overflow: hidden; background-color: #000000; transition: 0.3s ease-in-out;  }
.you_th:hover > img {filter: opacity(0.7);}
.you_th:after{position: absolute; top:50%; left: 50%; transform: translateX(-50%) translateY(-50%); content:''; display: block; width: 11%; height: 30%; background-image: url(../images/play_btn.png); background-size: 100%; background-position: center; background-repeat: no-repeat; z-index:300; }
/* 주의사항 */
#announcement { display: block; padding: 10px 0; }
#announcement .fmd_icon { font-variation-settings: 'FILL' 1, 'wght' 700, 'GRAD' 0, 'opsz' 48; display: flex; align-items: center; justify-content: center; font-size: 2em; }
#announcement .txt_01 { font-weight: bold; font-size: 1.4em; margin-top: 5px; }
#announcement .txt_02 { font-weight: bold; font-size: 1.6em; margin: 20px 0; }
#announcement .txt_02 p { margin-right: 15px; }
	#announcement .txt_02 p:last-of-type { margin-right: 0; }
#announcement .txt_02 p .check_icon { font-weight: bold; margin-right: 5px; }
#announcement .txt_02, #announcement .txt_02 * { display: flex; align-items: center; justify-content: center; }


/* 모바일 레이아웃 */
@media ( max-width: 900px ) {
	
	/*모바일 스크롤바 없애기*/
	body{ -ms-overflow-style: none; /* IE and Edge */  scrollbar-width: none; /* Firefox */}
	body::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera*/}
	
	.wrap { padding: 0 20px!important; }
	
	/* 모바일 표시 */
	.m_ver { display: inline-block!important; }
	.p_ver { display: none!important; }
	
	/* 버튼 스타일 */
	.btn_style_01 { height: 52px; line-height: 52px; font-size: 1em; }
	.board_btn { height: 50px; line-height: 50px; padding: 0 20px; margin: 40px 0% 0 0!important; width: 49%; }
		/*.board_btn:first-of-type { margin: 40px 0 0!important; float: right; }*/
	.board_btn + .board_btn {margin-left: 2%;}
	/* 박스 */
	.box_01 { padding: 40px 20px; }
	.box_02 { padding: 30px 20px; }
	.num_box { width: 60px; height: 60px; font-size: 0.78em; }
	
	/* 리스트 보더 스타일 */
	.dot_border_li li { margin-bottom: 40px; padding-bottom: 40px; }
	
	/* 폰트 스타일 */
	.fs_01 { font-size: 28px; margin-bottom: 30px; line-height: 1.4; }
	.fs_02 { font-size: 18px; margin-bottom: 30px; line-height: 1.4; }
	.fs_03 { font-size: 15px; margin-bottom: 12px; }
	.fs_04 { font-size: 1em; }
	
	/* 유튜브 영상 */
	.video { margin: 30px auto 0; }
	
	/* 이미지 */
	.content_img { margin-top: 30px; }
	
	/* 테이블 스타일 */
	.table_style_01 .p_ver { display: none!important; }
	.table_style_02 { font-size: 0.9em; }
	
	/* 무료체험 신청 페이지 폼 */
	#announcement .txt_02 { display: inline-block; font-size: 1.4em; margin: 10px 0; }
	#announcement .txt_02 p { width: 100%; }
}