@charset "utf-8"; 


/* VISUAL  ================================================================================== */
.main_container						{padding:170px 0 0 0; overflow:hidden;}

.mainVisual							{display:none; position:relative; overflow:hidden;}  
.mainVisual .item 					{position:relative; height:600px; overflow:hidden;}
.mainVisual .item img				{width:100%; height:100%; object-fit:cover;animation:imgScale 3s both;}
.mainVisual .acc					{position:absolute; width:100%; top:20%; transform:translateX(-50%); text-align:left; z-index:100; color:#fff;  animation:slide-up 3s cubic-bezier(.5,.2,0,1) forwards;}
.mainVisual .acc dt					{font-family: 'S-CoreDream-3Light'; font-size:2.8em; letter-spacing:-3px; margin-bottom:25px; line-height:1.25;}
.mainVisual .acc dt em				{font-family: 'SpoqaHanSansNeo-Regular';  display:block; color:#95d0ff; font-size:18px; letter-spacing:2px; margin-bottom:20px;}
.mainVisual .acc dt strong			{display:block; font-family: 'S-CoreDream-6Bold';}
.mainVisual .acc dd					{font-family: 'S-CoreDream-4Regular'; font-size:1.2em; line-height:1.6; }	
.mainVisual .default .item			{height:600px; background:url('../img/main/back_default.jpg') no-repeat center 50%; background-size:cover; animation:imgScale 3s both;}
.mainVisual .default .acc dt		{color:#111; }
.mainVisual .default .acc dt em		{color:var(--color1);}
.mainVisual .default .acc dd		{color:#414141;}
.mainVisual .default:after			{content:''; display:block; width:1800px; height:480px; position:absolute; bottom:0; left:0;right:0; margin:auto; background:url('../img/main/back_acc.png') no-repeat right bottom;} 
.mainVisual .mvideo_box				{position: relative; width:100%; aspect-ratio:16/9; padding:0; margin:0;}

.mHeadline dt					{font-family: 'S-CoreDream-6Bold'; font-size:2em; color:#111; letter-spacing:-2px; line-height:1.2;}
.mHeadline dd					{font-family: 'S-CoreDream-4Regular'; color:#555; font-size:1.1em; margin:20px 0 40px 0; line-height:1.6;}

.mainQuickbn					{padding:100px 0 120px 0; text-align:center; }
.mainQuickbn .web_size			{display:grid; grid-template-columns:repeat(5, 1fr); gap:0 25px;}
.mainQuickbn .web_size a		{display:grid; align-items:center; border-radius:20px; height:260px; min-width:100%; flex:1; background:url('../img/main/backBlue.jpg') no-repeat center 50%; background-size:cover;}
.mainQuickbn .web_size dl		{color:#fff;}
.mainQuickbn .web_size dl dt	{font-family: 'S-CoreDream-6Bold'; font-size:1.3em; margin-bottom:12px;}
.mainQuickbn .web_size dl dd	{font-family: 'S-CoreDream-4Regular';}
.mainQuickbn .more				{font-size:14px; padding:2px 15px; display:inline-block; border:1px solid #fff; border-radius:50px; margin-top:20px;}
.mainQuickbn .more i			{font-size:10px; margin:0 0 3px 5px; vertical-align:middle;}
.mainQuickbn .web_size a:nth-child(2) 	{background-image:url('../img/main/backGreen.jpg'); transform: translateY(30px);}
.mainQuickbn .web_size a:nth-child(3) 	{background-image:url('../img/main/backYe.jpg');}
.mainQuickbn .web_size a:nth-child(4) 	{background-image:url('../img/main/backOr.jpg'); transform: translateY(30px);}
.mainQuickbn .web_size a:last-child 	{background-image:url('../img/main/backGr.jpg');}
.mainQuickbn .web_size a:hover	{transform: translateY(-10px); transition: .5s;}
.mainQuickbn .web_size a:nth-child(2):hover, .mainQuickbn .web_size a:nth-child(4):hover	{transform: translateY(20px);}
.mainQuickbn .web_size a:hover .more	{background:rgba(0,0,0,0.5); border:none;}

.mainPro						{position:relative; padding:100px 0 80px 0; }
.mainPro .tab					{position:absolute; right:0; top:0; display:flex; gap:0 40px;}
.mainPro .tab li				{position:relative;}
.mainPro .tab li:after			{content:''; position:absolute; top:0; right:-19px; bottom:0; width:1px; height:12px; margin:auto; background:#c7c7c7;}
.mainPro .tab li:last-child:after	{display:none;}
.mainPro .tab li a				{font-family: 'S-CoreDream-4Regular'; color:#666; padding:0 2px; font-size:1.1em;}
.mainPro .tab .on a				{position:relative; font-family: 'S-CoreDream-6Bold'; color:#000;}
.mainPro .tab .on a:after		{content:''; position:absolute; left:0; bottom:-7px; width:100%; height:3px; border-radius:5px; background:var(--color1); }
.mainPro .item					{position:relative; margin:-15px;}
.mainPro .item .slick-list		{padding-top:40px;}
.mainPro .item li				{position:Relative; margin:15px; transition: .5s;}
.mainPro .item figure			{aspect-ratio:6 / 4; box-shadow:0 0 15px 1px rgba(0,0,0,.1); border-radius:20px; overflow:hidden;}
.mainPro .item figure img		{width:100%; height:100%; object-fit:Cover;}
.mainPro .item dt				{margin:25px 0 15px 0;}
.mainPro .item dt strong		{font-family: 'S-CoreDream-4Regular'; display:inline-block; font-size:0.9em; background:#0d57b8; color:#fff; line-height:32px; width:80px; text-align:center; border-radius:50px; margin-right:5px;}
.mainPro .item dt span			{font-family: 'S-CoreDream-4Regular'; font-size:0.95em; color:#555;}
.mainPro .item dt p				{font-family: 'S-CoreDream-5Medium'; font-size:1.1em; line-height:1.4; color:#333; overflow:hidden; margin-top:10px; text-overflow:ellipsis;-o-text-overflow:ellipsis; display:-webkit-box;-webkit-line-clamp: 2;-webkit-box-orient:vertical; word-wrap:break-word;}
.mainPro .item dd				{color:#666; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; letter-spacing:0;}
.mainPro .item dd span			{font-family: 'S-CoreDream-5Medium'; font-size:0.95em; color:var(--color1); margin-right:15px;}
.mainPro .item .end dt strong	{background:#888;}
.mainPro .item li:hover			{transform: translateY(-15px);}
.mainPro .arrow					{position:absolute; top:50%; width:100%;}
.mainPro .arrow p				{position:absolute; text-align:center; width:75px; line-height:75px; background:rgba(0,0,0,0.2); cursor:pointer; border-radius:50%;} 
.mainPro .arrow p:after			{content:''; display:inline-block; border:solid #fff; border-width:4px 0 0 4px; padding:5px; border-radius:2px;}
.mainPro .arrow .prev			{left:-120px;}
.mainPro .arrow .prev:after		{transform:rotate(315deg); margin-left:5px;}
.mainPro .arrow .next			{right:-120px;}
.mainPro .arrow .next:after		{transform:rotate(135deg); margin-right:5px;}
.mainPro .arrow p:hover			{background:var(--color1);} 

.mainBoard						{padding:100px 0; background:url('../img/main/back_default.jpg') no-repeat center 50%; background-size:cover;}
.mainBoard:after				{content:''; display:block; clear:both;}
.mainBoard .noti				{float:left; width:calc(100% - 560px);}
.mainBoard .news_item 			{background:#fff; padding:45px; border-radius:0 5px 40px 40px; box-shadow:0 0 15px 1px rgba(0,0,0,.08);}
.mainBoard .photo				{float:right; width:500px;}
.mainBoard .tit					{font-family: 'S-CoreDream-3Light'; font-size:2.6em; line-height:1.2; margin-bottom:40px; letter-spacing:-3px; text-align:center; color:#111; animation:slide-up 3s cubic-bezier(.5,.2,0,1) forwards;}
.mainBoard .tit em				{font-family: 'SpoqaHanSansNeo-Regular';  display:block; color:var(--color1); font-size:18px; letter-spacing:2px; margin-bottom:15px;}
.mainBoard .tit strong			{font-family: 'S-CoreDream-6Bold';}

.mainAfter						{padding:100px 0; background:#f4f5f7;}
.mainAfter .web_size			{display:grid; grid-template-columns:auto 25%; gap:40px;}
.mainAfter .web_size>div		{position:relative; min-width:0;}

.mFamsite						{position:relative; padding:30px 0; text-align:center; border-top:1px solid #ddd;}
.mFamsite .bottom_slickslider	{overflow:hidden;}
.mFamsite ul					{width:calc(100% - 60px); margin:0 auto;}
.mFamsite .arrow				{position:absolute; top:calc(50% - 20px); width:100%;}
.mFamsite .arrow p				{position:absolute; width:30px; height:30px; cursor:pointer;}
.mFamsite .arrow p:after		{content:''; display:inline-block; border:solid #d1d1d1; border-width:0 3px 3px 0; padding:7px; margin:10px 0 0 10px;}
.mFamsite .arrow p:hover:after	{border-color:#333;}
.mFamsite .prev					{left:10px;}
.mFamsite .prev:after			{transform: rotate(135deg);}
.mFamsite .next					{right:10px;}
.mFamsite .next:after			{transform: rotate(-45deg);}
.mFamsite .slick-list			{padding:0;}
.mFamsite img					{margin:0 auto;}


@media screen and (max-width:1700px) {
	.mainVisual .default:after	{width:100%;}
	.mainPro .arrow .prev		{left:-40px;}
	.mainPro .arrow .next		{right:-40px;}
}

@media screen and (max-width:1480px) {
	.mainVisual .default:after		{height:60%; background-size:contain;}
	.mainVisual .acc				{top:15%; padding:0 40px;}
	.mainQuickbn, .mainPro, .mainBoard, .mainAfter	{padding:100px 40px;}
	.mainQuickbn .web_size			{gap:0 20px;}
	.mainQuickbn .web_size a		{height:auto;}
	.mainQuickbn .web_size dl		{padding:20px 15px;}
	.mainQuickbn .web_size dl dd br	{display:none;}
}

@media screen and (max-width:1200px) {
	.mainVisual .item, .mainVisual .default .item	{aspect-ratio:6 / 3; height:100%;}
	.mainVisual .default:after		{right:20px; height:45%;}
	.mainBoard .noti	{width:50%;}
	.mainBoard .photo	{width:45%;}
	.mainAfter .web_size	{grid-template-columns:auto 33%;}
}

@media screen and (max-width:1024px) {
	.main_container					{padding:60px 0 0 0;}
	.mainVisual .acc dt				{font-size:2.2em; margin-bottom:15px; line-height:1.4;}
	.mainVisual .acc dt em			{font-size:14px; margin-bottom:7px;}
	.mainVisual .acc dd				{font-size:1.1em;}
	.mainVisual .acc dd br			{display:none;}

	.mHeadline dt					{font-size:1.4em;}
	.mHeadline dd					{font-size:0.95em; margin:7px 0 20px 0;}
	.mainQuickbn					{padding:40px 15px;}
	.mainQuickbn .web_size			{gap:10px; grid-template-columns:repeat(3, 1fr);}
	.mainQuickbn .web_size dl dt	{font-size:1.1em; margin-bottom:7px;}
	.mainQuickbn .web_size dl dd	{font-size:0.95em;}
	.mainQuickbn .web_size dl .more	{font-size:12px; margin-top:15px; padding:0 12px;}
	.mainQuickbn .web_size a:nth-child(2), .mainQuickbn .web_size a:nth-child(4)	{transform:unset;}

	.mainPro						{padding:40px 15px 20px 15px;}
	.mainPro .mHeadline				{text-align:center;}
	.mainPro .tab					{position:relative; justify-content:center; margin-top:10px; gap:0 25px;}
	.mainPro .tab li:after			{right:-15px;}
	.mainPro .tab li a				{font-size:0.95em;}
	.mainPro .arrow p				{width:46px; line-height:46px; border-radius:5px;}
	.mainPro .arrow p:after			{padding:4px; border-width:3px 0 0 3px; border-radius:0;}
	.mainPro .arrow .prev			{left:-10px;}
	.mainPro .arrow .next			{right:-10px;}
	.mainPro .item					{margin:0 -10px;}
	.mainPro .item .slick-list		{padding:10px;}
	.mainPro .item li				{margin:10px;}
	.mainPro .item dt				{margin:20px 0 10px 0;}
	.mainPro .item dt p				{font-size:1.05em;}
	.mainPro .item dt strong		{width:75px; line-height:26px;}
	.mainPro .item dd span			{margin-right:12px;}
	.mainPro .item dl:hover,.mainQuickbn .web_size a:hover	{transform:unset;}
	.mainPro .arrow					{top:35%;}

	.mainBoard						{padding:40px 15px;}
	.mainBoard .noti				{float:none; width:100%; margin-bottom:20px;}
	.mainBoard .photo				{float:none; width:100%;}
	.mainBoard .news_item			{padding:20px;}
	.mainBoard .tit					{font-size:2em; margin-bottom:20px;}
	.mainBoard .tit em				{font-size:14px; margin-bottom:7px;}

	.mainAfter						{padding:40px 15px;}
	.mainAfter .web_size			{display:block;}
	.mainAfter .lt					{margin-bottom:20px;}

	.mFamsite						{padding:20px 0;}
	.mFamsite .arrow				{top:calc(50% - 15px);}
	.mFamsite ul					{width:calc(100% - 40px);}
	.mFamsite .arrow p:after		{padding:4px;}
	.mFamsite .prev					{left:0;}
	.mFamsite .next					{right:10px;}
	.mFamsite img					{width:80%;}
}


@media screen and (max-width:768px) { 
	.mainVisual .item, .mainVisual .default .item	{aspect-ratio:unset; height:320px;}
	.mainVisual .acc dt				{font-size:1.7em;}
	.mainVisual .acc dd				{font-size:1em;}

	.mainCurrent .tab ul			{width:90%; grid-template-columns:repeat(3, 1fr);}

	.mainBoard .tit strong			{display:block;}
}
