@CHARSET "UTF-8";

.slick-slider {}
.slick-slider .slick-list {position:relative; height:100%;  overflow:hidden;}
.slick-slider .slick-list:after {content:""; display:block; clear:both;}
.slick-slider .slick-list .slick-slide {outline:none; border:0;}
.slick-slider.noControll .slick-arrow {display:none;}
.slick-slider .slick-arrow {position:absolute; top:50%; width:30px; height:30px; margin-top:-15px; text-align:left; text-indent:-3000em; transition:background 0.2s ease-in-out; border-radius:17px; border:none; cursor:pointer;}
.slick-slider .slick-prev {left:5px; background:url(/mobile/images/blt/arrow_left.png) no-repeat 50%;}
.slick-slider .slick-next {right:5px; background:url(/mobile/images/blt/arrow_right.png) no-repeat 50%;}
.slick-slider .slick-prev:hover {background:rgba(0,0,0,.1) url(/mobile/images/blt/arrow_left.png) no-repeat 50%;} 
.slick-slider .slick-next:hover {background:rgba(0,0,0,.1) url(/mobile/images/blt/arrow_right.png) no-repeat 50%;}

.controllTypeA .slick-arrow {position:absolute; top:50%; width:40px; height:58px; margin-top:-29px; text-align:left; text-indent:-3000em; transition:background 0.2s ease-in-out; border:none; cursor:pointer; border-radius:0;}
.controllTypeA .slick-prev {left:-50px; background:url(/mobile/images/blt/arrow_g_m_left.png) no-repeat 50%;}
.controllTypeA .slick-next {right:-50px; background:url(/mobile/images/blt/arrow_g_m_right.png) no-repeat 50%;}
.controllTypeA .slick-prev:hover {background:rgba(0,0,0,.1) url(/mobile/images/blt/arrow_g_m_left.png) no-repeat 50%;} 
.controllTypeA .slick-next:hover {background:rgba(0,0,0,.1) url(/mobile/images/blt/arrow_g_m_right.png) no-repeat 50%;}

/* main */
#header h1 {z-index:-1}
.main #contatiner {position:relative; padding-top:130px; border-bottom:30px solid #f4f4f4; z-index:5;} 
.main #contatiner:after {content:""; position:absolute; right:-15px; bottom:-30px; display:block; width:50%; height:30px; background:#e72410;}
#mainVisualArea:before {content:""; position:absolute; left:0; bottom:0; display:block; width:15px; height:120px; background:#0062b1;}
.main #quickBoard:before {content:""; position:absolute; left:0; bottom:0; display:block; width:15px; height:100%; background:#0062b1;}
.main .movieArea:before {content:""; position:absolute; left:0; bottom:0; display:block; width:15px; height:100%; background:#0062b1;}
.main #footer {}
 
#mainVisualArea {position:relative; height:425px; padding:0 15px; margin:0 auto; z-index:10;}
#mainVisualArea .mainVisualWrap {height:425px; position:relative; width:100%;}
#mainVisualArea .mainVisualWrap:after {content:""; display:block; clear:both;}
#mainVisualArea .mainVisualWrap .slick-list {position:relative; height:425px; z-index:10;}
#mainVisualArea .mainVisualWrap .slick-list:after {content:""; display:block; clear:both;}
#mainVisualArea .section {float:left; width:100%; height:425px; position:relative; background-size:cover; background-position:50% 0; background-repeat:no-repeat; background-color:#f4f4f4;}

.visualCont {position:absolute; width:100%; left:0; top:25px; padding:0 20px; color:#fff;}
.visualCont.otherColor {color:#000;} 
.visualCont strong {display:block; font-size:36px; line-height:37px; font-weight:700; color:inherit;}
.visualCont p {margin-top:5px; font-size:13px; color:inherit; line-height:16px; font-weight:300;}
.visualCont a.btn {margin-top:15px; width:140px;}
.visualCont a.btn:after {border-width:0 3px 4px 0;} 
.visualCont.otherColor a.btn {border-color:#434343 !important; color:#434343 !important; background-color:rgba(255,255,255,.05) !important;}
.visualCont.otherColor a.btn:after {border-color:#434343;} 
#mainVisualArea .slick-dots {position:absolute; left:20px; top:300px; z-index:15;}
#mainVisualArea .slick-dots li {display:inline-block; margin-right:10px; font-size:0; line-height:0; width:11px; text-align:center; vertical-align:middle;} 
#mainVisualArea .slick-dots li button {width:5px; height:5px; display:block; padding:0; margin:0 auto; border-radius:100%; background:#e3e3e3; opacity:0.85; box-sizing:content-box; text-align:left; text-indent:-3000em; font-size:0; line-height:0; box-shadow:none; border:none;}
#mainVisualArea .slick-dots li.slick-active button {opacity:1; border:3px solid #fabe00; background:transparent;}
/* #mainVisualArea .slick-arrow {display:none !important;} 2023 remuwal */
.main #tagListArea {position:relative; height:76px; padding:25px 15px; margin:-76px auto 0; z-index:30; visibility:hidden;} 
.main #tagListArea .slick-arrow {position:absolute; top:15px; width:20px; height:26px; text-align:left; text-indent:-3000em; z-index:50; transition:background 0.2s ease-in-out; border-radius:17px;}
.main #tagListArea .slick-prev {left:10px; background:url(/mobile/images/blt/arrow_w_left.png) no-repeat 50%; background-size:8px auto;}
.main #tagListArea .slick-next {right:10px; background:url(/mobile/images/blt/arrow_w_right.png) no-repeat 50%; background-size:8px auto;}
.main #tagListArea .tagListWrap {position:relative; height:26px; padding:0 30px;}
.main #tagListArea .tagListWrap:after {content:""; display:block; clear:both;}
.main #tagListArea .tagListWrap .slick-slide {float:left; margin:0 2px;}
.main #tagListArea .tagListWrap .slick-slide a {display:inline-block; height:26px; padding:0 20px; border-radius:13px; background:rgba(255,255,255,.5); color:#000; line-height:26px; transition:all 0.2s ease-in-out; font-size:13px; white-space:nowrap;}
.main #tagListArea .tagListWrap .slick-slide a:hover {background:rgba(255,255,255,.75);}
.main #quickBoard {position:relative; padding:20px 15px 0; height:130px; z-index:30}
.main #quickBoard .slick-arrow {display:none !important;} 
.main #quickBoard .quickBoardWrap {background:#fff;}  
.main #quickBoard .quickBoardWrap div.slick-slide {float:left; width:100%;}
/*.main #quickBoard .quickBoardWrap div.slick-slide a {position:relative; display:block; padding-left:90px; min-height:36px;}*/
.main #quickBoard .quickBoardWrap div.slick-slide a {position:relative; display:flex; align-itemes:flex-start; min-height:36px;}
.main #quickBoard .quickBoardWrap div.slick-slide a:before {content:""; position:absolute; left:0; top:5px; display:block; width:20px; height:1px;}
.main #quickBoard .quickBoardWrap div.slick-slide.news a:before {background:#6fba2c;}
.main #quickBoard .quickBoardWrap div.slick-slide.notice a:before {background:#0062b1;}
.main #quickBoard .quickBoardWrap div.slick-slide.event a:before {background:#fabe00;}
.main #quickBoard .quickBoardWrap div.slick-slide.advice a:before {background:#0062b1;}
.main #quickBoard .quickBoardWrap div.slick-slide.activities a:before {background:#ff0000;}
.main #quickBoard .quickBoardWrap div.slick-slide a:after {content:""; display:block; clear:both;}
/*.main #quickBoard .quickBoardWrap div.slick-slide .side {position:absolute; left:0; top:3px; padding-left:30px;} */
.main #quickBoard .quickBoardWrap div.slick-slide .side { padding-left:30px;} 
.main #quickBoard .quickBoardWrap div.slick-slide strong {display:block; font-size:11px; line-height:11px; font-weight:400; text-transform:uppercase;}
.main #quickBoard .quickBoardWrap div.slick-slide.event strong {color:#fabe00;}
.main #quickBoard .quickBoardWrap div.slick-slide.news strong {color:#6fba2c;}
.main #quickBoard .quickBoardWrap div.slick-slide.notice strong {color:#0062b1;}
.main #quickBoard .quickBoardWrap div.slick-slide.advice strong {color:#0062b1;}
.main #quickBoard .quickBoardWrap div.slick-slide.activities strong {color:#ff0000;}
.main #quickBoard .quickBoardWrap div.slick-slide .date {display:block; padding-top:3px; font-size:18px; line-height:18px; color:#333; font-weight:700;}
/*.main #quickBoard .quickBoardWrap div.slick-slide p {font-size:13px; padding-right:15px; line-height:18px;} */
.main #quickBoard .quickBoardWrap div.slick-slide p {font-size:13px; margin-left:12px; margin-top:-4px; line-height:18px;} 

.main #quickBoard .slick-dots {position:absolute; left:45px; bottom:40px; z-index:15;}
.main #quickBoard .slick-dots li {display:inline-block; margin-right:10px; font-size:0; line-height:0; width:11px; text-align:center; vertical-align:middle;} 
.main #quickBoard .slick-dots li button {width:5px; height:5px; display:block; padding:0; margin:0 auto; border-radius:100%; background:#e3e3e3; opacity:0.85; box-sizing:content-box; text-align:left; text-indent:-3000em; font-size:0; line-height:0; box-shadow:none; border:none;}
.main #quickBoard .slick-dots li.slick-active button {opacity:1; border:3px solid #0062b1; background:transparent;}
.main #quickBoard .snsArea {position:absolute; right:30px; bottom:25px;}
.main #quickBoard .snsArea:after {content:""; display:block; clear:both;}
.main #quickBoard .snsArea li {float:left; margin-left:10px;}
.main .movieArea {position:relative; padding-left:15px;}
.main .movieArea iframe {vertical-align:top;}
#mainContent {position:relative; padding:0 15px;}
#mainContent .tit {display:block; font-size:28px; line-height:26px; font-weight:700;}
#mainContent .titTxt {display:block; padding-top:5px; font-size:12px; color:#555; line-height:15px;}
  
#mainContent #studyProcessCont {position:relative; padding:65px 0 0 50px;}
#mainContent #studyProcessCont:before {content:""; position:absolute; left:-15px; bottom:0; display:block; width:45px; height:100%; background:#0062b1;}
#mainContent #studyProcessCont .tit {color:#0062b1;}
#mainContent #studyProcessCont .tit a {color:#0062b1;}
#mainContent #studyProcessCont .btnGo { display:block; width:21px; height:27px; position:absolute; right:0; top:63px; }
#mainContent #studyProcessCont .btnGo:before,
#mainContent #studyProcessCont .btnGo:after {content:""; position:absolute; right:0; top:12px; display:block; width:21px; height:3px; background:#0062b1; font-size:0; line-height:0;}
#mainContent #studyProcessCont .btnGo:after { top: 4px; right: 9px; width: 3px; height: 21px; }
#mainContent #studyProcessCont .contArea {padding-top:5px;}
#mainContent #studyProcessCont .contArea li {position:relative; padding-top:20px; padding-bottom:5px;}
#mainContent #studyProcessCont .contArea li span {position:absolute; left:-50px; top:20px; display:block; width:30px; padding-top:3px; border-top:1px solid #fff; color:#fff; font-size:18px; font-weight:400; transition:all 0.2s ease-in-out; background:#0062b1;}
#mainContent #studyProcessCont .contArea li strong {display:block; position:relative; font-size:21px; line-height:20px; font-weight:700; font-weight:700; color:#333; background:#fff; z-index:5;}
#mainContent #studyProcessCont .contArea li strong br {display:none;}
#mainContent #studyProcessCont .contArea li p {opacity:0; padding-top:5px; font-size:12px; line-height:15px;height:0;}
#mainContent #studyProcessCont .contArea.on li span {
	animation-name:fadeIn;
	animation-duration: 0.75s;
	animation-fill-mode: both;
}
#mainContent #studyProcessCont .contArea.on li p { 
	animation-name: fadeInDown;
	animation-duration: 0.75s;
	animation-fill-mode: both;
}
#mainContent #studyProcessCont .contArea.on li:nth-child(2) span,
#mainContent #studyProcessCont .contArea.on li:nth-child(2) p {animation-delay:.3s;}
#mainContent #studyProcessCont .contArea.on li:nth-child(3) span,
#mainContent #studyProcessCont .contArea.on li:nth-child(3) p {animation-delay:.6s;}
#mainContent #studyProcessCont .contArea.on li:nth-child(4) span,
#mainContent #studyProcessCont .contArea.on li:nth-child(4) p {animation-delay:.9s;}

@keyframes fadeIn {
  from {
    opacity: 1;
  }

  to {
    opacity: 1;
  }
}
 
@keyframes fadeInDown {
  from {
  	height: 0;
    opacity: 0;
    transform:translateY(-100%);
  }

  to {
  	height:40px;
    opacity: 1;
    transform:translateY(0);
  }
}


#mainContent #programsCont {position:relative; padding:65px 0 40px 50px;}
#mainContent #programsCont:before {content:""; position:absolute; left:-15px; bottom:0; display:block; width:45px; height:100%; background:#f4f4f4;}
#mainContent #programsCont .tit {color:#e72410;}
#mainContent #programsCont ul {padding-top:0;}  
#mainContent #programsCont ul li {padding-top:25px;} 
#mainContent #programsCont ul li a {position:relative; display:block; padding-top:10px; border-top:1px dotted #939598; font-size:21px; line-height:26px; color:#333; font-weight:700;}
/* #mainContent #programsCont ul li a:before {content:""; position:absolute; right:0; top:-11px; display:block; width:22px; height:22px; border-radius:50%; background:#e72410 url(/mobile/images/blt/arrow_w_right.png) no-repeat 50%; background-size:7px auto;} */
#mainContent #programsCont ul li a:before, 
#mainContent #programsCont ul li a:after { content: ""; position: absolute; right: 0; top: 25px; display: block; width: 21px; height: 3px; background: #e72410; font-size: 0; line-height: 0; }
#mainContent #programsCont ul li a:after { top: 15px; right: 9px; width: 3px; height: 21px; }

/* 2023 remuwal */
.main #contatiner{padding-top:50px;border-bottom: 0;}
.main #contatiner:after{display:none}
#mainContent{margin:0}
#mainContent .clearFix:after{display:none}
#mainContent .imageArea{position:relative;text-align:center}
#mainContent .textArea{text-align:left}
#mainVisualArea{height:auto;padding:0}
#mainVisualArea .mainVisualWrap{height:auto;padding:0}
#mainVisualArea:before{display:none}
#mainVisualArea .mainVisualWrap .slick-list{height:auto}
#mainVisualArea .section{height: 135vw;max-height: 972px;background-color:#f4f4f4;background-position:center;background-size:100% auto}
#mainVisualArea .section.al{background-position:right bottom}
#mainVisualArea .section.ar{background-position:left bottom}
#mainVisualArea .slick-dots{top:auto;bottom:15px}
#mainVisualArea .visualCont{top:50px}
#mainVisualArea .visualCont strong{color:#000;font-size:40px;font-style:normal;font-weight:700;line-height:1.1em}
#mainVisualArea .visualCont p{margin-top:10px;color:#4D4D4D;font-size:14px;font-style:normal;font-weight:300;line-height:1.5em;text-transform:capitalize}
#mainVisualArea .visualCont a.btn{margin-top:10px}
#mainVisualArea .visualCont.otherColor a.btn {color: #F00 !important;border: 1px solid #F00 !important;background: #fff !important;}
#mainVisualArea .visualCont.otherColor a.btn:hover {color: #fff !important;background: #fff !important;}
#mainVisualArea .slick-dots li{vertical-align:top;width:8px;margin:0 5px}
#mainVisualArea .slick-dots li button{width:8px;height:8px;border:1px solid #fff;background-color:transparent;box-sizing:border-box}
#mainVisualArea .slick-dots li.slick-active button{border:1px solid #fff;background-color:#fff}
#mainVisualArea .slick-slider .slick-arrow{background-image:url(/mobile/images/btn/arrow_right2.svg)!important;background-size:6.5px auto!important}
#mainVisualArea .slick-slider .slick-prev{top:auto;left:0;bottom:-10px}
#mainVisualArea .slick-slider .slick-next{top:auto;right:0;bottom:-10px}
#mainContent .section{margin-top:100px}
#mainContent .section .textArea .subTitle{margin-bottom:30px}
#mainContent .textArea strong{margin-top:0;color:#333;font-size:52px;line-height:57.2px;letter-spacing:-.5px}
#mainContent .contArea:after{content:"";display:block;clear:both}
#mainContent #MAIN_CONTENT1.section{margin-top:80px}
#mainContent #MAIN_CONTENT1.section .imageArea{margin-bottom:40px}
#mainContent #MAIN_CONTENT1.section .imageArea img{width:100%;max-width:640px}
#mainContent #MAIN_CONTENT1.section .imageArea > div {position: absolute;top: 0;width: 100%;height: 60vw; max-height: 380px;}
#mainContent #MAIN_CONTENT1.section .imageArea > div .scroll1 {position: absolute; top: 0; left: 0; width: 26.6vw; height: 100%; max-width: 185px; background: url(../images/main/main_cont01_1.png) no-repeat center top;background-size: 100% auto;}
#mainContent #MAIN_CONTENT1.section .imageArea > div .scroll2 {position: absolute; top: 27.5%; left: 30.5%; width: 33.5vw; height: 100%; max-width: 232px; background: url(../images/main/main_cont01_2.png) no-repeat center top;background-size: 100% auto;}
#mainContent #MAIN_CONTENT1.section .imageArea > div .scroll3 {position: absolute; top: 8.5%; right: 0; width: 29vw; height: 100%; max-width: 203px; background: url(../images/main/main_cont01_3.png) no-repeat center top;background-size: 100% auto;}
#mainContent #MAIN_CONTENT1.section .textArea p{color:gray;font-size:14px;font-style:normal;font-weight:300;line-height:1.5em;text-align:center}
#mainContent #MAIN_CONTENT1.section .videoArea {position: relative;margin-top: 100px;}
#mainContent #MAIN_CONTENT1.section .videoArea .main_video_play {all: unset;position: relative;z-index: 2;width:100%;}
#mainContent #MAIN_CONTENT1.section .videoArea iframe {position: absolute;top: 0;left: 0;z-index: 1;width:100%;height:100%}
#mainContent #MAIN_CONTENT3.section{margin-left: -15px;margin-right: -15px;background-color:#F4F4F4}
#mainContent #MAIN_CONTENT3.section .textArea{padding:40px 20px 0}
#mainContent #MAIN_CONTENT3.section .subTitle{padding:0}
#mainContent #MAIN_CONTENT3.section .subTitle:after{display:none}
#mainContent #MAIN_CONTENT3.section .textArea p{color:gray;font-size:14px;font-style:normal;font-weight:300;line-height:1.5em}
#mainContent #MAIN_CONTENT3.section .textArea p span{color:red;font-weight:500}
#mainContent #MAIN_CONTENT3.section .imageArea img{width:100%;max-width:720px}
#mainContent #MAIN_CONTENT4.section .tabArea.type3{margin-top:40px}
#mainContent #MAIN_CONTENT4.section .list-grid li{border:0}
#mainContent #MAIN_CONTENT4.section .list-grid.col1{gap:20px 10px}
#mainContent #MAIN_CONTENT4.section .list-grid.col2{gap:20px 10px}
#mainContent #MAIN_CONTENT4.section .list-grid.col1>li>a{display:block;margin-bottom:10px;padding:13px 15px;color:#FFF;font-size:20px;font-style:normal;font-weight:600;line-height:1.1em;background:url(/mobile/images/btn/bt_arrow_r.svg) no-repeat right 15px center;background-size:16px;background-color:red;text-align:left}
#mainContent #MAIN_CONTENT4.section .list-grid.col1>li>a span{margin-right:7px}
#mainContent #MAIN_CONTENT4.section .list-grid.col1>li:nth-child(2)>a{background-color:#06F}
#mainContent #MAIN_CONTENT4.section .list-grid li>div{padding:25px 30px 55px;border-top:1px solid #E5E5E5;border-bottom:1px solid #E5E5E5}
#mainContent #MAIN_CONTENT4.section .list-grid li>div strong{margin-top:0;margin-bottom:15px;padding-bottom:0;padding-left:36px;border:0}
#mainContent #MAIN_CONTENT4.section .list-grid li>div strong:after{width:21px;height:20px;top:50%;bottom:auto;background:url(/mobile/images/icon/bu_edit.png) no-repeat center;transform:translateY(-50%)}
#mainContent #MAIN_CONTENT4.section .list-grid.col2 li a{position:relative;display:block}
#mainContent #MAIN_CONTENT4.section .list-grid.col2 li span{position:absolute;bottom:0;left:0;right:0;padding:13px 15px;color:#FFF;font-size:16px;font-style:normal;font-weight:600;line-height:1.1em;background:rgba(0,0,0,.4) url(/mobile/images/btn/bt_arrow_r.svg) no-repeat right 15px center;background-size:16px;text-align:left}
#mainContent #MAIN_CONTENT5.section .list-card .item strong {display: flex; align-items: center; justify-content: center; min-height: 30px}
.contactUsWrap .contBody{max-width:1260px}
.contactUsWrap .HowToReachUs{margin-bottom:70px;padding:0}
.contactUsWrap .HowToReachUs h3{position:static;width:auto;margin-bottom:50px;padding-top:55px;font-size:52px;font-style:normal;font-weight:600;line-height:1.1em;letter-spacing:-.5px;text-align:center}
.contactUsWrap .HowToReachUs h3:after{display:none}
.contactUsWrap .HowToReachUs ul{padding:35px 0;border:1px solid #E5E5E5}
.contactUsWrap .HowToReachUs ul li:nth-child(1),
.contactUsWrap .HowToReachUs ul li:nth-child(2),
.contactUsWrap .HowToReachUs ul li:nth-child(3){width:33.33%}
.contactUsWrap .HowToReachUs ul li+li:before{top:0;bottom:0;left:0;width:1px;height:auto;border-right:1px solid #E5E5E5;background:none}
.contactUsWrap .HowToReachUs ul li strong{display:block;margin-top:10px;color:#4D4D4D;font-size:24px;font-weight:500;line-height:1.3em}
.contactUsWrap .HowToReachUs ul li p{color:gray;font-size:24px;font-weight:300;line-height:1.5em}
/* //2023 remuwal */