@charset "utf-8"; 
 
.main_container						{padding:100px 0 0 0; overflow:hidden;}

.mainVisual .bxslider				{visibility:hidden;}
.mainVisual .mvideo_box				{position: relative;width: 100%; aspect-ratio:16/9; padding:0; margin:0; }
.mainVisual							{position:relative; top:0; left:0; overflow:hidden;  }  
.mainVisual .item 					{position:relative; height:600px; overflow:hidden;}
.mainVisual .bg 					{overflow:hidden; position:absolute; width:100%; height:100%; top:0; left:0; filter: brightness(0.7); animation:imgScale 3s both;} 
.mainVisual .text					{position:absolute; width:100%; top:47%; transform:translateY(-50%); color:#FFF; z-index:100;} 
.mainVisual .wrap					{animation:slide-up 1.5s cubic-bezier(.5,.2,0,1) forwards; }
.mainVisual .Btit					{font-family: 'S-Core Dream'; font-size:2.55em; line-height:1.3; font-weight:700; letter-spacing:-2px; text-shadow:0 0 10px rgba(0,0,0,0.2);}
.mainVisual .Stit					{font-family: 'S-Core Dream'; font-size:1.4em; line-height:1.6; letter-spacing:-1px; font-weight:300; margin:20px 0 40px 0; text-shadow:0 0 10px rgba(0,0,0,0.3);}
.mainVisual .Sch					{position:relative; max-width:620px; background:#fff; border-radius:50px; overflow:hidden;}
.mainVisual .Sch input[type="text"]	{font-family: 'S-Core Dream'; width:calc(100% - 65px);line-height:72px; border:0; padding:0 0 0 30px;}
.mainVisual .Sch .btn				{width:50px; height:50px; cursor:pointer; background:var(--gra1); color:#fff; border-radius:50%;} 
.mainVisual .Sch .btn i				{font-size:1em;}
.mainVisual .Sch .btn:hover			{background:#000;}
.mainVisual .Sch input::placeholder	{color:#555;}
.mainVisual .Sch input:hover, .mainVisual .Sch input:focus, .mainVisual .Sch input:active	{background:#fff;}

.main_container h2					{font-family: 'S-Core Dream'; font-size:2.1em; letter-spacing:-1px; color:#111; font-weight:500; margin-bottom:40px; line-height:1;}
.main_container h2 span				{font-family: 'S-Core Dream'; margin-left:20px; font-size:18px; color:#666;}
.main_container	h2 .more			{float:right;}
.main_container	h2 .more a			{display:block; font-size:17px; width:42px; height:42px; line-height:36px; border:2px solid #c9c9c9; border-radius:10px; background:#fff; text-align:center;}
.main_container	h2 .more:hover a	{color:#fff; border-color:var(--color1); background:var(--color1);}
.main_container	h2 .more:hover i	{transform:rotate(180deg); transition: all 0.2s;}

.mainClass							{padding:100px 0; position:relative;}
.mainClass .tab						{position:absolute; top:15px; right:0; display:flex; gap:45px;}
.mainClass .tab li					{position:relative; font-family: 'S-Core Dream'; cursor:pointer; padding:0 5px; color:#333;}
.mainClass .tab li:after			{content:''; position:absolute; top:0; right:-25px; bottom:0; width:1px; height:15px; margin:auto; background:#bbb;}
.mainClass .tab li:last-child:after	{display:none;}
.mainClass .tab li.on, .mainClass	.tab li:hover	{font-weight:600;}
.mainClass .tab li.on:before		{content:''; position:absolute; bottom:-7px; left:2px; width:100%; height:3px; background:#0d57b8; border-radius:10px;}
.mainClass .item a					{display:block; padding:25px 35px; min-height:190px; border:1px solid #ddd; border-left:0;}
.mainClass .slick-slide>div .item:first-child a		{border-left:1px solid #ddd;}
.mainClass .slick-slide>div:nth-child(2) .item a, .mainClass .slick-slide>div:nth-child(3) .item a, .mainClass .slick-slide>div:nth-child(4) .item a,
.mainClass .slick-slide>div:nth-child(5) .item a, .mainClass .slick-slide>div:nth-child(6) .item a	{border-top:0 !Important;}
.mainClass .item .cate				{font-family: 'S-Core Dream'; font-size:0.95em; color:#777;}
.mainClass .item .tit				{font-family: 'S-Core Dream'; height:52px; font-size:1.1em; font-weight:500; color:#111; line-height:1.4; margin:7px 0 18px 0; overflow:hidden; text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical; word-wrap:break-word; word-break:keep-all;}
.mainClass .item .date				{font-family: 'Paperlogy'; font-size:0.9em; color:#0d57b8; font-weight:500; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.mainClass .item .date strong		{font-family: 'S-Core Dream'; display:inline-block; background:#0d57b8; border:1px solid #0d57b8; color:#fff; width:65px; line-height:26px; font-size:14px; font-weight:300; text-align:center; margin-right:12px;}
.mainClass .item.closed .date		{color:#999;}
.mainClass .item.closed .date strong	{background:#888f95; border-color:#888f95;}
.mainClass .item:hover				{background:var(--gra);}
.mainClass .item:hover .cate		{color:#fff; opacity:0.8;}
.mainClass .item:hover .tit, .mainClass .item:hover .date	{color:#fff;}
.mainClass .item:hover .date strong	{border-color:rgba(256,256,256,0.6); background:none;}
.mainClass .dots					{margin-top:15px; text-align:center;}
.mainClass .dots li					{padding:0 !important; display:inline-block; margin:0 3px; content:''; width:12px; height:12px; min-height:12px; border-radius:50%;  background:#000; opacity:0.25; overflow:hidden; cursor:pointer;}
.mainClass .dots li:hover, .mainClass .dots .slick-active		{opacity:1; background:var(--color3);}

.mainRoom							{padding:100px 0; position:relative; background:url('../img/main/acc_bg.jpg') no-repeat center 50%; background-size:cover;}
.mainRoom .item						{position:relative; margin:0 -15px; height:370px; overflow:hidden;}
.mainRoom .item li					{margin:0 15px;}
.mainRoom .item .img				{position:relative; aspect-ratio:6/4; overflow:hidden; border:1px solid rgba(0,0,0,0.1);}
.mainRoom .item .img span			{font-family: 'S-Core Dream'; display:block; font-size:0.9em; width:110px; line-height:42px; text-align:center; position:absolute; right:0; bottom:0; background:rgba(0,0,0,0.6); color:#fff; z-index:1;}
.mainRoom .item .tit				{font-family: 'S-Core Dream'; font-size:1.1em; font-weight:500; color:#222; letter-spacing:-1px; margin:20px 0 10px 0; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.mainRoom .item .info				{font-size:0.95em; letter-spacing:-1px; margin:3px 0; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.mainRoom .item .info strong		{font-family: 'S-Core Dream'; color:var(--color1); font-weight:500; font-weight:500; margin-right:15px;}
.mainRoom .item li:hover .img img	{transform: scale(1.1); transition:all 1s ease;}
.mainRoom .item li:hover .img span	{background:var(--color1);}
.mainRoom .arrow					{position:absolute; top:33%; width:100%;}
.mainRoom .arrow p					{position:absolute; text-align:center; width:75px; line-height:75px; background:rgba(0,0,0,0.2); cursor:pointer; border-radius:50%;} 
.mainRoom .arrow p:after			{content:''; display:inline-block; border:solid #fff; border-width:4px 0 0 4px; padding:5px; border-radius:2px;}
.mainRoom .arrow .prev				{left:-120px;}
.mainRoom .arrow .prev:after		{transform:rotate(315deg); margin-left:5px;}
.mainRoom .arrow .next				{right:-120px;}
.mainRoom .arrow .next:after		{transform:rotate(135deg); margin-right:5px;}
.mainRoom .arrow p:hover			{background:var(--color3);} 

.mainBoard							{padding:100px 0;}
.mainBoard:after					{content:''; display:block; clear:both;}
.mainBoard .noti					{float:left; width:calc(100% - 560px);}
.mainBoard .photo					{float:right; width:500px;}	


@media screen and (max-width:1700px) {
	.mainRoom .arrow .prev			{left:-30px;}
	.mainRoom .arrow .next			{right:-30px;}
}
@media screen and (max-width:1400px) {
	.mainVisual .text				{text-align:center; padding:0 20px;}
	.mainVisual .Sch				{margin:auto;}
	.mainClass, .mainRoom, .mainBoard	{padding:100px 20px;}
}
@media screen and (max-width:1200px) {
	.mainBoard .noti				{float:none; width:100%; margin-bottom:20px;}
	.mainBoard .photo				{float:none; width:100%;}
}
@media screen and (max-width:1024px) {
	.main_container					{padding:60px 0 0 0;}

	.mainVisual .item				{aspect-ratio:6 / 3; height:auto;}
	.mainVisual .text				{top:50%;}
	.mainVisual .Btit				{font-size:2em; letter-spacing:-1px;}
	.mainVisual .Stit				{font-size:1.3em; margin:15px 0 30px 0; word-break:keep-all;}
	.mainVisual .Sch				{display:none; max-width:90%;}
	.mainVisual .Sch input[type="text"]	{padding-left:15px; line-height:52px;}
	.mainVisual .Sch .btn			{width:42px; height:42px;}
	.mainVisual .Sch .btn i			{font-size:0.9em;}

	.main_container h2				{font-size:1.6em; margin-bottom:20px; text-align:center;}
	.main_container h2 span			{display:block; margin-top:15px; font-size:15px;}
	
	.mainClass						{padding:40px 15px;}
	.mainClass .tab					{position:relative;top:0; justify-content:center; margin-bottom:20px; gap:25px;}
	.mainClass .tab li:after		{right:-15px; height:13px;}
	.mainClass .tab li				{padding:0 2px;}
	.mainClass .item a				{padding:15px 20px; min-height:auto;}
	.mainClass .item .tit			{height:auto; -webkit-line-clamp:1; margin:5px 0 10px 0;}
	.mainClass .dots				{margin-top:5px;}
	.mainClass .dots li				{width:10px; height:10px; min-height:10px;}

	.mainRoom						{padding:40px 15px;}
	.mainRoom h2 .more				{position:absolute; top:0; right:0;}
	.main_container h2 .more a		{font-size:14px; width:36px; height:36px; line-height:32px;}
	.mainRoom .item li				{margin:0 10px;}
	.mainRoom .item .img			{aspect-ratio:6/3.5;}
	.mainRoom .item .img span		{width:100px; line-height:36px;}
	.mainRoom .item .tit			{margin:15px 0 10px 0;}
	.mainRoom .arrow				{top:40%;}
	.mainRoom .arrow p				{width:46px; line-height:46px; border-radius:0;}
	.mainRoom .arrow p:after		{padding:4px; border-width:3px 0 0 3px; border-radius:0;}
	.mainRoom .arrow .prev			{left:-5px;}
	.mainRoom .arrow .next			{right:-5px;}
	.mainRoom .arrow p:hover		{background:#fff; box-shadow:0 0 15px 1px rgba(0,0,0,.08);}
	.mainRoom .arrow p:hover:after	{border-color:#555;}
	
	.mainBoard						{padding:40px 15px;}
}
@media screen and (max-width:768px) { 
	.mainVisual .item				{aspect-ratio:unset; height:320px;}
	.mainVisual .Btit				{font-size:1.6em;}
	.mainVisual .Stit				{font-size:1em; letter-spacing:0; margin-bottom:20px;}
}
