@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/variable/pretendardvariable.css");
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap');

*{list-style: none; text-decoration: none; margin:0; padding:0; box-sizing: border-box;  letter-spacing:-0.05em; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; color:#1b1b1b;}

button{border:none; background:none;}
input,select{-webkit-border-radius:0; background-color:#fff;}
table, th, thead, tfoot {outline: 0;}
table{border-collapse: collapse; border-spacing: 0;}
body, html {height: 100%;}
html{scroll-behavior: smooth;}
label, input, button, select, img{vertical-align:middle;}

.mart30{margin-top:30px !important;}
.mart40{margin-top:40px !important;}
.mart50{margin-top:50px !important;}
.mart60{margin-top:60px !important;}
.mart100{margin-top:100px !important;}

.w50{width:50px !important;}
.w200{width:200px !important;}
.w220{width:220px !important;}

.ipt_20{width:20% !important;}
.ipt_30{width:30% !important;}
.ipt_40{width:40% !important;}
.ipt_42{width:42% !important;}
.ipt_44{width:44% !important;}
.ipt_57{width:57% !important;}
.ipt_70{width:70% !important;}
.ipt_75{width:75% !important;}

.md10{margin: 10px 0;}
.mr8{margin-right:8px;}


/* ------------------------------------------------------------------------------------------------------------------------------------------------ */


.header {position:fixed; top:0; left:0; width:100%; z-index:1000; height:80px; overflow:hidden; -webkit-transition: height 0.3s; -moz-transition: height 0.3s;  transition: height 0.3s; display:flex;  justify-content: space-between; align-items:center; border-bottom:1px solid #ebebeb; background-color:#fff;}
.inner{width:100%; max-width:1320px; display:flex; justify-content:space-between; align-items:center; margin: 0 auto;}
.hd_left{display:flex; align-items:center; gap:60px;}
.header h1{font-size:22px;}
.header h1 img{width:30px; vertical-align:middle; border-radius:6px; margin-right:8px; margin-top:-2px;}
.header ul{display:flex; gap:45px;}
.header ul li a{color:#545b5d; font-size:16px;}
.header ul li a.active-link{color:#000 !important; font-weight:600;}
.start{font-size:15px; height:40px; background-color:#585858; color:#fff; display:inline-block; text-align:center; line-height:40px; border-radius:8px; padding: 0 15px;}

.page{max-width:1120px; margin: 0 auto; padding-top:80px; text-align:center;}
.page_bg{background-color:#fafafa; margin-top:130px; padding-bottom:80px;}

.ai_info h2{font-size:68px; margin-top:40px;}
.ai_info h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px;}
.ai_info .ai_video{width:850px; height:auto; margin-top:50px; border-radius:20px;}
.ai_info .memo_ig1{width:890px; height:590px; object-fit:cover; object-position:center; border-radius:20px; margin-top:60px;}

.ai_info2 h2{font-size:40px;}
.ai_info2 h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px; line-height:30px;}

.slider-container{display: flex; width: 100%; max-width: 1000px; margin: auto;}
.ai_sld{margin-top:50px;}
.ai_sld .slider-titles {width: 30%; display: flex; justify-content: center; }
.ai_sld .slider-titles ul{height:430px;  display: flex; flex-direction: column; gap:10px;}
.ai_sld .slider-titles li{font-size: 18px; cursor: pointer; transition: 0.3s; padding:15px 0 15px 30px; border-radius:12px; text-align:left; color:#545b5d; flex:1; background-color:#fff; display:flex; align-items:center; width:300px;}
.ai_sld .slider-titles li.active {color: #000; background-color:#eaebec; font-weight:500;}
.ai_sld .slider-titles li.active h5,
.ai_sld .slider-titles li.active .da_p{color:#000; font-weight:500;}
.ai_sld .slider-titles li span{display:flex; width:30px; justify-content:center; align-items:center; margin-right:15px;}
.ai_sld .slider-titles li h5{font-size:18px; font-weight:400; color:#545b5d;}
.ai_sld .slider-titles li .da_p{font-size:15px; margin-top:5px; color:#545b5d; line-height:20px;}
.ai_sld .slider-titles li .txt_wrp{display:flex; flex-direction:column;}


.ai_sld .swiper {width: 65%; height:430px;}
.ai_sld .swiper-slide img {width: 100%; height: 430px; display: block; border-radius:20px; object-fit: cover;}

.ai_memo h2{font-size:40px;}
.ai_memo h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px; line-height:30px;}
.memo_btn{margin:30px 0;}
.memo_btn a{border:1px solid #585858; height:56px; padding: 0 30px; display:inline-block; line-height:56px; color:#585858; background-color:#fff; font-size:18px; border-radius:10px;}
.memo_btn .mbtn_2{margin-left:20px; background-color:#585858; color:#fff;}
.room_bx{margin-top:50px;}
.room_bx img{border-radius:20px;}
.room_if{margin-top:20px;}
.room_if ul{display:flex; gap:20px;}
.room_if ul li{flex:1; background-color:#fbfbfb; border-radius:12px; padding:40px 20px;}
.room_if ul li h4{font-size:24px; font-weight:600; margin:15px 0 18px 0;}
.room_if ul li h5{font-size:20px; color:#595959; font-weight:500; line-height:30px;}

.ai_call{display:flex; justify-content:space-between; align-items:center; gap:100px;}
.aic_1{width:340px;}
.aic_1 video{width:100%; border-radius:20px;}
.aic_2{flex:1;}
.aic_2 h2{font-size:40px;}
.aic_2 h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px; line-height:30px;}

.aic_bx{margin-top:40px; display:flex; flex-wrap:wrap; gap:20px;}
.aic_bx dl{background-color:#fff; flex:1 1 calc(50% - 20px); padding:40px 30px; text-align:left; border-radius:20px; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .25); }
.aic_bx dl dt{font-size:20px; font-weight:600;}
.aic_bx dl dd{font-size:16px; color:#545b5d; margin-top:10px;}    

.ai_riv h2{font-size:40px;}
.ai_riv h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px; line-height:30px;}
.riv_bx{margin-top:60px;}
.riv_sld{background-color:#fbfbfb; padding:50px 35px; text-align:left; border-radius:20px; height:280px !important;}
.riv_sld h3{color:#1b1b1b; font-size:20px; height:100px;}
.riv_sld p{color:#545b5d; font-size:20px; margin-top:15px;}

.sibs h2{font-size:40px;}
.sibs h3{font-size:20px; color:#6d6d6d; font-weight:500; margin-top:20px; line-height:30px;}
.sibs_bx{margin-top:60px;}
.sibs_bx ul{display:flex; gap:20px;}
.sibs_bx ul li{flex:1; border:1px solid #d7dadb; padding: 0 0 30px 0; border-radius:20px;}
.sibs_bx ul li .sbs_hd{height:35px; line-height:35px;}
.sibs_bx ul li .sbs_hdbg{background-color: #585858; border-top-left-radius:20px; border-top-right-radius:20px; color:#fff;}
.sibs_bx ul li .sbs_hdbg2{background-color: #073845; border-top-left-radius:20px; border-top-right-radius:20px;}
.sibs_bx ul li h2 {font-size:30px;}
.sibs_bx ul li h2 .hdg_1 {font-size:20px; font-weight:600;}
.sibs_bx ul li h2 .hdg_2 {color:#767676; font-size:20px; font-weight:500;}
.sibs_bx ul li .sbs_sb{height:90px; padding-top:30px; padding-right:25px; padding-left:25px;}
.sibs_bx ul li button{height:55px; }
.sibs_bx ul li .sbs_btn1{background-color:#585858; width:100%; color:#fff; font-size:16px; border-radius:10px; cursor:pointer;}
.sibs_bx ul li .sbs_btn2{background-color:#073845; width:100%; color:#fff; font-size:16px; border-radius:10px; cursor:pointer;}
.sbs_md{margin-top:40px; border-top:1px solid #d7dadb; padding-top:20px; text-align:left; padding: 20px 25px 0 25px;}
.sbs_md p{font-size:18px; margin-bottom:15px; font-weight:500;} 
.sbs_md p:last-child{margin-bottom:0px;}


/* 푸터 */
.footer{margin-top:120px; padding-top:30px; padding-bottom:40px; border-top:1px solid #dfdfdf; background-color:#fff;}
.ftr{max-width:1320px; margin: 0 auto;}
.ftr h1{font-size:22px; margin-bottom:15px;}
.ftr p{font-size:15px; color:#757575; margin-bottom:10px;}
.ftr .fo_line{margin: 0 8px;}

.swpio2{margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; display: block;}






.pc{display:block;}
.mob{display:none;}


/* 반응형 */
@media (max-width: 400px){
	.pc{display:none;}
	.mob{display:block;}

	.header{padding: 0 20px;}
	.header ul{display:none;}

	.page{width:100%; padding:80px 20px 0 20px !important;}
	.ai_info h2{font-size:44px;}

	.ai_info h3,
	.ai_info2 h3,
	.ai_memo h3,
	.aic_2 h3,
	.ai_riv h3,
	.sibs h3{font-size:18px; line-height:28px;}

	.ai_info2 h2,
	.ai_memo h2,
	.aic_2 h2,
	.ai_riv h2,
	.sibs h2{font-size:36px; line-height:48px;}



	.ai_info .memo_ig1{width:100%; height:260px;}

	.ai_info2{padding:70px 20px !important; }

	.page_bg{margin-top:80px; padding-bottom:0px;}

	.slider-container{display:grid;}

	.ai_sld {flex-direction: column; align-items: center;}
	.ai_sld .swiper {order: 1; width: 100%; height: auto;}
    .ai_sld .swiper-slide img {height: auto; max-height: 300px;}
	.ai_sld .slider-titles {order: 2; width: 100%; margin-top:20px;}
    .ai_sld .slider-titles ul {height: auto; flex-direction: row; flex-wrap: wrap; gap: 10px;}
	.ai_sld .slider-titles li {width: calc(50% - 5px); flex: unset; height: auto; padding:15px;}
	.ai_sld .slider-titles li h5{font-size:16px;}

	.memo_btn{display:none;}
	
	.room_bx {margin-top:25px;}
	.room_bx img{width:100%; height:250px; object-fit:cover;}

	.room_if ul{display:block;}
	.room_if ul li{display:flex; align-items:center; gap:30px; padding:20px; margin-bottom:12px;}
	.room_if ul li img{width:40px;}
	.room_if ul li .mtxbox{display:flex; flex-direction:column; justify-content:center;}
	.room_if ul li .mtxbox h4{font-size:18px; text-align:left; margin:12px 0 10px 0;}
	.room_if ul li .mtxbox h5{font-size:15px; text-align:left; line-height:22px;}
	
	.ai_call{display:unset;}
	
	.aic_1{width:100%; padding:50px 20px 0 20px;}
	.aic_1 img{width:100%; border-radius:15px;}
	.aic_2{padding: 0 20px 40px 20px; margin-top:40px;}
	
	.aic_bx{gap:12px; margin-top:25px;}
	.aic_bx dl{text-align:center; padding:20px 15px;}
	.aic_bx dl dt{font-size:18px;}
	.aic_bx dl dd{font-size:15px;}
	
	.swpio2{margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; display: block;}
	.riv_bx{margin-top:30px;}
	.riv_sld p{font-size:17px; margin-top:0px;}
	.riv_sld{height:255px !important; padding:40px 25px;}

	.sibs_bx{margin-top:50px;}
	.sibs_bx ul{display:unset;}
	.sibs_bx ul li{margin-bottom:30px;}
	
	.sibs_bx ul li .sbs_sb{padding-top:15px;}
	.sbs_md{margin-top:15px;}
	.sbs_md p{font-size:17px;}
	.sibs_bx ul li .sbs_sb{height:85px;}
	.sibs_bx ul li button{height:50px;}

	.footer{padding:30px 20px 40px 20px; margin-top:60px;}
	.ftr h1{font-size:17px;}
	.ftr p{font-size:14px; margin-bottom:7px;}

	.ai_info .ai_video{width:100%; height:300px; object-fit:cover; margin-top:50px; border-radius:20px;}
}


@media (max-width: 360px){
	.ai_info h2{font-size:38px;}

	.ai_info2 h2,
	.ai_memo h2,
	.aic_2 h2,
	.ai_riv h2,
	.sibs h2{font-size:32px; line-height:44px;}
	
	.ai_info h3,
	.ai_info2 h3,
	.ai_memo h3,
	.aic_2 h3,
	.ai_riv h3,
	.sibs h3{font-size:17px; line-height:27px;}

	.riv_sld h3{font-size:17px !important; line-height:24px !important;}
	.riv_sld{height:245px !important; padding:35px 25px;}
	.riv_sld p{font-size:16px;}

	.ai_sld .slider-titles li h5{font-size:15px;}
}