.@charset "utf-8";

.content_tit{font-size: 3.5rem;color: #000;}

.radi_box input[type="radio"] + label:before{left: 0;background: #fff;border-color: #bbb;position: absolute;}
.radi_box input[type="radio"]:checked + label:before {left: 0px;}

.top_line {border-top: 2px solid #000;width: 100%;margin-bottom: 30px;}
.top_line2 {border-top: 1px solid #000;width: 100%;margin-bottom: 30px;}

.sub_title{color:#fff;position:relative;background: url('../images/sub/sub_title_bg.png?v2') no-repeat 50%;background-size: cover;padding: 100px 0 50px;display: flex;flex-direction: column;justify-content: center;align-items: center;height: 270px;margin-bottom: 60px;}
.sub_title h2{font-size: 6rem;margin-bottom: 30px;color: #000;text-align: center;font-family: 'SBAggro';line-height: 1.2;word-break: keep-all;}
.sub_title span{font-size: 1.6rem;font-weight: 400;opacity: 0.6;font-family: 'pretendard';color: #000;}
.sub_title span i{margin:0 5px;}


#sub1 .sub_title::before{content:'';background: url('../images/sub/sub01_deco_1.png') no-repeat right;width: 211px;height: 311px;position: absolute;left: 0;top: 0;z-index: -1;}
#sub1 .sub_title::after{content:'';background:url('../images/sub/sub01_deco_2.png') no-repeat;width: 150px;height: 396px;position: absolute;right: 0;top: 0;z-index: -1;}

#sub1 .program_btn{display:flex;flex-direction: column;align-items: center;width: 100%;}

#sub1 .link_ul{border:1px solid #bbbb;border-radius:100px;display: flex;flex-wrap: wrap;background: #fff;width: 100%;}
#sub1 .link_ul a{width:237px;height:60px;font-size:2rem;display:flex;float:left;align-items: center;justify-content: center;font-weight: 600;border-radius: 100px;transition: all 0.3s ease;background: #fff;flex: 1;}
#sub1 .link_ul a:hover{background: #f7f7f7;}
#sub1 .link_ul a.on{background:#FF9823;border:1px solid #FF9823;color: #fff;}

#sub1 .button_ul{margin-top:30px;}
#sub1 .button_ul button{padding:10px 20px;border:1px solid #bbb;border-radius:5px;color:#707070;font-size: 1.6rem;transition: all 0.3s ease;}
#sub1 .button_ul button:hover{background: #fffaf5;border: 1px solid #ff9823;color: #ff9823;}
#sub1 .button_ul button ~ button{margin-left:20px;}
#sub1 .button_ul button.on{border: 2px solid #FF9823;color:#FF9823;background:#FFFAF5;/* box-shadow: 3px 3px 0px rgb(0 0 0 / 10%); */}

#sub1 .radi_box{float:right;margin-bottom: 20px;}
.radi_box input[type="radio"] + label{padding: 2px 10px 2px 23px;height: 23px;}

#sub1 ul[data-role=displaybar]{margin-bottom: 50px;font-size: 0;text-align: right;}
#sub1 ul[data-role=displaybar] > li{display:inline-block;}
#sub1 ul[data-role=displaybar] > li > button{width: 35px;height: 35px;background-color: #e9e9e9;padding: 8px;border-radius: 4px;}
#sub1 ul[data-role=displaybar] > li > button img{width: 100%;}
#sub1 ul[data-role=displaybar] > li + li{margin-left: 5px;}
#sub1 ul[data-role=displaybar] > li > button.selected{background-color: #ed4570;}


.list_form a{width:100%;margin-bottom: 50px;}
.list_form .img_box{width: 340px;height: 240px;border: 1px solid #ddd;overflow: hidden;border-radius: 10px;float: left;margin-right: 20px;}
.list_form .img_box img{width:100%;height:100%;transition:all 0.3s ease;}
.list_form a:hover .img_box img{scale: 1.07;}
.list_form .tag{background:#3A3D78;color:#fff;width:97px;height:50px;border-radius:0 0 15px 0;display: flex;justify-content: center;align-items: center;font-size: 2rem;z-index: 10;}
.list_form .tag.off{background:#8F8F8F;}
.list_form .s_title{color:#3A3D78;font-size: 1.6rem;font-weight: 700;background: #fff;padding: 6px 10px;border-radius: 5px;border: 1px solid #3a3d78;}
.list_form .title{font-size: 2.8rem;color:#000;font-weight: 600;line-height: 1.3;margin: 10px 0 20px;}

.list_form .search_no{display: flex;flex-direction: column;justify-content: center;align-items: center;}
.list_form .search_no{font-size:2.6rem;color:#666666;padding: 60px 0;text-align: center;word-break: keep-all;cursor: auto;}
.list_form .search_no img{max-width:100%;}
.list_form .search_no > span{font-size: 5rem;margin-bottom: 10px;color: #000;font-family: 'SBAggro';font-weight: 300;}
.list_form .search_no b{font-weight: 400;display: inline-block;word-break: keep-all;color: #ed4570;}
.list_form .search_no span span{font-weight: 300;}

.list_form .txt_box{padding: 0 35px;background: #F8F8F8;min-height: 246px;width: calc(100% - 360px);float: left;border-radius: 10px;display: flex;flex-wrap: wrap;align-items: center;align-content: center;}
.list_form .txt_box .title{width:100%;transition: all 0.3s ease;}
.list_form .txt_box i{margin:0 5px;display:inline-block;}
.list_form .txt_box b{color:#000;width: auto;}
.list_form .txt_box li{display: flex;align-items: center;word-break: break-all;width: 100%;}
.list_form .txt_box li ~ li{margin-top:10px;}
.list_form .count span b{color: var(--sub1-color);}
.list_form .count span img{width: 13px;margin-right: 3px;}

#sub1 .list_view {margin-top: 100px;}
.list_view .img_box{width:580px;height:410px;border-radius:10px;overflow:hidden;margin-right:40px;float:left;background: #f5f5f5;border: 1px solid #ddd;}
.list_view .img_box strong{width:100%;height:100%;display: block;background-position: 50%;}

.list_view .txt_box{width: calc(100% - 650px);float: left;}
.list_view .txt_box .s_title{color:#3A3D78;font-size: 1.6rem;font-weight: 700;background: #fff;padding: 5px 10px;border-radius: 5px;border: 1px solid #3a3d78;margin-right: 5px;}
.list_view .txt_box .s_title2{color:var(--sub1-color);font-size: 1.6rem;font-weight: 700;background: #fff;padding: 5px 10px;border-radius: 5px;border: 1px solid var(--sub1-color);}
.list_view .txt_box .title{font-size: 2.8rem;font-weight: 600;width: 100%;margin: 10px 0 15px;min-height: 61px;}

.pro_appli{margin-top:25px;font-size: 1.8rem;position: relative;}

/* pop-up text */

.no.pro_appli span {color:#666;position:absolute;bottom:0;word-break: keep-all;display: inline-block;left:-25px;right:-25px;padding:5px 7px;z-index: 1;font-size:14px;border-radius: 4px;background:#fff;border: 1px solid #ddd;visibility:hidden;opacity:0;-o-transition:all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);-webkit-transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);-moz-transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);}

/* pop-up text arrow */

.no.pro_appli span:before {/* content:''; */width: 0;height: 0;border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 5px solid #fff;position:absolute;bottom:-5px;left:40px;}

/* text pops up when icon is in hover state */

.no.pro_appli:hover span {bottom: 61px;visibility:visible;opacity:1;}


.list_cont{margin-top:50px;}
.list_cont .txt_box{background:#F8F8F8;border-radius:10px;padding: 20px !important;line-height: 1.4;}
.list_cont .txt_box *{padding:0 !important;margin:0 !important;text-indent: 0 !important;font-family: 'Pretendard' !important;line-height: 1.8 !important;}
#sub1 .back_link{margin-top:20px;float:right;height: 50px;/* line-height: 38px; */}

.srch_box{}
.srch_box .sub_input {width: 100%;border-radius: 10px;background: #F8F8F8;padding: 25px 30px;margin: 40px 0;display: flex;justify-content: center;flex-wrap: wrap;}
.srch_box .sub_input .input_src_box{width: auto;float: left;}
.srch_box .sub_input select {width: 140px;height: 55px;font-family: 'Pretendard';border: 1px solid #BBBBBB;border-radius: 5px;color: #000;margin-right: 10px;}
.srch_box .sub_input input {min-width: 430px;border: 1px solid #bbb;border-radius: 5px;height: 55px;font-family: 'Pretendard';font-size: 1.6rem;text-indent: 10px;}
.detail_src li > div{display: flex;align-items: center;flex-wrap: wrap;gap: 5px;}
.key_scroll .chk_box {height: 70px;overflow-y: auto;}
.srch_box .sub_input .search_btn {width: 100px;height: 55px;font-size: 1.6rem;position: static;background: var(--main-color);color: #fff;transition: all 0.26s ease;border-radius: 5px;/* float: right; */margin-left: 12px;}
.srch_box .sub_input .search_btn span {margin-right: 5px;}
.srch_box .sub_input .search_btn:hover {box-shadow: 0 3px 10px rgb(0 11 48 / 31%);}


.ability_con {width: 100%;margin-top: 30px;}
.ability_con li{margin-bottom: 30px;width: 100%;display: flex;align-items: center;}
.ability_con li:nth-child(2n+1){float:left;}
.ability_con li:nth-child(2n){float:right;}
.ability_con .left{margin-right: 174px;}
.ability_con .squre{background: #f9f9ff;border-radius: 140px;height: auto;width: calc(100% - 334px);display: flex;text-align: center;justify-content: center;flex-direction: column;position: relative;padding: 40px 40px;}

.ability_con .right.squre::before{content:'';display:block;width: 130px;height: 0px;border: 2px dashed #ddd;position: absolute;right: calc(100% + 39px);}
.ability_con .left.squre::before{content:'';display:block;width: 151px;height: 0px;border: 2px dashed #ddd;position: absolute;left: calc(100% + 38px);}

.ability_con .right.squre01::before{content:'';display:block;width: 130px;height: 0px;border: 2px dashed #ddd;position: absolute;right: calc(100% + 39px);}
.ability_con .right.squre02::before{content:'';display:block;width: 93px;height: 0px;border: 2px dashed #ddd;position: absolute;right: calc(100% + 41px);}
/* .ability_con .right.squre01::after{content:'';display:block;width: 0px;height: 181px;border: 2px dashed #ddd;position: absolute;top: calc(50% - -4px);right: calc(100% + 130px);} */

.ability_con .left.squre01::before{content:'';display:block;width: 151px;height: 0px;border: 2px dashed #ddd;position: absolute;left: calc(100% + 38px);}
.ability_con .left.squre02::before{content:'';display:block;width: 95px;height: 0px;border: 2px dashed #ddd;position: absolute;left: calc(100% + 39px);}
/* .ability_con .left.squre01::after{content:'';display:block;width: 0px;height: 181px;border: 2px dashed #ddd;position: absolute;top: calc(50% - -4px);left: calc(100% + 130px);} */

.ability_con2 .squre{height:auto;padding: 30px 0;}
.ability_con .round.one::before{display:none;}
.ability_con .round::before{top: 241px;}
.ability_con .round::after{content:'';width: 25px;height: 25px;background: url('../images/sub/ability_dot.png?v2') no-repeat;position: absolute;left: -170px;top: 50%;transform: translate(0px, -50%);}
.ability_con .left.round::after{right: -170px;left: initial;}
.ability_con .left.round::before{right: -170px;left: initial;}
.ability_con span{word-break: keep-all;font-size: 1.8rem;}
.ability_con  b{font-size: 2.4rem;width: 100%;display: inline-block;margin-bottom: 10px;text-align: center;word-break: keep-all;}
.ability_con .round{width: 160px;height: 160px;border-radius:50%;border: 12px solid #ddd;display:flex;justify-content: center;align-items: center;font-size: 2.3rem;flex-direction: column;position: relative;background: #fff;}
.ability_con .con::before{content:'';display: block;width: 55px;height: 60px;background-image: url('../images/sub/ability_con.png?v2');background-repeat: no-repeat;background-size: cover;}

/* .ability_con li:nth-child(1) .round{border-color: #15b48e;color: #15b48e;} */
.ability_con li:nth-child(3) .round{border-color: #80b95d;color: #80b95d;}
.ability_con li:nth-child(2) .round{border-color: #3363b7;color: #3363b7;}
/* .ability_con li:nth-child(4) .round{border-color: #723ea7;color: #723ea7;} */
.ability_con li:nth-child(1) .round{border-color: #3c3f79;color: #3c3f79;}

/* .ability_con li:nth-child(1) .con::before{background-position: 0 13px;} */
.ability_con li:nth-child(3) .con::before{background-position: 0 -135px;}
.ability_con li:nth-child(2) .con::before{background-position: 0 -272px;}
/* .ability_con li:nth-child(4) .con::before{background-position: 0 -424px;} */
.ability_con li:nth-child(1) .con::before{background-position: 0 -572px;}
/* .ability_con li:nth-child(6) .con::before{background-position: 0 -722px;} */

.ability_con2 li{max-width: none;display: flex;align-items: center;}
.ability_con.ability_con2 li .con::before{background-position: 0 -727px;}
.ability_con.ability_con2 li .round{border-color: #cf4a64;color: #cf4a64;}
.default_page{}

#sub2 .sub_title::before{content:'';background: url('../images/sub/sub02_deco_1.png') no-repeat left bottom;width: 181px;height: 311px;position: absolute;background-size: cover;right: 0;top: 20px;z-index: -1;}
#sub2 .sub_title::after{content:'';background: url('../images/sub/sub01_deco_2.png') no-repeat bottom right;width: 180px;height: 312px;position: absolute;left: 0;top: -70px;z-index: -1;background-size: cover;}

.bbs_list{width:100%;margin:0;border-top: 2px solid var(--sub2-color);background: #fff;float: left;}
.bbs_list .no_list{width:100%;text-align:center;padding:60px 0;}
.bbs_list .no_list::before{content:'!';display:block;font-size:3rem;width: 50px;height: 50px;border: 5px solid #d3d4ed;text-align: center;color: #9295d5;box-sizing: content-box;border-radius: 50%;line-height: 50px;margin: 0 auto 20px;}
.bbs_list a:not(.info), .bbs_list .link{padding: 20px 0px;border-bottom: 1px solid #d6d6d6;width:100%;display: flex;align-items: center;flex-wrap: wrap;transition: all 0.3s ease;position:relative;}
.bbs_list .btn_li .info{width: calc(100% - 340px);}
.bbs_list .btn_box{
    display: flex;
    justify-content: flex-end;
    width: 280px;
}
.bbs_list a.btn_li{cursor: context-menu;}
.bbs_list a.btn_li:hover .title{color:#000;}
.bbs_list .btn_li button{width: 130px;padding: 12px 8px;font-size: 15px;border-radius: 5px;word-break: keep-all;}
.bbs_list .btn_li .btn{background: #f5f5f5;border: 1px solid #a3a3a3;line-height: 29px;height: auto;padding: 1px 0;width: 74px;height: 29px;padding: 0;text-align: center;border-radius: 0;font-weight: 400;font-size: 15px;}
.bbs_list a:hover .title{color:var(--sub2-color);}
.bbs_list .btn_st1:hover{box-shadow: 0 3px 5px rgb(0 11 48 / 16%);}
.bbs_list .num{width: 60px;font-size:2rem;text-align: center;float:left;}
.bbs_list .info{width: calc(100% - 80px);color: #888888;padding-left: 10px;}
.bbs_list .title{font-size: 2.1rem;width:100%;display:inline-block;color:#000;}
.bbs_list .title .new{font-size:14px;background: #ffefea;font-weight: 400;padding: 4px 7px;border-radius: 3px;color: #e12a00;}
.bbs_list .noti_tag{background: #f53f61;color: #fff;padding:3px 10px;margin-right:10px;}
.bbs_list .qa_tag{position:absolute;top: 50%;transform: translate(0px, -50%);right:10px;background: #f7f7f7;color: #666666;padding:3px 10px;border: 1px solid #858585;}
.bbs_list .qa_tag.on{background: #fff6ec;color: #f17e06;padding:3px 10px;border: 1px solid #ff9823;}

@media screen and (max-width: 767px){

	.bbs_list .qa_tag{position:static;margin-left: auto;margin-top: 3px;transform: none;}
}

.bbs_form_view .view_top {width: 100%;padding: 30px 0px;border-top: 2px solid var(--sub2-color);border-bottom: 1px solid #d7d7d7;display: flex;align-items: center;position: relative;flex-wrap: wrap;justify-content: center;}
.bbs_form_view .txt_box{min-height: 300px;padding:30px;}
.bbs_form_view .view_top .other_info {width: auto;margin-top: 10px;color: #888;}
.bbs_form_view .view_top .title {width: 100%;color: #000;font-size: 4.5rem;text-align: center;}
.other_info span {margin-right:15px;}
.other_info span::before {content: '';display: inline-block;position: absolute;top: 4px;right: -11px;width: 1px;height: 14px;background: #ccc;}
.other_info span:last-child::before {display: none;}

.bbs_form_view .attach{border:1px solid #ddd;margin-top:50px;border-radius:10px;}
.bbs_form_view .attach .attach-tit{border-right:1px solid #ddd;display:inline-block;padding:30px 20px;}
.bbs_form_view .attach .attach-con{display:inline-block;padding-left:10px;}
.bbs_form_view .attach .attach-con img{width:18px;margin-right:10px;}

.bbs_bottom{float:right;margin-top: 20px;}
.bbs_bottom a{width: 130px;text-align:center;}
.bbs_bottom a ~ a{margin-left:10px;}

.file_load {width: 100%;border: 2px solid #d7d7d7;border-radius: 10px;/* max-width: 450px; */display: flex;align-items: center;margin: 10px auto;transition: all 0.3s ease;}
.file_load:hover{border-color: var(--main-color);}
.file_load .left{border-right:1px solid #ddd;padding: 20px;}
.file_load .left img {width: 30px;}
.file_load .right{width:calc(100% - 40px);padding: 20px;text-align: left;color: #888;}
.file_load .right b {width: 100%;display: inline-block;font-size: 2rem;text-align: left;color: var(--main-color);}

.view_controll {width: 100%;background: #ffffff;box-sizing: content-box;margin-top: 30px;float: left;}
.view_controll > a:not(.btn_st2){width: calc(50% - 10px);transition: all 0.3s ease;display: flex;align-items: center;background: var(--sub3-color);height: 60px;border-radius: 100px;padding: 0 20px;}
.view_controll > .prev img{float:left;}
.view_controll > .next img{float:right;}
.view_controll > .prev{float:left;}
.view_controll > .next{float:right;}
.view_controll > a.btn_st2{width: 130px;text-align: center;margin: 0 30px;border-radius: 100px;height: 60px;line-height: 33px;font-size: 2rem;}
.view_controll span{height:100px;width:100px;display: flex;align-items: center;justify-content: center;background: #e5e5e5;color: #000;transition: all 0.3s ease;}
.view_controll .prev span{float:left;}
.view_controll .next span{float:right;}
.view_controll p{width: 100%;padding: 0 20px;font-size: 2rem;color: var(--main-color);}
.view_controll .prev p{float:left;text-align: left;}
.view_controll .next p{float: right;text-align: right;}

.view_controll a:hover span{background: #333;color: #fff;}
.view_controll a:hover p{text-decoration:underline;}


.member_wrap {/* background: #eef1f6; */}
.loginWrap .txt_box{font-size:1.4rem;background: #f9faff;padding: 10px;border-radius: 5px;}
.loginBox {width: 500px;margin: 0 auto;}
.login .login_logo {font-size: 5rem;color: #000;text-align: center;display: block;font-family: 'SBAggro';font-weight: 400;margin-bottom: 10px;}
.login .login_subtit {text-align: center;color: #686868;line-height: 1.3;word-break: keep-all;font-size: 1.8rem;margin-bottom: 25px;}
.login .login_subtit span{font-weight: 500;color:#000;}

.login input[type="text"], .login input[type="password"] {height: 60px;width: 100%;font-size: 1.8rem;position: relative;box-sizing: border-box;font-family: 'Pretendard';border-radius: 5px;}
.login #user_pw {padding-right: 50px;background: #fff url('../../images/web/common/eye-blocked.svg') 98% 50% no-repeat;background-size: 32px;}
.login button {width: 100%;}
.loginLink {text-align: right;margin-top: 15px;}
.loginLink > a {margin-left: 1em;text-decoration: underline;color: #000;}
.loginLink > a:hover {font-weight: 500;}

.loginBox .btn_st3 {height: 55px;border-radius: 5px;font-size: 1.8rem;font-weight: 600;transition: all 0.3s ease;}

@media screen and (max-width: 1100px) {
}
@media screen and (max-width: 900px) {
.loginBox {width: 100%;}
}

@media screen and (max-width: 550px) {
.login_subtit br{display:none;}
}


#ready {height: calc(100vh - 200px - 143px - 130px);display: flex;align-items: center;margin-top: 100px;}
#ready .txt_box {width: 100%;text-align: center;}
#ready h2 {width: 100%;font-weight: 200;font-size: 5rem;margin-bottom: 0;}
#ready h2 span {color: #ed4570;}
#ready .txt_box > span {font-size: 2.5rem;color: #666;}
#ready img {margin: 0px auto 40px;display: block;max-width: 100%;}



#mypage{background: #fdfdff;}
#mypage h2{width: 100%;word-break: keep-all;}
#mypage .list{padding: 10px 10px;display: flex;justify-content: space-between;width: 100%;position: relative;flex-wrap: wrap;}
#mypage .list .tab_content04 {height: calc(100% - 60px);}

#mypage .bot-area h2{width:calc(100% - 110px);height: 66px;}
#mypage .box{background-color: #fff;box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 5%);padding: 30px 40px;border-radius: 15px;height: auto;border: 1px solid #d6d7e9;position: relative;margin-bottom: 20px;}
#mypage .more{right: 40px;top: 30px;border: 1px solid #3a3d78;border-radius: 10px;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;transition: all 0.3s ease;}
#mypage .more:hover{background: #f4f5ff;}
#mypage .more_sm{margin-left:5px;border: 1px solid #3a3d78;border-radius: 5px;width: 20px;height: 20px;display: inline-flex;align-items: center;justify-content: center;transition: all 0.3s ease;}
#mypage .more_sm:hover{background: #f4f5ff;}
#mypage .more_sm img{width:10px;}
#mypage .print{right: 88px;top: 30px;transition: all 0.3s ease;border-radius: 10px;}
#mypage .print:hover{box-shadow: 0 3px 5px rgb(0 0 0 / 29%);}
.chart_box{}
.chart_box .sample{background: #f2f2f2;border-radius: 10px;padding: 30px;text-align: center;color: #888;width: 100%;height: 100%;}
.chart_box01{
    min-height: 360px;
    height: 100%;
}
.chart_box02{height: 380px;}

#mypage .table_st2 td{text-align:center;vertical-align: middle;}
#mypage .table_st2{height: calc(100% - 50px);}
#mypage .table_st2 .btn_st2,
#mypage .table_st2 .btn_st4{padding:3px 10px;width: 80px;}
#mypage .table_st2 th{vertical-align: middle;}

/* top-area */
.top-area{padding: 55px 10px 15px 10px;}
.top-area table{height: 360px !important;}

/* first */
#mypage .top-area .txt-group{width:100%;}
#mypage .top-area .first{width: 20%;text-align: center;float: left;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;align-content: center;height: 488px;}
.top-area .first > .relative{width:100px;margin: 0 auto;}
.top-area .first .img_box{border-radius:50%;overflow:hidden;width: 100px;height: 100px;margin: 0 auto;}
.top-area .first .img_box img{width:100%;display:block;}
.top-area .first .prf_setting{position: absolute;right: 0;bottom: 0;transition: all 0.3s ease;}
.top-area .first .prf_setting:hover{transform: rotate(45deg);}
.top-area .first .btn_st2{margin-top:20px;width: 280px;height: 50px;border-radius: 5px;transition: all 0.3s ease;font-size: 1.8rem;}
.top-area .first h3{font-size: 3rem;margin: 20px 0 10px;}
.top-area .first span{display: inline-block;font-size: 1.8rem;font-weight: 400;width: 100%;margin-bottom: 3px;}
.top-area .first .btn-wrap{margin-top: 20px;width: 100%;}
.top-area .first .btn-wrap span{background-color: #F1F1F1;border-radius: 10px;color: #AAAAAA;margin-bottom: 10px;padding: 13px 0px;text-align: center;width: 100%;cursor:pointer;transition: all 0.3s ease;}
.top-area .first .btn-wrap span:hover{box-shadow: 0px 3px 10px rgb(0 0 0 / 8%);}
.top-area .first .btn-wrap span:nth-child(2){background-color: #E5E5E5;color: #545454;}

.mile_table td{font-size: 1.8rem;padding: 10px 0;color: #000;font-weight: 500;}
.mile_table tr:nth-child(1){border-top:2px solid #000;}
.mile_table td:nth-child(2){color: #686868;text-align: right;}
.mile_table td .progress{max-width: 100%;}
.mile_table td .progress i{visibility: hidden;}

/* second */
.top-area .second{width: 79%;}
.top-area .second .left{width: calc(100% - 350px);}
.top-area .second .right{
    width: 340px;
}

/* mid-area */
/* first */
.mid-area .first{width: 27%;}
.mid-area .first table td{font-size: 18px;padding-bottom: 30px;}
.mid-area .first table td:nth-child(2){color: #686868;text-align: right;}
.mid-area .first table td .progress{margin-left: 20px;}
.mid-area .first table td .progress i{visibility: hidden;}


/* second */
.mid-area .second{width: 30%;padding-bottom: 50px !important;}
#mypage .table_st1 td{font-weight: 500;color: #000;text-align: center;padding: 10px 5px;vertical-align: middle;font-size: 1.6rem;word-break: keep-all;}
#mypage .mid-area .table_st1 {eight: 490px;}
#mypage .table_st1 td:nth-child(2){color: #686868;text-align: center;text-align: right;}
#mypage .table_st1 td:nth-child(3){text-align: right;}
#mypage .table_st1 td a{padding: 5px 10px;border-radius: 5px;}
#mypage .table_st1 td a:hover{}
#mypage .table_st1 td a.test{}
#mypage .table_st1 td a.result{}
/* third */
.mid-area .third{width: 69%;padding-bottom: 50px !important;}
.mid-area .third table{}
.mid-area .third .left{width: calc(100% - 380px);height: calc(100% - 50px);}
.mid-area .third .right{width: 370px;}

#mypage .mid-area2 table{height: 100%;}
.mid-area2 .box {width: 49.5%;height: auto !important;}
.mid-area2 {}
#mypage .mid-area2 h2{width:auto;}
#myp_tab01 label, #myp_tab02 label
{font-size: 1.8rem;width: 45px;border-radius: 5px;height: 45px;display: inline-block;font-weight: 500;transition: all 0.3s ease;}

#mypage .table_btn::before{content:'';width: 22px;height: 22px;display:block;background: url('../images/sub/mypage_con.png') no-repeat;margin: 0 auto;background-position: 4px 1px;position: relative;z-index: 1;top: 13px;right: 0;}
#mypage .on .table_btn::before{background-position: -33px 1px;}
#mypage .grap_btn::before{content:'';width: 22px;height: 22px;display:block;background: url('../images/sub/mypage_con.png') no-repeat;margin: 0 auto;right: -2px;top: 13px;background-position: -68px 0px;z-index: 1;position: relative;}
#mypage .on .grap_btn::before{background-position: -103px 0px;}
#myp_tab01 li,
#myp_tab02 li{float: left;}
#myp_tab01,
#myp_tab02{float: right;border: 1px solid #EFF0F3;border-radius: 5px;}
#myp_tab01,
#myp_tab02{height:45px;width: 90px;float: right;margin-bottom: 10px;}
#myp_tab01 li:not(.on) button:hover,
#myp_tab02 li:not(.on) button:hover{}

#mypage .mid-area2 td{font-size:1.6rem;}

#mypage .btn {position: relative;transition: background 600ms ease, color 600ms ease;padding: 0;margin: 0;}
#mypage input[type=radio].toggle-2,
#mypage input[type=radio].toggle {display: none;}
#mypage input[type=radio].toggle-2 + label,
#mypage input[type=radio].toggle + label{cursor: pointer;}
#mypage input[type=radio].toggle-2 + label:hover,
#mypage input[type=radio].toggle + label:hover{background: none;color: #1a1a1a;}
#mypage input[type=radio].toggle-2 + label:after,
#mypage input[type=radio].toggle + label:after{background: var(--main-color);content: "";height: 45px;position: absolute;top: 0;transition: left 200ms cubic-bezier(0.77, 0, 0.175, 1);width: 45px;z-index: 0;border-radius: 5px;box-shadow: 0 3px 10px #3a3d7836;}

#mypage input[type=radio].toggle-2.toggle-left-2 + label,
#mypage input[type=radio].toggle.toggle-left + label{border-right: 0;}

#mypage input[type=radio].toggle-2.toggle-left-2 + label:after,
#mypage input[type=radio].toggle.toggle-left + label:after{left: 100%;}

#mypage input[type=radio].toggle-2.toggle-right-2 + label,
#mypage input[type=radio].toggle.toggle-right + label{margin-left: -2px;width: 45px;height: 45px;}

#mypage input[type=radio].toggle-2.toggle-right-2 + label:after,
#mypage input[type=radio].toggle.toggle-right + label:after{left: -100%;}

#mypage input[type=radio].toggle-2:checked + label,
#mypage input[type=radio].toggle:checked + label{cursor: default;color: #fff;transition: color 200ms;}

#mypage input[type=radio].toggle-2:checked + label:after,
#mypage input[type=radio].toggle:checked + label:after{left: 0;}

ul.table_st3 a{height:60px;background: #f6f6f6;padding:15px 10px;font-size:1.8rem;font-weight:500;display: flex;flex-wrap: wrap;align-items: center;align-content: center;justify-content: space-between;margin-bottom: 10px;transition: all 0.3s ease;border-radius: 5px;border: 1px solid #f6f6f6;}
ul.table_st3 a:hover{background:#fff;border: 1px solid #ededed;}
ul.table_st3 a:hover button{background:#f9faff}
ul.table_st3 li.no_list{background: #fff;border: 1px dashed #ddd;border-radius: 5px;padding: 20px;margin-bottom: 15px;}
ul.table_st3 li .ellipsis{width: calc(100% - 292px);text-indent: 5px;}
ul.table_st3 li .ellipsis.w_auto{width: calc(100% - 138px);}
ul.table_st3 li div{display:inline-block;}
ul.table_st3 button{height: 100%;display: flex;align-items: center;font-size: 1.6rem;background: #fff;}
ul.table_st3 li div:nth-child(1){width: 130px;text-align: center;}
/* bot-area */
/* first */
.bot-area .box{width: 49.5%;}
.bot-area .tb_box{overflow-y: scroll;height: 370px;padding: 0 10px 0px 0px;}

/* second */
.bot-area .second{width: 49.5%;}
.bot-area .second .counsel{display: flex;justify-content: space-between;}
.bot-area .second .counsel-wrap{background-color: #FFCC00;width: 33%;border-radius: 10px;padding: 35px 45px;box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);}
.bot-area .second .counsel-wrap h3{color: #fff;font-size: 25px;margin-bottom: 40px;display: inline-block;vertical-align: top;}
.bot-area .second .counsel-wrap img{display: inline-block;margin-top: 5px;margin-left: 5px;}
.bot-area .second .counsel-wrap .counsel-list{background-color: #fff;border-radius: 10px;margin-bottom: 10px;padding: 15px 20px;display: flex;justify-content: space-between;cursor:pointer;}
.bot-area .second .counsel-wrap .counsel-list:hover{background-color: #EBEBEB;}
.bot-area .second .counsel-wrap .counsel-list span{font-size: 20px;}

#mypage .legend{width: 130px;position: absolute;bottom: 20px;}
#mypage .mid-area .third .legend{bottom: -30px;}
#mypage .legend li{display:flex;width: 50%;float: left;align-items: center;}
#mypage .legend li::before {content: '';display: block;width: 20px;height: 11px;background: #ddd;border-radius: 50px;float: left;margin-right: 5px;}
#mypage .legend li:nth-child(1)::before{background: var(--prgress-color-01);}
#mypage .legend li:nth-child(2)::before{background: var(--prgress-color-02);}

.progress02 .bar {width: 100%;height: 24px;top: 0;border-radius: 50px;position: relative;}
.progress02 .bar_bg{background: #ececec;}
.progress02 .bar > .absolute{max-width: 100%;/* width:100%; */height:100%;left: 0;transition: all 0.3s ease;/* border-radius: 30px; */}
.progress02 .bar_01{background: var(--prgress-color-01);border: 2px solid var(--prgress-color-01);}
.progress02 .bar_02{background: var(--prgress-color-02);border: 2px solid var(--prgress-color-02);}
.progress02 .tag{/* opacity:0; */}
.progress02 .absolute:hover .tag{opacity:1;transition:all 0.3s ease;}
.progress02 .bar .absolute:hover b{}
.progress02 .bar_01 b{top: -33px;right: -20px;height: 26px;text-align: center;width: 42px;line-height: 26px;font-weight: 500;background: rgb(58 61 120 / 75%);border: 1px solid var(--prgress-color-01);color: #fff;border-radius: 4px;padding: 0 10px;font-size: 1.4rem;}
.progress02 .bar_01 b::after{border-top: 5px solid #3a3d78;border-left: 5px solid transparent;border-right: 5px solid transparent;border-bottom: 0px solid transparent;content: "";position: absolute;top: 24px;left: 16px;}
.progress02 .bar_02 b{bottom: -33px;right: 0;font-weight: 500;height: 26px;line-height: 26px;background: rgb(255 117 153 / 62%);border: 1px solid var(--prgress-color-02);color: #fff;border-radius: 6px;padding: 0 10px;font-size: 1.4rem;}
.progress02 .bar_02 b::after{border-bottom: 5px solid #ff7599;border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 0px solid transparent;content: "";position: absolute;top: -5px;left: 13px;}
.progress02 .bar_bg b{left: 10px;z-index:10;color:#fff;top: -2px;font-weight: 400;}
.progress02 .bar_02:hover {box-shadow: 0 0px 10px rgb(204 0 35 / 28%);border: 2px solid #fff;z-index: 10 !important;}
.progress02 .bar_01:hover {box-shadow: 0 0px 10px rgb(29 64 137 / 40%);border: 2px solid #fff;z-index: 10 !important;}
.progress02 .test_no{background: #ececec;width: 100%;/* border-radius: 50px; */height: 24px;line-height: 24px;color: #888;text-align: center;}


.test_form{float: left;width: 100%;}
.test_form.list_form .txt_box{background:#fff;width: 100%;border-top: 2px solid #000;border-radius: 0;/* border-bottom: 1px solid #d2d2d2; */transition: all 0.3s ease;padding: 0 10px;}
.test_form.list_form .txt_box:hover .title{text-indent: 5px;transition: all 0.3s ease;}
.test_form.list_form .txt_box:hover .s_title{text-indent:0;}
.test_form.list_form a{margin-bottom: 0;}
.test_form.list_form .s_title{float:left;margin-right: 10px;border-color: var(--prgress-color-02);color: var(--sub1-color);text-indent:0 !important;}
.test_form.list_form .title{}
.test_form.list_form .txt_box li{width: 50%;float: left;padding: 10px 0;}
.test_form.list_form .txt_box li ~ li{margin-top:0;}
.test_form.list_form .text_info{width:100%;background: #f8f8f8;border-radius: 10px;padding: 15px 25px;}
.test_form.list_form button.btn_st1{min-width:180px;}
.test_form.list_form a:hover .btn_st1 {box-shadow: 0 3px 10px rgb(0 11 48 / 31%);}

.popup_wrap .learn_popup .table_contents {position: absolute;right: -290px;top: 0;width: 290px;height: 100%;background: #fff;transition: right 0.3s;}
.popup_wrap .learn_popup .table_contents .view {position: absolute;left: -45px;top: 130px;width: 45px;height: 105px;font-size: 2rem;line-height: 24px;color: #fff;background: #ff6009;border-radius: 10px 0 0 10px;}
.popup_wrap .learn_popup .table_contents .view i {display: block;width: 17px;height: 12px;margin: 0 auto 10px;background: url(../imgs/myclass/icon_popup_table_cont.png) no-repeat left top;}
.popup_wrap .learn_popup .table_contents.active {right: 0;}
.popup_wrap .learn_popup .table_contents.active .view i {width: 14px;height: 14px;background-image: url(../imgs/myclass/icon_popup_table_cont_on.png);}

.popup_wrap .exam_popup {padding: 0 30px;}
.popup_wrap .exam_popup .title_box {display: flex;padding: 30px 0 13px;justify-content: space-between;border-bottom: 2px solid #222;}
.popup_wrap .exam_popup .title_box h1 { font-size: 2.6rem;color: #222;}
.popup_wrap .exam_popup .title_box .time {overflow: hidden;padding: 2px 20px;font-size: 1.6rem;line-height: 34px;color: #fff;background: var(--prgress-color-02);border-radius: 5px;}
.popup_wrap .exam_popup .title_box .time strong {margin: 0 1px 0 7px; font-size: 1.6rem;line-height: 34px;color: #fff;}
.popup_wrap .exam_popup .info {margin: 20px 0;padding: 0 20px;background: #f5f5f5;border-radius: 5px;}
.popup_wrap .exam_popup .info dl {overflow: hidden;padding: 7px 0 9px;border-bottom: 1px solid #d5d5d5;}
.popup_wrap .exam_popup .info dl dt {position: relative;float: left;width: 110px;padding: 0 0 0 16px;font-size: 1.6rem;line-height: 24px;color: #222;box-sizing: border-box;}
.popup_wrap .exam_popup .info dl dt:before {content: '';position: absolute;left: 0;top: 9px;width: 6px;height: 6px;background: var(--prgress-color-01);border-radius: 50%;}
.popup_wrap .exam_popup .info dl dt:after {content: '';position: absolute;right: 18px;top: 50%;width: 1px;height: 16px;background: #d5d5d5;transform: translateY(-50%);}
.popup_wrap .exam_popup .info dl dd {float: right;width: calc(100% - 110px);font-size: 1.6rem;font-weight: 300;line-height: 24px;color: #222;}
.popup_wrap .exam_popup .info dl:last-child {border-bottom: 0 none;}
.popup_wrap .exam_popup .info dl:last-child dd {float: left;width: auto;margin: 0 70px 0 0;}
.popup_wrap .exam_popup .list {overflow: hidden;overflow-y: auto;padding: 18px;border: 3px solid #e5e5e5;border-radius: 5px;}
.popup_wrap .exam_popup .list ol > li {padding: 20px 0;border-top: 1px solid #d5d5d5;}
.popup_wrap .exam_popup .list ol > li:first-child {padding-top: 0;border-top: 0 none;}
.popup_wrap .exam_popup .list ol > li:last-child {padding-bottom: 0;}
.popup_wrap .exam_popup .list ol > li .title {position: relative;font-size: 1.8rem;line-height: 28px;color: #222;display:flex;}
.popup_wrap .exam_popup .list ol > li .title span {height: 30px;font-size: 2.2rem;line-height: 30px;text-align: center;border-radius: 5px;font-weight: 600;box-sizing: border-box;margin-right: 6px;}
.popup_wrap .exam_popup .list ol > li ul {padding: 4px 0 0 0;}
.popup_wrap .exam_popup .list ol > li ul li {margin: 12px 0 0;font-size: 1.8rem;}
.popup_wrap .exam_popup .list ol > li ul li input[type=radio] {width: 18px;height: 18px;margin-right: 6px;}
.popup_wrap .exam_popup .list ol > li ul li input[type=radio] + label {line-height: 18px;width: 100%;display: flex;cursor: pointer;}
.popup_wrap .exam_popup .buttons_wrap {margin-top: 25px;}

.popup_wrap .ox_box em{width: 90px;border-radius:10px;height: 90px;float:left;font-size: 4rem;line-height: 90px;}
.popup_wrap .ox_box input:checked + label em{color: #f2443a;background: #fff;border: 2px solid #f2443a;}
.popup_wrap .ox_box span{width: auto;float:left;}
.popup_wrap .ox_box li{margin-top:0 !important;width: auto;float: left;}
.popup_wrap .ox_box li ~ li{margin: 0 0 0 10px !important;}

.popup_wrap .txt_box{background: #f5f5f5;padding: 20px 25px;border-radius: 10px;margin-bottom: 10px;margin-top: 10px;line-height: 1.4;}

.answer_box span{width: 100%;}
.answer_box input[type="radio"], .answer_box input[type="checkbox"]{position: absolute;width: 1px;height: 1px;margin-left: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);}
.answer_box em{border: 1px solid #333;border-radius: 50%;width: 22px;height: 22px;text-align: center;line-height: 22px;display:inline-block;margin-right:6px;min-width: 22px;}
.answer_box input:checked + label em {background:#333;color:#fff;/* margin: 0; */}
.answer_box input[type="text"]{width:100%;height:40px;border-radius: 5px;}
.answer_box textarea{width:100%;height:200px;font-size:1.8rem;border-radius: 5px;}
.popup_wrap .buttons_wrap{display: flex;flex-wrap: wrap;justify-content: center;}
.popup_wrap .buttons_wrap button{width:150px;margin:10px;font-size: 1.6rem;}

.popup_wrap .t_center.start_notice {border: 1px solid #ddd;border-radius: 5px;padding: 20px;line-height: 1.4;}

/*------------------ 캘린더 ------------------*/
/*
#calendar {width: calc(100% - 350px);margin-right: 20px;float: left;border: 1px solid var(--calendar-border-color1);display: grid;grid-template-columns: repeat(7, 1fr);grid-template-rows: 35px;grid-auto-rows: 140px;overflow: auto;}
*/

.c_right{width: 350px;position: sticky;top: 100px;right: 0;float: left;}

#calendar {width: calc(100% - 370px);margin-right: 20px;float: left;}

.today_list {width: 100%;}
.today_list ul{max-height: calc(100vh - 257px);width: 100%;overflow-y: auto;padding-right: 10px;}
.today_list h4{font-size: 2.3rem;width: 100%;height: 30px;margin-bottom: 10px;}
.today_list li {background:#fff;border-radius: 5px;padding: 10px 15px;margin: 0 0 11px;position: relative;border: 1px solid #dbdbdb;border-left: none;cursor: pointer;transition: all 0.3s ease;}
.today_list li::before{content:'';display: block;position:absolute;left:0;top: 0;width: 5px;height:100%;border-radius: 5px;background: #f27e9c;}
.today_list li:hover{box-shadow: 3px 3px 5px rgb(0 0 0 / 18%);}
.today_list li a{display:inline-block;width: 100%;height: 100%;}
.today_list .today_no{border: 1px solid #ddd;width: 100%;display: flex;justify-content: center;align-items: center;flex-direction: column;padding: 20px;}
.today_list .today_no::before{content:'!';display:block;font-size:3rem;width: 50px;height: 50px;border: 5px solid #d3d4ed;text-align: center;color: #9295d5;box-sizing: content-box;margin-bottom: 10px;border-radius: 50%;line-height: 50px;float: left;}
.today_list .tag{border-radius:3px;padding: 4px 8px;font-size: 1.4rem;font-weight: 500;}
.today_list .tag{background: #fff7f9;color: #ef5e83;}
.today_list .tag1{background:#D8DAFF;color:var(--main-color);}
.today_list .tag1.no{background:#F2F2F2;color: rgb(0 0 0 / 43%);}
.today_list .tag2_01{background: #fff7f9;color: #ef5e83;}
.today_list .tag2_03{background: #edf6ee;color: #316131;}
.today_list .tag2_02{background:#f7faff;color: #2b2e73;}
.today_list .tag2_04{background: #fffbe7;color: #b07025;}
.today_list .tag2{background: #fff7f9;color: var(--sub1-color);}
.today_list .ellipsis{font-size: 1.7rem;font-weight: 600;margin:10px 0 5px;}
.today_list .date{color:#888;font-size: 1.4rem;}

#calendar .coulmn{border-right: 1px solid var(--calendar-border-color1);position: relative;border-bottom: 1px solid var(--calendar-border-color1);}
#calendar .coulmn:hover{background: #fff8fa;}
#calendar .coulmn_hd{border-bottom: 1px solid var(--calendar-border-color2);border-right: 1px solid var(--calendar-border-color1) !important;text-align: center;line-height: 35px;}

#calendar .coulmn_6{border-bottom:none;}
#calendar .br_no{border-right: none !important;}

#calendar .sunday .txt_day{color: #f2443a;}
#calendar .readonly{opacity:0.4;}
#calendar .sunday,
#calendar .saturday{background:#f9f9f9;}

.c_legend {width:100%;display: flex;flex-direction: row;flex-wrap: wrap;border: 1px solid #ddd;padding: 10px 11px;height: 83px;margin-bottom: 20px;}
.c_legend li{display:flex;float: left;width: calc(33.33% - 10px);font-size: 1.4rem;margin: 5px;justify-content: space-between;}
.c_legend .l_pt{width:20px;height:20px;margin-right: 5px;}

.calendar_box{float:left;width:100%;position: relative;}

.event {border-radius: 4px;height: 26px;position: relative;background: #fff;margin: 0 10px;padding: 0 10px;border: 1px solid #ddd;font-size: 1.4rem;line-height: 24px;text-align: left;color: #000;box-shadow: 1px 1px 3px rgb(0 0 0 / 18%);transition: all 0.3s ease;cursor: pointer;align-self: start;}

#calendar .active{background: #f5f5f8;}
#calendar .today .txt_day{color:#fff;z-index:10;}
#calendar .today .txt_day::after{content:'';display:block;width: 25px;height: 25px;background:var(--sub1-color);position: absolute;top: -1px;left: 1px;border-radius: 50%;z-index: -1;}
#calendar .coulmn .txt_day{position:absolute;left: 5px;top: 5px;cursor: context-menu;width: 25px;height: 25px;text-align: center;line-height: 25px;}
#calendar .the_more {width:100%;height:100%;}
#calendar .the_more .pc {float: right;margin-top: 10px;margin-right: 10px;text-decoration: underline;cursor: context-menu;}

.coulmn_1 {grid-row: 2;}
.coulmn_2{grid-row: 3;}
.coulmn_3{grid-row: 4;}
.coulmn_4{grid-row: 5;}
.coulmn_5 {grid-row: 6;}
.coulmn_6{grid-row: 7;}

.coulmn:nth-of-type(7n + 1) {grid-column: 1/1;}
.coulmn:nth-of-type(7n + 2) {grid-column: 2/2;}
.coulmn:nth-of-type(7n + 3) {grid-column: 3/3;}
.coulmn:nth-of-type(7n + 4) {grid-column: 4/4;}
.coulmn:nth-of-type(7n + 5) {grid-column: 5/5;}
.coulmn:nth-of-type(7n + 6) {grid-column: 6/6;}
.coulmn:nth-of-type(7n + 7) {grid-column: 7/7;}

.calendar_nav {margin-bottom: 20px;position: relative;width: calc(100% - 370px);}
.calendar_nav .c_box{display: flex;justify-content: center;align-items: center;}
.calendar_nav h3 {font-size: 7rem;display: flex;text-align: center;margin: 0 30px;line-height: 1;height: auto;align-items: center;flex-wrap: wrap;justify-content: center;}
.calendar_nav h3 span{font-size: 1.8rem;letter-spacing: 5px;}
.calendar_nav button{transition: all 0.3s ease;border-radius: 100px;width: 40px;height: 40px;}
.calendar_nav button:hover{background: #f7f7f7;}

.calendar_nav button.today{border-radius:5px;border:1px solid #ddd;padding:0 20px;height: 33px;width:auto;font-size: 1.4rem;position:absolute;bottom:0;right:0;background: #fff;}


/* error 404/505 등 */
#ErrorPage{padding: 60px 0 0;}
#ErrorPage img{max-width:100%;}
#ErrorPage .container_wrap{display: flex;justify-content: center;align-items: center;align-content: center;flex-direction: column;}
#ErrorPage .error_box {position: relative;display: flex;align-items: center;justify-content: center;color: #292c6c;line-height: 1;}
#ErrorPage .error_box .txt{position:absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#ErrorPage .error_box::before{content:'';display:block;background: url('../images/web/error_03.png') no-repeat;background-size: contain;background-position: bottom;width: 183px;height: 100%;right: 0;position: absolute;bottom: 0;transform: translate(-2px, 0px);z-index: 10;}
#ErrorPage .error_box span{width:100%;text-align:center;font-size: 11rem;font-weight: 600;margin-top: -19px;}
#ErrorPage .error_box em{text-align: center;width: 100%;display: inline-block;font-size: 2.6rem;font-weight: 500;text-transform: uppercase;}

#ErrorPage .txt_box{text-align:center;}
#ErrorPage .txt_box h2{font-size:5rem;width:100%;word-break: keep-all;margin-top: 70px;font-weight: 300;}
#ErrorPage .txt_box h2 *{display:inline-block;word-break:keep-all;}
#ErrorPage .txt_box h2 b{color: #292c6c;font-weight: 400;}
#ErrorPage .txt_box span{font-size:2.6rem;color:#666;}
#ErrorPage button{margin: 0 auto;display: inline-block;width: 220px;height: 50px;color: #42446A;border-radius: 5px;border: 1px solid #9183AC;font-size: 1.6rem;}

.btn-jittery {animation: jittery 4s infinite;}
.btn-pulse{box-shadow: 0 0 0 10px transparent;animation: pulse 2s;animation-iteration-count: infinite;}

@keyframes pulse {
	from {box-shadow: 0 0 0 0 var(--main-color);}
}
@keyframes jittery {
	5%, 50% {transform: scale(1);}
	10% {transform: scale(0.9);}
	15% {transform: scale(1.15);}
	20% {transform: scale(1.15) rotate(-5deg);}
	25% {transform: scale(1.15) rotate(5deg);}
	30% {transform: scale(1.15) rotate(-3deg);}
	35% {transform: scale(1.15) rotate(2deg);}
	40% {transform: scale(1.15) rotate(0);}
}


.guide_wrap {border-radius: 30px;padding: 20px 60px;background-color: #f9f9f9;display: flex;align-items: center;justify-content: space-between;background-size: cover;background-position: 50%;flex-wrap: wrap;}
.guide_wrap br{display:none;}
.guide_wrap1{background-color: #eff5ff;background-image: url('../images/sub/guide_bg.png?v3');}
.guide_wrap2{background-color: #f5f5ff;background-image: url('../images/sub/guide_bg2.png?v3');}
.guide_wrap h3{font-size: 4.5rem;font-family: 'SBAggro';word-break: keep-all;}
.guide_wrap .left{width: 55%;max-width: 730px;word-break: keep-all;}
.guide_wrap .left span{font-size:2rem;opacity: 0.8;word-break: keep-all;}
.guide_wrap .right{width: 40%;}
.guide_wrap .right img{max-width:100%;}


.program1 h3{color: var(--main-color);font-size: 2.4rem;margin-bottom: 20px;/* font-family: 'SBAggro'; */word-break: keep-all;}
.program1 span{max-width: 500px;font-size: 2rem;display: block;margin: 0 auto;text-align: center;font-weight: 400;color: var(--sub1-color);font-family: 'SBAggro';margin-bottom: 30px;background: #fff8fa;/* box-shadow: 2px 2px 5px #0000002e; */border-radius: 10px;padding: 30px;position:relative;border: 1px solid;word-break: keep-all;}
.program1 span:after{display: block;content: '';position: absolute;bottom: -28px;left: calc(50% - 9px);width: 0px;height: 0px;border-top: 16px solid var(--sub1-color);border-left: 16px solid transparent;border-right: 16px solid transparent;border-bottom: 16px solid transparent;z-index: -1;} 
.program1 span:before{display: block;content: '';position: absolute;bottom: -25px;left: calc(50% - 7px);width: 0px;height: 0px;border-top: 14px solid #fff8fa;border-left: 14px solid transparent;border-right: 14px solid transparent;border-bottom: 14px solid transparent;} 
.program1 em{width:100%;display:inline-block;font-size: 1.8rem;line-height: 1.4;}
.program1 .txt_box{border: 1px dashed #c9c9c9;border-radius:10px;padding:20px;text-align: center;}
.program1-1{margin-bottom: 40px;}
.program1 img{margin:0 auto;display: block;}
.program1-1 img{width:200px;margin-bottom: -2px;}
.program1-2 img{width:200px;margin-bottom: -6px;}


.tb_box{
    width: 100%;
    float: left;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin-bottom: 20px;
}

.tg {width: calc(50% - 10px);float:left;}
.tg .b_ln{border-left:none;}
.tg .b_rn{border-right:none;word-break: keep-all;}
.tg .b_bn{border-bottom:none;}
.tg .br_2{border-bottom: 2px solid !important;}
.tg th{border-top:2px solid !important;}
.tg tr:last-child td{border-bottom: 2px solid !important;}
.tg span {width: 100%;padding: 4px 2px;border-radius: 3px;font-size: 1.6rem;font-weight: 400;letter-spacing: -1.5px;word-break: keep-all;}

.program2 .bg_p span {background: #f3f3f3;color: #333;}
.program2 .bg_pn span {background: #fff3f5;color: #e3033e;}
.program2 td {border-color: #d9c6cc !important;border-style: solid;border-width: 1px;padding: 10px;}
.program2 th {border-color: black;border-style: solid;border-width: 1px;padding: 10px 5px;}
.program2 .tg-ci8b {background-color: #fff3f7;color: #dd2a73;text-align: center;vertical-align: middle;border: 1px solid;border-top: 2px solid;height: 60px;}
.program2 .tg-ci8b:nth-of-type(1){border-left:none;} 
.program2 .tg-ci8b:nth-of-type(5){border-right:none;}
.program2 .tg-yt8t {border-color: inherit;color: #e3033e;text-align: center;vertical-align: middle;font-weight: 600;font-size: 1.8rem;word-break: keep-all;}
.program2 .tg-qvbo {border-color: #8d278f;color: #f3537d;text-align: center;vertical-align: middle;font-weight: 600;font-size: 1.8rem;}
.program2 .tg-o6ka {border-color: inherit;color: #695ddd;text-align: center;vertical-align: middle}

.program3  {
    margin-left: 20px;
}
.program3 td{border-color: #efdbad !important;border-style: solid;border-width:1px;padding: 10px;}
.program3 th{border-width:1px;padding:10px 5px;}
.program3 .tg-1k7o{border-color: #9ba0af;color: #b36e16;text-align:center;vertical-align:middle;font-size: 1.8rem;font-weight: 600;word-break: keep-all;}
.program3 .tg-q0i1{background-color: #fff9e1;border-color: #d79c2f;border: 1px solid;border-top: 2px solid;color: #cb6a13;text-align:center;vertical-align:middle;font-size: 1.6rem;font-weight: 600;height: 60px;}
.program3 .tg-q0i1:first-child{border-left:none;}
.program3 .tg-q0i1:last-child{border-right:none;}
.program3 .bg_b span {background: #fff9e1;color: #a54e00;word-break: inherit;}


.program4 {}
.program4 .tg-l0lo:nth-of-type(1){border-left:none;} 
.program4 .tg-l0lo:nth-of-type(5){border-right:none;}
.program4 td{border-style: solid;border-width:1px;padding: 10px;border-color: #b9c0cd !important;}
.program4 th{border-color:black;border-style:solid;border-width:1px;padding: 10px;}
.program4 .bg_g span{background: #eef2f9;color: #3b608f;word-break: keep-all;}
.program4 .tg-l0lo{background-color: #eff8ff;border-color:inherit;color: #3b608f;text-align:center;vertical-align:middle;font-size: 1.6rem;font-weight: 600;height: 60px;}
.program4 .tg-iooq{border-color:inherit;color: #4e5683;text-align:center;vertical-align:middle;font-size: 1.8rem;font-weight: 600;word-break: keep-all;}

.program5  {margin-left: 20px;}
.program5 .tg-9qec:nth-of-type(1){border-left:none;} 
.program5 .tg-9qec:nth-of-type(5){border-right:none;}
.program5 td{border-style: solid;border-width:1px;padding: 10px;border-color: #beafc3 !important;}
.program5 th{border-color:black;border-style:solid;border-width:1px;padding: 10px;}
.program5 .tg-fnut{border-color:inherit;color: #9a34ab;text-align:center;vertical-align:middle;font-size: 1.8rem;font-weight: 600;word-break: keep-all;}
.program5 .tg-9qec{background-color: #faf3ff;border-color:inherit;color: #985ba7;text-align:center;vertical-align:middle;height: 60px;}
.program5 .bg_o span {background: #f9f4fb;color: #6a2a75;}

.program6 {width: 100%;}
.program6  td{border-style: solid;border-width:1px;word-break: keep-all;padding: 10px;border-color: #d1d1df !important;}
.program6  th{border-color:black;border-style:solid;border-width:1px;padding: 10px;word-break:normal;}
.program6  .tg-jy6y{border-color: #b2bcc1;color: #494ca5;text-align:center;vertical-align:middle;font-size: 1.8rem;font-weight: 600;}
.program6 .tg-jy6y span{background: #f1f1ff;color: #292b63;}
.program6  .tg-arny{background-color: #e7e8ff;border-color: #8089bd;color: #292b63;text-align:center;vertical-align:middle;height: 60px;}
.program6  .tg-g0t8{border-color:#7198ad;color: #494ca5;text-align:center;vertical-align:middle;font-weight: 600;font-size: 1.8rem;}
.program6  .tg-g0t8 span{background: #f3f3f3;color: #333;}


/* 마일리지 */
.mile_btn{display:flex;flex-direction: column;align-items: center;width: 100%;}

.mile_btn .link_ul{border:1px solid #bbbb;border-radius:100px;display: flex;flex-wrap: wrap;background: #fff;width: 100%;}
.mile_btn .link_ul a{width:237px;height:60px;font-size:2rem;display:flex;float:left;align-items: center;justify-content: center;font-weight: 600;border-radius: 100px;transition: all 0.3s ease;background: #fff;flex: 1;}
.mile_btn .link_ul a:hover{background: #f7f7f7;}
.mile_btn .link_ul a.on{background: var(--sub1-color);border: 1px solid var(--sub1-color);color: #fff;}

.mile_sbtn{margin-top:30px;}
.mile_sbtn button{padding:10px 20px;border:1px solid #bbb;border-radius:5px;color:#707070;font-size: 1.6rem;transition: all 0.3s ease;}
.mile_sbtn button:hover{background: var(--sub1-2-color);border: 1px solid var(--sub1-color);color: var(--sub1-color);}
.mile_sbtn button ~ button{margin-left:20px;}
.mile_sbtn button.on{border: 2px solid var(--sub1-color);color: var(--sub1-color);background: var(--sub1-2-color);/* box-shadow: 3px 3px 0px rgb(0 0 0 / 10%); */}

.mile_pop.table_st2 em{display: inline-block;width:100%;opacity: 0.8;font-size: 1.5rem;padding: 0;}

@media screen and (max-width:726px){

    .mile_t_st2,
    .mile_t_st2 tr,
    .mile_t_st2 tbody
    {display: inline-block !important;width: 100%;}
	.mile_t_st2 th,
	.mile_t_st2 td{width:50%;float: left;}

    .mile_t_st2 .th{border-top: 1px solid #979797;}

}

/* 수집동의 박스 */
.agree_box{}
.agree_box li:nth-child(1){font-size:2rem;font-weight:600;}
.agree_box li:nth-child(2){padding: 20px;border: 1px solid #ddd;margin-top: 20px;height: 220px;overflow: auto;}
.agree_box li:nth-child(2) b{display: inline-block;margin-bottom: 5px;}
.agree_box li:nth-child(2) p{margin-bottom:20px;}
.agree_box li:nth-child(3){padding:20px;background: #f3f3f3;border: 1px solid #ddd;border-top: none;}


/* 에디터 폼 */
.bbs_form_editor input{height:50px;}
.bbs_form_editor textarea{padding: 11px;height: 350px;}
.bbs_form_editor .radi_box input[type="radio"] + label{padding: 0 0 0px 23px;margin-right: 12px;}
.bbs_form_editor .radi_box > span{display: flex;align-items: center;align-content: center;justify-content: center;float: left;}
.radi_box input[type="radio"] + label:before{top: 3px;}

.list_form.grid_form{display: flex;flex-wrap: wrap;gap: 15px;}
.list_form.grid_form ul{width:100%;}
.list_form.grid_form a{width: calc(25% - 12px);}
.list_form.grid_form a .img_box{width: 100%;}
.list_form.grid_form a .img_box img{object-fit: cover;}
.list_form.grid_form a .txt_box{width: 100%;padding: 20px;margin-top: 10px;}
.list_form.grid_form .date span{width: calc(100% - 70px);line-height: 1;height: auto;}

.hashtag{font-size: 14px;}
.hashtag.d_flex{display: flex;justify-content: center;flex-wrap: wrap;}
.hashtag > span {background: transparent;margin-right: 10px;padding: 4px 10px;font-size: 16px;border-radius: 15px;box-sizing: border-box;border: 1px solid #292c6c;;color:#292c6c;margin-bottom: 10px;}
.hashtag > button {background: transparent;margin-right: 10px;padding: 4px 10px;font-size: 16px;border-radius: 15px;box-sizing: border-box;border: 1px solid #292c6c;color:#292c6c;margin-bottom: 10px;background: #fff;}
.hashtag > button.on{background: #484a6c;color: #fff;}
.hashtag > button:hover{background: #484a6c;color: #fff;}

.fav_btn {border:transparent 1px solid;background-color: #e1e1e1;height:50px;}
.fav_btn:hover {background-color: #f5acbe;border: 1px solid #eb4972;}
.fav_btn img{width: 16px;margin-top: -5px;}
.fav_btn.on{background-color: #eb4972;}

.date_td{width: 320px !important;}

.txt_box_st1{border: 1px dashed #c9c9c9;border-radius:10px;padding:20px;font-size: 1.8rem;line-height: 1.4;}
.txt_box_st2{display: flex;flex-direction: column;flex-wrap: wrap;align-items: flex-start;}
.txt_box_st2 li{font-size: 2.0rem;position:relative;display: inline-block;background: #f3f3ff;margin-bottom: 6px;padding: 3px;}

.tCard_ul{display: flex;flex-wrap: wrap;}
.tCard_ul > li{width: calc(20% - 20px);float: left;display: flex;flex-wrap: wrap;}
.tCard_ul > li ~ li{margin-left: 22px;}
.tCard_ul .li1 ul{background:#F6FEFC;border:1px solid #4AC1A4;width: 100%;}
.tCard_ul .li1 .mid{padding: 50px 20px 50px;}
.tCard_ul .li1 .btm{padding: 26px 20px;}
.tCard_ul .li1 .top{background:#4AC1A4;color:#fff;font-weight:700;font-size:1.8rem;}
.tCard_ul .li1 .title{color:#05AA81;font-weight:600;margin-bottom:15px;font-size:1.7rem;}
.tCard_ul .li2 ul{background: #FCFEFB;border: 1px solid #88BC66;width: 100%;}
.tCard_ul .li2 .top{background: #88BC66;color:#fff;font-weight:700;font-size:1.8rem;}
.tCard_ul .li2 .title{color: #56952D;font-weight:600;margin-bottom:15px;font-size:1.7rem;}
.tCard_ul .li3 ul{background: #F9FBFF;border: 1px solid #3363B7;}
.tCard_ul .li3 .top{background: #3363B7;color:#fff;font-weight:700;font-size:1.8rem;}
.tCard_ul .li3 .title{color: #3363B7;font-weight:600;margin-bottom:15px;font-size:1.7rem;}
.tCard_ul .li4 ul{background: #F9FAFF;border: 1px solid #4347AA;}
.tCard_ul .li4 .top{background: #4347AA;color:#fff;font-weight:700;font-size:1.8rem;}
.tCard_ul .li4 .title{color: #4347AA;font-weight:600;margin-bottom:15px;font-size:1.7rem;}
.tCard_ul .li5 ul{background: #FCF9FF;border: 1px solid #723EA7;}
.tCard_ul .li5 .top{background: #723EA7;color:#fff;font-weight:700;font-size:1.8rem;}
.tCard_ul .li5 .mid{padding: 115px 20px;}
.tCard_ul .li5 .title{color: #723EA7;font-weight:600;margin-bottom:15px;font-size:1.7rem;}
.tCard_ul .mid{background:#ddd;border-radius:15px;text-align: center;padding: 35px 20px 20px 20px;margin-top: -22px;width: 100%;}
.tCard_ul .btm{background:#ddd;border-radius:15px;text-align: center;padding: 20px;margin-top:15px;width: 100%;}
.tCard_ul .top{background:#ddd;border: 4px solid #fff;border-radius:100px;width:240px;height: 50px;text-align:center;line-height:44px;margin: 0px auto 0;display: block;z-index: 1;position: relative;}

.txt_arow li{width: 25%;height:75px;background:#ddd;float: left;font-size: 1.8rem;font-weight: 600;line-height: 77px;text-align: center;text-indent: -18px;}
.txt_arow li:nth-child(2n){background:#fff;border: 1px solid #4c4f89;color: #4c4f89;}
.txt_arow li:nth-child(2n + 1){background: #4c4f89;color:#fff;}
.txt_arow li::before{content:'';display: block;float: left;width: 0;height: 0;border-style: solid;border-width: 37.5px 0 37.5px 41px;margin-left: -2px;}
.txt_arow li:nth-child(1)::before{display:none;}
.txt_arow li:nth-child(2n)::before{border-color: transparent transparent transparent #4c4f89;}
.txt_arow li:nth-child(2n + 1)::before{border-color: transparent transparent transparent #ffffff;}


.srch_box .detail_src .radi_box{height: auto;width:calc(100% - 120px);display: flex;flex-wrap: wrap;}
.srch_box .datail_menu {width: 100%;margin: 0 auto;position: relative;max-width: 700px;}
.srch_box .select_box1 select{width: calc(33.33% - 10px);}
.srch_box .select_box1 select:last-child{margin-right:0;}
.srch_box .detail_src li > div select{background-color:#fff !important;flex: 1;}
.srch_box .datail_menu .detail_open{display: block;width: auto;border-radius: 3px;font-size: 14px;margin: 20px 0 0 0;color: #000;float: right;border: 1px solid #ddd;padding: 3px 10px;}
.srch_box .datail_menu .detail_open::before{content: '상세검색 펼치기';background: none;width: auto;height: auto;display: inline-block;text-align: center;color: #5c5c5c;}
.srch_box .datail_menu .detail_open.on::before{content: '상세검색 닫기';}
.srch_box .datail_menu .detail_open{margin-bottom:20px;background: #fff;}

.detail_src .chk_box input[type="checkbox"] + label {cursor: pointer;float: left;position:relative;border: 1px solid var(--main-color);color: var(--main-color);padding: 5px 10px;border-radius: 100px;margin-right: 7px;background: #fff;}
.detail_src .chk_box input[type="checkbox"] + label:hover{background: #f5f6ff;}
.detail_src .chk_box input[type="checkbox"]:checked + label{background:var(--main-color);color:#fff;}
.detail_src .chk_box input[type="checkbox"] + label:before {display:none;}
.detail_src .radi_box input[type="radio"]:checked + label:before {content:'';background-color: #fff;border-color: var(--main-color);}
.detail_src .radi_box input[type="radio"] + label{margin-top:5px;}

.qa_lock{margin-bottom: 4px;}

/* Editor image align */
.image { text-align: center; }
.image.image-style-side { text-align: right;}


.fc-day-sun a {color: #df0303;}
.fc-day-sun{background-color: rgb(255 46 46 / 4%);}
.fc-day-sat a {color: #4545b1;}
.fc-day-sat{background-color: rgb(43 43 255 / 4%);}

.profile_load::before{content:'';display:block;width:13px;height:16px;background:url('../images/sub/feather-file.png');float: left;margin-right: 4px;}
.profile_load{display: flex;align-items: center;}
.profile_load:hover{text-decoration: underline;}

/* 비교과프로그램 구조 수정 */
.list_left{width: calc(55% - 40px);float:left;}
.list_left .img_box{width:100%;}
.list_right{width:45%;float:left;margin-left:40px;}
.list_right .txt_box{width:100%;}
.list_right.pc{display:block;position: sticky;top: 100px;}
.list_right.mo{display:none;}


/* table style ********************************************************************************************************************/
:root {
/* 테이블 색상 */
--table2-th-th-bg:#5a5a5a; --table2-th-th-border:#3d3d3d; 
--table2-th-bg:#f4f4f4;  --table2-th-border:#d6d8dc; 
--table2-td-bg:#fff; --table2-td-border:#e7e7e7;  
--table2-tf-th-bg:#e2e2e2;  --table2-tf-th-border:#c9c9c9; 
--table2-tf-td-bg:#f6f6f6;  --table2-tf-td-border:#e7e7e7;
  
}

/* table style5 */
.table_st5 {overflow:hidden;width:100%;border-top: 1px solid #000;border-bottom: 1px solid #ddd;position:relative;overflow:hidden;width:calc(100% + 1px);margin-left:-1px;font-weight:300;line-height:1.25;border-collapse:collapse;}
.table_st5 th{padding:.4em .4em;border: 1px solid var(--table2-th-border);color: #000620;font-weight:600;height: 48px;vertical-align: middle;}
.table_st5 td{word-break:keep-all;padding: .4rem .4rem;background: #fff;border: solid #e7e7e7;border-width:1px;color:#333;position:relative;min-height:3.95rem;height: 48px;vertical-align: middle;font-weight: 500;text-align: left;transition:background .3s;-webkit-transition:background .3s;}
.table_st5 tbody tr:first-child th,
.table_st5 tbody tr:first-child td{border-top-width:0}
.table_st5 tbody th {text-align: left;background: var(--table2-th-bg);}
.table_st5 thead th {background: var( --table2-th-th-bg);border-color: var( --table2-th-th-border);font-weight: 600;color: #fff;}
.table_st5 tfoot td {background: var( --table2-tf-td-bg);border-color: var(--table2-tf-td-border);color: #000;}
.table_st5 tfoot th {background: var(--table2-tf-th-bg);border-color: var(--table2-tf-th-border);}


/* table style 공통 */
/* 
[html]

<table class="table_st1 table_td_center">
 */
.table_td_center td,
td.table_td_center {text-align: center !important;}
.table_td_left td,
td.table_td_left {text-align: left !important;}
.table_td_right td,
td.table_td_right td {text-align: right !important;}
.table_th_left th,
th.table_th_left {text-align: left !important;}
.table_th_right th,
th.table_th_right {text-align: left !important;}
.table_th_center th,
th.table_th_center {text-align: center !important;}


/* 체크박스 style ********************************************************************************************************************/
/*
[html]
<div class="checkbox">
	<input type="checkbox" id="a" name="" value="" class="">
	<label for="a">aa</label>
</div>
	
*/
.checkbox {position:relative;}
.checkbox input[type="checkbox"] {position: absolute;width: 1px;height: 1px;margin-left: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);}
.checkbox input[type="checkbox"] + label {width:100%;cursor: pointer;float: left;position:relative;margin-right: .5em;display: flex;align-items: center;padding-left:0;justify-content: center;}
.checkbox input[type="checkbox"] + label:before {content:'';background: #e8e8e8 url(../images/sub/chek_ic.svg) 50% 50% no-repeat;background-size: 12px;text-align: center;font-weight: 600;width: 18px;height: 18px;border-radius:100%;float: left;margin-right: 3px !important;display: inline-flex;align-items: center;justify-content: center;}
.checkbox input[type="checkbox"] + label span {width:100%;display:inline-block;padding-left: 43px;text-overflow: ellipsis;white-space: nowrap;overflow:hidden;line-height:1.3;font-weight: 500;}
.checkbox input[type="checkbox"]:checked + label {float: left;text-align: left;color: #000;}
.checkbox input[type="checkbox"]:checked + label:before {background: #ff9823 url(../images/sub/chek_ic_on.svg) 50% 50% no-repeat;background-size: 12px;}


/* wrap_between 
.wrap_between 쓰면 좌우로 붙게
*/
.wrap_between {width: 100%;display: flex;flex-direction: row;align-items: center;justify-content: space-between;}
.wrap_between .btn_wrap {width: auto !important;}

/* margin-top */
.m0 {margin: 0 !important}
.m_auto {margin: 0 auto !important;}
.mt1{margin-top:.1em !important;}
.mt2{margin-top:.2em !important;}
.mt3{margin-top:.3em !important;}
.mt4{margin-top:.4em !important;}
.mt5{margin-top:.5em !important;}
.mt6{margin-top:.6em !important;}
.mt7{margin-top:.7em !important;}
.mt8{margin-top:.8em !important;}
.mt9{margin-top:.9em !important;}
.mt10{margin-top:1em !important;}
.mt11{margin-top:1.1em !important;}
.mt12{margin-top:1.2em !important;}
.mt13{margin-top:1.3em !important;}
.mt14{margin-top:1.4em !important;}
.mt15{margin-top:1.5em !important;}
.mt20{margin-top:2em !important;}
.mt21{margin-top:2.1em !important;}
.mt22{margin-top:2.2em !important;}
.mt23{margin-top:2.3em !important;}
.mt24{margin-top:2.4em !important;}
.mt25{margin-top:2.5em !important;}
.mt30{margin-top:3em !important;}
.mt31{margin-top:3.1em !important;}
.mt32{margin-top:3.2em !important;}
.mt33{margin-top:3.3em !important;}
.mt34{margin-top:3.4em !important;}
.mt35{margin-top:3.5em !important;}
.mt40{margin-top:4em !important;}
.mt41{margin-top:4.1em !important;}
.mt42{margin-top:4.2em !important;}
.mt43{margin-top:4.3em !important;}
.mt44{margin-top:4.4em !important;}
.mt45{margin-top:4.5em !important;}
.mt46{margin-top:4.6em !important;}
.mt47{margin-top:4.7em !important;}
.mt48{margin-top:4.8em !important;}
.mt49{margin-top:4.9em !important;}
.mt50{margin-top:5em !important;}

/* margin-bottom */
.mb1{margin-bottom:.1em !important;}
.mb2{margin-bottom:.2em !important;}
.mb3{margin-bottom:.3em !important;}
.mb4{margin-bottom:.4em !important;}
.mb5{margin-bottom:.5em !important;}
.mb6{margin-bottom:.6em !important;}
.mb7{margin-bottom:.7em !important;}
.mb8{margin-bottom:.8em !important;}
.mb9{margin-bottom:.9em !important;}
.mb10{margin-bottom:1em !important;}
.mb11{margin-bottom:1.1em !important;}
.mb12{margin-bottom:1.2em !important;}
.mb13{margin-bottom:1.3em !important;}
.mb14{margin-bottom:1.4em !important;}
.mb15{margin-bottom:1.5em !important;}
.mb20{margin-bottom:2em !important;}
.mb21{margin-bottom:2.1em !important;}
.mb22{margin-bottom:2.2em !important;}
.mb23{margin-bottom:2.3em !important;}
.mb24{margin-bottom:2.4em !important;}
.mb25{margin-bottom:2.5em !important;}
.mb30{margin-bottom:3em !important;}
.mb31{margin-bottom:3.1em !important;}
.mb32{margin-bottom:3.2em !important;}
.mb33{margin-bottom:3.3em !important;}
.mb34{margin-bottom:3.4em !important;}
.mb35{margin-bottom:3.5em !important;}
.mb40{margin-bottom:4em !important;}
.mb41{margin-bottom:4.1em !important;}
.mb42{margin-bottom:4.2em !important;}
.mb43{margin-bottom:4.3em !important;}
.mb44{margin-bottom:4.4em !important;}
.mb45{margin-bottom:4.5em !important;}
.mb46{margin-bottom:4.6em !important;}
.mb47{margin-bottom:4.7em !important;}
.mb48{margin-bottom:4.8em !important;}
.mb49{margin-bottom:4.9em !important;}
.mb50{margin-bottom:5em !important;}

/* margin-left */
.ml1{margin-left:.1em !important;}
.ml2{margin-left:.2em !important;}
.ml3{margin-left:.3em !important;}
.ml4{margin-left:.4em !important;}
.ml5{margin-left:.5em !important;}
.ml6{margin-left:.6em !important;}
.ml7{margin-left:.7em !important;}
.ml8{margin-left:.8em !important;}
.ml9{margin-left:.9em !important;}
.ml10{margin-left:1em !important;}
.ml11{margin-left:1.1em !important;}
.ml12{margin-left:1.2em !important;}
.ml13{margin-left:1.3em !important;}
.ml14{margin-left:1.4em !important;}
.ml15{margin-left:1.5em !important;}
.ml20{margin-left:2em !important;}
.ml21{margin-left:2.1em !important;}
.ml22{margin-left:2.2em !important;}
.ml23{margin-left:2.3em !important;}
.ml24{margin-left:2.4em !important;}
.ml25{margin-left:2.5em !important;}
.ml30{margin-left:3em !important;}
.ml31{margin-left:3.1em !important;}
.ml32{margin-left:3.2em !important;}
.ml33{margin-left:3.3em !important;}
.ml34{margin-left:3.4em !important;}
.ml35{margin-left:3.5em !important;}
.ml40{margin-left:4em !important;}
.ml41{margin-left:4.1em !important;}
.ml42{margin-left:4.2em !important;}
.ml43{margin-left:4.3em !important;}
.ml44{margin-left:4.4em !important;}
.ml45{margin-left:4.5em !important;}
.ml46{margin-left:4.6em !important;}
.ml47{margin-left:4.7em !important;}
.ml48{margin-left:4.8em !important;}
.ml49{margin-left:4.9em !important;}
.ml50{margin-left:5em !important;}

/* margin-right */
.mr1{margin-right:.1em !important;}
.mr2{margin-right:.2em !important;}
.mr3{margin-right:.3em !important;}
.mr4{margin-right:.4em !important;}
.mr5{margin-right:.5em !important;}
.mr6{margin-right:.6em !important;}
.mr7{margin-right:.7em !important;}
.mr8{margin-right:.8em !important;}
.mr9{margin-right:.9em !important;}
.mr10{margin-right:1em !important;}
.mr11{margin-right:1.1em !important;}
.mr12{margin-right:1.2em !important;}
.mr13{margin-right:1.3em !important;}
.mr14{margin-right:1.4em !important;}
.mr15{margin-right:1.5em !important;}
.mr20{margin-right:2em !important;}
.mr21{margin-right:2.1em !important;}
.mr22{margin-right:2.2em !important;}
.mr23{margin-right:2.3em !important;}
.mr24{margin-right:2.4em !important;}
.mr25{margin-right:2.5em !important;}
.mr30{margin-right:3em !important;}
.mr31{margin-right:3.1em !important;}
.mr32{margin-right:3.2em !important;}
.mr33{margin-right:3.3em !important;}
.mr34{margin-right:3.4em !important;}
.mr35{margin-right:3.5em !important;}
.mr40{margin-right:4em !important;}
.mr41{margin-right:4.1em !important;}
.mr42{margin-right:4.2em !important;}
.mr43{margin-right:4.3em !important;}
.mr44{margin-right:4.4em !important;}
.mr45{margin-right:4.5em !important;}
.mr46{margin-right:4.6em !important;}
.mr47{margin-right:4.7em !important;}
.mr48{margin-right:4.8em !important;}
.mr49{margin-right:4.9em !important;}
.mr50{margin-right:5em !important;}

/* weight */
.font_300 {font-weight: 300  !important;}
.font_400 {font-weight: 400  !important;}
.font_500 {font-weight: 500  !important;}
.font_bold, .font_600 {font-weight: bold !important;}
.font_normal {font-weight: normal  !important;}


/* list style ********************************************************************************************************************/
/*
[html]
<ul class="list_st1">
	<li></li>
	<li></li>
	<li></li>
</ul>
*/

.list_st2 > li {position: relative;padding-left: .7em;margin-bottom: .6em;color: #444;}
.list_st2 > li::after {content: '';display: block;position: absolute;top: 10px;left: 0;width: 3px;height: 3px;background: #555;}

.list_st3 > li {position: relative;padding-left: .7em;margin-bottom: .6em;color: #444;}
.list_st3 > li::after {content: '-';display: block;position: absolute;top: 0;left: 0;}