@charset "utf-8";

/**************************************************
	Layout CSS Document
	IEETU Web Standardization Team
	2023-11-10
**************************************************/

/**************************************************
	Main
**************************************************/
.cont_main{
	--g-radius-xlarge1:var(--g-number-9);
}
@media (max-width:767px){
	.cont_main{
		--g-radius-xlarge1:var(--g-number-7);
	}
}
.main-sect{margin-top:8rem;}
.main-sect:last-child{padding-bottom:var(--g-pc-gap-layout-contents-footer);}
.main-ban-wrap{background:url(../images/main/bg_main_ban.jpg) no-repeat 50% 0;}
.main-ban-wrap .inner{max-width:none; padding:6rem 0;}
.main-ban-wrap .main-headline{display:flex; flex-direction:column; align-items:center; gap:var(--g-gap-5);}
.main-ban-wrap .main-headline .txt-wrap{display:flex; gap:var(--g-gap-3);}
.main-ban-wrap .main-headline .txt{background-repeat:no-repeat; background-size:contain; forced-color-adjust:none; mask-repeat:no-repeat; mask-position:50% 50%; mask-size:contain;}
.main-ban-wrap .main-headline .t1{width:423px; height:27px; background-color:var(--g-light-color-text-basic); mask-image:url(../images/main/txt_headline01.svg);}
.main-ban-wrap .main-headline .t2{width:343px; height:47px; background-image:linear-gradient(to right, #478aca, #005af0); mask-image:url(../images/main/txt_headline02.svg);}
.main-ban-wrap .main-headline .t3{width:485px; height:47px; background-image:linear-gradient(to right, #005af0, #005af0); mask-image:url(../images/main/txt_headline03.svg);}
.main-ban-wrap .sch-form-wrap{max-width:44rem; margin:4.8rem auto 0;}
.main-ban-wrap .sch-form-wrap .sch-input{width:100%;}
.main-ban-wrap .sch-form-wrap .sch-input .g-input{height:5.6rem; margin:0; border-radius:5.6rem; border-color:#111;}
.main-ban-wrap .sch-form-wrap .sch-input .ico-sch{mask-image:url(../images/common/icon/ico_sch_bold.svg); background-color:#0068ff;}
.main-ban-wrap .meetzone{position:relative; margin-top:4rem;}
@media screen and (min-width:1024px){
	.main-ban-wrap .meetzone .item > .inr{width:32.8rem;}
}
.main-ban-wrap .meetzone .item > .inr{position:relative; margin:0 10px;}
.main-ban-wrap .meetzone .item .in{display:flex; flex-direction:column; gap:var(--g-gap-3);}
.main-ban-wrap .meetzone .item .img{display:block; position:relative; aspect-ratio:1/1; overflow:hidden; border-radius:var(--g-radius-xlarge1); background-color:#fff; box-shadow:5px 10px 10px 0 rgba(0, 0, 0, 0.12);}
.main-ban-wrap .meetzone .item .img:after{content:''; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid rgba(0, 0, 0, 0.05); border-radius:var(--g-radius-xlarge1);}
.main-ban-wrap .meetzone .item .img img{width:100%; height:100%; object-fit:scale-down; transition:var(--g-transition-base);}
.main-ban-wrap .meetzone .item a:hover .img img{transform:scale(1.05);}
.main-ban-wrap .meetzone .item .badge-wrap{display:flex; align-items:center; flex-wrap:wrap; gap:var(--g-gap-2); margin-top:var(--g-gap-4);}
.main-ban-wrap .meetzone .item .g-badge{border-radius:2.4rem;}
.main-ban-wrap .meetzone .item .b-open{background-color:#2303e8; color:#fff;}
.main-ban-wrap .meetzone .item .b-coming{background-color:#8a0dcd; color:#fff;}
.main-ban-wrap .meetzone .item .b-closed{background-color:#6f6f6f; color:#fff;}
.main-ban-wrap .meetzone .item .b-indv{background-color:#fff6de;}
.main-ban-wrap .meetzone .item .b-school{background-color:#fff6de;}
.main-ban-wrap .meetzone .item .tit{display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:1;}
.main-ban-wrap .meetzone .nav{margin-top:2.4rem;}
.main-ban-wrap .meetzone .nav .count{display:none;}
.main-ban-wrap .meetzone .nav .area_ctrl{display:flex; align-items:center; gap:var(--g-gap-3);}
.main-ban-wrap .meetzone .nav .area_ctrl{display:flex; align-items:center; justify-content:center;}
.slick-button{display:flex; align-items:center; justify-content:center; flex-shrink:0; width:var(--g-size-height-6); height:var(--g-size-height-6); border-radius:var(--g-radius-max); border:.1rem solid var(--g-color-light-gray-90);}
.slick-button:hover{background-color:var(--g-light-color-action-secondary-hover);}
.slick-button::after{content:''; display:inline-flex; width:var(--g-icon--size-large); height:var(--g-icon--size-large); background-color:var(--g-light-color-text-basic); forced-color-adjust:none; mask-repeat:no-repeat; mask-position:50% 50%; mask-size:contain;}
.slick-button.pause::after{mask-image:url(../images/common/icon/ico_swiper_stop.svg);}
.slick-button.play::after{mask-image:url(../images/common/icon/ico_swiper_play.svg);}
.slick-button.next::after{mask-image:url(../images/common/icon/ico_angle.svg); transform:rotate(-90deg);}
.slick-button.prev::after{mask-image:url(../images/common/icon/ico_angle.svg); transform:rotate(90deg);}
.slick-button.more::after{mask-image:url(../images/common/icon/ico_plus.svg);}
.main-ban-wrap .meetzone .nav .dots{display:block; padding:0 var(--g-gap-4);}
.main-ban-wrap .meetzone .nav .dots ul{display:flex; justify-content:center; align-items:center; width:21rem; height:.5rem; border-radius:.5rem; background-color:var(--g-color-light-gray-30);}
.main-ban-wrap .meetzone .nav .dots ul li{flex:1; height:100%;}
.main-ban-wrap .meetzone .nav .dots button{display:block; position:relative; width:100%; height:100%; overflow:hidden; border-radius:.5rem; background:none; color:transparent;}
.main-ban-wrap .meetzone .nav .dots .slick-active button{background:var(--g-color-light-gray-60);}
.main-sect .main-box-responsive{display:flex; gap:6rem;}
.main-tit-wrap{display:flex; align-items:center; justify-content:space-between; gap:var(--g-gap-5);}
.main-tit-wrap .tit{font-size:var(--g-pc-font-size-heading-xlarge); font-weight:800;}
.main-tit-wrap .more{height:4.4rem; border-radius:4.4rem;}
.main-sect .main-noti{display:flex; flex-direction:column; gap:var(--g-gap-7); flex:1; overflow:hidden;}
.main-sect .noti-list{flex:1; padding:0 var(--g-pc-padding-card-medium); border:1px solid var(--g-light-color-border-gray-light); border-radius:var(--g-radius-xlarge1);}
.main-sect .noti-list li:not(:last-child){border-bottom:1px solid var(--g-light-color-border-gray-light);}
.main-sect .noti-list li a{display:flex; justify-content:space-between; align-items:center; gap:var(--g-gap-5); padding:var(--g-gap-7) 0 var(--g-gap-6);}
.main-sect .noti-list li a .tit{font-weight:700; font-size:1.8rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.main-sect .noti-list li a .tit:hover{text-decoration:underline; text-underline-offset:var(--g-font-underline-offset);}
.main-sect .noti-list li a .date{font-size:1.6rem;}
.main-sect .more a{display:block; padding:25px 0; font-size:1.6rem; text-align:center;}
.main-sect .more a span{display:inline-flex; align-items:center;}
.main-sect .more a span:after{content:''; width:16px; height:16px; margin-left:5px; background:url(../images/main/ico_more.png) no-repeat 0 0/cover;}
.main-sect .main-svc{flex:1; overflow:hidden;}
.main-sect .svc-list{display:grid; grid-template-columns:1fr 1fr; grid-gap:var(--g-gap-9); height:100%;}
.main-sect .svc-list > li{min-width:0;}
.main-sect .svc-list a{display:block; position:relative; height:100%;}
.main-sect .svc-list .in{display:flex; align-items:center; gap:var(--g-gap-5); position:relative; height:100%; overflow:hidden; padding:var(--g-pc-padding-card-small); border-radius:var(--g-radius-xlarge1); forced-color-adjust:none; mask-repeat:no-repeat; mask-position:100% 100%; mask-size:auto; mask-image:url(../images/main/bg_bsn_round.svg); transition:var(--g-transition-base);}
.main-sect .svc-list a:hover .in{border-radius:4rem;}
.main-sect .svc-list .i1{background-color:#ebfbd7;}
.main-sect .svc-list .i2{background-color:#fff6de;}
.main-sect .svc-list .i3{background-color:#e8f1fe;}
.main-sect .svc-list .i4{background-color:#e4f7f4;}
.main-sect .svc-list .ico{flex-shrink:0; width:8rem; height:8rem; background-position:0 0; background-size:contain; transition:var(--g-transition-base);}
.main-sect .svc-list  a:hover .ico{transform:translateX(-6px);}
.main-sect .svc-list .i1 .ico{background-image:url(../images/main/ico_svc01.svg);}
.main-sect .svc-list .i2 .ico{background-image:url(../images/main/ico_svc02.svg);}
.main-sect .svc-list .i3 .ico{background-image:url(../images/main/ico_svc03.svg);}
.main-sect .svc-list .i4 .ico{background-image:url(../images/main/ico_svc04.svg);}
.main-sect .svc-list .text{display:flex; flex-direction:column; align-items:flex-start; gap:var(--g-gap-3);}
.main-sect .svc-list .text .txt{font-size:1.6rem;}
.main-sect .svc-list .text .tit{font-weight:800; font-size:1.8rem; color:transparent; background-clip:text; background-size:200% 100%; background-position:100% 0; transition:var(--g-transition-base);}
.main-sect .svc-list .i1 .text .tit{background-image:linear-gradient(to right, #0cba76 50%, #000 50%);}
.main-sect .svc-list .i2 .text .tit{background-image:linear-gradient(to right, #f15c0b 50%, #000 50%);}
.main-sect .svc-list .i3 .text .tit{background-image:linear-gradient(to right, #8421d0 50%, #000 50%);}
.main-sect .svc-list .i4 .text .tit{background-image:linear-gradient(to right, #2335e8 50%, #000 50%);}
.main-sect .svc-list a:hover .text .tit{background-position:0;}
.main-sect .svc-list .btn{display:flex; align-items:center; justify-content:center; position:absolute; right:0; bottom:0; width:4.8rem; height:4.8rem; border-radius:50%; background-color:var(--g-color-light-gray-90); transition:var(--g-transition-base);}
.main-sect .svc-list a:hover .i1 + .btn{background-color:#0cba76;}
.main-sect .svc-list a:hover .i2 + .btn{background-color:#f15c0b;}
.main-sect .svc-list a:hover .i3 + .btn{background-color:#8421d0;}
.main-sect .svc-list a:hover .i4 + .btn{background-color:#2335e8;}
.main-sect .svc-list .btn:after{content:''; display:inline-flex; width:var(--g-icon--size-large); height:var(--g-icon--size-large); background-color:#fff; forced-color-adjust:none; mask-repeat:no-repeat; mask-position:50% 50%; mask-size:contain; mask-image:url(../images/common/icon/ico_more.svg); transform:rotate(-45deg); transition:var(--g-transition-base);}
.main-sect .svc-list a:hover .btn:after{transform:rotate(0);}
.main-sect .main-bsn{display:flex; flex-direction:column; gap:var(--g-gap-7); flex:1; overflow:hidden;}
.main-sect .bsn-list{display:grid; grid-template-columns:1fr 1fr 1fr 1fr; grid-gap:var(--g-gap-5);}
.main-sect .bsn-list > li{flex:1; min-width:0; aspect-ratio:360/540;}
.main-sect .bsn-list a{display:block; height:100%; overflow:hidden; border-radius:var(--g-radius-xlarge1);}
.main-sect .bsn-list .in{position:relative; overflow:hidden; height:100%; background-repeat:no-repeat; background-position:50% 0; background-size:cover;}
.main-sect .bsn-list .in:after{content:''; position:absolute; inset:0; background-color:rgba(0,0,0,0.15); opacity:0; transition:var(--g-transition-base);}
.main-sect .bsn-list a:hover .in:after{opacity:1; backdrop-filter:blur(3px);}
.main-sect .bsn-list .i1{background-image:url(../images/main/bg_bsn01.jpg);}
.main-sect .bsn-list .i2{background-image:url(../images/main/bg_bsn02.jpg);}
.main-sect .bsn-list .i3{background-image:url(../images/main/bg_bsn03.jpg);}
.main-sect .bsn-list .i4{background-image:url(../images/main/bg_bsn04.jpg);}
.main-sect .bsn-list .text{display:flex; flex-direction:column; align-items:center; position:absolute; z-index:10; top:calc(50% + 1rem); left:0; right:0; padding:0 var(--g-pc-padding-card-small); color:#fff; text-align:center; transition:var(--g-transition-base);}
.main-sect .bsn-list a:hover .text{top:50%; transform:translateY(-50%);}
.main-sect .bsn-list .text:before{content:''; display:block; position:absolute; left:0; right:0; bottom:calc(100% + 1rem); width:9rem; height:9rem; margin:0 auto; background-color:#fff; forced-color-adjust:none; mask-repeat:no-repeat; mask-position:50% 50%; mask-size:contain; transition:var(--g-transition-base); transition-property:opacity;}
.main-sect .bsn-list a:hover .text:before{opacity:0;}
.main-sect .bsn-list .i1 .text:before{mask-image:url(../images/main/ico_bsn01.svg);}
.main-sect .bsn-list .i2 .text:before{mask-image:url(../images/main/ico_bsn02.svg);}
.main-sect .bsn-list .i3 .text:before{mask-image:url(../images/main/ico_bsn03.svg);}
.main-sect .bsn-list .i4 .text:before{mask-image:url(../images/main/ico_bsn04.svg);}
.main-sect .bsn-list .tit{font-weight:800; font-size:2.8rem;}
.main-sect .bsn-list .txt{display:-webkit-box; opacity:0; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:5; margin-top:3rem; transition:var(--g-transition-base);}
.main-sect .bsn-list a:hover .txt{opacity:1;}
.main-sect .bsn-list .more{display:inline-flex; opacity:0; align-items:center; justify-content:center; height:4.4rem; margin-top:5.6rem; padding:0 var(--g-gap-6); border-radius:4.4rem; background-color:#0068ff; font-weight:700; font-size:1.5rem; transition:var(--g-transition-base);}
.main-sect .bsn-list a:hover .more{opacity:1;}
.main-sect .bsn-list .more .svg-icon{gap:var(--g-gap-3); width:var(--g-icon--size-small); height:var(--g-icon--size-small); background-color:#fff;}

/* Tablet  ~ 1500px */
@media all and (max-width:1500px){
	.main-sect .main-box-responsive{gap:4rem;}
	.main-sect .svc-list{grid-gap:var(--g-gap-5);}
	.main-sect .svc-list .in{gap:var(--g-gap-3); padding:var(--g-mobile-padding-card-xsmall);}
	.main-sect .svc-list .text .tit{font-size:1.7rem;}
}

@media all and (max-width:1280px){
	.main-sect .svc-list .ico{width:5rem; height:5rem;}
	.main-sect .bsn-list .text{padding:0 var(--g-mobile-padding-card-small);}
	.main-sect .bsn-list .tit{font-size:2.4rem;}
	.main-sect .bsn-list .txt{margin-top:2.4rem;}
	.main-sect .bsn-list .more{margin-top:4rem;}

}

/* Tablet 768px ~ 1023px */
@media all and (max-width:1023px){
	.main-ban-wrap .main-headline .txt-wrap{flex-direction:column; align-items:center;}
	.main-ban-wrap .main-headline .t3{background-image:linear-gradient(to right, #478aca, #005af0);}
	.main-sect .main-box-responsive{flex-direction:column; gap:2rem;}
	.main-sect .bsn-list{grid-template-columns:1fr 1fr;}

}

/* Mobile ~ 767px */
@media all and (max-width:767px){
	.main-sect{margin-top:5rem;}
	.main-sect:last-child{padding-bottom:var(--g-mobile-gap-layout-contents-footer);}
	.main-ban-wrap{background-size:cover; background-position:60% 0;}
	.main-tit-wrap .tit{font-size:var(--g-mobile-font-size-heading-large);}
	.main-ban-wrap .inner{padding:5rem var(--g-contents-padding-x);}
	.main-ban-wrap .main-headline .t1{aspect-ratio:423/27; width:240px; height:auto;}
	.main-ban-wrap .main-headline .t2{aspect-ratio:343/47; width:auto; height:30px;}
	.main-ban-wrap .main-headline .t3{aspect-ratio:485/47; width:auto; height:30px;}
	.main-ban-wrap .sch-form-wrap{margin:3.2rem auto 0;}
	.main-ban-wrap .sch-form-wrap .sch-input .g-input{height:4.8rem;}

	.main-ban-wrap .meetzone{margin:3rem -0.8rem 0;}
	.main-ban-wrap .meetzone .item > .inr{margin:0 .8rem;}
	.main-ban-wrap .meetzone .item .img{box-shadow:4px 8px 6px 0 rgba(0, 0, 0, 0.12);}
	.main-ban-wrap .meetzone .item .tit{ -webkit-line-clamp:2;}
	.main-ban-wrap .meetzone .nav .dots ul{width:10rem;}

	.main-sect .main-noti{gap:var(--g-gap-6);}
	.main-tit-wrap .more{height:4rem;}
	.main-sect .noti-list{padding:0 var(--g-mobile-padding-card-medium);}
	.main-sect .noti-list li a{flex-direction:column; align-items:flex-start; gap:var(--g-gap-3); padding:var(--g-gap-5) 0 var(--g-gap-4);}
	.main-sect .noti-list li a .tit{width:100%;}
	.main-sect .svc-list .btn{width:3.4rem; height:3.4rem;}
	.main-sect .svc-list .btn:after{width:var(--g-icon--size-medium); height:var(--g-icon--size-medium);}
	.main-sect .svc-list .in{flex-direction:column; align-items:flex-start; padding:var(--g-mobile-padding-card-xsmall); mask-size:360px 360px;}
	.main-sect .svc-list .ico{margin:0 auto;}
	.main-sect .svc-list .text .txt{font-size:1.5rem;}
	.main-sect .main-bsn{gap:var(--g-gap-6);}
	.main-sect .bsn-list .text{padding:0 var(--g-mobile-padding-card-xsmall);}
	.main-sect .bsn-list .text:before{width:4rem; height:4rem;}
	.main-sect .bsn-list .tit{font-size:1.7rem;}
	.main-sect .bsn-list .txt{margin-top:2rem; -webkit-line-clamp:4; font-size:1.5rem;}
	.main-sect .bsn-list .more{height:4rem; margin-top:2rem;}

}

@media all and (max-width:639px){
}
