.main_tit{position:relative;}
.main_tit h3{color:#1f1513; }
.main_tit h3 span{font-weight:400; font-size:61%;  line-height:1.4em}
.main_tit h3 font{font-size:89%; line-height:1.1em}

 .scroll{position:absolute; display:block; left:50%; top:98%}
 
.contents h5{color:#1f1513; font-weight:400; text-align:center; line-height:1.2em}
.contents .text{color:#282828; font-weight:500; text-align:center; line-height:1.4em}
.contents .text font{font-weight:400}


.features .con1{}
.features .con1 li{position:relative; float:left;}
.features .con1 li h6{font-weight:500; text-align:center}
.features .con1 li h6 strong{color:#fff; display:block; font-weight:bold}
.features .con1_1 h6{color:#ffc6b9;}
.features .con1_2 h6{color:#ffe3c3;}
.features .con1_3 h6{color:#bce2ff;}
.features .con1 li p{position:absolute;color:#fff;word-break: keep-all;font-weight: 500;line-height: 1.2em;}



.features .con2{}
.features .con2 li{position:relative; text-align:center;   }
.features .con2 li img,.features .con2 li div{display:inline-block; vertical-align:middle;}
.features .con2 li::after{position:absolute; left:50%; transform:translate(-50%, 0); content:''; background-color:#1f1513; transform: scaleY(0); transform-origin: 50% 0%;}
.features .con2_1::after{background-color:#e8340c !important}
.features .con2 li h6{color: transparent; -webkit-text-stroke:1px #c3c3c3; letter-spacing:0}
.features .con2 li strong{color:#1f1513;font-weight:bold;display: block;}
.features .con2 li strong font{font-size:50%; font-weight:500}
.features .con2 li div{width: 51%; opacity: 0;}
.features .con2 li img{ opacity: 0;}
.features .con2 li p {line-height:1.2em;}
.features .con2 li p font{font-weight:500}

.features .con2 li.animate__step_act::after{-webkit-animation-name: hline;animation-name: hline;animation-fill-mode: forwards;}
.features .con2 li.animate__step_act div{-webkit-animation-name: fadeIn;animation-name: fadeIn;animation-fill-mode: forwards;}
.features .con2 li.animate__step_act img{animation-delay:1.6s;animation-duration: 0.5s;-webkit-animation-name: fadeIn;animation-name: fadeIn;animation-fill-mode: forwards;}

.features .con2 .con2_1.animate__step_act::after{animation-delay:0.5s;animation-duration:0.5s;}
.features .con2 li.con2_1.animate__step_act div{animation-delay:1.5s;animation-duration: 0.5s;}
.features .con2 li.con2_1.animate__step_act img{animation-delay:1s;animation-duration: 0.5s;}


.features .con2 .con2_2.animate__step_act::after{animation-delay:1s;animation-duration:0.5s;}
.features .con2 li.con2_2.animate__step_act div{animation-delay:2s;animation-duration: 0.5s;}
.features .con2 li.con2_2.animate__step_act img{animation-delay:1.5s;animation-duration: 0.5s;}


.features .con2 .con2_3.animate__step_act::after{animation-delay:1.2s;animation-duration:0.5s;}
.features .con2 li.con2_3.animate__step_act div{animation-delay:2.3s;animation-duration: 0.5s;}
.features .con2 li.con2_3.animate__step_act img{animation-delay:1.7s;animation-duration: 0.5s;}




.study_contents .book_slide{position:relative;}
.study_contents .slide_tit h6{ font-weight:bold; line-height:1.1em}
.study_contents .slide_tit strong{display:block; color:#1f1513; font-weight:bold;}
.study_contents .slide_tit p{color:#1f1513;font-weight:400;line-height: 1.6em;}

.study_contents .slide1 .slide_tit h6{color:#e8340c;}
.study_contents .slide2 .slide_tit h6{color:#0068b7;}

.study_contents .slide_btn{}
.study_contents .slide_btn span{display:inline-block; vertical-align:middle; border-radius:50%; cursor:pointer; text-align:center;}
.study_contents .slide1 .slide_btn span{border:1px solid #e8340c; color:#e8340c;}
.study_contents .slide1 .slide_btn span:hover{background-color:#e8340c; color:#fff;}
.study_contents .slide2 .slide_btn span{border:1px solid #0068b7; color:#0068b7;}
.study_contents .slide2 .slide_btn span:hover{background-color:#0068b7; color:#fff;}

.study_contents .slide_list{background-color:#fff;box-shadow: 0 0 10px rgba(0,0,0,0.2);}
.study_contents .slide_list::after{position:absolute; top:50%; content:''; display:block;}
.study_contents .slide1 .slide_list::after{background-color:#e8340c; left:0;}
.study_contents .slide2 .slide_list::after{background-color:#0068b7; right:0}



.study_contents .con2_1>div{position:relative;float:left; text-align:center}
.study_contents .con2_1>div::after{position:absolute; top:0; left:50%; content:'';  display:block; transform:translate(-50%, 0);transform: scaleY(0); transform-origin: 50% 0%;}

.study_contents .con2_1>div::after{-webkit-animation-name: hline;animation-name: hline;animation-fill-mode: forwards;}
.study_contents .con2_1 .box1.animate__fadeIn::after{animation-delay:1.2s;animation-duration:0.5s;}
.study_contents .con2_1 .box2.animate__fadeIn::after{animation-delay:2.2s;animation-duration:0.5s;}


.study_contents .box1::after{background-color:#e8340c}
.study_contents .box1 h6{color:#e8340c}

.study_contents .box2::after{background-color:#0068b7}
.study_contents .box2 h6{color:#0068b7}

.study_contents .con2_1 li{border-bottom:1px solid #dedede; color:#282828; font-weight:bold}
.study_contents .con2_1 li.last{border-bottom:0;}



.study_contents .con2_2{}
.study_contents .con2_2 li{position:relative; float:left;}
.study_contents .con2_2 li h6{font-weight:500; text-align:center}
.study_contents .con2_2 li h6 strong{color:#fff; display:block; font-weight:bold; line-height:1.1em}
.study_contents .con2_list1 h6{color:#ffc6b9;}
.study_contents .con2_list2 h6{color:#ffe3c3;}
.study_contents .con2_list3 h6{color:#bce2ff;}
 

/**/
.process{}
.process .main_tit h3{line-height:1.2em;}
.process .main_tit span font{display:none;font-size:100%}

.process .class_map{position:relative; display:table; width:100%; text-align:center;}

.process .class_map h6{display:table-cell; vertical-align:middle; color:#e8340c; font-weight:bold;}
.process .class_map h6 span{display:block; color:#1f1513; font-weight:500}

.process .class_map>div{position:absolute; color:#1f1513; font-weight:500}
.process .class_map>div strong{display:block; font-weight:bold;}
.process .class_map .tool1 strong,.process .class_map .tool4 strong{color:#f18e1e;}
.process .class_map .tool2 strong,.process .class_map .tool3 strong{color:#0068b7;}


.process .con2{}
.process .class_tb h6,.process .class_tb ul{display:inline-block; vertical-align:middle;}
.process .class_tb h6{font-weight:400; text-align:center;}
.process .class_tb h6 span{color:#1f1513}
.process .class_tb li{font-size:0;}
.process .class_tb li.last{margin-bottom:0 !important}
.process .class_tb strong{display:inline-block; color:#fff; text-align:center; font-weight:500; vertical-align:middle;}
.process .class_tb p{display:inline-block;color:#282828;font-weight:300;line-height: 1.5em;vertical-align:middle;}

.process .class_tb.tb1 h6{color:#e8340c;}
.process .class_tb.tb1 strong{background-color:#e8340c}

.process .class_tb.tb2 h6{color:#0068b7;}
.process .class_tb.tb2 strong{background-color:#0068b7} 


.process .level_tab{}
.process .level_tab>div{position:relative; float:left; text-align:center; cursor:pointer;}
.process .level_tab>div::after{position:absolute; left:50%;  display:none; content:'';}
.process .level_tab>div:hover::after{display:block}
.process .level_tab>div:hover span,.process .level_tab>div.on span{color:#fff;}
.process .level_tab>div span{font-weight:500;display:block;font-size: 80%;}
.process .level_tab>div font{font-weight:300; display:block;}
 
.process .level1 span{color:#f18e1e;}
.process .level2 span{color:#0068b7;}
.process .level3 span{color:#e8340c;}


.level_table{position:relative;}
.level_table::after{position:absolute; bottom:100%; content:''; display:block;}

.level_table::after{width:52px; height:47px;}
.level_table.lev0::after{left: 150px;background:url(/on-tact/images/pc/sub3/con2_1_c.png) no-repeat 50%;}
.level_table.lev1::after{left: 613px;background:url(/on-tact/images/pc/sub3/con2_2_c.png) no-repeat 50%;}
.level_table.lev2::after{left: 1077px;background:url(/on-tact/images/pc/sub3/con2_3_c.png) no-repeat 50%;}




.level_table .shadow>div{position:relative; display:none;}
.level_table .shadow>div h6{position:absolute;}
.level_table table{border-collapse: separate;}
.level_table th{color:#1f1513;text-align:center;}
.gray1 th,.gray2 th,.gray1 td li,.gray2 td li{color:#1f1513;}
.gray3 th,.gray4 th,.gray3 td li,.gray4 td li{color:#fff;}
.gray1 th,.gray1 td{background-color:#efefef}
.gray2 th,.gray2 td{background-color:#d7d7d7}
.gray3 th,.gray3 td{background-color:#9a9a9a}
.gray4 th,.gray4 td{background-color:#515151}
.bg_white{background-color:#fff !important;}

.level_table tbody th{vertical-align:middle; word-break:keep-all;}

.level_table td img,.level_table td ul{display:inline-block; vertical-align:middle;}
.level_table td li{position:relative; font-weight:450; word-break:keep-all; line-height:1.5em}
.level_table .book_list li::after{position:absolute; top:0; left:0; line-height:1.5em; height:1.5em; content:'-';}
.gray1 .book_list li::after,.gray2 .book_list li::after{color:#1f1513}
.gray3 .book_list li::after,.gray4 .book_list li::after{color:#fff}


.lev_tb1 .th1{background: linear-gradient(to right, #ffedd6, #facc95);}
.lev_tb1 .th2{background: linear-gradient(to right, #facc95, #f6b162);}
.lev_tb1 .th3{background: linear-gradient(to right, #f6b162, #f29a34);}
.lev_tb1 .book_list li.strong{color:#f18e1e }
.lev_tb1 .book_list li.strong::after{color:#f18e1e }


.lev_tb2 .th1{background: linear-gradient(to right, #80bbe6, #5ca4da); color:#fff;}
.lev_tb2 .th2{background: linear-gradient(to right, #5ca4da, #2782c6); color:#fff;}
.lev_tb2 .th3{background: linear-gradient(to right, #2782c6, #0068b7); color:#fff;}
.lev_tb2 .book_list li.strong{color:#0068b7 }
.lev_tb2 .book_list li.strong::after{color:#0068b7 }

.lev_tb3 .th1{background: linear-gradient(to right, #f49f8b, #f48c74); color:#fff;}
.lev_tb3 .th2{background: linear-gradient(to right, #f48c74, #f06b4e);color:#fff;}
.lev_tb3 .th3{background: linear-gradient(to right, #f06b4e, #eb4b27);color:#fff;}
.lev_tb3 .th4{background: linear-gradient(to right, #eb4b27, #e8340c);color:#fff;}
.lev_tb3 .book_list li.strong{color:#e8340c; }
.lev_tb3 .book_list li.strong::after{color:#e8340c; }


.process .lang_tb1 li{font-size:0;}
.process .lang_tb1 strong,.process .lang_tb1 p{display:inline-block; vertical-align:middle;} 
.process .lang_tb1 strong{color:#fff; text-align:center;}
.process .lang_list1 strong{background-color:#f18e1e}
.process .lang_list2 strong{background-color:#0068b7}
.process .lang_list3 {margin-bottom:0 !important;}
.process .lang_list3 strong{background-color:#e8340c}

.process .lang_tb1 p{color:#282828}

.lang_tb2 {position:relative;}
.lang_tb2 h6{position:absolute;}
.lang_tb2  th,.lang_tb2  td{border-radius:5px}
.lang_tb2 tbody th,.lang_tb2  td{color:#1f1513}


.lang_tb2 thead th{color:#1f1513}
.proc_tb2 thead th{color:#fff}


.step1{background-color:#ffedd6}
.step2{background-color:#0068b7; color:#fff}
.step3{background-color:#e8340c; color:#fff;}

.lang_tb2 table{border-collapse:separate; text-align:center;}
.lang_tb2 td{word-break:keep-all;}

.lang_tb2 td img,.lang_tb2 td span{display:inline-block; vertical-align:middle;}


.proc_tb1 .lev1{background:linear-gradient(to right, #fce0be, #fcd8ad);}
.proc_tb1 .lev2{background:linear-gradient(to right, #fcd8ad, #facb95);}
.proc_tb1 .lev3{background:linear-gradient(to right, #faca92, #f8be7b);}
.proc_tb1 .lev4{background:linear-gradient(to right, #f8be7b, #f6b162);}
.proc_tb1 .lev5{background:linear-gradient(to right, #f6b162, #f5a44a);}
.proc_tb1 .lev6{background:linear-gradient(to right, #f5a44a, #f29935);}

.proc_tb2 .lev1{background:linear-gradient(to right, #81bce8, #5fa5db); }
.proc_tb2 .lev2{background:linear-gradient(to right, #5fa5db, #2882c7); }
.proc_tb2 .lev3{background:linear-gradient(to right, #2882c7, #0068b7); }

.proc_tb2 .lev4{background:linear-gradient(to right, #f7a08d, #f3836a); }
.proc_tb2 .lev5{background:linear-gradient(to right, #f3836a, #ec5534);}
.proc_tb2 .lev6{background:linear-gradient(to right, #ec5534, #e8350c);}
 

.process .con5{}
.process .con5 li{position:absolute; font-weight:500; color:#1f1513; display:inline-block;}
.process .con5 img{position:absolute; top:0; left:0;}
.process .con6 .inbox>img{display:block;}







@media (min-width:1200px){
/*.inbox{position:relative; z-index:1;}*/
.main_tit .inbox{display:table; height:790px; vertical-align:middle;}
.main_tit h3{display:table-cell;vertical-align:middle;font-size: 57px;line-height:1.8em;}

.scroll{width:30px; margin-left:-15px;}

.contents h5{font-size: 64px;}
.contents .text{font-size: 27px;margin-top:20px;}
 
 
 

/**/
.features .contents{position:relative; }
.features .contents::before{position:absolute;top: 26%;left:0;content:'';display:block;width: 418px;height: 585px;background:url(/on-tact/images/pc/sub1/deco_left.png) no-repeat 0 50%;}
.features .contents::after{position:absolute; bottom:26%; right:0; content:''; display:block; width:337px; height:568px; background:url(/on-tact/images/pc/sub1/deco_right.png) no-repeat 0 100%;}
 
 

.features .main_tit .inbox{background:url(/on-tact/images/pc/sub1/viaual_1.png) no-repeat 100% 50%;}
.features .con1 .inbox>div{margin-top:40px}
.features .con1 ul{margin:0 -4px;}
.features .con1 li{width:436px; height:486px;  padding:80px 27px 24px 10px}
.features .con1_1{background:url(/on-tact/images/pc/sub1/con1_bg1.png) no-repeat 50%;}
.features .con1_2{background:url(/on-tact/images/pc/sub1/con1_bg2.png) no-repeat 50%;}
.features .con1_3{background:url(/on-tact/images/pc/sub1/con1_bg3.png) no-repeat 50%;}

.features .con1 h6{font-size:30px;}
.features .con1 h6 strong{font-size:55px;margin-bottom: 5px;}
.features .con1 li p{left:118px;bottom: 48px;font-size:25px;width: 250px;}



.features .con2 ul{margin-top:80px;}
.features .con2 li{padding-top: 100px;}
.features .con2 li::after{top:0; width:3px; height:100px}
.features .con2_2::after{top:-14px}
.features .con2 li div{padding:0 123px}
.features .con2 li h6{font-size: 53px;margin-bottom: 38px;}
.features .con2 li strong{font-size: 53px;margin-bottom: 38px;}
.features .con2 li p{margin-top:10px;font-size: 32px;}



/**/
.study_contents .contents{position:relative;  }
.study_contents .contents::before{position:absolute; top:1%; left:0; content:''; display:block; width:322px; height:573px; background:url(/on-tact/images/pc/sub2/deco_left.png) no-repeat 0 100%;}
.study_contents .contents::after{position:absolute; bottom:40%; right:0; content:''; display:block; width:337px; height:568px; background:url(/on-tact/images/pc/sub2/deco_right.png) no-repeat 0 100%;}
 
  
.study_contents .main_tit .inbox{background:url(/on-tact/images/pc/sub2/viaual_2.png) no-repeat 100% 50%;}
.study_contents  .main_tit h3 span{font-size:25px;}
.study_contents  .main_tit h3 font{font-size:40px;}

.study_contents .slide1 .slide_tit {padding: 17px 0 0;}
.study_contents .slide_tit h6{font-size: 46px;}
.study_contents .slide_tit strong{font-size: 21px;margin: 20px 0 15px;}
.study_contents .slide_tit p{font-size: 19px;}

.study_contents .slide_btn{margin-top: 10px;}
.study_contents .slide_btn span{width: 55px;height: 55px;line-height: 55px;font-size: 21px;margin-right:10px;}

.study_contents .book_slide.slide1{margin: 85px 0 100px;}

.study_contents .slide_list{ width:calc(100% - 840px)}
.study_contents .slide_list::after{width:3px; height:100px; margin-top:-50px;}
.study_contents .slide_list img{width:100%;}
.study_contents .slide1 .slide_list{border-radius:20px 0 0 20px;padding: 30px 0 30px 35px;}
.study_contents .slide2 .slide_list{border-radius:0 20px 20px 0;padding: 35px 35px 35px 0;}

.study_contents .slide1 .slide_list li{width: 185px;margin-right:40px;}
.study_contents .slide2 .slide_list li{width: 355px;margin-left:40px;}

 
.study_contents .con2_1{margin-top:70px;}
.study_contents .con2_1>div::after{width:3px; height:100px;}
.study_contents .box1{width:640px;height:640px;margin-right:30px;padding-top:148px;background:url(/on-tact/images/pc/sub2/con1_img1.png) no-repeat 50%;background-size: 90%;}
.study_contents .box2{width:500px;height:500px;padding-top:140px;background:url(/on-tact/images/pc/sub2/con1_img2.png) no-repeat 50%;background-size: 90%;}
.study_contents .con2_1 h6{font-size: 40px;}
.study_contents .con2_1 ul{width:250px;margin: 43px auto 0;}
.study_contents .con2_1 li{font-size: 30px;padding-bottom:20px;margin-bottom:25px;}


.study_contents .con2_2{margin-top: 90px;}
.study_contents .con2_2 ul{margin:0 -4px;}
.study_contents .con2_2 li{width: 436px;height:486px;padding:60px 27px 24px 10px;}
.study_contents .con2_list1{background:url(/on-tact/images/pc/sub2/con2_bg1.png) no-repeat 50%;}
.study_contents .con2_list2{background:url(/on-tact/images/pc/sub2/con2_bg2.png) no-repeat 50%;}
.study_contents .con2_list3{background:url(/on-tact/images/pc/sub2/con2_bg3.png) no-repeat 50%;}

.study_contents .con2_2 h6{font-size: 25px;}
.study_contents .con2_2 h6 strong{font-size: 50px;margin-top:20px;}


/****/
.process .contents{position:relative;  }
.process .contents::before{position:absolute;top: 1%;left:0;content:'';display:block;width:322px;height:573px;background:url(/on-tact/images/pc/sub3/deco_left.png) no-repeat 0 100%;}
.process .contents::after{position:absolute;top: 13%;right: -5%;content:'';display:block;width:337px;height:568px;background:url(/on-tact/images/pc/sub3/deco_right.png) no-repeat 0 100%;}
.process {position:relative; }
.process::before{position:absolute;top: 63%;left: 0;content:'';display:block;width:318px;height:573px;background:url(/on-tact/images/pc/sub3/deco_left2.png) no-repeat 0 100%;z-index:0;}
.process::after{position:absolute; bottom:945px; right:0; content:''; display:block; width:362px; height:575px; background:url(/on-tact/images/pc/sub3/deco_right2.png) no-repeat 0 100%;}

.process .main_tit .inbox{background:url(/on-tact/images/pc/sub3/viaual_3.png) no-repeat 100% 50%;}


.process .class_map{width:603px; height:583px; margin:50px auto 0; background:url(/on-tact/images/pc/sub3/con1_bg.png) no-repeat 50%;}
.process .class_map h6{font-size:60px;}
.process .class_map h6 span{margin-top:20px; font-size:25px;}
 
.process .class_map>div{padding-top:150px; width:326px; height:326px; font-size:30px;}
.process .class_map strong{margin-top:10px; font-size:40px;}
.process .class_map .tool1{top:0; left:-140px; background:url(/on-tact/images/pc/sub3/con1_img1.png) no-repeat 50%;}
.process .class_map .tool2{top:0; right:-140px; background:url(/on-tact/images/pc/sub3/con1_img2.png) no-repeat 50%;}
.process .class_map .tool3{bottom:-120px;left: -88px;background:url(/on-tact/images/pc/sub3/con1_img3.png) no-repeat 50%;}
.process .class_map .tool4{bottom:-120px;right: -75px;background:url(/on-tact/images/pc/sub3/con1_img4.png) no-repeat 50%;}


.process .class_tb.tb1 ul{border-left:3px solid #e8340c}
.process .class_tb.tb2 ul{border-left:3px solid #0068b7}

.process .class_tb{font-size:0;}
.process .class_tb h6,.process .class_tb ul{display:inline-block;}
.process .class_tb h6{font-size: 55px;padding-right:40px;}
.process .class_tb h6 span{font-size:30px;}
.process .class_tb ul{padding:8px 0 8px 40px;}
.process .class_tb li{margin-bottom: 50px;}
.process .class_tb strong{width:270px;height:55px;line-height:61px;border-radius:27px;margin-right:30px;font-size: 25px;}
.process .class_tb p{font-size: 23px;}

.process .class_tb.tb1{margin-bottom:50px;}


.process .level_tab{margin:65px -39px 50px;}
.process .level_tab>div{width:459px; height:459px; padding-top:195px; font-size:60px;  }
.process .level_tab>div font{font-size:40px  }

.process .level1{padding-top:175px !important; padding-right:16px; background:url(/on-tact/images/pc/sub3/con2_1_off.png) no-repeat 50%;}
.process .level1:hover,.process .level1.on{background:url(/on-tact/images/pc/sub3/con2_1_on.png) no-repeat 50%;}

.process .level2{background:url(/on-tact/images/pc/sub3/con2_2_off.png) no-repeat 50%;}
.process .level2:hover,.process .level2.on{background:url(/on-tact/images/pc/sub3/con2_2_on.png) no-repeat 50%;}

.process .level3{background:url(/on-tact/images/pc/sub3/con2_3_off.png) no-repeat 50%;}
.process .level3:hover,.process .level3.on{background:url(/on-tact/images/pc/sub3/con2_3_on.png) no-repeat 50%;}

.process .level_tab>div::after{bottom:95px; width:36px; height:57px; background:url(/on-tact/images/pc/sub3/con2_mouse.png) no-repeat; margin-left:-30px}

.level_table .shadow>div h6{left: -10px;top: -28px;width:228px;height:228px;}
.level_table .lev_tb1 h6{ background:url(/on-tact/images/pc/sub3/con2_1_tit.png) no-repeat;}
.level_table .lev_tb2 h6{ background:url(/on-tact/images/pc/sub3/con2_2_tit.png) no-repeat;}
.level_table .lev_tb3 h6{ background:url(/on-tact/images/pc/sub3/con2_3_tit.png) no-repeat;}

.level_table table{border-spacing:10px;}
.level_table th,.level_table td{border-radius:5px; overflow:hidden}

.level_table thead th{font-size:30px; padding:25px 0 20px;}
.level_table tbody th{font-size:30px; padding:25px 30px 20px; line-height:1.3em}

.level_table tbody td{padding:10px;}
.level_table td ul{padding-left:10px}
.level_table td li{font-size:21px;}
.level_table .book_list li{padding-left:14px;}


.process .lang_tb1 li{margin-bottom:20px;}
.process .lang_tb1 strong{width:270px;font-size: 25px;height:55px;line-height:60px;border-radius:27px;margin-right:30px;}
.process .lang_tb1 p{font-size: 25px;}

.lang_tb2 h6{left: 40px;top: 0;width:228px;height:228px;}
.proc_tb1 h6{background:url(/on-tact/images/pc/sub3/con3_1_tit.png) no-repeat;}
.proc_tb2 h6{background:url(/on-tact/images/pc/sub3/con3_2_tit.png) no-repeat;}
.proc_tb3 h6{background:url(/on-tact/images/pc/sub3/con3_3_tit.png) no-repeat;}

.lang_tb2 table{border-spacing:10px;}
.lang_tb2 thead th{padding:13px 0 10px; font-size:25px;}
.lang_tb2 tbody th{font-weight:bold; font-size:30px;}
.lang_tb2 td{font-size:21px; font-weight:500}
.lang_tb2 .gray1 td{padding:20px 5px;line-height:1.4em;text-align: left;}
.lang_tb2 .gray2 td{padding:10px;text-align: left;}
.lang_tb2 td span{padding-left:5px;line-height:1.2em;text-align: left;}



.process .con5 ul{position:relative; width:100%; height:200px; margin:60px auto 0; background:url(/on-tact/images/pc/sub3/con4_bg.png) no-repeat 50% 0;}
.process .con5 li{font-size:30px;}
.process .con5 .con5_1{top:65px; left:90px;}
.process .con5 .con5_2{bottom:0; left:385px}
.process .con5 .con5_3{top: 24px;left: 690px;padding:40px 0 0 40px;}
.process .con5 .con5_4{bottom:0;left: 1052px;}



.process .con6 .inbox>img{width:435px; margin:50px auto 0}


}
@media (min-width: 650px){
 .slide_list{position:absolute;top: 0;}
 .slide1 .slide_list{right:0;}
 .slide2 .slide_list{left:0;}
 .slide2 .slide_tit {float:right;}
 

}
@media (max-width:1199px){
 
}
@media (min-width:650px) and (max-width:1199px){
.main_tit .inbox{display:table;height:100vw;vertical-align:middle;}
.main_tit h3{display:table-cell;vertical-align:top;padding-top:8%;font-size: 214%;line-height:1.8em;}
.process .main_tit span font{display:inline-block;}


.scroll{width:4vw; margin-left:-2vw;}

.contents h5{font-size: 220%;}
.contents .text{font-size: 96%;margin-top: 3vw;}
 
.features .main_tit .inbox{background: url(/on-tact/images/tab/sub1/viaual_1.png) no-repeat 102% 60%;background-size:80% !important;}
.features .con1 .inbox>div{margin-top:5vw}
.features .con1 ul{margin: 0px -1.5vw;}
.features .con1 li{width:31.3vw; height:53vw;  padding:6.25vw 2.6vw 2vw 0.8vw; background-size:100% !important}
.features .con1_1{background:url(/on-tact/images/tab/sub1/con1_bg1.png) no-repeat 50%;}
.features .con1_2{background:url(/on-tact/images/tab/sub1/con1_bg2.png) no-repeat 50%;}
.features .con1_3{background:url(/on-tact/images/tab/sub1/con1_bg3.png) no-repeat 50%;}

.features .con1 h6{font-size:100%;}
.features .con1 h6 strong{font-size:185%;margin-bottom: 5px;}
.features .con1 li p{left: 15%;bottom: 11%;font-size:85%;width: 66%;line-height: 1.4em;}


.features .con2 ul{margin-top:6vw;}
.features .con2 li{padding-top: 8vw;}
.features .con2 li img{width: 47%;}
.features .con2 li::after{top:0; width:3px; height:12.5vw}
.features .con2 li div{padding-right: 5vw;}
.features .con2 .con2_2 div{padding-left: 5vw;padding-right:0;}
.features .con2 li h6{font-size: 187%;margin-bottom: 3vw;}
.features .con2 li strong{font-size: 187%;margin-bottom: 3vw;}
.features .con2 li p{font-size: 116%;}
 
 
 
 
/**/

.study_contents .main_tit .inbox{background:url(/on-tact/images/mb/sub2/viaual_2.png) no-repeat 100% 50%; background-size:61% !important}
.study_contents  .main_tit h3 span{font-size:50%;}
.study_contents  .main_tit h3 font{font-size:72%;}


.study_contents .slide_tit h6{font-size: 165%;}
.study_contents .slide_tit strong{font-size: 97%;margin:3vw 0 2vw;}
.study_contents .slide_tit p{font-size: 77%;}

.study_contents .slide_btn{margin-top: 1vw;}
.study_contents .slide_btn span{width: 5.3vw;height: 5.3vw;line-height: 5.3vw;font-size: 85%;margin-right:1vw;}
.study_contents .slide2 .slide_btn{margin-top:2vw}

.study_contents .book_slide.slide1{margin: 10vw 0;}

.study_contents .slide_list{ width:50%;}
.study_contents .slide_list::after{width:3px; height:8.3vw; margin-top:-4.2vw;}

.study_contents .slide1 .slide_list{border-radius:15px 0 0 15px;padding: 3.6vw 0 3.6vw 3.6vw;}
.study_contents .slide2 .slide_list{border-radius:0 15px 15px 0;padding: 3.6vw 3.6vw 3.6vw 0;}

.study_contents .slide1 .slide_list li{width: 17vw;margin-right: 3vw;}
.study_contents .slide2 .slide_list li{width: 30vw;margin-left: 3vw;}

 
.study_contents .con2_1{margin-top:9vw;}
.study_contents .con2_1>div{background-size: 95% !important;}
.study_contents .con2_1>div::after{width:3px; height:8.3vw;}
.study_contents .box1{width: 58%;height:53vw;padding-top: 11vw;background:url(/on-tact/images/tab/sub2/con1_img1.png) no-repeat 50%;background-size:100% !important;}
.study_contents .box2{top: 14vw;width: 44%;height:41vw;padding-top: 10vw;background:url(/on-tact/images/tab/sub2/con1_img2.png) no-repeat 50%;margin-left: -2%;}
.study_contents .con2_1 h6{font-size: 131%;}
.study_contents .con2_1 ul{width:20vw; margin:4vw auto 0;}
.study_contents .con2_1 li{font-size: 96%;padding-bottom: 1.7vw;margin-bottom:2vw;}
 
 
.study_contents .con2_2{margin-top:100px}
.study_contents .con2_2 ul{margin: 0px -1.5vw;}
.study_contents .con2_2 li{width:31.3vw;height:46.6vw;padding: 8vw 2.6vw 2vw 0.8vw;background-size:100% !important;}
.study_contents .con2_list1{background:url(/on-tact/images/tab/sub2/con2_bg1.png) no-repeat 50%;}
.study_contents .con2_list2{background:url(/on-tact/images/tab/sub2/con2_bg2.png) no-repeat 50%;}
.study_contents .con2_list3{background:url(/on-tact/images/tab/sub2/con2_bg3.png) no-repeat 50%;}


.study_contents .con2_2 h6{font-size: 94%;}
.study_contents .con2_2 h6 strong{font-size:180%;margin-top: 5px;}
 
 
 
/****/
.process .main_tit .inbox{background:url(/on-tact/images/tab/sub3/viaual_3.png) no-repeat 100% 70%; background-size:79% !important}


.process .class_map{width:100%;height: 63vw;margin:5.8vw auto 0;background:url(/on-tact/images/tab/sub3/con1_bg.png) no-repeat 50%;background-size:60% !important;}
.process .class_map h6{font-size:214%;}
.process .class_map h6 span{margin-top:2vw; font-size:41%;}
 
.process .class_map>div{padding-top:14.5vw; width:33.33vw; height:33.33vw; font-size:105%; background-size:100% !important}
.process .class_map strong{margin-top:10px; font-size:135%;}
.process .class_map .tool1{top: 0;left: 2vw;background:url(/on-tact/images/tab/sub3/con1_img1.png) no-repeat 50%;}
.process .class_map .tool2{top: 0;right: 0vw;background:url(/on-tact/images/tab/sub3/con1_img2.png) no-repeat 50%;}
.process .class_map .tool3{bottom: -8vw;left:6.25vw;background:url(/on-tact/images/tab/sub3/con1_img3.png) no-repeat 50%;}
.process .class_map .tool4{bottom: -10vw;right: 4.25vw;background:url(/on-tact/images/tab/sub3/con1_img4.png) no-repeat 50%;}


.process .con2 .shadow{padding: 6vw 4vw;}
.process .class_tb h6{font-size: 171%;margin-bottom: 2vw;}
.process .class_tb h6 span{font-size: 53%;display: inline-block;}
.process .class_tb ul{}
.process .class_tb li{margin-bottom: 2.5%;}
.process .class_tb strong{width: 30vw;height: 5.6vw;line-height: 6vw;border-radius: 3.3vw;margin-right: 2vw;font-size: 2.4vw;}
.process .class_tb p{font-size: 2.2vw;}

.process .class_tb.tb1{margin-bottom: 7vw;}


.process .level_tab{margin: 65px -2% 50px;width: 104%;}
.process .level_tab>div{width: 33.33%;height: 32vw;padding-top: 14vw;font-size: 130%;background-size: 105% !important;}
.process .level_tab>div font{font-size: 63%;}

.process .level1{padding-top: 13vw !important;padding-right:16px;background:url(/on-tact/images/tab/sub3/con2_1_off.png) no-repeat 50%;}
.process .level1:hover,.process .level1.on{background:url(/on-tact/images/tab/sub3/con2_1_on.png) no-repeat 50%;}

.process .level2{background:url(/on-tact/images/tab/sub3/con2_2_off.png) no-repeat 50%;}
.process .level2:hover,.process .level2.on{background:url(/on-tact/images/tab/sub3/con2_2_on.png) no-repeat 50%;}

.process .level3{background:url(/on-tact/images/tab/sub3/con2_3_off.png) no-repeat 50%;}
.process .level3:hover,.process .level3.on{background:url(/on-tact/images/tab/sub3/con2_3_on.png) no-repeat 50%;}

.process .level_tab>div::after{bottom:5.85vw; width:3vw; height:4.75vw; background:url(/on-tact/images/tab/sub3/con2_mouse.png) no-repeat; margin-left:-2vw; background-size:100% !important}


.level_table .shadow{padding:1.5vw;}
.level_table .shadow>div h6{left: -1%;top: -2vw;width: 19vw;height: 19vw;background-size: 90%;}
.level_table .lev_tb1 h6{ background:url(/on-tact/images/pc/sub3/con2_1_tit.png) no-repeat;}
.level_table .lev_tb2 h6{ background:url(/on-tact/images/pc/sub3/con2_2_tit.png) no-repeat;}
.level_table .lev_tb3 h6{ background:url(/on-tact/images/pc/sub3/con2_3_tit.png) no-repeat;}

.level_table table{border-spacing:5px;}
.level_table th,.level_table td{border-radius:5px; overflow:hidden}

.level_table thead th{font-size: 80%;padding: 2vw 0 1.6vw;}
.level_table tbody th{font-size: 76%;padding: 1vw 2vw;line-height:1.3em;width: 18% !important;}

.level_table tbody td{padding:5px;}
.level_table tbody td img{width: 4.5vw;}
.level_table td ul{margin-left: -3px;}
.level_table td li{font-size: 52%;}
.level_table .book_list li{padding-left: 10px;}


.process .lang_tb1 li{margin-bottom:20px;}
.process .lang_tb1 strong{width: 22.5vw;font-size: 2.4vw;height: 5.6vw;line-height: 6vw;border-radius: 3.3vw;margin-right: 1vw;}
.process .lang_tb1 p{font-size: 2.2vw;width: calc(100% - 23.5vw);line-height: 3vw;}

.lang_tb2 {padding:1.5vw;}
.lang_tb2 h6{left: 1vw;top: 1vw;width: 19vw;height: 19vw;background-size: 100% !important;}
.lang_tb2 td img{ width:14vw }
.proc_tb1 h6{background: url(/images/tab/sub3/con3_1_tit.png) no-repeat;}
.proc_tb2 h6{background:url(/on-tact/images/pc/sub3/con3_2_tit.png) no-repeat;}
.proc_tb3 h6{background:url(/on-tact/images/pc/sub3/con3_3_tit.png) no-repeat;}

.lang_tb2 table{border-spacing: 7px;}
.lang_tb2 thead th{padding: 1.5vw 0 1vw;font-size: 85%;}
.lang_tb2 tbody th{font-weight:bold;font-size: 85%;}
.lang_tb2 td{font-size: 60%;font-weight:500;text-align: left;}
.lang_tb2 .gray1 td{padding:20px 5px; line-height:1.4em}
.lang_tb2 .gray2 td{padding:10px; }
.lang_tb2 td span{padding-left:5px;line-height:1.2em;width: calc(100% - 15vw);}



.process .con5 ul{position:relative;width:100%;height: 17.6vw;margin: 7.5vw auto 0;background: url(/on-tact/images/tab/sub3/con4_bg.png) no-repeat 50% 0;background-size: 89.7%;}
.process .con5 li{font-size: 100%;}
.process .con5 .con5_1{top: 6.6vw;left: 0;}
.process .con5 .con5_2{bottom:0;left: 22.5vw;}
.process .con5 .con5_3{top: 0.6vw;left: 47.3vw;padding: 5.3vw 0 0 2.5vw;}
.process .con5 .con5_3 img{width:8vw;}
.process .con5 .con5_4{bottom:0;right: 0;}


.process .con6 .inbox p>img{width:7%;}
.process .con6 .inbox>img{width:435px; margin:50px auto 0}
}


@media (max-width: 649px){
 
 
.main_tit .inbox{display:table;height:140vw;vertical-align:middle;}
.main_tit h3{display:table-cell;vertical-align:top;padding-top: 15vw;font-size: 148%;line-height:1.8em;text-align:center;}
.main_tit h3 span{font-size:75%;}
 

.scroll{width:4.8vw; margin-left:-2.4vw;}

.contents h5{font-size: 180%;}
.contents .text{font-size: 75%;margin-top: 2vw;}
 

.features .main_tit .inbox{background: url(/on-tact/images/mb/sub1/viaual_1.png) no-repeat 50% 87%;background-size:94% !important;}
.features .con1 .inbox>div{margin-top:5vw}
.features .con1 ul{margin: 0px -1.5vw 0 -0.5vw;}
.features .con1 li{width: 31.6vw;height: 63.6vw;padding: 7.5vw 1.5vw 2vw 0.5vw;background-size: 105% !important;}
.features .con1_1{background:url(/on-tact/images/mb/sub1/con1_bg1.png) no-repeat 50%;}
.features .con1_2{background:url(/on-tact/images/mb/sub1/con1_bg2.png) no-repeat 50%;}
.features .con1_3{background:url(/on-tact/images/mb/sub1/con1_bg3.png) no-repeat 50%;}

.features .con1 h6{font-size: 70%;}
.features .con1 h6 strong{font-size:185%;margin-bottom: 5px;}
.features .con1 li p{left: 9%;bottom: 10%;font-size: 60%;width: 78%;line-height: 1.5em;}


.features .con2 ul{margin-top:7.6vw;}
.features .con2 li{padding-top: 12vw;}
.features .con2 li img{width: 47%;}
.features .con2 li::after{top:0;width: 2px;height: 12vw;}
.features .con2 li div{padding-right: 4.5vw;}
.features .con2 .con2_2 div{padding-left: 5vw;padding-right:0;}
.features .con2 li h6{font-size: 125%;margin-bottom:3vw;}
.features .con2 li strong{font-size: 127%;margin-bottom: 3vw;}
.features .con2 li p{font-size: 81%;}


/**/
.study_contents .main_tit .inbox{background: url(/on-tact/images/mb/sub2/viaual_2.png) no-repeat 50% 78%;background-size:92% !important;}
.study_contents  .main_tit h3 span{font-size:41%;}
.study_contents  .main_tit h3 font{font-size:56%;}


.study_contents .slide_tit {position:relative;margin-bottom: 3vw;}
.study_contents .slide_tit h6{font-size: 125%;}
.study_contents .slide_tit strong{font-size: 75%;margin:3vw 0 2vw;}
.study_contents .slide_tit p{font-size: 55%;}

.study_contents .slide_btn{position:absolute; bottom:0; }
.study_contents .slide_btn span{width: 7vw;height: 7vw;line-height: 7vw;font-size: 70%;margin-right:1vw;}
.study_contents .slide1 .slide_btn{right:0;}
.study_contents .slide2 .slide_btn{left:0;}

.study_contents .book_slide.slide1{margin: 13vw 0;}

.study_contents .slide_list{width: 100vw;left: -3%;position: relative;padding: 3vw 3%;}
.study_contents .slide_list::after{display:none;}

.study_contents .slide1 .slide_list{}
.study_contents .slide2 .slide_list{}

.study_contents .slide1 .slide_list li{width: 23vw;margin-right: 4vw;}
.study_contents .slide2 .slide_list li{width: 39vw;margin-right:4vw;}

 
.study_contents .con2_1{margin-top: 13vw;}
.study_contents .con2_1>div{background-size:100% !important}
.study_contents .con2_1>div::after{width:2px;height:10vw;top: -3vw;}
.study_contents .box1{width: 58%;height:55vw;padding-top: 11vw;background:url(/on-tact/images/tab/sub2/con1_img1.png) no-repeat 50%;background-size:100% !important;}
.study_contents .box2{top: 16vw;width: 44%;height:42vw;padding-top: 11vw;background:url(/on-tact/images/tab/sub2/con1_img2.png) no-repeat 50%;margin-left: -2%;}
.study_contents .con2_1 h6{font-size:100%;}
.study_contents .con2_1 ul{width:25vw; margin:4vw auto 0;}
.study_contents .con2_1 li{font-size:76%;padding-bottom: 1vw;margin-bottom:2vw;}
 
 
.study_contents .con2_2{margin-top: 13vw;}
.study_contents .con2_2 ul{margin: 0px -1.5vw 0 -0.5vw;}
.study_contents .con2_2 li{width: 31.6vw;height: 44.6vw;padding: 6vw 1.5vw 2vw 0.5vw;background-size: 105% !important;}
.study_contents .con2_list1{background:url(/on-tact/images/mb/sub2/con2_bg1.png) no-repeat 50%;}
.study_contents .con2_list2{background:url(/on-tact/images/mb/sub2/con2_bg2.png) no-repeat 50%;}
.study_contents .con2_list3{background:url(/on-tact/images/mb/sub2/con2_bg3.png) no-repeat 50%;}

.study_contents .con2_2 h6{font-size: 70%;}
.study_contents .con2_2 h6 strong{font-size: 157%;margin-top: 5px;}



 
 
 
/****/
.process .main_tit .inbox{background:url(/on-tact/images/tab/sub3/viaual_3.png) no-repeat 100% 90%; background-size:100% !important}


.process .class_map{width:100%;height: 78vw;margin:5.8vw auto 0;background:url(/on-tact/images/tab/sub3/con1_bg.png) no-repeat 50%;background-size: 75% !important;}
.process .class_map h6{font-size: 170%;}
.process .class_map h6 span{margin-top:2vw; font-size:41%;}
 
.process .class_map>div{padding-top: 14.5vw;width:33.33vw;height:33.33vw;font-size: 70%;background-size:100% !important;}
.process .class_map strong{margin-top: 1vw;font-size:135%;}
.process .class_map .tool1{top: 0;left: 0;background:url(/on-tact/images/tab/sub3/con1_img1.png) no-repeat 50%;}
.process .class_map .tool2{top: 8px;right:-3vw;background:url(/on-tact/images/tab/sub3/con1_img2.png) no-repeat 50%;}
.process .class_map .tool3{bottom: -5vw;left:6.25vw;background:url(/on-tact/images/tab/sub3/con1_img3.png) no-repeat 50%;}
.process .class_map .tool4{bottom: -5vw;right: 4.25vw;background:url(/on-tact/images/tab/sub3/con1_img4.png) no-repeat 50%;}


.process .con2 .shadow{padding: 6vw 4vw;}
.process .class_tb h6{font-size: 140%;margin-bottom: 3vw;}
.process .class_tb h6 span{font-size: 53%;display: inline-block;}
.process .class_tb ul{}
.process .class_tb li{margin-bottom: 2.5%;}
.process .class_tb strong{width: 40vw;height: 7vw;line-height: 8vw;border-radius: 4vw;margin-right: 2vw;font-size: 3.8vw;}
.process .class_tb p{font-size: 3.3vw;padding: 2% 5%;}

.process .class_tb.tb1{margin-bottom: 8vw;}


.process .level_tab{margin: 65px -2% 20px;width: 104%;}
.process .level_tab>div{width: 33.33%;height: 32vw;padding-top: 13vw;font-size: 130%;background-size: 105% !important;}
.process .level_tab>div font{font-size: 63%;}

.process .level1{padding-top: 11.7vw !important;background:url(/on-tact/images/tab/sub3/con2_1_off.png) no-repeat 50%;}
.process .level1:hover,.process .level1.on{background:url(/on-tact/images/tab/sub3/con2_1_on.png) no-repeat 50%;}

.process .level2{background:url(/on-tact/images/tab/sub3/con2_2_off.png) no-repeat 50%;}
.process .level2:hover,.process .level2.on{background:url(/on-tact/images/tab/sub3/con2_2_on.png) no-repeat 50%;}

.process .level3{background:url(/on-tact/images/tab/sub3/con2_3_off.png) no-repeat 50%;}
.process .level3:hover,.process .level3.on{background:url(/on-tact/images/tab/sub3/con2_3_on.png) no-repeat 50%;}

.process .level_tab>div::after{bottom:5.85vw; width:3vw; height:4.75vw; background:url(/on-tact/images/tab/sub3/con2_mouse.png) no-repeat; margin-left:-2vw; background-size:100% !important}

.level_table .shadow{padding:3vw;}
.level_table .shadow>div {overflow-x: scroll;}
.level_table .shadow>div h6{left: 0%;top: 0;width: 22vw;height: 22vw;background-size: 100%;}
.level_table .lev_tb1 h6{background: url(/images/mb/sub3/con2_1_tit.png) no-repeat;}
.level_table .lev_tb2 h6{background: url(/images/mb/sub3/con2_2_tit.png) no-repeat;}
.level_table .lev_tb3 h6{background: url(/images/mb/sub3/con2_3_tit.png) no-repeat;}

.level_table table{border-spacing:10px;width: 170%;}
.level_table th,.level_table td{border-radius:5px; overflow:hidden}

.level_table thead th{font-size: 75%;padding: 3vw 0 2vw;}
.level_table tbody th{font-size: 76%;padding: 1vw 1vw;line-height:1.3em;width: 14% !important;}

.level_table tbody td{padding: 10px 5px;}
.level_table tbody td img{width: 7vw;margin-right: 1%;}
.level_table td ul{margin-left: -3px;}
.level_table td li{font-size: 52%;}
.level_table .book_list li{padding-left: 10px;}


.process .lang_tb1 li{margin-bottom:20px;}
.process .lang_tb1 strong{width: 40vw;height: 8vw;line-height: 9vw;border-radius: 4vw;margin-right: 2vw;font-size: 4.1vw;}
.process .lang_tb1 p{font-size: 3.7vw;padding: 2% 5%;line-height:1.2em;}

.lang_tb2 {padding:3vw;overflow-x: scroll;}
.lang_tb2 h6{left: 5vw;top: 4vw;width: 19vw;height: 19vw;background-size: 100% !important;}
.proc_tb1 h6{background: url(/images/tab/sub3/con3_1_tit.png) no-repeat;}
.proc_tb2 h6{background:url(/on-tact/images/pc/sub3/con3_2_tit.png) no-repeat;}
.proc_tb3 h6{background:url(/on-tact/images/pc/sub3/con3_3_tit.png) no-repeat;}

.lang_tb2 table{border-spacing:10px;width: 200%;}
.lang_tb2 thead th{padding: 1.5vw 0 1vw;font-size: 80%;}
.lang_tb2 td img{ width:14vw }
.lang_tb2 tbody th{font-weight:bold;font-size: 80%;width: 11%;}
.lang_tb2 td{font-size: 60%;font-weight:500;}
.lang_tb2 .gray1 td{padding: 10px 5px;line-height:1.4em;}
.lang_tb2 .gray2 td{padding:10px; }
.lang_tb2 td span{padding-left:5px;line-height:1.2em;width: calc(100% - 15vw);}



.process .con5 ul{position:relative;width:100%;height: 17.6vw;margin: 7.5vw auto 0;background: url(/on-tact/images/mb/sub3/con4_bg.png) no-repeat 50% 0;background-size: 89.7%;}
.process .con5 li{font-size: 75%;}
.process .con5 .con5_1{top: 6.6vw;left: 0;}
.process .con5 .con5_2{bottom:0;left: 22.5vw;}
.process .con5 .con5_3{top: 0.6vw;left: 47.3vw;padding: 5.3vw 0 0 2.5vw;}
.process .con5 .con5_3 img{width:8vw;}
.process .con5 .con5_4{bottom:0;right: 0;}


.process .con6 .inbox p>img{width:7%;}
.process .con6 .inbox>img{width:43.5vw; margin:50px auto 0}
}