@charset "utf-8";

header{width:100%; position: fixed; z-index: 1000; top:0; background: var(--bg-card)}
header .header_wrap{max-width: 1120px; margin: 0 auto; position: relative; display: flex; align-items: center; padding: 20px 0; gap: var(--box-gap)}
header .lecture_room{max-width:1280px}
main, footer{max-width: 1120px; margin: 0 auto}
main, footer{max-width: 1120px; margin: 0 auto}
main.lecture_room{max-width:1280px; display: block !important}
#banner{width: 100%; margin-top:var(--mbanner-margin)}
header h1.logo{width: 105px; height: 38px; margin: 0; flex-shrink: 0}
header h1.logo a{display: block; width: 100%; height: 100%; background: url(../images/logo.png) no-repeat center/contain; text-indent: -9999px; overflow: hidden}

header .header_notice{background: var(--itgo-dark); display: flex; position: relative}
header .header_notice .header_notice_wrap{max-width: 1120px; height: 80px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center}
header .header_notice button.btn_hnotice_pre{width: 50px; height: 80px; background: url(../images/popup_arrow_prev.png) 0 50% no-repeat; overflow: hidden; text-indent: -9999px; border: none; cursor: pointer}
header .header_notice button.btn_hnotice_next{width: 50px; height: 80px; background: url(../images/popup_arrow_next.png) 100% 50% no-repeat; overflow: hidden; text-indent: -9999px; border: none; cursor: pointer}
header .header_notice .header_notice_list{width: 1000px; height: 80px; overflow: hidden; position: relative}
header .header_notice .header_notice_list_track{display: flex; gap: 50px; transition: transform 0.3s ease-in-out}
header .header_notice .header_notice_list .header_notice_box{width: 300px; flex-shrink: 0; height: 80px; display: flex; align-items: center}
header .header_notice .header_notice_list .header_notice_box a{width: 100%; font-size: 0.92em; display: flex; flex-wrap: wrap; justify-content: space-between; color: var(--bg-card)}
header .header_notice .header_notice_list .header_notice_box .hnotice_st{width: 100%; height: 30px; overflow: hidden; display: block; word-break: break-all; font-weight: 800}
header .header_notice .header_notice_list .header_notice_box .hnotice_date{display: block; margin: var(--cont-margin); font-size: 0.85rem}
header .header_notice .header_notice_list .header_notice_box .hnotice_dea{display: block; margin: var(--cont-margin); font-size: 0.85rem}
header .header_notice .header_notice_list .header_notice_box .hnotice_dea::after{content: " +"}
header .header_notice .btn_hnotice_close{position: absolute; right: 0; bottom: -20px; padding: 5px 30px 5px 20px; border-radius: 0 0 5px 5px; color: var(--bg-card); font-size: 0.85rem; background: url(../images/pop_close.png) 80% 50% var(--itgo-dark) no-repeat; border: none; cursor: pointer}
header .header_notice .btn_hnotice_close.on{background: url(../images/pop_open.png) 80% 50% var(--itgo-dark) no-repeat}

nav.gnb{display: flex; align-items: center; flex-shrink: 0; padding: 10px}
nav.gnb .menu_set{display: flex; align-items: center}
nav.gnb .menu_set > li{position: relative}
nav.gnb .menu_set > li > a{font-weight: 800; text-decoration: none; padding: 10px}
nav.gnb .menu_set > li > a:hover{color: var(--itgo)}
/*nav.gnb .menu_set > li:first-child > a{background: url(../images/ico_selec.png) 85% 50% no-repeat; padding: 10px 25px 10px 10px; display: flex; flex-shrink: 1; flex-direction: column}*/
nav.gnb .sub_menu_wrap{display: none; position: absolute; top: 39px; left: 0; border-radius: var(--box-radius); border: var(--border); box-sizing: border-box; box-shadow: var(--box-shadow); background: var(--bg-card); z-index: 200}
nav.gnb .sub_menu_wrap.on,
nav.gnb .menu_set > li:first-child.on .sub_menu_wrap{display: flex}
nav.gnb .sub_menu_wrap .sub_menu_step1_padd{padding: 10px 0}
nav.gnb .sub_menu_step1{border-top-left-radius: var(--box-radius); border-bottom-left-radius: var(--box-radius); overflow: auto; scrollbar-width: none; max-height: calc(100vh - 150px)}
nav.gnb .sub_menu_step1 dl{border-bottom: var(--border); margin: 0 0 15px 0; padding: 0 10px 5px 10px}
nav.gnb .sub_menu_step1 dl:nth-last-of-type(1){border: 0}
nav.gnb .sub_menu_step1 dl > dt{font-size: 0.85rem; padding: 5px 10px}
nav.gnb .sub_menu_step1 dl > dd{font-weight: 700}
nav.gnb .sub_menu_step1 dl > dd > a{background: url(../images/ico_menu.png) 93% 50% no-repeat; padding: 10px 20px 10px 10px; display: block; border-radius: var(--button-radius); white-space: nowrap}
nav.gnb .sub_menu_step1 dl > dd > a:hover,
nav.gnb .sub_menu_step1 dl > dd > a.on{background: url(../images/ico_menu.png) 93% 50% var(--bg-blue) no-repeat; color: var(--itgo)}
nav.gnb .sub_menu_step2{border-top-right-radius: var(--box-radius); border-bottom-right-radius: var(--botton-radius); border-left: var(--border)}
nav.gnb .sub_menu_step2 .sub_menu_step2_st{border-bottom: var(--border); display: block; padding: 10px 20px; font-weight: 900}
nav.gnb .sub_menu_step2 .sub_menu_step2_list_padd{padding: 10px 0}
nav.gnb .sub_menu_step2 ul.sub_menu_step2_list{padding: 0 10px; overflow: auto; scrollbar-width: none; max-height: calc(100vh - 190px)}
nav.gnb .sub_menu_step2 ul.sub_menu_step2_list li{font-weight: 700}
nav.gnb .sub_menu_step2 ul.sub_menu_step2_list li > a{padding: 10px; display: block; border-radius: var(--box-radius); white-space: nowrap}
nav.gnb .sub_menu_step2 ul.sub_menu_step2_list li > a:hover{background: var(--bg-blue); color: var(--itgo)}

nav.gnb ul.sub_menu_wrap2{
	display: block; position: absolute; top: 39px; left: 50%; transform: translateX(-50%); border-radius: var(--box-radius); border: var(--border); box-sizing: border-box; box-shadow: var(--box-shadow); background: var(--bg-card); z-index: 200; padding: 10px 0
}
nav.gnb ul.sub_menu_wrap2 li{padding:0 10px; font-weight: 700}
nav.gnb ul.sub_menu_wrap2 li > a{padding:10px; border-radius: var(--button-radius); white-space: nowrap; display: block}
nav.gnb ul.sub_menu_wrap2 li > a:hover{background: var(--bg-blue); color: var(--itgo)}

header .search_set{flex: 1; position: relative; height: 46px; display: flex; align-items: center}
header .search_set .search_wrapbox{width: 100%; position: absolute; top: -6px; left: 0; z-index: 10}
header .search_set .search_wrapbox.on{background: var(--bg-card); border: var(--border); box-sizing: border-box; border-radius: var(--box-radius); box-shadow: var(--box-shadow); z-index: 100}
header .search_set .search_wrapbox.on .search_history{display: block}
header .search_set .search_input_padd{padding: 6px 6px 0 6px}
header .search_set .search_input{height: 44px; border: var(--border); box-sizing: border-box; border-radius: var(--button-radius); display: flex; align-items: center; background: var(--bg-card)}
header .search_set .search_wrapbox.on .search_input{border: var(--border-itgo); box-sizing: border-box; transition: border 5s}
header .search_set .search_st{width: 95px; position: relative; flex-shrink: 0; height: 100%}
header .search_set .search_st > .search_st_tt{height: 100%; display: flex; align-items: center; padding: 0 13px 0 20px; background: url(../images/ico_selec.png) 90% 50% no-repeat; cursor: pointer; font-weight: 700; font-size: 1rem}
header .search_set .search_st > ul.search_st_box{display: none; position: absolute; top: 35px; left: -1px; width: 100%; border-radius: var(--box-radius); line-height: 28px; padding: 5px; border: var(--border); box-sizing: border-box; background: var(--bg-card); box-shadow: var(--box-shadow); z-index: 110}
header .search_set .search_st > ul.search_st_box.on{display: block}
header .search_set .search_st > ul.search_st_box > li{padding: 2px 15px; cursor: pointer}
header .search_set .search_st > ul.search_st_box > li:hover{font-weight: 800; background: rgba(216, 229, 243, 0.8); border-radius: var(--box-radius);}
header .search_set .inp_search{flex: 1; width:100%; height: 100%; border: 0; outline: none; background: transparent; padding: 0 10px}
header .search_set .btn_search_ser{width: 44px; height: 100%; background: url(../images/ico_ser.png) center no-repeat; text-indent: -9999px; overflow: hidden; flex-shrink: 0}
header .search_set .search_history{display: none}
header .search_set ul.search_history_list{padding: 10px 0}
header .search_set ul.search_history_list li{padding: 0 40px 0 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; position: relative; line-height: 28px}
header .search_set ul.search_history_list li:hover{background: var(--bg-blue)}
header .search_set ul.search_history_list li .btn_serarch_del{width: 9px; height: 9px; background: url(../images/ser_del.png) center no-repeat; text-indent: -9999px; overflow: hidden; transition: transform 0.3s ease; position: absolute; top: 10px; right: 15px}
header .search_set ul.search_history_list li .btn_serarch_del:hover{transform: rotate(180deg)}
header .search_set .search_history_option{height: 40px; background: var(--bg-gray); border-bottom-left-radius: var(--box-radius); border-bottom-right-radius: var(--box-radius); padding: 0 20px; display: flex; align-items: center; justify-content: space-between}
header .search_set .search_history_option button.btn_serarch_savechk{font-weight: 800; background: var(--bg-card); text-align: center; border-radius: var(--box-radius); color: var(--bg-card); display: inline-block; vertical-align: middle; margin-left: 8px; padding:3px 5px; cursor: pointer; font-size: 8px}
header .search_set .search_history_option button.btn_serarch_savechk::after{content: "OFF"}
header .search_set .search_history_option button.btn_serarch_savechk.on{background: var(--itgo)}
header .search_set .search_history_option button.btn_serarch_savechk.on::after{content: "ON"}
header .search_set .search_history_option .search_alldel{cursor: pointer}

header .topmenu_set{display: flex; align-items: center; justify-content: flex-end; flex-shrink: 0; gap: 10px}

header .bell_set{position: relative; display: flex; align-items: center}
header .bell_set .btn_bell{width: 36px; height: 36px; position: relative; border-radius: 50%; cursor: pointer; transition: background 0.3s}
header .bell_set .btn_bell:hover{background: var(--bg-gray)}
header .bell_set .btn_bell .bell_chek{width: 5px; height: 5px; background: var(--color-red); border-radius: 50%; position: absolute; top: 6px; right: 6px}
header .bell_set .btn_bell .bell{width: 100%; height: 100%; display: block; background: url(../images/bell.png) center no-repeat; text-indent: -9999px; overflow: hidden}
header .bell_set .bell_pop{display: none; position: absolute; top: 48px; right: 0; left: auto; transform: none; width: 250px; height: 400px; background: var(--bg-card); border: var(--border); box-sizing: border-box; border-radius: var(--box-radius); box-shadow: var(--box-shadow); z-index: 150; overflow: hidden}
header .bell_set .bell_pop.on{display: block}
header .bell_set .bell_pop .bell_header{display: flex; justify-content: space-between; align-items: center; font-weight: 800; padding: 20px 15px 10px 15px}
header .bell_set .bell_pop .bell_header button.btn_alldel{cursor: pointer; font-size: 0.85rem}
header .bell_set .bell_pop .bell_header h2.bell_title{font-size: 1rem}
header .bell_set .bell_pop ul{max-height: 350px; overflow-y: auto}
header .bell_set .bell_pop ul::-webkit-scrollbar{width: 4px}
header .bell_set .bell_pop ul::-webkit-scrollbar-thumb{background-color: var(--thumb); border-radius: var(--box-radius)}
header .bell_set .bell_pop ul::-webkit-scrollbar-track{background-color: transparent}
header .bell_set .bell_pop ul li.not_reading{background: var(--bg-blue)}
header .bell_set .bell_pop ul li:nth-last-child(1){border-bottom-left-radius: var(--box-radius); border-bottom-right-radius: var(--box-radius)}
header .bell_set .bell_pop ul li a{display: flex; justify-content: space-between; align-items: center; padding: 10px 30px 10px 15px; position: relative; font-size: 0.92rem}
header .bell_set .bell_pop ul li a em{display: block; color: var(--text-gray); margin: 3px 0 0 0; font-size: 0.85rem}
header .bell_set .bell_pop ul li a .del{width: 9px; height: 9px; background: url(../images/ser_del.png) center no-repeat; text-indent: -9999px; overflow: hidden; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); transition: transform 0.3s ease}
header .bell_set .bell_pop ul li a .del:hover{transform: translateY(-50%) rotate(180deg)}

header .login_set{position: relative; display: flex; align-items: center}
header .login_set button.btn_login{font-weight: 800; padding: 10px 16px; border-radius: var(--button-radius); cursor: pointer; border: var(--border); box-sizxing: border-box; background: var(--bg-card); transition: background 0.3s}
header .login_set button.btn_login:hover{background-color:var(--itgo); color:var(--bg-card)}
header .login_set .mem_info{position: absolute; width: 195px; border-radius: var(--box-radius); border: var(--border); box-sizing: border-box; top: 48px; right: 0; background: var(--bg-card); display: none; box-shadow: var(--box-shadow); z-index: 150}
header .login_set .mem_info.on{display: block}
header .login_set .mem_info .info_ico{display: flex; border-bottom: var(--border)}
header .login_set .mem_info .info_ico .info_fav{width: 50%; height: 73px; background: url(../images/ico_fav.png) 50% 15px no-repeat; text-align: center}
header .login_set .mem_info .info_ico .info_fav a{width: 100%; height: 100%; padding-top: 44px; box-sizing: border-box; display: block}
header .login_set .mem_info .info_ico .info_11{width: 50%; height: 73px; background: url(../images/ico_11.png) 50% 15px no-repeat; text-align: center; border-left: var(--border)}
header .login_set .mem_info .info_ico .info_11 a{width: 100%; height: 100%; padding-top: 44px; box-sizing: border-box; display: block}
header .login_set .mem_info .info_pt{display: block; box-sizing: border-box; padding: 10px 0 10px 20px}
header .login_set .mem_info .info_cp{display: block; box-sizing: border-box; padding: 10px 0 10px 20px; border-top: var(--border)}
header .login_set .mem_info .info_fp{display: block; box-sizing: border-box; padding: 10px 0 10px 20px; line-height: 20px; border-top: var(--border)}
header .login_set .mem_info .info_remote{padding: 10px 20px 10px 20px; display: block; border-top: var(--border)}
header .login_set .mem_info .info_remote a{width: 100%; padding: 10px 0; background: var(--itgo); display: block; text-align: center; color: var(--bg-card); border-radius: var(--button-radius)}
header .login_set .mem_info .info_ip{width: 100%; background: var(--bg-card); display: flex; justify-content: space-between; border-bottom-left-radius: var(--box-radius); border-bottom-right-radius: var(--box-radius)}
header .login_set .mem_info .info_ip .info_my a{padding: 15px 15px 15px 20px; background: url(../images/ico_key.png) 100% 50% no-repeat; display: block}
header .login_set .mem_info .info_ip .info_out a{padding: 15px 20px; display: block}
header .login_set .mem_info .cect{color: var(--itgo); font-weight: 700}

#sub_banner{width:100%; height:200px; margin:var(--banner-margin) 0 0 0}
#sub_banner.class_room{background: url(../images/sub_banner01.jpg) no-repeat}
#sub_banner.my_class{background: url(../images/sub_banner05.jpg) no-repeat}
#sub_banner.customer{background: url(../images/sub_banner07.jpg) no-repeat}
#sub_banner.basic{background: url(../images/sub_banner04.jpg) no-repeat}
#sub_banner .subbanner_title{max-width: 1120px; height:100%; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: var(--bg-card)}
#sub_banner .subbanner_title .subbanner_title_st{font:var(--sub-banner-st)}
#sub_banner .subbanner_title .subbanner_title_em{display: block; font: var(--sub-banner-em)}

main{}
main.sub_wrap{display: flex; justify-content: space-between}

main .sub_menu{width:170px}
main .sub_menu h3.sub_menu_title{font-size: 1.6rem; font-weight: 900;  margin:var(--section-margin); padding:0 0 0 10px}
main .sub_menu dl.sub_menu_list{margin: var(--cont-margin)}
main .sub_menu dl.sub_menu_list dd{font-weight: 700}
main .sub_menu dl.sub_menu_list dd a{padding: 10px 20px 10px 10px; display: block; border-radius: var(--button-radius); white-space: nowrap}
main .sub_menu dl.sub_menu_list dd a:hover,
main .sub_menu dl.sub_menu_list dd a.on{background: var(--bg-blue); color:var(--itgo)}

main .cont{width:calc(100% - 170px - 30px)}

main .count_set{display: flex; justify-content: space-between; margin: var(--section-margin)}
main .count_set dl.count_box{display: flex; flex-wrap: wrap; justify-content: center}
main .count_set .count_title{ width: 100%; text-align: center; padding: 0 0 10px 0; box-sizing: border-box; font-size: 1rem; font-weight: 700}
main .count_set .count_badge{height: 50px; color: var(--bg-card); letter-spacing: -1px; font-size: 1.85rem; font-weight: 800; display: flex; align-items: center; box-sizing: border-box}
main .count_set .count_badge > em{letter-spacing: -1px; font-size: 0.92rem; font-weight: 400; padding: 10px 0 0 3px}
main .count_set .count_badge.left{padding: 0 15px 0 20px; border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .count_set .count_badge.right{padding: 0 20px 0 15px; border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .theme_blue .count_badge.left{background: var(--itgo-dark)}
main .theme_blue .count_badge.right{background: var(--itgo)}
main .theme_green .count_badge.left{background: #035353}
main .theme_green .count_badge.right{background: #00b3b4}
main .theme_purple .count_badge.left{background: #59012a}
main .theme_purple .count_badge.right{background: #b40054}

main .main_notice_set {width: 100%;height: 50px; background: var(--bg-gray); display: flex; align-items: center; border-radius: var(--box-radius); margin: var(--section-margin); overflow: hidden;}
main .main_notice_set h2.main_notice_title {flex: 0 0 60px; text-align: center; font-size: 1rem;}
main .main_notice_set ul.main_notice_cont {width: calc(100% - 80px); flex: 1; min-width: 0; overflow: hidden; display: block; margin: 0; padding: 0; list-style: none;}
main .main_notice_set .notice_track {display: flex; flex-wrap: nowrap; width: max-content; white-space: nowrap;}
main .main_notice_set ul.main_notice_cont li {flex: 0 0 auto; white-space: nowrap; margin: 0 50px 0 0;}


main .class_set{margin: var(--section-margin)}
main .class_set h2.class_title{font:var(--font-title)}
main .class_set .class_imgwrap{display: grid; grid-template-columns: var(--box-grid); gap: var(--box-gap); margin: var(--box-margin)}
main .class_set .class_imgwrap li{border-radius: var(--box-radius); overflow: hidden; position: relative; height: var(--box-height); border:var(--border); transition: border 5s}
main .class_set .class_imgwrap li:hover{border:var(--border-itgo); box-sizing: border-box}
main .class_set .class_imgwrap li a{display: block; width: 100%; height: 100%}
main .class_set .class_imgwrap li .thumb_img img{width: 100%; height: 100%; object-fit: cover; display: block}
main .class_set .class_imgwrap li .card_info{position: absolute; left: 0; bottom: 0; background: var(--bg-card); padding: 15px 20px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 90px; transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1); border-radius: 0 0 var(--box-radius) var(--box-radius)}
main .class_set .class_imgwrap li .card_info h3.card_title{word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font:var(--box-title)}
main .class_set .class_imgwrap li a:hover .card_info{height: 70%}
main .class_set .class_imgwrap li a:hover .card_info h3.card_title{-webkit-line-clamp: unset; overflow: visible}
main .class_set .class_imgwrap li .card_info .card_meta{margin-top: auto; display: flex; gap: 8px; font-size: 0.85rem; font-weight: 700}
main .class_set .class_imgwrap li .card_info .card_meta .card_meta_count{color: var(--itgo)}
main .class_set .class_sub{display: flex; margin:var(--box-margin); flex-wrap: wrap; gap:10px; background: var(--bg-blue); padding:10px; border-radius: var(--box-radius); justify-content: space-between}
main .class_set .class_sub li{position: relative; display: flex; padding:5px 20px 5px 5px; border:solid 1px transparent; box-sizing:border-box; border-radius: var(--box-radius); overflow: hidden; background: var(--bg-card); transition: border 0.3s}
main .class_set .class_sub li:hover{border:var(--border-itgo)}
main .class_set .class_sub li a{display: flex; align-items: center; gap: 8px; width: 100%}
main .class_set .class_sub li .class_sub_img{width:40px; height:40px; border-radius: var(--box-radius); overflow: hidden; display: block; flex-shrink: 0}
main .class_set .class_sub li .class_sub_img img{width: 100%; height: 100%; object-fit: cover; object-position: center; display: block}
main .class_set .class_sub li .class_sub_tt{text-align: left; letter-spacing: -1px; padding:0; display: block; word-break: keep-all}

main .newclass_set{margin:var(--section-margin)}
main .newclass_set h2.newclass_title{font:var(--font-title)}
main .newclass_set .newclass_wrap{display: flex; gap: 0 var(--box-gap); margin: var(--box-margin); overflow: hidden}
main .newclass_set .newclass_wrap li{min-width:208px; border-radius: var(--box-radius); overflow: hidden; position: relative; height: var(--box-height); border:var(--border); transition: border 5s}
main .newclass_set .newclass_wrap li:hover{border:var(--border-itgo); box-sizing: border-box}
main .newclass_set .newclass_wrap li a{display: block; width: 100%; height: 100%}
main .newclass_set .newclass_wrap li .thumb_img img{width: 100%; height: 100%; object-fit: cover; display: block}
main .newclass_set .newclass_wrap li .card_info{position: absolute; left: 0; bottom: 0; background: var(--bg-card); padding: 15px 20px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 90px; transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1); border-radius: 0 0 var(--box-radius) var(--box-radius)}
main .newclass_set .newclass_wrap li .card_info h3.card_title{word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font:var(--box-title)}
main .newclass_set .newclass_wrap li a:hover .card_info{height: 70%}
main .newclass_set .newclass_wrap li a:hover .card_info h3.card_title{-webkit-line-clamp: unset; overflow: visible}
main .newclass_set .newclass_wrap li .card_info .card_meta{margin-top: auto; display: flex; gap: 8px; font-size: 0.85rem; font-weight: 700}
main .newclass_set .newclass_wrap li .card_info .card_meta .card_meta_count{color: var(--itgo)}

main .recseries_set{margin:var(--section-margin); padding:20px; background: var(--bg-blue); border-radius: var(--box-radius)}
main .recseries_set .recseries_title_wrap{display: flex; justify-content: space-between}
main .recseries_set .recseries_title_wrap h2.recseries_title{font:var(--font-title); color: var(--itgo); display: flex; align-items: center}
main .recseries_set .recseries_title_wrap a{padding:5px 10px; color:var(--bg-card); background:var(--itgo); border-radius: var(--button-radius); font-size: 0.85rem}
main .recseries_set ul.recseries_list{display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--box-gap); margin: var(--box-margin)}
main .recseries_set ul.recseries_list li{display: flex; flex-direction: column; align-items: flex-start; background: var(--bg-card); border-radius: var(--box-radius); transition: border 0.3s; border:solid 1px transparent}
main .recseries_set ul.recseries_list li:hover{border:var(--border-itgo); box-sizing: border-box}
main .recseries_set ul.recseries_list li a{padding:20px}
main .recseries_set ul.recseries_list li a::before{content: "SERIES"; background: var(--itgo); font-size: 10px;  padding: 0px 5px; border-radius: var(--box-radius); display: block; width: max-content; margin-bottom: 5px; color: var(--bg-card); font-weight: 800}

main .recommended_set{margin: var(--section-margin)}
main .recommended_set h2.recommended_title{font:var(--font-title)}
main .recommended_set ul.recommended_list{display: grid; grid-template-columns: var(--box-grid); gap: var(--box-gap); margin: var(--box-margin)}
main .recommended_set ul.recommended_list li{height:200px; overflow: hidden; border-radius: var(--box-radius); padding:30px 0 0 0; box-sizing: border-box}
main .recommended_set ul.recommended_list li:nth-child(1){background: url(../images/recommended01.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(2){background: url(../images/recommended02.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(3){background: url(../images/recommended03.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(4){background: url(../images/recommended04.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(5){background: url(../images/recommended05.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(6){background: url(../images/recommended06.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(7){background: url(../images/recommended07.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(8){background: url(../images/recommended08.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(9){background: url(../images/recommended09.png) 50% no-repeat}
main .recommended_set ul.recommended_list li:nth-child(10){background: url(../images/recommended10.png) 50% no-repeat}
main .recommended_set ul.recommended_list li a{width:100%; height:100%; display: block}
main .recommended_set ul.recommended_list li .recom_st_em{display: flex; justify-content: center; color:var(--bg-card); font-size: 0.85rem}
main .recommended_set ul.recommended_list li .recom_st{display: flex; justify-content: center; color:var(--bg-card); font:var(--pop-text); text-align: center; margin:0.3rem 0 0 0}

main .popular_set{margin: var(--section-margin)}
main .popular_set h2.popular_title{font:var(--font-title)}
main .popular_set ul.popular_list{display: grid; grid-template-columns: var(--box-grid); gap: var(--box-gap); margin: var(--box-margin)}
main .popular_set ul.popular_list li{height:210px; overflow: hidden; border-radius: var(--box-radius); padding:30px 0 0 0; box-sizing: border-box}
main .popular_set ul.popular_list li:nth-child(1){background: url(../images/popular01.png) 50% no-repeat}
main .popular_set ul.popular_list li:nth-child(2){background: url(../images/popular02.png) 50% no-repeat}
main .popular_set ul.popular_list li:nth-child(3){background: url(../images/popular03.png) 50% no-repeat}
main .popular_set ul.popular_list li:nth-child(4){background: url(../images/popular04.png) 50% no-repeat}
main .popular_set ul.popular_list li:nth-child(5){background: url(../images/popular05.png) 50% no-repeat}
main .popular_set ul.popular_list li a{width:100%; height:100%; display: block}
main .popular_set ul.popular_list li .popular_st_em{display: flex; justify-content: center; color:var(--bg-card); font-size: 0.85rem}
main .popular_set ul.popular_list li .popular_st{display: flex; justify-content: center; color:var(--bg-card); font:var(--pop-text); letter-spacing: -1px; text-align: center; margin:0.3rem 0 0 0}

main .freepass_set{display: flex; margin: var(--section-margin)}
main .freepass_set .freepass_box{width:151px; height:268px; padding:20px 0 0 20px; box-sizing: border-box; flex-shrink: 0;} /* 카드 너비 고정 */
main .freepass_set .freepass_3m{background: url(../images/freepass_3m.png) no-repeat}
main .freepass_set .freepass_6m{background: url(../images/freepass_6m.png) no-repeat; margin-left:19px}
main .freepass_set .freepass_title_wrap{flex: 1; text-align: center}
main .freepass_set .freepass_12m{background: url(../images/freepass_12m.png) no-repeat}
main .freepass_set .freepass_24m{background: url(../images/freepass_24m.png) no-repeat; margin-left:19px}
main .freepass_set a{width:100%; height:100%; display: block}
main .freepass_set .freepass_st{font:var(--freepass-st); color:var(--bg-card); display: block}
main .freepass_set .freepass_st .freepass_st_text{font-weight: 400; font-size: 1.3rem}
main .freepass_set .freepass_price{color:var(--bg-card); text-decoration: line-through; margin:7px 0 0 0; display:inline-block; letter-spacing: -1px}
main .freepass_set .freepass_sale{background: var(--color-red); border-radius: var(--button-radius); padding:2px 5px; color: var(--bg-card); font-weight: 800; font-size: 0.85rem; letter-spacing: -1px}
main .freepass_set .freepass_pay{font:var(--freepass-st); color:var(--color-yellow); margin:5px 0 0 0; display:inline-block; letter-spacing: -1px}
main .freepass_set .freepass_rest{color: var(--bg-card); display: block; margin:5px 0 0 0; font-size: 0.92rem}
main .freepass_set .freepass_app{width:60px; text-align: center; background:var(--bg-card); display:block; border-radius: var(--button-radius); font-size:0.85rem; padding:3px 0 2px 0; font-weight: 800; margin:7px 0 0 0}
main .freepass_set h3.freepass_title{font:var(--freepass-st); margin:60px 0 0 0}
main .freepass_set .freepass_em{display: block; font-weight: 600}
main .freepass_set .freepass_num{display: block; margin:20px 0 0 0}
main .freepass_set .freepass_num .freepass_br{display: block}

main .class_list_set{}
main .class_list_set h4.class_list_subtitle{margin:var(--section-margin); font:var(--font-title)}
main .class_list_set .veiw_wrap{margin: var(--cont-margin); display: flex; justify-content: space-between}
main .class_list_set .veiw_wrap .class_list_em{display: flex; align-items: center}
main .class_list_set .veiw_wrap .class_list_em .itgo_series{padding:5px 10px; background: var(--itgo); color: var(--bg-card); font-weight: 700; border-radius: 5px; margin:0 10px 0 0}
main .class_list_set .veiw_wrap dl.class_list_view{display: flex; padding:10px 15px; border:var(--border); border-radius: var(--box-radius)}
main .class_list_set .veiw_wrap dl.class_list_view dd{width:18px; height:18px; overflow: hidden; text-indent: -9999px; cursor: pointer}
main .class_list_set .veiw_wrap dl.class_list_view dd.view_box{background: url(../images/view_box.png) no-repeat}
main .class_list_set .veiw_wrap dl.class_list_view dd.view_box_on{background: url(../images/view_box_on.png) no-repeat}
main .class_list_set .veiw_wrap dl.class_list_view dd.view_list{background: url(../images/view_list.png) no-repeat; margin:0 0 0 10px}
main .class_list_set .veiw_wrap dl.class_list_view dd.view_list_on{background: url(../images/view_list_on.png) no-repeat; margin:0 0 0 10px}
main .class_list_set ul.class_list_wrap{display: grid; grid-template-columns: var(--sub-box-grid); gap: var(--box-gap); margin: var(--box-margin)}
main .class_list_set ul.class_list_wrap li{border-radius: var(--box-radius); overflow: hidden; position: relative; height: var(--box-height); border:var(--border); transition: border 5s}
main .class_list_set ul.class_list_wrap li:hover{border:var(--border-itgo); box-sizing: border-box}
main .class_list_set ul.class_list_wrap li a{display: block; width: 100%; height: 100%}
main .class_list_set ul.class_list_wrap li .thumb_img img{width: 100%; height: 100%; object-fit: cover; display: block}
main .class_list_set ul.class_list_wrap li .card_info{position: absolute; left: 0; bottom: 0; background: var(--bg-card); padding: 15px 20px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 90px; transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1); border-radius: 0 0 var(--box-radius) var(--box-radius)}
main .class_list_set ul.class_list_wrap li .card_info h5.card_title{word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font:var(--box-title)}
main .class_list_set ul.class_list_wrap li a:hover .card_info{height: 70%}
main .class_list_set ul.class_list_wrap li a:hover .card_info h5.card_title{-webkit-line-clamp: unset; overflow: visible}
main .class_list_set ul.class_list_wrap li .card_info .card_meta{margin-top: auto; display: flex; gap: 8px; font-size: 0.85rem; font-weight: 700}
main .class_list_set ul.class_list_wrap li .card_info .card_meta .card_meta_count{color: var(--itgo)}

main .class_list_set table.class_list_tab{width:100%; margin: var(--box-margin)}
main .class_list_set table.class_list_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set table.class_list_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set table.class_list_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set table.class_list_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set table.class_list_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set table.class_list_tab tbody td:first-of-type{text-align: left; padding:10px 0 10px 10px}
main .class_list_set table.class_list_tab tbody td .class_sub{background: var(--itgo); color: var(--box-card); border-radius: var(--box-radius); padding:5px 10px}

main .class_list_set table.series_tab{width:100%; margin: var(--box-margin)}
main .class_list_set table.series_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set table.series_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set table.series_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set table.series_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set table.series_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set table.series_tab tbody td:first-of-type{text-align: left; padding:10px 0 10px 10px}

main .class_list_set .reins_tip{margin: var(--box-margin); display: block}
main .class_list_set .reins_tip li{padding-left: 8px; text-indent: -8px; font-size: 0.92rem}
main .class_list_set .reins_tip li::before{content: "- "}
main .class_list_set .reins_box{border-radius: var(--box-radius); background: var(--bg-gray); margin: var(--section-margin); padding:20px}
main .class_list_set .reins_box .reins_box_st{width:100%; text-align: center; display: block; font-weight: 800}
main .class_list_set .reins_box .reins_box_tab_wrap{background: var(--bg-card); border-radius: var(--box-radius); margin: var(--box-margin); padding:20px}
main .class_list_set .reins_box .reins_box_tab_wrap button{margin:0 auto}
main .class_list_set .reins_box table.reins_box_tab{width:100%}
main .class_list_set .reins_box table.reins_box_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set .reins_box table.reins_box_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set .reins_box table.reins_box_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set .reins_box table.reins_box_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set .reins_box table.reins_box_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set .reins_box .btn_set_wrap{width:100%; display: block; text-align: center; margin: var(--box-margin)}

main .class_list_set .pointdea_wrap{display: flex; margin: var(--box-margin)}
main .class_list_set .pointdea_pointbox{border: var(--border); border-radius: var(--box-radius); position: relative}
main .class_list_set .pointdea_pointbox .pointdea_pointbox_wrap{display: block; text-align: center; padding: 20px 0}
main .class_list_set .pointdea_pointbox .pointdea_pointbox_wrap h5{}
main .class_list_set .pointdea_pointbox .pointdea_pointbox_wrap .pointdea_pointbox_pt{font: var(--pop-text); margin:5px 0 0 0; display: block; color: var(--itgo); letter-spacing: -1px}
main .class_list_set .pointdea_pointbox .pointdea_pointbox_wrap .pointdea_pointbox_pt .ptt{font-size: 0.85rem; font-weight: 800; margin: 0 0 0 3px}
main .class_list_set .pointdea_pointbox .pointdea_pointbox_delpt{
	width:100%; display: block; background: var(--bg-gray); border-radius: 0 0 var(--box-radius) var(--box-radius); text-align: center; padding:10px; box-sizing: border-box
}
main .class_list_set dl.pointdea_tip{margin:10px 0 0 20px}
main .class_list_set dl.pointdea_tip dt{font-weight: 800; margin: 0 0 5px  0}
main .class_list_set dl.pointdea_tip dd{padding-left: 8px; text-indent: -8px; font-size: 0.92rem}
main .class_list_set dl.pointdea_tip dd::before{content: "- "}
main .class_list_set .pointdea_menu{display: flex; margin: var(--section-margin); gap:10px}
main .class_list_set .pointdea_menu button{border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; cursor: pointer}
main .class_list_set .pointdea_menu buttoni:hover{background: var(--itgo); color: var(--bg-card)}
main .class_list_set .pointdea_menu button.on{background: var(--itgo); color: var(--bg-card)}
main .class_list_set table.pointdea_tab{width:100%; margin: var(--box-margin)}
main .class_list_set table.pointdea_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set table.pointdea_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set table.pointdea_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set table.pointdea_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set table.pointdea_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set table.pointdea_tab tbody td.pointdea_st{text-align: left; padding:0 10px; box-sizing: border-box}

main ul.courselist_set{margin: var(--box-margin); border-top: var(--border)}
main ul.courselist_set li{border-bottom: var(--tab-border); padding:20px 10px}
main ul.courselist_set li:hover{background: var(--bg-blue)}
main ul.courselist_set li>dl.courselist_box{display: flex; flex-wrap: wrap}
main ul.courselist_set li>dl.courselist_box dt{width:100%; font-weight: 800}
main ul.courselist_set li>dl.courselist_box dd{margin: 5px 10px 0 0; color: var(--text-gray); font-size: 0.85rem; display: flex; align-items: center}
main ul.courselist_set li>dl.courselist_box dd:last-of-type{width:100%; margin: var(--cont-margin)}

main .class_list_set table.coupondea_tab{width:100%; margin: var(--box-margin)}
main .class_list_set table.coupondea_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set table.coupondea_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set table.coupondea_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set table.coupondea_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set table.coupondea_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set table.coupondea_tab tbody td.pointdea_st{text-align: left; padding:0 10px; box-sizing: border-box}

main .class_list_set table.new_class_tab{width:100%; margin: var(--box-margin)}
main .class_list_set table.new_class_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .class_list_set table.new_class_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_list_set table.new_class_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_list_set table.new_class_tab tbody tr:hover{background: var(--bg-blue)}
main .class_list_set table.new_class_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .class_list_set table.new_class_tab tbody td:first-of-type{padding:0 10px; box-sizing: border-box; text-align: left}
main .class_list_set table.new_class_tab thead th.wm60{min-width:60px}
main .class_list_set table.new_class_tab thead th.wm80{min-width:80px}
main .class_list_set table.new_class_tab thead th.wm90{min-width:90px}

main .class_list_set .new_class_menu{display: flex; margin: var(--box-margin); gap: 10px; flex-wrap: wrap}
main .class_list_set .new_class_menu button{border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; cursor: pointer}
main .class_list_set .new_class_menu button.on{background: var(--itgo); color: var(--bg-card)}

main .class_list_set table.class_list_tab thead th.wm60{min-width:60px}
main .class_list_set table.class_list_tab thead th.wm80{min-width:80px}
main .class_list_set table.class_list_tab thead th.wm90{min-width:90px}

main .educoupon_set{margin:var(--section-margin)}
main .educoupon_set h4.educoupon_subtitle{font:var(--font-title)}
main .educoupon_set .educoupon_tip{margin: var(--box-margin); display: block}
main .educoupon_set .educoupon_box{width:100%; justify-content: space-between; margin: var(--coupon-margin); display: flex; align-items: center; flex-wrap: wrap}
main .educoupon_set .educoupon_box .educoupon_img{width: 410px; height: 276px; background: url(../images/online_edu.png) no-repeat}
main .educoupon_set .educoupon_box .coupon_reg_free_img{width: 409px; height: 275px; background: url(../images/freepass_reg_img.png) no-repeat}
main .educoupon_set .educoupon_box .course_reg_img{width: 410px; height: 270px; background: url(../images/course_reg_img.png) no-repeat}
main .educoupon_set .educoupon_box .educoupon_form{width: calc(100% - 410px - 50px)}
main .educoupon_set .educoupon_box .educoupon_form .educoupon_inp_wrap{width:100%; display: block}
main .educoupon_set .educoupon_box .educoupon_form .educoupon_inp{width: calc(100% - 80px); height: 44px; background: var(--bg-gray); border-radius: var(--button-radius) 0 0 var(--button-radius); padding: 0 20px; box-sizing: border-box; outline: none}
main .educoupon_set .educoupon_box .educoupon_form button.btn_reg{width: 80px; height: 44px; background: var(--itgo); color: var(--bg-card); border-radius: 0 var(--button-radius) var(--button-radius) 0; font-size: 0.85rem; box-sizing: border-box}
main .educoupon_set .educoupon_box .educoupon_form ul.educoupon_spon{width:100%; margin: var(--cont-margin)}
main .educoupon_set .educoupon_box .educoupon_form ul.educoupon_spon li{padding-left: 8px; text-indent: -8px; font-size: 0.92rem}
main .educoupon_set .educoupon_box .educoupon_form ul.educoupon_spon li::before{content: "- "}


main .coupondea_set{margin:var(--section-margin)}
main .coupondea_set h4.coupondea_subtitle{font:var(--font-title)}
main .coupondea_set .coupondea_reg{margin:var(--box-margin)}
main .coupondea_set h5.coupondea_title{font-weight: 800; font-size: 1rem}
main .coupondea_set .coupondea_reg .coupondea_inp_wrap{background: var(--bg-gray); border-radius: var(--box-radius); padding:20px; margin: var(--cont-margin)}
main .coupondea_set .coupondea_reg input.coupondea_inp{width: calc(100% - 80px); height:44px; background: var(--bg-card); border-radius: var(--button-radius) 0 0 var(--button-radius); padding:0 20px; box-sizing: border-box; outline: none}
main .coupondea_set .coupondea_reg button.btn_reg{width:80px; height:44px; background: var(--itgo); color: var(--bg-card); border-radius: 0 var(--button-radius) var(--button-radius) 0; font-size: 0.85rem; box-sizing: border-box}
main .coupondea_set .coupondea_reg .coupondea_tip{margin: var(--cont-margin); display: block}
main .coupondea_set .coupondea_list_wrap{margin: var(--section-margin)}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab{width:100%; margin: var(--cont-margin)}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab tbody tr:hover{background: var(--bg-blue)}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .coupondea_set .coupondea_list_wrap table.coupondea_tab tbody td.coupondea_st{text-align: left; padding: 0 10px; box-sizing: border-box}

main .notice_set{margin:var(--section-margin)}
main .notice_set h4.notice_subtitle{font:var(--font-title)}
main .notice_set .notice_menu{display: flex; flex-wrap: wrap; margin: var(--box-margin); gap:10px}
main .notice_set .notice_menu button{border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; cursor: pointer}
main .notice_set .notice_menu button:hover{background: var(--itgo); color: var(--bg-card)}
main .notice_set .notice_menu button.on{background: var(--itgo); color: var(--bg-card)}
main .notice_set table.notice_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .notice_set table.notice_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .notice_set table.notice_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .notice_set table.notice_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .notice_set table.notice_tab thead th button.notice_select{background: url(../images/ico_selec.png) 100% 50% no-repeat; padding:5px 12px 5px 0; cursor: pointer; font-weight: 600}
main .notice_set table.notice_tab tbody tr:hover{background: var(--bg-blue)}
main .notice_set table.notice_tab tbody tr.announcement td{font-weight: 800}
main .notice_set table.notice_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .notice_set table.notice_tab tbody td.notice_st{text-align: left; padding:0 10px; box-sizing: border-box}
main .notice_set table.notice_tab tbody td.notice_st a{width:100%; display: block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .notice_set table.notice_tab tbody td.ico_notice{background: url(../images/ico_notice.png) 50% no-repeat}
main .notice_set table.notice_tab thead th ul.notice_pop{
	position: absolute; padding:10px 0; top: calc(100% - 7px); right: 0; margin: 0; border-radius: var(--box-radius); border: var(--border); box-sizing: border-box; background: var(--bg-card); box-shadow: var(--box-shadow); z-index: 150
}
main .notice_set table.notice_tab thead th ul.notice_pop li{padding:0 10px}
main .notice_set table.notice_tab thead th ul.notice_pop li a{padding:5px 10px; border-radius: var(--box-radius); display: block}
main .notice_set table.notice_tab thead th ul.notice_pop li a:hover{background: var(--bg-blue)}

main .notice_set dl.notice_view{margin: var(--box-margin)}
main .notice_set dl.notice_view dt{font-weight: 800}
main .notice_set dl.notice_view dt .notice_tag{font-size: 0.69rem; background: var(--itgo-dark); border-radius: var(--button-radius); color: var(--bg-card); padding:3px 5px; vertical-align: middle; margin:0 5px 0 0}
main .notice_set dl.notice_view dd.notice_dea{display: flex; justify-content: space-between; font-size: 0.92rem; background: var(--bg-gray); border-radius: var(--box-radius); padding: 10px 20px}
main .notice_set dl.notice_view dd.notice_dea ul.review_opt{display: flex; gap: 10px}
main .notice_set dl.notice_view dd.notice_dea ul.review_opt li:nth-of-type(2)::before{content: "l"; padding:0 10px 0 0; color: var(--bg-darkgray)}
main .notice_set dl.notice_view dd{margin:var(--cont-margin)}
main .notice_set dl.notice_view dd.notice_btn{text-align: center; margin:var(--section-margin)}
main .notice_set dl.notice_view dd.notice_btn a.btn_list{word-break: keep-all; border-radius: var(--button-radius); background: var(--itgo); padding: 10px 20px; color: var(--bg-card);}
main .notice_set dl.notice_view dd.notice_btn a.btn_cancel{word-break: keep-all; border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px}
main .notice_set dl.notice_view dd.inquiry_answer{margin: var(--box-margin)}
main .notice_set dl.notice_view dd.inquiry_answer .inquiry_answer_box{padding:20px; background: var(--bg-blue); border-radius: var(--box-radius); margin: var(--cont-margin)}
main .notice_set dl.notice_view dt input.inquiry_write_inp{width:100%; background: var(--bg-gray); border-radius: var(--box-radius); outline: none; padding:10px 15px; box-sizing: border-box; margin: var(--cont-margin)}
main .notice_set dl.notice_view dt input.inquiry_write_inp:focus{background: var(--bg-blue)}
main .notice_set dl.notice_view dd textarea.inquiry_write_box{width: 100%; height:200px; background: var(--bg-gray); border-radius: var(--box-radius); outline: none; padding:10px 15px; box-sizing: border-box; margin: var(--cont-margin)}
main .notice_set dl.notice_view dd textarea.inquiry_write_box:focus{background: var(--bg-blue)}
main .notice_set dl.notice_view dd.inquiry_write_wrap{width:100%; display: block; text-align: center; margin: var(--section-margin)}
main .notice_set dl.notice_view dd.inquiry_write_wrap button.btn_write{word-break: keep-all; border-radius: var(--button-radius); background: var(--itgo); padding: 10px 20px; color: var(--bg-card); margin:0 5px 0 0}
main .notice_set dl.notice_view dd.inquiry_write_wrap a.btn_cancel{word-break: keep-all; border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; margin:0 0 0 5px}

main .notice_set dl.notice_view .inquiry_answer_tag{font-size: 0.69rem; background: var(--itgo-dark); border-radius: var(--button-radius); color: var(--bg-card); padding:3px 5px; vertical-align: middle; margin:0 5px 0 0}

main .notice_set table.notice_tab thead th.wm60{width:60px}
main .notice_set table.notice_tab thead th.wm90{width:90px}
main .notice_set table.notice_tab thead th.wm100{width:100px}

main .freepass_purch_set{margin:var(--section-margin)}
main .freepass_purch_set h4.freepass_purch_subtitle{font:var(--font-title)}
main .freepass_purch_set .freepass_purch_tip{margin: var(--box-margin); display: block}
main .freepass_purch_set .freepass_purch_total{width:100%; text-align: center; display: block; margin: var(--section-margin); font: var(--fptotal-text); letter-spacing: -1px}
main .freepass_purch_set .freepass_purch_total .freepass_purch_total_pti{color: var(--itgo)}
main .freepass_purch_set .freepass_purch_total .freepass_purch_total_ptr{color: var(--color-red)}

main .freepass_purch_set table.freepass_purch_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .freepass_purch_set table.freepass_purch_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .freepass_purch_set table.freepass_purch_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .freepass_purch_set table.freepass_purch_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .freepass_purch_set table.freepass_purch_tab tbody tr:hover{background: var(--bg-blue)}
main .freepass_purch_set table.freepass_purch_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .freepass_purch_set table.freepass_purch_tab tbody td:first-of-type{text-align: left; padding:0 0 0 10px; box-sizing: border-box}
main .freepass_purch_set table.freepass_purch_tab tbody td .freepass_purch_pt{color: var(--color-red); font-weight: 800}
main .freepass_purch_set .freepass_purch_box{margin: var(--section-margin); border: var(--border); padding:30px; border-radius: var(--box-radius)}
main .freepass_purch_set .freepass_purch_box .freepass_purch_box_st{width:100%; display: block; text-align: center; font: var(--fptotal-title)}
main .freepass_purch_set .freepass_purch_box .freepass_purch_box_st .freepass_purch_box_st_pt{font-weight: 900}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info{display: block; column-count: 2; column-gap: 20px; margin: var(--fptotal-margin)}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li{min-height:44px; break-inside: avoid; margin-bottom: 20px; height: auto; padding: 0 0 0 55px; box-sizing: border-box; background-repeat: no-repeat; display: flex; flex-wrap: wrap}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li span{width:100%; display: block; font-weight: 900; font-size: 1.1rem}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li em{width:100%; display: block; font-size: 0.92rem; margin:5px 0 0 0}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li:nth-of-type(1){background-image: url(../images/fp_ico001.png)}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li:nth-of-type(2){background-image: url(../images/fp_ico002.png)}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li:nth-of-type(3){background-image: url(../images/fp_ico003.png)}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li:nth-of-type(4){background-image: url(../images/fp_ico004.png)}
main .freepass_purch_set .freepass_purch_box ul.freepass_purch_info li:nth-of-type(5){background-image: url(../images/fp_ico005.png)}

main .notice_set table.faq_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .notice_set table.faq_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .notice_set table.faq_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .notice_set table.faq_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .notice_set table.faq_tab tbody tr:hover{background: var(--bg-blue)}
main .notice_set table.faq_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .notice_set table.faq_tab tbody td[colspan="3"]{background: var(--bg-gray); text-align: left; padding:15px 20px; box-sizing: border-box}
main .notice_set table.faq_tab tbody td.faq_st{text-align: left; padding:0 10px; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer}
main .notice_set table.faq_tab thead th.wm60{width:60px}
main .notice_set table.faq_tab thead th.wm90{width:90px}

main .review_set{margin:var(--section-margin)}
main .review_set h4.review_subtitle{font:var(--font-title)}
main .review_set table.review_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .review_set table.review_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .review_set table.review_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .review_set table.review_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .review_set table.review_tab tbody tr:hover{background: var(--bg-blue)}
main .review_set table.review_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .review_set table.review_tab tbody td.review_st{text-align: left; padding:0 10px; box-sizing: border-box}
main .review_set table.review_tab tbody td.review_st a{width:100%; display: block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .review_set table.review_tab thead th.wm60{width:60px}
main .review_set table.review_tab thead th.wm100{width:100px}
main .review_set dl.review_write{margin: var(--box-margin)}
main .review_set dl.review_write .review_tag{font-size: 0.69rem; background: var(--itgo-dark); border-radius: var(--button-radius); color: var(--bg-card); padding:3px 5px; vertical-align: middle; margin:0 5px 0 0}
main .review_set dl.review_write .review_select_wrap{widtn:100%; display: block}
main .review_set dl.review_write .review_select_wrap .review_select{
	width:150px; border-radius: var(--box-radius); padding: 10px 15px; margin: var(--cont-margin); box-sizing: border-box;
	-webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../images/option_arrow.png) 90% 50% var(--bg-gray) no-repeat
}
main .review_set dl.review_write input.review_write_inp{width:100%; background: var(--bg-gray); border-radius: var(--box-radius); outline: none; padding:10px 15px; box-sizing: border-box; margin: var(--cont-margin)}
main .review_set dl.review_write input.review_write_inp:focus{background: var(--bg-blue)}
main .review_set dl.review_write textarea.review_write_box{width: 100%; height:200px; background: var(--bg-gray); border-radius: var(--box-radius); outline: none; padding:10px 15px; box-sizing: border-box; margin: var(--cont-margin)}
main .review_set dl.review_write textarea.review_write_box:focus{background: var(--bg-blue)}
main .review_set dl.review_write dt{margin: var(--box-margin)}
main .review_set dl.review_write dd:nth-of-type(2){margin: var(--box-margin)}
main .review_set dl.review_write dd.review_write_wrap{width:100%; display: block; text-align: center; margin: var(--section-margin)}
main .review_set dl.review_write dd.review_write_wrap button.btn_write{word-break: keep-all; border-radius: var(--button-radius); background: var(--itgo); padding: 10px 20px; color: var(--bg-card); margin:0 5px 0 0}
main .review_set dl.review_write dd.review_write_wrap a.btn_cancel{word-break: keep-all; border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; margin:0 0 0 5px}

main .doc_set{margin: var(--box-margin)}
main .doc_set h4.doc_subtitle{margin:var(--section-margin); font:var(--font-title)}
main .doc_set ul{margin: var(--box-margin)}
main .doc_set ul li:not(:first-of-type){margin:var(--section-margin)}
main .doc_set ul li h5{font-size: 1rem; font-weight: 900}
main .doc_set ul li .doc_tt_wrap{margin: var(--cont-margin); display: block; padding-left: 8px; text-indent: -8px; font-size: 0.92rem}
main .doc_set ul li .doc_tt_wrap::before{content: "- "}
main .doc_set ul li .doc_tt_wrap em{font-size:0.6rem}
main .doc_set ul li dl.doc_form{font-size: 0.92rem}
main .doc_set ul li dl.doc_form dt{margin: var(--cont-margin); display: block; padding-left: 8px; text-indent: -8px}
main .doc_set ul li dl.doc_form dt::before{content: "- "}
main .doc_set ul li dl.doc_form dd{padding-left: 9px}

main .ai_pack_set{margin: var(--box-margin)}
main .ai_pack_set h4.ai_pack_subtitle{margin:var(--section-margin); font:var(--font-title)}
main .ai_pack_set ul.ai_pack_list{margin: var(--box-margin); display: grid;  grid-template-columns: repeat(3, 1fr); gap: var(--box-gap)}
main .ai_pack_set ul.ai_pack_list li{padding:20px; border-radius: var(--box-radius); background-position: 100% 50%}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n-3) {background-color: var(--bg-box-yellow); background-repeat: no-repeat}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n+2) {background-color: var(--bg-box-red); background-repeat: no-repeat}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n+3) {background-color: var(--bg-box-sky); background-repeat: no-repeat}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n) {background-color: var(--bg-box-blue); background-repeat: no-repeat}

main .ai_pack_set ul.ai_pack_list li h5.ai_pack_title{font: var(--freepass-st)}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n-3) h5.ai_pack_title{color: var(--color-box-yellow)}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n+2) h5.ai_pack_title{color: var(--color-box-red)}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n+3) h5.ai_pack_title{color: var(--color-box-sky)}
main .ai_pack_set ul.ai_pack_list li:nth-child(4n) h5.ai_pack_title{color: var(--color-box-blue)}

main .ai_pack_set ul.ai_pack_list li:nth-child(1){background-image: url(../images/ai_pack01.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(2){background-image: url(../images/ai_pack02.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(3){background-image: url(../images/ai_pack03.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(4){background-image: url(../images/ai_pack04.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(5){background-image: url(../images/ai_pack05.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(6){background-image: url(../images/ai_pack06.png)}
main .ai_pack_set ul.ai_pack_list li:nth-child(7){background-image: url(../images/ai_pack07.png)}

main .ai_pack_set ul.ai_pack_list li .ai_pack_cont{width:100%; margin:10px 0 0 0; display: block}
main .ai_pack_set ul.ai_pack_list li a.btn_ai_pack{padding:10px 20px; background: var(--bg-card); border-radius: var(--button-radius); margin:10px 0 0 0; display: inline-block}

main ul.instructor_set{margin: var(--box-margin); display: grid;  grid-template-columns: repeat(2, 1fr); gap: var(--box-gap)}
main ul.instructor_set li{background: var(--bg-gray); border-radius: var(--box-radius)}
main ul.instructor_set li .instructor_tea{background-repeat: no-repeat; border-radius: var(--box-radius) var(--box-radius) 0 0; box-sizing: border-box; display: flex; padding:50px}
main ul.instructor_set li:nth-of-type(1) .instructor_tea{background-position: -50px 50%; background-color: var(--bg-box-yellow);  justify-content: flex-end}
main ul.instructor_set li:nth-of-type(2) .instructor_tea{background-position: calc(100% + 30px) 50%; background-color: var(--bg-box-red)}
main ul.instructor_set li .instructor_tea em.inst_title{font-size: 0.85rem; padding:5px 10px; border-radius: var(--button-radius); color: var(--bg-card)}
main ul.instructor_set li:nth-of-type(1) .instructor_tea em.inst_title{background: var(--color-box-yellow)}
main ul.instructor_set li:nth-of-type(2) .instructor_tea em.inst_title{background: var(--color-box-red)}

main ul.instructor_set li .instructor_tea h5.inst_name{font: var(--pop-text); margin: var(--cont-margin)}
main ul.instructor_set li:nth-of-type(1) .instructor_tea h5.inst_name{color: var(--color-box-yellow)}
main ul.instructor_set li:nth-of-type(2) .instructor_tea h5.inst_name{color: var(--color-box-red)}
main ul.instructor_set li .instructor_tea dl.inst_class{margin: var(--cont-margin)}
main ul.instructor_set li .instructor_tea dl.inst_class dt{font-weight: 800}
main ul.instructor_set li .instructor_tea dl.inst_class dd{}
main ul.instructor_set li .instructor_tea a.btn_inst{}
main ul.instructor_set li .instructor_info{}
main ul.instructor_set li .instructor_info dl.inst_book{display: flex}
main ul.instructor_set li .instructor_info dl.inst_book dd{width:50%; text-align: center; padding:10px 0; background: var(--bg-darkgray); cursor: pointer}
main ul.instructor_set li .instructor_info dl.inst_book dd.on{background: var(--bg-gray); cursor: default; font-weight: 700}
main ul.instructor_set li .instructor_info dl.inst_history{padding:30px}
main ul.instructor_set li .instructor_info dl.inst_history dd::before{content: "- "}

main ul.instructor_list{margin: var(--section-margin); display: grid;  grid-template-columns:  repeat(3, 1fr); gap: var(--box-gap)}
main ul.instructor_list li{background: var(--bg-gray); border-radius: var(--box-radius); padding: var(--box-gap); display: flex}
main ul.instructor_list li .instructor_img{width:78px; height:78px; display: block}
main ul.instructor_list li dl.instructor_tt{padding:0 0 0 10px}
main ul.instructor_list li dl.instructor_tt dt{font-weight: 800; margin:0 0 5px 0}
main ul.instructor_list li dl.instructor_tt dd::before{content: "- "}

main .edu_support_set{margin:var(--section-margin)}
main .edu_support_set .edu_support_subtitle{font:var(--font-title)}
main .edu_support_set .edu_support{background: url(../images/edu_support.png) #e2ebff 50% 0 no-repeat; margin: var(--box-margin); padding: 85px 40px 40px 40px; border-radius: var(--box-radius)}
main .edu_support_set .edu_support .sup_tt{width:100%; display: block; text-align: center; font:var(--freeclass-text)}
main .edu_support_set .edu_support .sup_step{display: grid;  grid-template-columns:  repeat(4, 1fr); gap:var(--box-gap); margin: var(--section-margin)}
main .edu_support_set .edu_support .sup_step dd{border-radius: var(--box-radius); background: var(--bg-card)}
main .edu_support_set .edu_support .sup_step dd::before{content: ""; width:100%; height:230px; display: block; border-radius: var(--box-radius) var(--box-radius) 0 0; background-position: 50%}
main .edu_support_set .edu_support .sup_step dd:nth-of-type(1)::before{background-image: url(../images/freeclass01.png)}
main .edu_support_set .edu_support .sup_step dd:nth-of-type(2)::before{background-image: url(../images/freeclass02.png)}
main .edu_support_set .edu_support .sup_step dd:nth-of-type(3)::before{background-image: url(../images/freeclass03.png)}
main .edu_support_set .edu_support .sup_step dd:nth-of-type(4)::before{background-image: url(../images/freeclass04.png)}
main .edu_support_set .edu_support .sup_step dd .step_wrap{padding:25px}
main .edu_support_set .edu_support .sup_step dd .step_wrap h5.step_ddst{font:var(--box-title)}
main .edu_support_set .edu_support .sup_step dd .step_wrap .step_d4{margin:var(--cont-margin); display: block}
main .edu_support_set .edu_support_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .edu_support_set .edu_support_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .edu_support_set .edu_support_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .edu_support_set .edu_support_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .edu_support_set .edu_support_tab tbody tr:hover{background: var(--bg-blue)}
main .edu_support_set .edu_support_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .edu_support_set .edu_support_tab tbody td.edu_support_st{text-align: left; padding:0 10px; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .edu_support_set .edu_support_tab thead th.wm80{width:80px}
main .edu_support_set .edu_support_tab thead th.wm120{width:120px}

main .edu_support_set .freeclass_app_wrap{width: 100%; height: 100vh; height: 100dvh; position: fixed; top: 0; left: 0; background: rgba(0,0,0,.4); z-index: 9999}
main .edu_support_set .freeclass_app{min-width: 480px; max-height: calc(100vh - 80px); background: var(--bg-gray); z-index: 12; position: absolute; top: 40px; left: 50%; transform: translateX(-50%); border-radius: var(--box-radius); padding:50px 40px;  overflow: auto; scrollbar-width: none}
main .edu_support_set .freeclass_app h5.freeclass_app_title{font: var(--pop-text); text-align: center}
main .edu_support_set .freeclass_app ul.freeclass_app_form{margin: var(--section-margin)}
main .edu_support_set .freeclass_app ul.freeclass_app_form li{margin: 0 0 20px 0}
main .edu_support_set .freeclass_app_tag{font-size: 0.69rem; background: var(--itgo-dark); border-radius: var(--button-radius); color: var(--bg-card); padding: 3px 5px; vertical-align: middle; margin: 0 5px 0 0}
main .edu_support_set input.freeclass_app_inp{width: 100%; height:35px; background: var(--bg-card); border-radius: var(--box-radius); outline: none; box-sizing: border-box; margin: var(--cont-margin); padding:0 15px}
main .edu_support_set .freeclass_app_adr{display: flex; margin: var(--cont-margin)}
main .edu_support_set input.freeclass_app_inpadr{width: 100%; height:35px; background: var(--bg-darkgray); border-radius: var(--box-radius) 0 0 var(--box-radius); outline: none; box-sizing: border-box; padding:0 15px}
main .edu_support_set .freeclass_app_adr button.btn_addr{width:80px; height:35px; word-break:keep-all; border-radius: 0 var(--box-radius) var(--box-radius) 0; background: var(--itgo); color: var(--bg-card)}

main .edu_support_set .freeclass_app_pap{display: flex; margin: var(--cont-margin)}
main .edu_support_set input.freeclass_app_papinp{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0}
main .edu_support_set input.freeclass_app_papname{width: calc(100% - 80px); height: 35px; box-sizing: border-box; background: var(--bg-darkgray); caret-color: transparent; cursor: default; border-radius: var(--box-radius) 0 0 var(--box-radius); outline: none; padding:0 15px}
main .edu_support_set label.freeclass_app_papbtn{width: 80px; height: 35px; line-height: 35px; text-align: center; background: var(--itgo); display: block; color: var(--bg-card); cursor: pointer; border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .edu_support_set input.freeclass_app_papinp:focus + label.freeclass_app_papbtn,
main .edu_support_set input.freeclass_app_papinp:focus-visible + label.freeclass_app_papbtn {outline: 2px solid #000; outline-offset: 2px}

main .edu_support_set .freeclass_app_option_wrap{width:100%; margin: var(--cont-margin)}
main .edu_support_set select.freeclass_app_option{
	width:100px; height:35px; border-radius: var(--box-radius); box-sizing: border-box; padding:0 10px; background: url(../images/option_arrow.png) 85% 50%  var(--bg-card) no-repeat;
	-webkit-appearance: none; -moz-appearance: none; appearance: none
}
main .edu_support_set .freeclass_app_write{margin: var(--cont-margin)}
main .edu_support_set .freeclass_app_write .freeclass_app_write_tip{}
main .edu_support_set .freeclass_app_write table.freeclass_app_write_tab{}
main .edu_support_set .freeclass_app_write table.freeclass_app_write_tab thead{display: none}
main .edu_support_set .freeclass_app_write table.freeclass_app_write_tab tbody{}
main .edu_support_set .freeclass_app_write table.freeclass_app_write_tab tbody td:nth-of-type(1) span{
	width: 30px; height: 30px; display: block; background: var(--bg-darkgray); border-radius: var(--box-radius); text-align: center; line-height: 30px; font-size: 0.95; margin:0 5px 0 0
}
main .edu_support_set dl.freeclass_app_term dt{font-weight: 800}
main .edu_support_set dl.freeclass_app_term dd:first-of-type{padding:10px 15px; background: var(--bg-card); border-radius: var(--box-radius); margin: var(--cont-margin)}
main .edu_support_set dl.freeclass_app_term dd .freeclass_app_termchk{font-weight: 800}
main .edu_support_set dl.freeclass_app_term dd .freeclass_app_termchk input[type="radio"]{width: 20px; height: 20px; vertical-align: middle; margin: 0 5px 0 10px}
main .edu_support_set dl.freeclass_app_term dd .freeclass_app_termchk label{cursor: pointer; caret-color: transparent}
main .edu_support_set dl.freeclass_app_term dd:last-of-type{margin: var(--cont-margin)}
main .edu_support_set .freeclass_app_btn{display: flex; justify-content: center; margin: var(--section-margin)}
main .edu_support_set .freeclass_app_btn button.btn_app{border-radius: var(--button-radius); background: var(--itgo); padding: 10px 20px; color: var(--bg-card)}
main .edu_support_set .freeclass_app_btn button.btn_cancle{border-radius: var(--button-radius); background: var(--bg-darkgray); padding: 10px 20px; margin: 0 0 0 10px}

main .seriesview_set{display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--box-gap)}
main .seriesview_set .seriesview_tea{background: var(--bg-gray); border-radius: var(--box-radius); padding: var(--box-gap); margin: var(--box-margin); border: solid 1px var(--bg-darkgray); box-sizing: border-box}
main .seriesview_set .seriesview_tea h5.seriesview_st{background: var(--bg-bgray); color: var(--bg-card); border-radius: var(--button-radius); padding: 5px 10px; display: inline-block}
main .seriesview_set .seriesview_tea .seriesview_box{display: flex; margin: var(--box-margin)}
main .seriesview_set .seriesview_tea .seriesview_box .seriesview_img{width:78px; height:78px; border-radius: 50%}
main .seriesview_set .seriesview_tea .seriesview_box dl.seriesview_his{padding:0 0 0 20px}
main .seriesview_set .seriesview_tea .seriesview_box dl.seriesview_his dt{font: var(--font-title); padding:0 0 10px 0; color: var(--itgo)}
main .seriesview_set .seriesview_tea .seriesview_box dl.seriesview_his dd{}
main .seriesview_set .seriesview_tea .seriesview_box dl.seriesview_his dd::before{content: "-"; padding:0 5px 0 0}

main .seriesview_set .seriesview_intro{background: var(--bg-gray); border-radius: var(--box-radius); padding: var(--box-gap); margin: var(--box-margin)}
main .seriesview_set .seriesview_intro h5.seriesview_st{background: var(--bg-bgray); color: var(--bg-card); border-radius: var(--button-radius); padding: 5px 10px; display: inline-block}
main .seriesview_set .seriesview_intro .seriesview_tt{display: 100%; display: block; margin: var(--box-margin)}

main dl.privacy_set{margin: var(--box-margin)}
main dl.privacy_set dt h3.privacy_subtitle{margin:var(--section-margin); font:var(--font-title)}
main dl.privacy_set dd{margin: var(--box-margin)}
main dl.privacy_set dd h4.privacy_st{font-weight: 800}
main dl.privacy_set dd h4.privacy_st::before{content: "●"; padding:0 5px 0 0}
main dl.privacy_set dd .privacy_em{display: block; padding:0 0 0 15px; margin: var(--cont-margin)}
main dl.privacy_set ul.privacy_list{padding:0 0 0 15px; margin: var(--cont-margin)}
main dl.privacy_set ul.privacy_list li{line-height: 24px}
main dl.privacy_set ul.privacy_list li::before{content: "○"; padding:0 3px 0 0; font-size: 0.69rem; vertical-align: top}
main dl.privacy_set ul.privacy_listbr{margin: var(--cont-margin)}
main dl.privacy_set ul.privacy_listbr li{line-height: 24px}
main dl.privacy_set ul.privacy_listbr .privacy_list_st{display: block; padding:0 0 0 15px}
main dl.privacy_set ul.privacy_listbr .privacy_list_st::before{content: "○"; padding:0 3px 0 0; font-size: 0.69rem; vertical-align: top}
main dl.privacy_set ul.privacy_listbr li .privacy_list_dd{display: block; padding:0 0 0 27px}

main dl.term_set{margin: var(--box-margin)}
main dl.term_set dt h3{margin:var(--section-margin); font:var(--font-title)}
main dl.term_set dd h4{margin:var(--box-margin); font-weight: 800; font-size: 1.2rem}
main dl.term_set dd h5{margin:var(--box-margin); font-weight: 700; font-size: 1rem}
main dl.term_set dd .padd10{padding:0 0 0 10px}

main .progress_app_set{margin: var(--box-margin)}
main .progress_app_set h4.progress_app_subtitle{margin:var(--section-margin); font:var(--font-title)}
main .progress_app_set dl.progress_app_step{display: flex; margin: var(--box-margin)}
main .progress_app_set dl.progress_app_step dd{padding:0 100px 0 0; position: relative}
main .progress_app_set dl.progress_app_step dd::after{content: ">"; position: absolute; right:45px; top:50%; transform: translateY(-50%); font-weight: 900; font-size: 1.5rem; color: var(--bg-darkgray)}
main .progress_app_set dl.progress_app_step dd:last-of-type::after{content: ""}
main .progress_app_set dl.progress_app_step dd span{width:150px; height:150px; border-radius:150px; text-align: center; padding:95px 0 0 0; background-repeat: no-repeat; background-color: var(--bg-gray); background-position: 50% 30px; box-sizing: border-box; display: block}
main .progress_app_set dl.progress_app_step dd.on span{background-color: var(--itgo); color: var(--bg-card)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(1) span{background-image: url(../images/app_step1.png)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(1).on span{background-image: url(../images/app_step1_on.png)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(2) span{background-image: url(../images/app_step2.png)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(2).on span{background-image: url(../images/app_step2_on.png)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(3) span{background-image: url(../images/app_step3.png)}
main .progress_app_set dl.progress_app_step dd:nth-of-type(3).on span{background-image: url(../images/app_step3_on.png)}
main .progress_app_set .app_tab_wrap{margin: var(--section-margin)}
main .progress_app_set .app_tab_wrap h5.app_tab_st{font-size: 1.1rem; font-weight: 800}
main .progress_app_set .app_tab_wrap table.app_tab{width:100%; margin: var(--cont-margin); border-collapse:collapse; border-top: var(--border)}
main .progress_app_set .app_tab_wrap table.app_tab tr th{background: var(--bg-gray); vertical-align: middle; font-weight: 400; font-size: 0.92rem}
main .progress_app_set .app_tab_wrap table.app_tab tr td{padding: 10px; text-align: left; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main .progress_app_set .app_tab_wrap table.app_tab ul.pay_how{display: flex; align-items: center; vertical-align: middle; gap:20px; flex-wrap: wrap}
main .progress_app_set .app_tab_wrap table.app_tab ul.pay_how li{}
main .progress_app_set .app_tab_wrap table.app_tab ul.pay_how li label{outline: none; cursor: pointer}
main .progress_app_set .app_tab_wrap table.app_tab ul.pay_how li label input[type="radio"]{width:15px; height:15px; vertical-align: middle}
main .progress_app_set .app_tab_wrap table.app_tab input[type="tel"].inp_hpp{width:150px; height:30px; background: var(--bg-gray); border-radius: var(--input-radius); padding:10px; box-sizing: border-box}
main .progress_app_set .app_tab_wrap table.app_tab .point_use{display: flex}
main .progress_app_set .app_tab_wrap table.app_tab .point_use input[type="number"].point_use_inp{width:150px; height:30px; background: var(--bg-gray); border-radius: var(--input-radius); padding: 0 15px; box-sizing: border-box}
main .progress_app_set .app_tab_wrap table.app_tab .point_use button.btn_point_use{height:30px; background: var(--itgo); border-radius: var(--input-radius); color: var(--bg-card); padding: 10px; margin:0 0 0 5px}
main .progress_app_set .app_tab_wrap table.app_tab .payw{width:150px}
main .progress_app_set .app_tab_wrap table.app_tab .final_amount{color: var(--itgo); font-weight: 800}
main .progress_app_set dl.app_tip{margin: var(--section-margin)}
main .progress_app_set dl.app_tip dt{font-weight: 700}
main .progress_app_set dl.app_tip dd{padding:0 0 0 10px; position: relative}
main .progress_app_set dl.app_tip dd::before{content: "-"; position: absolute; left:0}

main .event_set{margin:var(--section-margin)}
main .event_set h4.event_subtitle{font:var(--font-title)}
main .event_set .event_menu{display: flex; flex-wrap: wrap; margin: var(--box-margin); gap:10px}
main .event_set .event_menu button{border-radius: var(--button-radius); background: var(--bg-gray); padding: 10px 20px; cursor: pointer}
main .event_set .event_menu button:hover{background: var(--itgo); color: var(--bg-card)}
main .event_set .event_menu button.on{background: var(--itgo); color: var(--bg-card)}
main .event_set table.event_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .event_set table.event_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .event_set table.event_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .event_set table.event_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .event_set table.event_tab tbody tr:hover{background: var(--bg-blue)}
main .event_set table.event_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .event_set table.event_tab tbody td.event_st{text-align: left; padding:0 10px; box-sizing: border-box}
main .event_set table.event_tab tbody td.event_st a{width:100%; display: block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .event_set table.event_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .event_set table.event_tab tbody td.event_st{text-align: left; padding:0 10px; box-sizing: border-box}
main .event_set table.event_tab tbody td.event_st a{width:100%; display: block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .event_set table.event_tab thead th.wm60{width:60px}
main .event_set table.event_tab thead th.wm200{width:200px}

main section.lecture_stwrap{display: flex; flex-wrap: wrap}
main section.lecture_stwrap .lecture_code{width:100%; text-align: right}
main section.lecture_stwrap .lecture_code span{padding:10px 20px; background: var(--bg-gray); display:inline-block; border-radius: var(--box-radius); margin: var(--cont-margin); font-size: 0.85rem}
main section.lecture_stwrap .lecture_title_wrap{display: block}
main section.lecture_stwrap .lecture_title_wrap h2.lecture_title{font:var(--font-title); padding:6px 0 0 0}
main section.lecture_stwrap .lecture_title_wrap .lecture_tea{display: block; margin: 5px 0 0 0}
main section.lecture_stwrap .lecture_btnset{height:100%; display: flex; align-items: flex-start}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_app{background: var(--bg-gray); padding:7px 15px; border-radius: var(--button-radius); margin: 0 0 0 10px; font-size: 0.92rem}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_app:hover{background: var(--bg-darkgray)}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_doc{background: var(--bg-gray); padding:7px 15px; border-radius: var(--button-radius); margin: 0 0 0 10px; font-size: 0.92rem}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_doc:hover{background: var(--bg-darkgray)}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_app.on{background: var(--itgo); color: var(--bg-card)}
main section.lecture_stwrap .lecture_btnset button.btn_lecture_doc.on{background: var(--color-red); color: var(--bg-card)}
main table.lecture_tab{width:60%; margin: var(--box-margin); border-top: var(--border)}
main table.lecture_tab th{height:100%; text-align: center; border-bottom: var(--tab-border); background: var(--bg-gray); padding:10px; vertical-align: middle; font-size: 0.92rem; font-weight: 400}
main table.lecture_tab td{padding: 10px; text-align: left; border-bottom: var(--tab-border); font-size: 0.92rem; word-break: break-all; white-space: normal; vertical-align: middle}
main table.lecture_tab td .lecture_teaset{width:100%; display: flex; align-items: center}
main table.lecture_tab td .lecture_teaset .lecture_teaset_img{wdith:78px; height:78px}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his{padding:0 0 0 20px}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his dt{font-size: 1rem; font-weight: 800; padding:0 0 3px 0; display: flex; align-items: center}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his dt .gotea{width:14px; height:14px; background: url(../images/lecture_tea.png) 50% var(--color-red) no-repeat; overflow: hidden; text-indent: -9999px; display: block; border-radius: 50%; margin: 0 0 0 5px}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his dt .gotea a{width:100%; height:100%; display: block}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his dd{}
main table.lecture_tab td .lecture_teaset dl.lecture_teaset_his dd::before{content: "-"; padding: 0 5px 0 0}
main table.lecture_tab td button.btn_reg{background: var(--bg-gray); padding:7px 15px; border-radius: var(--button-radius); margin: 0 0 0 10px; font-size: 0.92rem}
main table.lecture_tab td button.btn_reg:hover{background: var(--bg-darkgray)}
main table.lecture_tab td button.btn_reg.on{background: var(--itgo); color: var(--bg-card)}
main table.lecture_tab td button.btn_cer{background: var(--bg-gray); padding:7px 15px; border-radius: var(--button-radius); margin: 0 0 0 10px; font-size: 0.92rem}
main table.lecture_tab td button.btn_cer:hover{background: var(--bg-darkgray)}
main table.lecture_tab td button.btn_cer.on{background: var(--color-red); color: var(--bg-card)}
main section.lecture_info{display: flex; gap: 50px}
main section.lecture_info dl.lecture_list{width:40%}
main section.lecture_info dl.lecture_list dd{padding:10px; border-bottom: var(--border)}
main section.lecture_info dl.lecture_list dd:hover{background: var(--bg-gray)}

main section.lecture_intro{margin: var(--section-margin)}
main section.lecture_intro ul li.box_intro{display: flex}
main section.lecture_intro ul li.box_intro h3{width: 140px; height: 90px; background: url(/images/classinfo_ico001.png) 50% 10px no-repeat; text-align: center; box-sizing: border-box; padding: 80px 0 0 0; font-size: 1rem}
main section.lecture_intro ul li.box_intro div{width: calc(100% - 140px); background: var(--bg-gray); padding: 20px; border-radius: var(--box-radius); display: flex; align-items: center}
main section.lecture_intro ul li.box_object{margin: var(--section-margin); display: flex}
main section.lecture_intro ul li.box_object h3{width: 140px; height: 90px; background: url(/images/classinfo_ico002.png) 50% 10px no-repeat; text-align: center; box-sizing: border-box; padding: 80px 0 0 0; font-size: 1rem}
main section.lecture_intro ul li.box_object div{width: calc(100% - 140px); background: var(--bg-gray); padding: 20px; border-radius: var(--box-radius); display: flex; align-items: center}
main section.lecture_intro ul li.box_target{
	min-height: 110px; padding: 20px 20px 20px 140px; border-radius: var(--box-radius); background: url(/images/classinfo_ico003.png) 20px 20px no-repeat var(--bg-box-yellow);
	box-sizing: border-box; margin: var(--section-margin); display: flex; align-items: center; flex-wrap: wrap; line-height: 20px}
main section.lecture_intro ul li.box_target h3{width:100%; display: block; font-size: 1rem}
main section.lecture_intro ul li.box_target div{margin: 5px 0 0 0}
main section.lecture_intro ul li.box_process{
	min-height: 110px; padding: 20px 20px 20px 140px; border-radius: var(--box-radius); background: url(/images/classinfo_ico004.png) 20px 20px no-repeat var(--bg-box-red);
	box-sizing: border-box; margin: var(--box-margin); display: flex; align-items: center; flex-wrap: wrap; line-height: 20px}
main section.lecture_intro ul li.box_process h3{width:100%; display: block; font-size: 1rem}
main section.lecture_intro ul li.box_process div{margin: 5px 0 0 0}
main section.lecture_intro ul li.box_secc{
	min-height: 110px; padding: 20px 20px 20px 140px; border-radius: var(--box-radius); background: url(/images/classinfo_ico005.png) 20px 20px no-repeat var(--bg-box-blue);
	box-sizing: border-box; margin: var(--box-margin); display: flex; align-items: center; flex-wrap: wrap; line-height: 20px}
main section.lecture_intro ul li.box_secc h3{width:100%; display: block; font-size: 1rem}
main section.lecture_intro ul li.box_secc div{margin: 5px 0 0 0}
main section.lecture_intro ul li.box_tip{padding:20px; background: var(--bg-gray); border-radius: var(--box-radius); margin: var(--box-margin)}
main section.lecture_intro ul li.box_tip dl{}
main section.lecture_intro ul li.box_tip dl dt h3{width:100%; display: block; font-size: 1rem; margin: 0 0 5px 0}
main section.lecture_intro ul li.box_tip dl dd{}
main section.lecture_intro ul li.box_tip dl dd::before{content: "-"; padding: 0 5px 0 0}

main section.lecture_app{margin: var(--section-margin)}
main section.lecture_app h3.lecture_app_title{font-size: 1rem}
main section.lecture_app .lecture_app_wrap{display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--box-gap); margin: var(--cont-margin)}
main section.lecture_app .lecture_app_class{border:solid 3px var(--itgo); border-radius: var(--box-radius); padding:20px; display: flex; justify-content: space-between; align-items: center}
main section.lecture_app .lecture_app_class .lecture_app_classl{}
main section.lecture_app .lecture_app_class .lecture_app_classl h4.app_st{background: linear-gradient(to top, color-mix(in srgb, var(--bg-box-sky) 50%, transparent) 40%, transparent 40%); display: inline; font-weight: 800}
main section.lecture_app .lecture_app_class .lecture_app_classl .price_tt{display: block; margin:20px 0 0 0}
main section.lecture_app .lecture_app_class .lecture_app_classl .price_num{display: block; font: var(--font-title); margin:5px 0 0 0}
main section.lecture_app .lecture_app_class .lecture_app_classr{}
main section.lecture_app .lecture_app_class .lecture_app_classr .lecture_app_date{display: block}
main section.lecture_app .lecture_app_class .lecture_app_classr .btn_app{display: block; background: var(--itgo); border-radius: var(--button-radius); color: var(--bg-card); padding: 10px 20px; margin: var(--cont-margin)}
main section.lecture_app .lecture_app_free{border:solid 3px var(--color-red); border-radius: var(--box-radius); padding:20px}
main section.lecture_app .lecture_app_free h4.free_st{background: linear-gradient(to top, color-mix(in srgb, var(--bg-box-red) 50%, transparent) 40%, transparent 40%); display: inline; font-weight: 800}
main section.lecture_app .lecture_app_free .free_dd{display: block; margin: var(--cont-margin)}
main section.lecture_app .lecture_app_free a.btn_free{display: inline-block; margin: var(--cont-margin); font-weight: 800}
main section.lecture_app .lecture_app_free a.btn_free::after{content: "\203A"; padding: 0 0 0 5px}

main .btn_wrap{width:100%; position: relative}
main .btn_wrap .btn_write_wrap{position: absolute; top:8px; right:0}
main .btn_wrap .btn_write_wrap a.btn_write{border-radius: var(--button-radius); border: solid 3px var(--itgo); box-sizing: border-box; padding: 7px 15px; color: var(--itgo); font-weight: 800}
main .num_set{display: flex; justify-content: center; margin: var(--section-margin); align-items: center; gap:10px}
main .num_set button.num_pre{border-radius: var(--button-radius); background: var(--itgo); padding:10px 20px; color: var(--bg-card)}
main .num_set input.num_inp{width:50px; border-radius: var(--button-radius); border: var(--border); padding:9px; text-align: center}
main .num_set button.num_next{border-radius: var(--button-radius); background: var(--itgo); padding:10px 20px; color: var(--bg-card)}
main button.btn_set{word-break:keep-all; border-radius: var(--button-radius); background: var(--itgo); padding:7px 15px; color: var(--bg-card)}
main .btn_center{width:100%; text-align: center; margin: var(--section-margin)}
main .btn_center a.btn_set{word-break:keep-all; border-radius: var(--button-radius); background: var(--itgo); padding:10px 20px; color: var(--bg-card); margin:0 3px}
main .btn_center a.btn_gray{word-break:keep-all; border-radius: var(--button-radius); background: var(--bg-gray); padding:10px 20px; margin:0 3px}

#customer_set{margin: var(--section-margin); background: var(--bg-gray)}
#customer_set .customer_wrap{max-width: 1120px; margin: 0 auto; display: flex; justify-content: space-between; padding:10px 0}
#customer_set .customer_center{display: flex; align-items: center}
#customer_set .customer_center h2.customer_center_title{font-size: 1rem}
#customer_set .customer_center .customer_center_tel{font:var(--pop-text)}
#customer_set .customer_center ul.customer_center_time{padding:0 0 0 20px}
#customer_set .bank{display: flex; align-items: center; margin:0 0 0 20px; padding:20px; background: var(--bg-card); border-radius: var(--box-radius)}
#customer_set .bank h2.bank_title{font-size: 1rem}
#customer_set .bank .bank_number{font:var(--pop-text)}
#customer_set .bank ul.bank_name{padding:0 0 0 20px}


footer{position: relative}
footer .footer_wrap{margin:50px 0}
footer ul.condition{display: flex; justify-content: center; gap:var(--box-gap)}
footer ul.condition li a{padding:10px}
footer .copyright{margin:20px 0 0 0; text-align: center}
footer .copyright span{display: block}

footer .family_site{position: absolute; right:0; top:-12px}
footer .family_site ul.family_list{position: absolute; margin-top:calc(-42px * 4 - 42px); display: none}
footer .family_site ul.family_list li{width:242px; height:42px; font-size: 0.85rem; border:var(--border)}
footer .family_site ul.family_list li:hover{border:var(--border-itgo)}
footer .family_site ul.family_list li:nth-child(1){background: url(https://itgo.co.kr/images/family_bn001.png) 120px 50% no-repeat var(--bg-card)}
footer .family_site ul.family_list li:nth-child(2){background: url(https://itgo.co.kr/images/family_bn002.png) 120px 50% no-repeat var(--bg-card)}
footer .family_site ul.family_list li:nth-child(3){background: url(https://itgo.co.kr/images/family_bn003.png) 120px 50% no-repeat var(--bg-card)}
footer .family_site ul.family_list li:nth-child(4){background: url(https://itgo.co.kr/images/family_bn005.png) 120px 50% no-repeat var(--bg-card)}
footer .family_site ul.family_list li em{width:121px; height:42px; line-height: 42px; text-align: center; display: block}
footer .family_basic{width:242px; height:42px; background: url(https://itgo.co.kr/images/footer_arrow.png) 200px 50% var(--bg-gray) no-repeat; display: block; line-height: 42px; text-align: center; cursor: pointer}


/*itgo_kr*/
main .class_present_set{margin:var(--section-margin)}
main .class_present_set h4.class_present_subtitle{font:var(--font-title)}
main .class_present_set .class_present_box{padding: 10px; background: var(--bg-gray); border-radius: var(--box-radius); margin: var(--box-margin); display: flex; align-items: center; flex-wrap: wrap}
main .class_present_set .class_present_box input.class_present_inp{width:200px; background: var(--bg-card); border-radius: var(--box-radius); padding: 7px 15px; box-sizing: border-box}
main .class_present_set .class_present_box button.btn_present_ser{background: var(--itgo); border-radius: var(--box-radius); color: var(--bg-card); padding: 7px 15px; margin: 0 0 0 5px}
main .class_present_set .class_present_box button.btn_present_list{background: url(../images/all_list.png) 10px 50% var(--bg-darkgray) no-repeat; border-radius: var(--box-radius); padding: 7px 15px 7px 30px; margin: 0 0 0 5px}
main .class_present_set .class_present_box button.btn_present_excel{background: url(../images/excel_dn.png) 10px 50%  var(--bg-darkgray) no-repeat; border-radius: var(--box-radius); padding: 7px 15px 7px 30px; margin: 0 0 0 5px}
main .class_present_set table.class_present_tab{width:100%; margin: var(--box-margin); table-layout:fixed; border-collapse:collapse}
main .class_present_set table.class_present_tab thead th{background: var(--bg-gray); height:40px; vertical-align: middle; font-size: 0.85rem; word-break: keep-all; position: relative}
main .class_present_set table.class_present_tab thead th:first-of-type{border-radius: var(--box-radius) 0 0 var(--box-radius)}
main .class_present_set table.class_present_tab thead th:last-of-type{border-radius: 0 var(--box-radius) var(--box-radius) 0}
main .class_present_set table.class_present_tab tbody tr:hover{background: var(--bg-blue)}
main .class_present_set table.class_present_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}
main .class_present_set table.class_present_tab tbody td.class_present_st{text-align: left; padding:0 10px; box-sizing: border-box}
main .class_present_set table.class_present_tab tbody td.class_present_st a{width:100%; display: block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
main .class_present_set table.class_present_tab tbody td{padding:10px 0; text-align: center; border-bottom: var(--tab-border); font-size: 0.92rem; vertical-align: middle}

main .class_present_set table.class_present_tab thead th.wm60{width:60px}
main .class_present_set table.class_present_tab thead th.wm100{width:100px}
main .class_present_set table.class_present_tab thead th.wm130{width:130px}






