@charset "utf-8"; 
@import url(../font/OneMobileTitle/OneMobileTitle.css);
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: sans-serif;
}
body, html {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}





@media all and (max-width:1910px){
#header { width:1910px; }
}


@media all and (max-width:1860px){
#header  { width:1860px; }
}

@media all and (max-width:1728px){
#header { width:1728px; }
}


@media all and (max-width:1512px){
#header { width:1512px; }
}









#header.fixed{position:fixed; background:#fff;}
#menu-Area{
		position:relative;  c
		width:100%; min-width:1920px; 
		z-index:10;
		box-sizing:border-box;
	}

@media all and (max-width:1728px){
	#menu-Area{
		position:relative;  
		width:100%; min-width:1728px; 
		z-index:10;
		box-sizing:border-box;
	}
}

@media all and (max-width:1512px){
	#menu-Area{
		position:relative;  
		width:100%; min-width:1512px; 
		z-index:10;
		box-sizing:border-box;
	}
}

#menu-Area.sub{min-width:1400px;}
#menu-Area.on{
		/*url(/images/common/bg_onsubmenu1.png) center top;box-shadow:5px 4px 6px #e4e4e4 box-shadow: 1px 1px 10px 0 rgba(0,0,0,.5);*/
	}
#menu-box{ z-index:100;}
#menu-box .bgdepth1{
		position:relative;
		width:100%; 
		box-sizing:border-box;
		transition: all 0.8s ease;
		-webkit-transition: all 0.8s ease;
		transition-delay:.11s;		
	}
#menu-box .bgdepth1::before{
		position:absolute; left:0; top:79px;
		width:100%; height:1px;
		background:rgba(255,255,255,.3);
		content:"";
	}
#menu-Area.on .bgdepth1{
		background:#fff; 
	}
#menu-Area.on .bgdepth1::before{
		background:rgba(0,0,0,.1);
   }
#menu-Area .logo1{
		position:absolute; left:80px; top:38px;
	}


#menu-Area .t_go_btn {position:absolute; width:450px; height:80px; top:0px; right:0px; background-size:450px 80px; color:#fff; float:left;
background-image:url('../images/top_btn.svg');}
#menu-Area .t_go_btn span.go_btn_text {color:#fff; text-align:right; padding:28px 0px 0px 130px; float:left; line-height:24px; font-weight:500; font-size:18px; line-height:28px; font-family:'ONE Mobile OTF Regular';}
#menu-Area .t_go_btn span.go_btn_text a{color:#fff; text-align:right; padding:28px 0px 0px 130px; float:left;}
#menu-Area .t_go_btn span.go_btn_text p.go_t {font-weight:200; font-size:16px; line-height:22px; font-family:'ONE Mobile OTF Regular';}

#menu-Area .t_go_btn span.go_btn_arrow {float:left; margin:26px 0px 0px 21px;}
#menu-Area a.logo  {width:282px; height:47px; margin:17px 0px 0px 62px; float:left;}

.topmenu{position:relative; margin:0 auto; text-align:left; width:100%; }

.topmenu .total_menu {position:fixed; width:30px; height:20px; float:right; top:30px; right:35px;}
.topmenu .total_menu p.go_t {}	
	


	
.menudep1{ position:relative; margin:0px auto; width:550px;}

.menudep1 > li{	position:relative; 	display:table-cell;	}
.menudep1 li.mmenu0.f1{background:none;}
.menudep1 > li a.mnlnk1{position:relative;  display:block; line-height:27px; width:75px; color:#fff; font-size:18px; font-family:'ONE Mobile OTF Light'; text-decoration:none;
    text-align:center; font-weight:600; align-items: center; text-align: center;
	border-left:none; border-bottom:none; margin:27px 60px; 
	-moz-transition:all 10.45s ease-in-out;
	-webkit-transition:all 10.45s ease-in-out;
	-moz-transform:all 10.45s ease-in-out;
	transform:all 1.45s ease-in-out;
	transition-duration:.2s;
	transition-delay:.01s;}
	.menudep1 li a.mnlnk1:focus, .menudep1 li a.mnlnk1:hover, .menudep1 li a.mnlnk1.on, .menudep1 li:hover a.mnlnk1{color:#333; }
#menu-Area.on .menudep1 li a.mnlnk1, #header.fixed .menudep1 li a.mnlnk1{color:#333;}
.menudep1 > li::before{position:absolute; right:0; top:12.6%; width:1px; height:5%; background:#42515a; border-left:1px solid #b7bbbe; } 
.menudep1 > li:last-child::before{display:none;}
#menu-Area.on .menudep1 li ul {transform:translateY(0px);	}
#menu-Area.on {background:#fff;	}
	
.menudep1 li a.mnlnk1::after{position:absolute; right:50%; top:65px;  margin-right:-5px; opacity:0; content:"";
		transition: all 0.2s ease;
		-webkit-backface-visibility:hidden;
		-webkit-transition: all 0.2s ease;
		backface-visibility:hidden;
		opacity: 0;
	}
.menudep1 li a.mnlnk1:focus:after, .menudep1 li a.mnlnk1:hover:after, .menudep1 li a.mnlnk1.on:after, .menudep1 li:hover a.mnlnk1:after{	width:10px; top:70px;	opacity: 1;}
.menudep1 li ul.f1{border-left:none}
.menudep1 li ul li{ text-align:center; word-break:keep-all; padding:10px 0;}
.menudep1 li ul li a{line-height:22px; color:rgba(0,0,0,0.8); display:block; font-size: 16px; text-align: center; letter-spacing: -0.025em; font-weight: 200; font-family: 'ONE Mobile OTF Regular'; text-decoration:none;}
.menudep1 li ul{ border-right:none; height:0;  max-height:0; overflow:hidden;
		box-sizing:border-box;
		transition:all 0.4s ease;
		-webkit-transition: all 0.4s ease;	}
.menudep1 li ul::before{position:absolute; right:50%; top:0px; width:10px; height:10px; background:#4caa23; border-radius:50%; margin-right:-5px; opacity:0; transition:opacity 0.4s ease;
		-webkit-transition: opacity 0.4s ease;}
.menudep1 li:hover ul::before{opacity:1;}

html.fp-enabled,
.fp-enabled body {
    margin: 0;
    padding: 0;
    overflow:hidden;

    /*Avoid flicker on slides transitions for mobile phones #336 */
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.fp-section {
    position: relative;
    -webkit-box-sizing: border-box; /* Safari<=5 Android<=3 */
    -moz-box-sizing: border-box; /* <=28 */
    box-sizing: border-box;
}
.fp-slide {
    float: left;
}
.fp-slide, .fp-slidesContainer {
    height: 100%;
    display: block;
}
.fp-slides {
    z-index:1;
    height: 100%;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.3s ease-out; /* Safari<=6 Android<=4.3 */
    transition: all 0.3s ease-out;
}
.fp-section.fp-table, .fp-slide.fp-table {
    display: table;
    table-layout:fixed;
    width: 100%;
}
.fp-tableCell {
    display: table-cell;
    vertical-align: top;
    width: 100%;
    height: 100%;
}

@media all and (max-width:1920px){
.fp-tableCell { width:1920px; height:100vh; }
}

@media all and (max-width:1728px){
.fp-tableCell { width:1728px; height:100vh; }
}

@media all and (max-width:1600px){
.fp-tableCell { width:1600px; height:100vh; }
}

@media all and (max-width:1512px){
.fp-tableCell { width:1512px; height:982px; }
}


@media all and (max-width:1280px){
.fp-tableCell { width:1280px; height:100vh; }
}




.fp-slidesContainer {
    float: left;
    position: relative;
}
.fp-controlArrow {
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
    position: absolute;
    z-index: 4;
    top: 50%;
    cursor: pointer;
    width: 0;
    height: 0;
    border-style: solid;
    margin-top: -38px;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.fp-controlArrow.fp-prev {
    left: 15px;
    width: 0;
    border-width: 38.5px 34px 38.5px 0;
    border-color: transparent #fff transparent transparent;
}
.fp-controlArrow.fp-next {
    right: 15px;
    border-width: 38.5px 0 38.5px 34px;
    border-color: transparent transparent transparent #fff;
}
.fp-scrollable {
    overflow: hidden;
    position: relative;
}
.fp-scroller{
    overflow: hidden;
}
.iScrollIndicator{
    border: 0 !important;
}
.fp-notransition {
    -webkit-transition: none !important;
    transition: none !important;
}
#fp-nav {
    position: fixed;
    z-index: 100;
    top: 50%;
    opacity: 1;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translate3d(0,-50%,0);
}
#fp-nav.fp-right {
    right: 17px;
}
#fp-nav.fp-left {
    left: 31px;
}
.fp-slidesNav{
    position: absolute;
    z-index: 4;
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    left: 0 !important;
    right: 0;
    margin: 0 auto !important;
}
.fp-slidesNav.fp-bottom {
    bottom: 17px;
}
.fp-slidesNav.fp-top {
    top: 17px;
}
#fp-nav ul,
.fp-slidesNav ul {
  margin: 0;
  padding: 0;
}
#fp-nav ul li,
.fp-slidesNav ul li {
    display: block;
    height:30px;
    margin: 0px;
    position:relative;

}
.fp-slidesNav ul li {
    display: inline-block;
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-decoration: none;
}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span{
    width: 6px;
    height: 30px;
    margin: 50px 0px 0px 0px;
      background: #52FF00;
	  border-radius: 10px;
	 
 }
#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    height: 6px;
    width: 6px;
    border: 0;
    background: #F0F0F0;
    left: 50%;
    top: 50%; 
	margin:60px 0px;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

#fp-nav ul li .fp-tooltip {
    position: fixed;
    top: -170px;
    color: #fff;
    font-size:17px;
    line-height:140%;
    font-family:'ONE Mobile OTF Regular';
    white-space: nowrap;
    max-width: 300px;
    overflow: hidden;
    display: block;
    opacity: 0;
    width: 0;
    cursor: pointer;
	transform: rotate(-90deg);
	
}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip {
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in;
    width: 300px;
	height:80px;
    opacity: 1;
}
#fp-nav ul li .fp-tooltip.fp-right {
    right: 20px;
}
#fp-nav ul li .fp-tooltip.fp-left {
    left: -121px;
}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell{
    height: auto !important;
}

.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
    height: auto !important;
}

/*Only display content to screen readers*/
.fp-sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#menu li {
	display:inline-block;
	margin: 10px;
	color: #000;
	background:#fff;
	background: rgba(255,255,255, 0.5);
	-webkit-border-radius: 10px;
            border-radius: 10px;
}
#menu li.active{
	background:#666;
	background: rgba(0,0,0, 0.5);
	color: #fff;
}
#menu li a{
	text-decoration:none;
	color: #000;
}
#menu li.active a:hover{
	color: #000;
}
#menu li:hover{
	background: rgba(255,255,255, 0.8);
}
#menu li a,
#menu li.active a{
	padding: 9px 18px;
	display:block;
}
#menu li.active a{
	color: #fff;
}
#menu{
	position:fixed;
	top:0;
	left:0;
	height: 40px;
	z-index: 70;
	width: 100%;
	padding: 0;
	margin:0;
}
#menu-Area.on .menudep1 li ul{	max-height:500px; height:244px;	padding-top:31px; padding-bottom:20px; transform:translateY(-10px);	}
#menu {width:68px; height:100vh; background: rgba(0, 0, 0, 0.7); position:fixed; z-index: 70; padding: 0; margin:0;	top:0;	left:0;}
#fp-nav ul li a span, .fp-slidesNav ul li a span {background: white;	}


.image-con {width:100%;}
.image-con li {position:relative; width:20%; height:100vh; overflow:hidden; float:left;   }
.image-con li img {position:absolute; width:100%; height:100%; object-fit: cover;transition: opacity 0.5s ease-in-out;    }
.image-con li img.hover-image { opacity:0;  }
.image-con li:hover img.hover-image {opacity:1;  }
.image-con li:hover img.default-image { opacity:0;}

.image-con li .text1_area {position:absolute; z-index:99; color:#fff; top:180px; left:50px; font-family:'ONE Mobile OTF Regular'; font-weight:400; font-size:16px; line-height:140%; transition:.5s;}
.image-con li .text1_area p.tit_a2 {font-family:'ONE Mobile Title OTF'; font-weight:400; font-size:26px; line-height:140%; margin-top:10px;}
.image-con li:hover .text1_area {top:200px;}


.image-con li .text2_area {position:absolute; z-index:99; color:#fff; top:714px; left:50px;  transition:.5s;}
.image-con li .text2_area span.txt_a1 {height:90px; font-family:'ONE Mobile Title OTF'; font-weight:400; font-size:20px; line-height:140%; text-transform: uppercase; overflow:hidden; display:block}
.image-con li .text2_area p.txt_a2 {font-family:'ONE Mobile OTF Light'; font-weight:400; font-size:16px; line-height:140%; margin-top:20px;}
.image-con li:hover .text2_area {top:690px;}



 @media all and (max-width:1512px){
	.image-con li .text1_area {top:140px; left:20px;}
	.image-con li:hover .text1_area {top:160px;}
	
	.image-con li .text2_area {left:20px; top:600px;}
     .image-con li .text2_area span.txt_a1 {font-size:18px;}
	.image-con li .text2_area p.txt_a2 {margin-top:0px; font-size:14px;}
    .image-con li:hover .text2_area {top:560px;}
 }


#myVideo{
		position: absolute;
		right: 0;
		bottom: 0;
		top:0;
		width: 100%;
		height: 100%;
		background-size: 100% 100%;
 		background-color: black; /* in case the video doesn't fit the whole page*/
  		background-image: /* our video */;
  		background-position: center center;
  		background-size: contain;
   		object-fit: cover; /*cover video background */
   		z-index:3;
	}

#section0 {background:url('../images/school/bg_22.png') no-repeat 0px 80px; background-size:100% 574px; width:100%; height:100vh;}
#section00 {background:url('../images/school/bg_25.png') no-repeat 0px 80px; background-size:100% 574px; width:100%; height:100vh;}
#section000 {background:url('../images/school/bg_28.png') no-repeat 0px 80px; background-size:100% 574px; width:100%; height:100vh;}
#section0000 {background:url('../images/school/bg_31.png') no-repeat 0px 80px; background-size:100% 574px; width:100%; height:100vh;}

@media all and (max-width:1512px){
   #section0 {  background-size:100% 400px; }
   #section00 {  background-size:100% 400px; }
   #section000 {  background-size:100% 400px; }
   #section0000 {  background-size:100% 400px; }
}


.s_tit_area1 {width:900px; margin:185px 0px 0px 210px; background:url('../images/school/Vector_1.png') no-repeat 0px 0px; background-size:18px 18px; font-family:'ONE Mobile Title OTF'; 
font-weight: 400; font-size: 50px; line-height: 140%; color: #FFFFFF; padding:20px; z-index:999999; position:relative;}
.s_tit_area1 p.s_tit_txt1 {font-weight: 400; font-size: 24px; line-height: 140%; color: #FFFFFF; margin-top:10px; font-family:'ONE Mobile OTF Regular'; z-index:999999; }
.s_tit_area1 p.s_tit_txt2 {font-weight: 500; font-size: 26.5px; line-height: 140%; color: #FFFFFF; font-family:'ONE Mobile OTF Regular'; z-index:999999; }
.s_tit_area1 p.s_tit_txt3 {font-weight: 200; font-size: 30px; line-height: 140%; color: #FFFFFF; margin-top:40px; font-family:'ONE Mobile Title OTF'; text-transform: uppercase; letter-spacing: -0.025em; z-index:999999;  }


.s_txt_area1 {float:left; margin:160px 0px 0px 230px; z-index:999999; position:relative;}
.s_txt_area2 {position: absolute; top:700px; right:158px; width:332px; height:130px; padding:30px; color: #00EEFF;  font-family:'ONE Mobile OTF Regular'; font-size: 15px; z-index:999999;  border-radius: 10px;}

.s_txt_area22 {position: absolute; top:700px; right:158px; width:332px; height:130px; z-index:999999; }

.s_tit_area2 {width:996px; position: absolute; left:50%; top:168px; text-align:center; background:url('../images/school/Vector_1.png') no-repeat 120px 0px;  background-size:18px 18px; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; 
font-weight:400; font-size:26px; line-height:140%; margin-left:-491px; padding-top:15px; letter-spacing: -0.025em;}
.s_tit_area2 p.s_tit_txt4 {font-family:'ONE Mobile Title OTF'; font-size:40px; line-height: 140%; font-weight: 400; margin-top:10px;}
.s_txt_area34 {position: absolute; left:50%; top:450px; margin-left:-715px; width:1430px;}
.s_txt_area3 {float:left;}
.s_txt_area4 {float:left; margin:38px 0px 0px 180px;}


@media all and (max-width:1512px){
	.s_tit_area1 {margin:145px 0px 0px 120px; }
	.s_txt_area1 {float:left; margin:80px 0px 0px 140px; }
	.s_txt_area2 { width:320px; height:138px; top:550px; right:158px;  border: none; backdrop-filter: none;  padding:0px; background:none;}

	.s_tit_area2 { top:130px;}
	.s_txt_area34 {position: absolute; left:50%; top:380px; margin-left:-715px; width:1430px;}
	.s_txt_area3 {margin-left:50px;}
	.s_txt_area3 img {width:75%;}
	.s_txt_area4 {float:left; margin:40px 0px 0px 80px;}
}



.s_tit_area3 {width:430px; margin:156px 0px 0px 148px;  text-align:left; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; font-weight:400; font-size:20px; line-height:140%;  letter-spacing: -0.025em; float:left;}
.s_tit_area3 p.s_tit_txt5 {font-family:'ONE Mobile Title OTF'; font-size:30px; line-height: 140%; font-weight: 400; margin-top:10px; color: #FFFFFF;}
.s_tit_area3 p.s_tit_txt6 {font-family:'ONE Mobile OTF Light'; font-size:15px; line-height: 160%; font-weight: 200; margin-top:40px; color: #FFFFFF; width:430px; }


.s_txt_area5 {float:left; margin:114px 0px 0px 86px;}
.s_txt_area6 {float:left; margin:40px 0px 0px 86px;;}


.left_school_1 {width:34%; height:100%; background:url('../images/school/bg_8.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
.left_school_2 {width:34%; height:100%; background:url('../images/school/bg_9.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
.s_txt_area7 { width:66%; height:100%; float:right; background:url('../images/school/bg_10.png') no-repeat right bottom; background-size:1242px 702px;}

.s_txt_area8 {float:left; margin:114px 0px 0px 86px;}
.s_txt_area9 {position: absolute; top:183px; right:127px;}


@media all and (max-width:1512px){
	.s_tit_area3 {font-size:15px;}
	.s_tit_area3 p.s_tit_txt5 { font-size:26px;}
}


.s_tit_area4 {width:1070px; position: absolute; left:50%; top:168px; text-align:center; background:url('../images/school/Vector_1.png') no-repeat 420px 0px;  background-size:18px 18px; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; 
font-weight:400; font-size:26px; line-height:140%; margin-left:-535px; padding-top:15px; letter-spacing: -0.025em;}
.s_tit_area4 p.s_tit_txt4 {font-family:'ONE Mobile Title OTF'; font-size:40px; line-height: 140%; font-weight: 400; margin-top:10px;}


.s_tit_area5 {width:246px; position: absolute; left:50%; top:480px; text-align:center; background:url('../images/school/Vector_1.png') no-repeat 0px 0px;  background-size:18px 18px; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; 
font-weight:400; font-size:26px; line-height:140%; margin-left:-123px; padding:17px 0px 0px 12px; letter-spacing: -0.025em;}


.s_txt_area11 {position: absolute; top:558px; left:50%; margin-left:-855px; width:1711px; height:105px;}
.s_txt_area12 {position: absolute; top:733px; left:50%; margin-left:-563px; width:1126px; height:90px; background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.3); backdrop-filter: blur(25px); border-radius: 10px;
font-family:'ONE Mobile Title OTF'; font-weight: 400; font-size: 22px; line-height:90px; color: #FFFFFF; text-align:center;}

.s_tit_area13 {width:430px; margin:156px 0px 0px 148px;  text-align:left; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; font-weight:400; font-size:20px; line-height:140%;  letter-spacing: -0.025em; float:left;}
.s_tit_area13 p.s_tit_txt5 {font-family:'ONE Mobile Title OTF'; font-size:30px; line-height: 140%; font-weight: 400; margin-top:10px; color: #FFFFFF;}
.s_tit_area13 p.s_tit_txt6 {font-family:'ONE Mobile OTF Light'; font-size:15px; line-height: 160%; font-weight: 200; margin-top:40px; color: #FFFFFF; width:430px; }

@media all and (max-width:1512px){
	.left_school_1 {width:34%; height:100%; background:url('../images/school/bg_8.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
	.s_tit_area3 {width:430px; margin:116px 0px 0px 100px;  }
	.s_tit_area3 p.s_tit_txt6 {width:380px; }
	.s_tit_area3 p.s_tit_txt6 img {width:100%;}
	.s_txt_area5 {float:left; margin:100px 0px 0px 40px;}
	.s_txt_area5 img {width:92%;}
	.s_txt_area6 {float:left; margin:20px 0px 0px 40px;}
	.s_txt_area6 img {width:92%;}
    .s_txt_area7 { width:66%; height:100%; float:right; background:url('../images/school/bg_10.png') no-repeat right bottom; background-size:90%;}
	.s_txt_area8 {float:left; margin:100px 0px 0px 40px;}
	.s_txt_area8 img {width:80%;}
	.s_txt_area9 {position: absolute; top:150px; right:60px;}
	.s_tit_area4 { top:120px}
	.s_tit_area5 {top:360px; }
	.s_txt_area11 {top:440px; left:50%; margin-left:-650px; width:1300px; height:105px; }
	.s_txt_area11 img {width:100%;}
	.s_txt_area12 {top:590px; }
	.s_tit_area13 {margin:120px 0px 0px 100px;  width:380px; }
	.s_tit_area13 p.s_tit_txt6 {margin-top:20px;  width:380px; }
}


.left_school_3 {width:34%; height:100%; background:url('../images/school/bg_13.png') no-repeat 0px 80px; background-size:100% 100%; float:left; }
.left_school_4 {width:34%; height:100%; background:url('../images/school/bg_14.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
.left_school_4 span.cont_11 { margin:60px 0px 0px 148px; float:left;}
.left_school_4 span.cont_12 { margin:60px 0px 0px 148px; float:left;}
.left_school_4 span.cont_28 { margin:60px 0px 0px 0px; float:left;}
.left_school_4 span.cont_29 { margin:60px 0px 0px 148px; float:left;}
.left_school_4 span.cont_30 { margin:60px 0px 0px 148px; float:left;}
.left_school_4 span.cont_31 { margin:60px 0px 0px 148px; float:left;}
.left_school_4 span.cont_32 { margin:60px 0px 0px 148px; float:left;}


.s_txt_area13 {float:left;  margin:98px 0px 0px 0px;  width:66%; padding-left:100px;}


.s_txt_area14 { width:66%; height:100%; float:right; }
.s_txt_area14 img {width:100%;}




.s_txt_area15 {float:right; margin:80px 0px 0px 20px; width:98.8%;}
.s_txt_area15 img {width:100%;}
.s_txt_area16 {float:right; margin:10px 0px 0px 20px; width:98.8%;}
.s_txt_area16 img {width:100%;}
.s_txt_area17 {float:left; margin:160px 0px 0px 230px; position: relative; z-index:999999; }


@media all and (max-width:1512px){
	.s_txt_area13 {padding-left:40px;}
	.s_txt_area13 img {width:84%;}
	.left_school_4 span.cont_11 { margin:20px 0px 0px 100px; }
	.left_school_4 span.cont_11 img {width:50%;}
	.left_school_4 span.cont_12 { margin:40px 0px 0px 125px; }
	.left_school_4 span.cont_12 img {width:82%;}
    .left_school_4 span.cont_28 { margin:15px 0px 0px 0px; float:left;}
    .left_school_4 span.cont_28 img {width:82%;}
	.left_school_4 span.cont_29{ margin:15px 0px 0px 100px; float:left;}
    .left_school_4 span.cont_29 img {width:86%;}
	.left_school_4 span.cont_30{ margin:15px 0px 0px 100px; float:left;}
    .left_school_4 span.cont_30 img {width:86%;}
	.left_school_4 span.cont_31 { margin:60px 0px 0px 100px; float:left;}
	.left_school_4 span.cont_31 img {width:86%;}
	.left_school_4 span.cont_32 { margin:20px 0px 0px 150px; float:left;}
    .left_school_4 span.cont_32 img {width:68%;}

	.s_txt_area17 {float:left; margin:50px 0px 0px 135px; }



}


.s_txt_area27 {float:left; margin:80px 0px 0px 0px; height:65%; width:100%; color:#111;}
.s_txt_area27 img {width:100%; height:100%;}
.s_txt_area28 {float:left; margin:0px 0px 0px 0px;  background:url(../images/school/cont_img26.png) no-repeat top left; background-size:100% 100%; width:100%; height:35%; text-align:center; padding-top:160px; color:#111; line-height:140%; 
font-family:'ONE Mobile Title OTF'; font-size:36px; }
.s_txt_area29 {float:left; margin:0px 0px 0px 0px;  background:url(../images/school/bg_24.png) no-repeat top left; background-size:100% 100%; width:100%; height:35%; text-align:center; padding-top:160px; color:#111; line-height:140%; 
font-family:'ONE Mobile Title OTF'; font-size:36px; }
.s_txt_area29 p {font-family:'ONE Mobile OTF Regular'; font-size:24px; font-weight:200; margin-top:5px; line-height:140%; text-transform: uppercase;}
@media all and (max-width:1920px){
	.s_txt_area27 {float:left; margin:80px 0px 0px 0px; height:630px; width:100%;}
	.s_txt_area27 img {width:100%; height:630px;}
	.s_txt_area28  {background-size:100% 272px; padding-top:99px;}
}

@media all and (max-width:1521px){
		.s_txt_area27 {height:500px; width:100%;}
		.s_txt_area27 img {width:100%; height:100%;}
		.s_txt_area28  {background-size:100% 230px; padding-top:80px; font-size:30px}

		.s_txt_area277 {float:left; margin:80px 0px 0px 0px; height:71%; width:100%; color:#111;}
		.s_txt_area277 img {width:100%; height:100%;}
}



.s_txt_area30 { margin:0px 0px 0px 0px;  background:url(../images/school/bg_26.png) no-repeat; background-position: left 80px; background-size:100% 100%; width:66%; height:100vh; text-align:center; padding-top:240px; float:left;}
@media all and (max-width:1920px){
	.s_txt_area30 {background-size:100% 92%;}
}

@media all and (max-width:1521px){
	.s_txt_area30 {background-size:100% 100%;}
	.s_txt_area30 img {width:90%;}
}

.s_txt_area31 {float:left; margin:0px 0px 0px 0px;  background:url(../images/school/bg_27.png) no-repeat top left; background-size:100% 100%; width:100%; height:35%; text-align:center; padding-top:70px; color:#111; line-height:140%; 
font-family:'ONE Mobile Title OTF'; font-size:36px; }
.s_txt_area31 p {font-family:'ONE Mobile OTF Regular'; font-size:24px; font-weight:200; margin-top:5px; line-height:140%; text-transform: uppercase;}


.s_txt_area32 { margin:0px 0px 0px 0px;  background:url(../images/school/bg_30.png) no-repeat; background-position: left 80px; background-size:100% 100%; width:66%; height:100vh; text-align:center; padding-top:240px; float:left;}
@media all and (max-width:1920px){
	.s_txt_area32 {background-size:100% 92%;}
}


.s_txt_area33 { margin:0px 0px 0px 0px;  background:url(../images/school/bg_33.png) no-repeat; background-position: left 80px; background-size:100% 100%; width:66%; height:100vh; text-align:center; padding-top:240px; float:left;}
@media all and (max-width:1920px){
	.s_txt_area33 {background-size:100% 92%;}
}

@media all and (max-width:1521px){
	.s_txt_area33 {background-size:100% 100%;}
	.s_txt_area33 img {width:90%;}
}



.s_tit_area6 {width:1474px; position: absolute; left:50%; top:180px; text-align:center; font-family:'ONE Mobile Title OTF'; color: #FFFFFF; font-weight:400; font-size:40px; line-height:140%; margin-left:-737px; letter-spacing: -0.025em;}
.s_tit_area6 p.s_tit_txt6 {font-family:'ONE Mobile OTF Regular'; font-size:15px; line-height: 160%; font-weight: 400; margin-top:24px; }

.s_txt_area18 {position:absolute; top:426px; left:50%; width:1415px; margin-left:-702px;}

@media all and (max-width:1512px){
.s_tit_area6 {width:1200px; margin-left:-600px; top:140px;}
.s_txt_area18 {width:1200px; margin-left:-600px; top:350px;}
.s_txt_area18 img{width:100%;}
}



.left_school_5 {width:34%; height:100%; background:url('../images/school/bg_16.png') no-repeat 0px 80px; background-size:100% 100%; float:left; }
.left_school_6 {width:34%; height:100%; background:url('../images/school/bg_14.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}

.left_school_7 {width:34%; height:100%; background:url('../images/school/bg_29.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
.left_school_7 span.cont_11 { margin:60px 0px 0px 148px; float:left;}
.left_school_7 span.cont_28 { margin:105px 0px 0px 0px; float:left;}
.left_school_7 span.cont_33 { margin:60px 0px 0px 148px; float:left;}
.left_school_7 span.cont_34 { margin:60px 0px 0px 148px; float:left;}
.left_school_7 span.cont_35 { margin:60px 0px 0px 148px; float:left;}

@media all and (max-width:1512px){
    .left_school_7 span.cont_33 { margin:20px 0px 0px 140px; float:left;}
	.left_school_7 span.cont_33 img {width:75%;}
	.left_school_7 span.cont_34 { margin:60px 0px 0px 100px; float:left;}
    .left_school_7 span.cont_34 img {width:90%;}
	.left_school_7 span.cont_35 { margin:30px 0px 0px 140px; float:left;}
    .left_school_7 span.cont_35 img {width:80%;}
}



.left_school_8 {width:34%; height:100%; background:url('../images/school/bg_32.png') no-repeat 0px 80px; background-size:100% 100%; float:left;}
.left_school_8 span.cont_11 { margin:60px 0px 0px 148px; float:left;}
.left_school_8 span.cont_28 { margin:105px 0px 0px 0px; float:left;}
.left_school_8 span.cont_36 { margin:60px 0px 0px 148px; float:left;}
.left_school_8 span.cont_37 { margin:60px 0px 0px 148px; float:left;}
.left_school_8 span.cont_38 { margin:60px 0px 0px 148px; float:left;}


@media all and (max-width:1512px){
    .left_school_8 span.cont_36 { margin:40px 0px 0px 140px; float:left;}
	.left_school_8 span.cont_36 img {width:80%;}
	.left_school_8 span.cont_37 { margin:30px 0px 0px 100px; float:left;}
    .left_school_8 span.cont_37 img {width:90%;}
	.left_school_8 span.cont_38 { margin:30px 0px 0px 140px; float:left;}
    .left_school_8 span.cont_38 img {width:70%;}
}

.right_cont_area1 {width:66%; height:100%; float:left; background:url('../images/school/bg_17.png') no-repeat 0px 80px; background-size:100% 100%;}
.right_cont_area1 .right_cont_1 {width:278px; height:100%; background:rgba(0,0,0,0.2); float:right; margin-top:80px;}
.right_cont_area1 .right_cont_1 span.right_img1 {margin:62px 0px 0px 21px; float:left;}


.s_tit_area19 {position:relative; z-index:99999; width:430px; margin:156px 0px 0px 148px;  text-align:left; font-family:'ONE Mobile OTF Regular'; color: #3A3A3A; font-weight:400; font-size:20px; line-height:140%;  letter-spacing: -0.025em; float:left;}
.s_tit_area19 p.s_tit_txt19 {font-family:'ONE Mobile Title OTF'; font-size:30px; line-height: 140%; font-weight: 400; margin-top:10px; color: #3A3A3A;}
.s_tit_area19 p.s_tit_txt20 {font-family:'ONE Mobile OTF Regular'; font-size:15px; line-height: 160%; font-weight: 200; margin-top:40px; color: #3A3A3A; width:430px;}
.s_tit_area19 span.sign {position: absolute; top:520px; left:230px;}


@media all and (max-width:1512px){
	.left_school_5 {width:34%; height:100%; background:url('../images/school/bg_16.png') no-repeat 0px 80px; background-size:auto; float:left; }

	.right_cont_area1 .right_cont_1 span.right_img1 {margin:62px 0px 0px 21px; float:left; height:600px;}
   .right_cont_area1 .right_cont_1 span.right_img1 img {width:100%; height:100%;}

   .s_tit_area19 {width:390px; margin:130px 0px 0px 100px;}
   .s_tit_area19 p.s_tit_txt20 { width:390px;}
   .s_tit_area19 span.sign {position: absolute; top:430px; left:245px;}
   .s_tit_area19 span.sign img {width:90%;}
}



.subvisual{position:relative; width:100%; height:680px; z-index:10; box-sizing:border-box;}	
.subvisual .subvisual_img {width:100%; height:680px;}
.subvisual span.subvisual_img_bg1 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img1.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg2 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img2.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg4 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img4.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg5 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img5.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg6 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img6.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg7 {width:100%; height:520px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img7.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg8 {width:100%; height:420px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img8.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg9 {width:100%; height:420px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img9.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_img_bg10 {width:100%; height:420px; z-index:12; display:block; position:absolute; background:url(../images/subvisual_img10.png) no-repeat top left; background-size:cover;}
.subvisual span.subvisual_video_bg {background:rgba(0,0,0,0.3); width:100%; height:680px; z-index:12; display:block; position:absolute;}
.subvisual .subvisual_video {width:100%; height:100vh; object-fit:cover; z-index:11; }

.subvisual span.subvisual_img_bg3 {width:100%; height:2600px; z-index:12; display:block; position:absolute; background:url(../images/story_bg.png) no-repeat top left; background-size:100% 100%; background-attachment: fixed;}








.subvisual .subvisual_tit {position:absolute; font-family: 'ONE Mobile Title OTF'; font-style: normal; font-weight:500; text-transform: uppercase;
text-align:left; top:200px; left:230px; z-index:99; color:#fff; font-size:60px; line-height:60px; letter-spacing: -0.025em;}
.subvisual .subvisual_tit p.subvisual_tit_s { font-family:'ONE Mobile Title OTF'; margin-top:22px; font-weight:300; font-size:50px; line-height:60px; color:#fff; }

.subvisual .subvisual_rtext {position:absolute; text-align:right; top:210px; right:230px; z-index:99; color:#fff; font-weight:400; background:url(../images/s_text_line.png) no-repeat 2px 15px;
background-size:27px 1px; font-size:13px; line-height:32px; letter-spacing: -0.025em;  font-family:'ONE Mobile OTF Regular';}

.subvisual .subvisual_rbtext {position:absolute; text-align:left; top:300px; left:230px; z-index:99; color:#fff;  font-size:28px; line-height:28px; font-family:'ONE Mobile OTF Regular';}
.subvisual .subvisual_rbtext_tt {position:absolute; top:560px; left:230px; z-index:99; font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 24px; line-height: 34px; color:#fff;}

.subvisual .selectArea {position:absolute; left:230px; top:704px; z-index:9999999; display:block; }
.select_icon {width:40px; height:40px; border:1px solid #fff; border-radius:50%; float:left; margin-right:5px; text-align:center; padding-top:9px;}


.subvisual .sns_icon {position:absolute; right:230px; top:690px; z-index:9999999; display:block; }
.subvisual .sns_icon span.sns_circle {width:50px; height:50px; line-height:50px; border-radius:50%; background:rgba(255,255,255,0.3); backdrop-filter: blur(12px); float:left; text-align:center;}


@media all and  (max-width:1512px){
.subvisual .subvisual_tit {left:160px; top:160px;}
.subvisual .subvisual_rtext {top:160px;}
.subvisual .subvisual_rbtext {left:160px; top:260px;}
.subvisual .subvisual_rbtext_tt {left:160px; top:480px;}
.subvisual .selectArea { left:160px; top:620px; }
.subvisual .sns_icon {top:600px;}
}


.wrapper {
  margin-top:-10px;
  width: 200px;
  display: block;
  text-align: center;
  transition: 0.15s ease;
   padding:20px 15px;
   float:left;
  }

.click-text {
  display: block;
  text-align: left;
  padding-bottom: 10px;
  margin: 0;
  cursor: pointer;
  color: #fff;
  font-weight: 500;
  font-size: 17px;
  font-family:"ONE Mobile OTF Regular";
  border-bottom: 1px solid #fff;
  letter-spacing: -0.025em;
  transition: 0.15s ease;
}
.wrapper.active .click-text {color:#111; padding-bottom: 10px;  margin: 0; border-bottom: 1px solid rgba(17, 17, 17, 0.1); transition: 0.15s ease;}



.wrapper.active { width:200px; background:#FFFFFF; border-radius:10px; padding:20px 15px; transition: 0.15s ease;  box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.20); }

.wrapper.active .t_arrow {
  transform: rotate(45deg) translate(-5px, -5px);
}
.wrapper.active .t_arrow:before {
  transform: translate(10px, 0);
}
.wrapper.active .t_arrow:after {
  transform: rotate(90deg) translate(10px, 0);
}
.wrapper.active ul {
  opacity: 1;
  height:auto;
}



.wrapper3 .t_arrow {
  transform: rotate(0);
  left: 0;
}
.wrapper3 .t_arrow:before, .wrapper3 .t_arrow:after {
  background-color: transparent;
  width: 1px;
  height: 10px;
  display: inline-block;
  position: absolute;
  border-bottom: 11px solid white;
  top: 0;
  left: 0;
  transform: rotate(0);
}
.wrapper3 .t_arrow:before {
  transform: rotate(-135deg);
}
.wrapper3 .t_arrow:after {
  transform: rotate(135deg);
}
.wrapper3.active .t_arrow {
  transform: rotate(0);
  transform: translate(0, -6px);
}
.wrapper3.active .t_arrow:before {
  transform: rotate(-45deg);
  border-bottom:12px solid #111;
}
.wrapper3.active .t_arrow:after {
  transform: rotate(45deg);
  border-bottom:12px solid #111;
}

.t_arrow {
  width: 13px;
  height: 13px;
  display: inline-block;
  position: relative;
  bottom: 0px;
  left: -10px;
  transition: 0.4s ease;
  margin-top: 0px;
  text-align: left;
  transform: rotate(45deg);
  float: right;
}
.t_arrow:before, .t_arrow:after {
  position: absolute;
  content: "";
  display: inline-block;
  width: 12px;
  height: 3px;
  background-color: #fff;
  transition: 0.4s ease;
}
.t_arrow:after {
  position: absolute;
  transform: rotate(90deg);
  top: -5px;
  left: 5px;
}



.wrapper3 ul {
  padding: 0;
  margin: 0;
  height: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.4s ease;

}

.wrapper3 li {
  list-style-type: none;
  margin: 0 auto;
  padding: 4px 0px;
  text-align: left;
  cursor: pointer;
  
}

.wrapper3 li a {color:#9B9B9B;
  font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 23px; /* 153.333% */
letter-spacing: -0.375px;
text-transform: uppercase;
font-family:"ONE Mobile OTF Regular";
text-decoration:none;
}
.wrapper3 li:first-child {
  margin-top: 12px;
}
.wrapper3 li:last-child {
  margin-bottom: 0px;
}




.subCont_1 {width:100%; position:relative;}
.subCont_1 .cont_bg .cont_Text { position:absolute; top:150px; left:148px; padding-left:120px; background:url(../images/deco_1.png) no-repeat top left; background-size:100px 170px; color:#4BBBEE;
font-weight: 400; font-size: 24px; line-height: 32px; font-family:'ONE Mobile OTF Regular';}
.subCont_1 .cont_bg .cont_Text p.sub_tit { font-weight:600; font-size: 40px; line-height: 50px; color: #1496D1; margin-top:20px; letter-spacing: -0.025em;  font-family:'ONE Mobile OTF Regular';}
.subCont_1 .cont_bg .cont_Text p.sub_text1 {font-weight:400; font-size:18px; line-height:40px; color: #686868; margin-top:50px;  font-family:'ONE Mobile OTF Regular';}
.subCont_1 .cont_bg .cont_Text p.sub_text2 {background:url(../images/deco_2.png) no-repeat top left; background-size:147px 99px; font-weight:700; padding-left:170px; height:98px;
font-size:18px; line-height:26px; color: #1496D1; margin-top:40px;  font-family:'ONE Mobile OTF Regular';}
.subCont_1 .cont_Text p.sub_text2 span.sub_text3 {font-family:'ONE Mobile Title OTF'; color: #1496D1; font-weight: 400; font-size: 24px; line-height: 32px; margin-top:17px; float:left;}
.subCont_1 .cont_bg {position:relative; width:100%; height:100vh; margin:0px auto; display:flex; align-items:center; justify-content:center; }






.subCont_1 .cont_bg span.subCont_1_bg {background:url('../images/school/bg_richard.png') no-repeat; width:100%; height:100%;   background-size:cover;}
.subCont_1 .cont_bg .cont_Text span.quotes_l {position:absolute; top:200px; left:-60px; width:41px; height:38px;}
.subCont_1 .cont_bg .cont_Text span.quotes_r {position:absolute; top:200px; left:600px; width:41px; height:38px;}


@media all and  (max-width:1512px){
.subCont_1 .cont_bg .cont_Text {left:100px; top:120px;}
.subCont_1 .cont_bg span.subCont_1_bg {background:url('../images/school/bg_richard.png') no-repeat; width:100%; height:100%;   background-size:100% 100%;}
.subCont_1 .cont_bg .cont_Text span.quotes_l { left:-120px; width:41px; height:38px;}
.subCont_1 .cont_bg .cont_Text span.quotes_r {position:absolute; top:200px; left:540px; width:41px; height:38px;}
.subCont_1 .cont_bg .cont_Text p.sub_text1 {margin-left:-50px; line-height:30px;}
.subCont_1 .cont_bg .cont_Text p.sub_text2 {margin-left:-50px;}
}



.left_cont_area1 {width:50%; height:100%; float:left; background:url('../images/school/bg_20.png') no-repeat 0px 0px; background-size:429px 431px; margin-top:80px; float:left;}

.left_cont_area1 .cont_left1 {margin:50px 0px 0px 148px; font-family:'ONE Mobile OTF Regular'; font-weight:400; font-size:20px; line-height:32px;  letter-spacing: -0.025em;}
.left_cont_area1 .cont_left1 p.cont1 {font-family:'ONE Mobile Title OTF'; font-weight:400; font-size:40px; line-height:48px;  letter-spacing: -0.025em; margin-top:14px;}
.left_cont_area1 .cont_left1 p.cont2 {font-family:'ONE Mobile OTF Regular';  font-weight:400; font-size: 16px; line-height: 200%;  letter-spacing: -0.025em; margin-top:20px; color:#686868;}
.left_cont_area1 .cont_left1 p.cont3 {margin-top:62px;}


.left_cont_area2 {width:50%; height:100%; float:left; background:url('../images/school/bg_20.png') no-repeat 0px 0px; background-size:429px 431px; margin-top:80px; float:left;}


.center_img1 {position:absolute; top:120px; left:148px;}
.center_img1 img {width:88%;}
.center_img2 {position:absolute; top:500px; left:148px;}

.center_img3 img {width:90%}

@media all and  (max-width:1512px){
.left_cont_area1 .cont_left1 p.cont2 {line-height: 24px;  }
.left_cont_area1 .cont_left1 p.cont3 {margin-top:40px;}
.left_cont_area1 .cont_left1 p.cont3 img {width:94%;}

.center_img3 img {width:87%}
}


.left_area {width:68px; height:100vh; background: rgba(0, 0, 0, 0.7); position:absolute; z-index:9999; left:0px; top:0px; }
.menu {transform: rotate(-90deg); color:#fff;  width:300px; position: absolute; top:280px; left:-116px; font-family:'ONE Mobile OTF Regular'; font-size:20px; line-height:140%; z-index:999999999;}
.menu span.num_1 {font-family:"ONE Mobile Title OTF"; line-height:140%; font-size:20px; margin-right:10px;}


.video_text {position: absolute; top:150px; left:140px; z-index:11; font-weight: 400; font-size: 34px; line-height: 140%;}

.video_area_box {position: absolute; top:135px; left:128px;  width:1732px; height:541px; background:url('../images/school/img_3.png') no-repeat; z-index:11;}
.video_area {width:100%; height:100vh; float:left;  position:relative; z-index:1;}
.video_area video.video_box {position: absolute; top:80px; left:0px; width:100%; }


.content_1 {position: absolute; bottom:0px; left:0px; z-index:99; width:100%; height:160px; background: rgba(15, 160, 0, 0.3); backdrop-filter: blur(30px);}
.content_1 .tit_area {margin:0px 0px 0px 128px; float:left; width:640px;}
.content_1 .tit_area span.tit_f {float:left; font-family:'ONE Mobile Title OTF'; font-weight:400; font-size:42px; line-height:140%; margin:30px 0px 0px 25px; color:#fff;}
.content_1 .tit_area span.tit_f p.txt_f {font-weight:400; font-size:23px; line-height:140%; color:#fff; font-family:'ONE Mobile OTF Regular';}
.content_1 .txt_area {margin:35px 0px 0px 50px; font-weight: 200; font-size: 15px; line-height: 180%; color: #fff; font-family:'ONE Mobile OTF Regular'; width:960px;  float:left;}


@media all and  (max-width:1730px){
.content_1 .txt_area {width:800px; float:left;  }
}

@media all and  (max-width:1600px){
.content_1 .txt_area {width:700px; float:left;  }
}

@media all and  (max-width:1512px){
.content_1 .tit_area {margin:0px 0px 0px 100px; width:530px; }
.content_1 .tit_area span.tit_f  {font-size:36px; margin:40px 0px 0px 20px;}
.content_1 .tit_area span.tit_f p.txt_f { font-size:20px;}
.content_1 .txt_area {width:720px; float:left;  }
}


.content_3 {position:relative; float:left; z-index:99; width:100%; background:url('../images/school/bg_3.png') no-repeat; background-size:100% 378px; height:378px; }
.content_3 .tit_area_3 {font-weight: 400; font-size: 43px; line-height: 140%; color: #FFFFFF;padding:184px 0px 76px 138px; font-family:'ONE Mobile Title OTF';  }
.content_3 .tit_area_3 p {font-family:'ONE Mobile OTF Regular';  font-weight: 400; font-size: 15px; line-height: 140%; color: #FFFFFF; margin-top:10px;}

.content_4 {position:relative; float:left; z-index:99; width:100%; background:url('../images/school/bg_4.png') no-repeat right top; background-size:1505px 575px; height:575px;  }
.content_4 .img_a4 {position: absolute; bottom:0px; right:0px;}

.content_4 .text_a4 { background:url('../images/school/Vector_i.png') no-repeat; width:550px; margin:42px 0px 0px 125px; float:left; padding:18px; font-weight: 400; font-size: 20px; line-height: 140%;
color: #3A3A3A; font-family:'ONE Mobile OTF Regular';}
.content_4 .text_a4 p.text_a4_1 {font-family:'ONE Mobile Title OTF'; font-weight: 400; font-size: 30px; line-height: 140%; color: #3A3A3A;}
.content_4 .text_a4 p.text_a4_2 {font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 15px; line-height: 160%; margin-top:40px;}


@media all and  (max-width:1512px){
	.content_3 {background-size:100% 280px; height:280px; }
	.content_3 .tit_area_3 {font-size: 36px; line-height: 140%; padding:140px 0px 76px 105px;}
	.content_4 {height:auto; }
	.content_4 .text_a4 {margin:42px 0px 0px 105px; width:510px;  }
	.content_4 .img_a4 img {width:70%; float:right;}
}


.content_5 {position:relative; float:left; z-index:99; width:100%; background:url('../images/school/bg_5.png') no-repeat; background-size:100% 378px; height:378px; }
.content_5 .tit_area_5 {font-family:'ONE Mobile Title OTF'; font-weight: 400; font-size: 43px; line-height: 140%; color: #FFFFFF; padding:184px 0px 76px 138px;}
.content_5 .tit_area_5 p {font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 15px; line-height: 140%; color: #FFFFFF; margin-top:10px;}


.content_6 {position:relative; float:left; z-index:99; width:100%;  height:575px;  }
.content_6 .img_a6 {position: absolute; top:43px; left:695px;}

.content_6 .text_a6 { background:url('../images/school/Vector_i.png') no-repeat; width:550px; margin:42px 0px 0px 125px; float:left; padding:18px; font-weight: 400; font-size: 20px; line-height: 140%; 
color: #3A3A3A; font-family:'ONE Mobile OTF Regular';}
.content_6 .text_a6 p.text_a6_1 {font-family:'ONE Mobile Title OTF'; font-weight: 400; font-size: 30px; line-height: 140%; color: #3A3A3A;}
.content_6 .text_a6 p.text_a6_2 {font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 15px; line-height: 160%; margin-top:40px;}



@media all and  (max-width:1512px){
		.content_5 {background-size:100% 280px; height:280px; }
		.content_5 .tit_area_5 {font-size: 36px; line-height: 140%; padding:140px 0px 76px 105px;}
		.content_6 {height:auto; }
		.content_6 .text_a6 {margin:42px 0px 0px 105px; width:510px;  }
		.content_6 .img_a6 {position: absolute; top:75px; left:640px;}
		.content_6 .img_a6 img {width:92%; float:left;}
}


.cont_area11 {float:left; margin:230px 0px 0px 226px; width:690px; font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 15px; line-height: 160%; color:#3A3A3A;}
.cont_area12 {position: absolute; top:470px; left:1024px;}

@media all and  (max-width:1512px){
	.cont_area11 { margin:90px 0px 0px 110px; width:680px;}
	.cont_area12 {position: absolute; top:420px; left:860px;}
	.cont_area12 img {width:90%;}
}


.accordion-wrapper {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 99;
    width: 100%;
    height: 100vh;
	background:#fff;
}

.accordion {
    list-style: none;
    margin-left: 68px;
    padding: 0;
display: flex;
    flex-wrap: nowrap;

 
  height: 100vh;
}

.accordion .tabs {
  width: 100px;
  background-color: #000;
  display: flex;
  overflow: hidden;
  position: relative;
  transition: 0.4s ease;
  flex: 0 0 auto; /* ±âº» Å©±â °íÁ¤ */
  
}
.accordion .tabs:hover:not(.is-active) {
  width: 180px;
  cursor: pointer;
}


@media all and  (max-width:1512px){
.accordion .tabs:hover:not(.is-active) {
  width: 150px;
}
}


.accordion .tabs:hover {
  cursor: pointer;
}
.accordion .tabs .tab-header {

  flex-direction: column;
  justify-content: space-between;
  color: black;
  width:100px;
  visibility: visible;
  opacity: 1;
}

.accordion .tabs .tab-header img {height:100vh;}

.accordion .tabs .tab-header .text {
    z-index: 9999;
}

.accordion .tabs .tab-header .text > div {
    position: absolute;
    color: #fff;
    width: 500px;
    bottom: 174px;
    left: 29px;
    font-family: 'ONE Mobile Title OTF';
    font-weight: 400;
    font-size: 30px;
    line-height: 140%;
    transform: rotate(-90deg);
transform-origin: left top;
	 transition: 0.4s ease;
}

.accordion .tabs .tab-header .text > p {
    position: absolute;
    font-family: 'ONE Mobile OTF Regular';
    bottom: 260px;
    left: 119px;
    font-size: 18px;
    transform: rotate(-90deg);
    transform-origin: left top;
    color: #fff;
    width: 500px;
    line-height: 140%;
    opacity: 0;
	  transition: 0.4s ease;
}


.accordion .tabs:hover:not(.is-active) .tab-header .text > div {
    left: 29px;
	  width: 500px;
	    position: absolute;
  transform: rotate(-90deg);
  transform-origin: left top;
}

.accordion .tabs:hover:not(.is-active) .tab-header .text > p {
  
    opacity: 1;
	    left: 119px;
	  width: 500px;
	    position: absolute;
  transform: rotate(-90deg);
  transform-origin: left top;
}


.accordion .tabs:hover:not(.is-active) .tab-header  {
  
   
  flex-direction: column;
  justify-content: space-between;
  color: black;
  width: 100%;
  visibility: visible;
  opacity: 1;

}

.accordion .tabs:hover:not(.is-active) .tab-header .text > div {
    left: 57px;
	  width: 500px;
	    position: absolute;
  transform: rotate(-90deg);
  transform-origin: left top;
}

.accordion .tabs:hover:not(.is-active) .tab-header .text > p {
  
    opacity: 1;
	    left: 119px;
	  width: 500px;
	    position: absolute;
  transform: rotate(-90deg);
  transform-origin: left top;
}


@media all and  (max-width:1512px){
	.accordion .tabs:hover:not(.is-active) .tab-header .text > div {left: 34px;}
   .accordion .tabs:hover:not(.is-active) .tab-header .text > p {  left: 94px;}
}

/* Tab content styles */
.accordion .tabs .tab-content {
  visibility: hidden;
  opacity: 0;
  color: white;
  position: relative;
  width: 100%;
  height:100vh;
}

.accordion .tabs .tab-content .tab-content-wrapper {
  position: absolute;
  z-index: 3;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s 0.3s;
}

.accordion .tabs .tab-content .tab-img {
  position: absolute;
  top: -3rem;
  left: -3rem;
  right: -3rem;
  height: auto;
  width: auto;
  min-width: 100%;
  min-height: 100%;
  z-index: 2;
}

.accordion .tabs.is-active .tab-content {
    visibility: visible;
}

.accordion .tabs .tab-content .tab-content_img1 {
    position: absolute;
    top: 160px;
    left: 1020px;
}

.accordion .tabs .tab-content .tab-content_img2 {
    position: absolute;
    top: 510px;
    left: 90px;
}

@media all and  (max-width:1512px){
	.accordion .tabs .tab-content .tab-content_img1 {    top: 130px; left: 700px; width:510px; height:486px;;}
	.accordion .tabs .tab-content .tab-content_img1 img {width:90%;  }
	.accordion .tabs .tab-content .tab-content_img2 {    top: 450px; left: 30px;}
}

.accordion .tabs.is-active {
    flex: 3;
    flex-shrink: 0;
}

.accordion .tabs.is-active::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.accordion .tabs.is-active .tab-header {
  width: 0;
  visibility: hidden;
  opacity: 0;
}

.accordion .tabs.is-active .tab-content {
  visibility: visible;
  opacity: 1;
}

.accordion .tabs.is-active .tab-content .tab-content-wrapper {
  visibility: visible;
  opacity: 1;
}


.visualban_1 {position:absolute; left:50%; bottom:0px; width:98%; height:100px; margin-left:-49%; z-index:999; background: rgba(255, 255, 255, 0.8); border: 1px solid rgba(255, 255, 255, 0.7); border-top-left-radius: 10px; border-top-right-radius: 10px; 
backdrop-filter: blur(30px); transition: all 0.5s ease; -webkit-transition: all 0.5s ease;}
.visualban_1 ul {height:100%; box-sizing:border-box;}
.visualban_1 > ul > li {position:relative; padding:0px; box-sizing:border-box; text-align:left; align-items:center; overflow:hidden; float:left; z-index:99;}
.visualban_1 > ul > li a{width:100%;}
.visualban_1 > ul > li .cont1{position:relative; width:100%; line-height:30px; font-size:26px;}

.visualban_1 > ul > li .cont1 .left_text { line-height: 22px;  margin:15px 0px 0px 40px; float:left; width:100%;}
.visualban_1 > ul > li .cont1 .left_text > em {display:block; line-height:140%; margin-bottom:9px; font-weight: 200; font-family:'ONE Mobile Title OTF'; color:#3D3D3D; text-align:center; font-size: 14px; width:56px; height:19px; border-radius:20px; background:rgba(255,255,255,0.4);}
.visualban_1 > ul > li .cont1 .left_text > span.c_img {width:50px; height:50px; border-radius:50%; float:left;  margin-right:15px;}
.visualban_1 > ul > li .cont1 .left_text > p.txt1 {float:left; font-family:'ONE Mobile Title OTF'; font-weight: 400; font-size: 18px; line-height: 140%; text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.75); color:#3D3D3D;}
.visualban_1 > ul > li .cont1 .left_text > p.txt2 {float:left; font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 16px; line-height: 140%; text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.75); color: rgba(61, 61, 61, 0.5); width:80%;}
.visualban_1 > ul > li .cont1 .left_text > p.txt3 {float:left; font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 14px; line-height: 160%; color:#3D3D3D; margin-top:10px; opacity:0; width:100%; }
.visualban_1 > ul > li .cont1 .right_text {text-align:right; color:#fff; font-weight: 500; font-size: 18px; margin:42px 40px 0px 0px; float:right; font-family:'ONE Mobile OTF Regular';}
.visualban_1 > ul > li .cont1 .right_text > em{ display:block; opacity:.5; line-height:140%; font-size:16px;	margin-bottom:4px; font-weight: 200; font-family:'ONE Mobile OTF Light';}


.visualban_1 > ul > li:nth-child(1) {width:34%; color:#fff; }
.visualban_1 > ul > li:nth-child(2) {width:22%; color:#fff; }
.visualban_1 > ul > li:nth-child(3) {width:22%; color:#fff; }
.visualban_1 > ul > li:nth-child(4) {width:22%; color:#fff; }

.visualban_1:hover {width:98%; height:140px;}
.visualban_1:hover > ul > li .cont1 .left_text > p.txt3 {font-family:'ONE Mobile OTF Regular'; font-weight: 400; font-size: 14px; line-height: 160%; color:#3D3D3D; margin-top:10px; opacity:1;}

.visualbnn1 > ul > li:hover .cont1::before {opacity:0;	}
.visualban > ul > li .cont1::after{
		position:absolute; right:40px; top:20px;
		width:10px; height:10px; border-radius:50%;
		background:#fff;
		content:"";
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
}
.visualban > ul > li:hover .cont1::after{
		width:25px; height:25px;
		background:url(../images/btn_view.png); background-size:25px 25px;
		z-index:99999;
	}
.visualban > ul > li::before{
		position:absolute; left:0px; top:0px;
		width:101%; height:110px;
		background:url(../images/ban_bg1.png) no-repeat center center; background-size:100% 110px !important;
		opacity:0;
		content:"";
		transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	}



.info_banner_1 {position:absolute; width:260px; height:130px; display:inline-block; z-index:99999; top:450px;left:60px;}
.info_banner_1 .item-inner {position:relative; display:block; width:100%; height:100%; overflow:hidden;}

.info_banner_1 .item-inner a .bg {position:relative; display:block;  width:240px; height:130px; z-index:9; }
.info_banner_1 .item-inner a .bg::before {content:""; top:0; left:0; width:100%; height:100%; position:absolute; background-image:url('../images/banner_1_over.png'); background-size:cover;  transition: all 0.3s ease; background-position:center top; }


.info_banner_1 .item-inner a .bg span.banner_text1 {position:relative; z-index:99; float:left; margin:30px 0px 0px 70px; font-weight: 400; font-size: 14px; color: #000000; font-family:'ONE Mobile OTF Regular';  transition: all 0.3s ease;}
.info_banner_1 .item-inner a .bg p.banner_text2 {position:relative; z-index:99; float:left; margin:40px 0px 0px 30px; text-align:left; font-weight: 400; font-size: 20px; line-height:140%; color: #1496D1; font-family:'ONE Mobile Title OTF';  transition: all 0.3s ease; z-index:99; }
.info_banner_1 .item-inner a .bg p.banner_text3 {position:relative; float:left; margin:20px 0px 0px 25px; text-align:left; font-weight:600; font-size:16px; color:#144883; font-family:'ONE Mobile OTF Regular'; line-height:140%;}


.info_banner_1 .item-inner a .bg:hover::before { width:260px; height:130px; background-image: url('../images/banner_1_over.png'); background-size:cover;  background-position:center top; }
.info_banner_1 .item-inner a .bg:hover span.banner_text1 {float:left; margin:30px 0px 0px 107px; text-align:center; font-size: 14px; color: #000000; font-family:'ONE Mobile OTF Regular'; }
.info_banner_1 .item-inner a .bg:hover p.banner_text3 {float:left; margin:20px 0px 0px 25px; text-align:left; font-weight:600; font-size:16px; color:#144883; font-family:'ONE Mobile OTF Regular'; }


.main_school_seoul {position:absolute; width:440px; height:190px; display:inline-block; z-index:99999; top:195px; left:60px;  }
.main_school_seoul span.school_seoul_logo {width:88px; height:91px; float:left; margin-right:20px;}
.main_school_seoul span.main_school_seoul_txt{font-family:'ONE Mobile Title OTF'; color:#fff; font-weight:400; font-size:34px; line-height:130%; text-align:left; float:left; text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2);}
.main_school_seoul p.main_school_seoul_txt1{margin-top:15px; font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; font-size: 20px; line-height: 140%; text-align:left; float:left; text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2); letter-spacing: -0.009em;}
.main_school_seoul p.main_school_seoul_txt2{font-family:'ONE Mobile OTF Regular'; color: #FFFFFF; font-size: 23.5714px; line-height: 140%; font-weight:500; text-align:left; float:left; text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.2); letter-spacing: -0.025em;}




                                       