/* A A A : A : A : A : */ #Full_Division_blurSlide { width : 100%; height : 100vmin; padding : 0 5%; text-align : center; background-image : url("../../../Image/Full_Division_blurBack2.jpg"); background-size : cover; background-position : center; background-repeat : no-repeat; } #Full_Division_blurSlide .blurSlideWrap { width : 100%; height : 100%; max-width : 1400px; display : flex; flex-direction : row; margin : 0 auto; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox { width : 30%; height : 100%; text-align : left; display : flex; flex-direction : column; justify-content : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .Tit { width : 100%; height : auto; font-size : calc(20px + 2.5vw); font-weight : 300; line-height : 1.1em; color : #fff; position : relative; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .Tit span { width : 100%; height : auto; font-size : calc(20px + 2.5vw); font-weight : 700; line-height : 1.1em; display : inline-block; color : #fff; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .TitLine { width : 1px; height : calc(20px + 2vw); background : #fff; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .subTitBox { width : 100%; height : auto; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .subTitBox .subTit { width : 100%; height : auto; font-size : calc(14px + 0.3vw); font-weight : 200; color : #d3d3d3; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox { width : 70%; height : 100%; display : flex; flex-direction : column; justify-content: center; position : relative; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .contTitBox { width : 100%; height : auto; text-align : right; margin-bottom : 2%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .contTitBox .contTitSlide .swiper-slide .contTit { font-size : calc(16px + 1vw); color : #fff; font-weight : 300; display : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .contTitBox .contTitSlide .swiper-slide-active .contTit { display : block; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .contTitBox .contTitSlide .swiper-slide .contTit span { font-size : calc(20px + 2vw); color : #fff; font-weight : 700; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox { width : 100%; height : 70vmin; overflow : hidden; backdrop-filter : blur(10px); background : #ffffff0f; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide { width : 100%; height : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap { width : 80%; height : 100%; display : flex; flex-direction : column; justify-content : space-evenly; margin : 0 auto; overflow : hidden; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap { width : 100%; height : auto; display : flex; justify-content : space-between; align-items : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox { width : calc(100% - (200px + 9vw)); height : auto; display : flex; flex-direction : column; text-align : left; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox .introduceTit { width : auto; height : auto; font-size : calc(14px + 0.6vw); color : #fff; font-weight : 500; word-break : keep-all; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox .introduceText { width : 90%; height : auto; font-size : calc(12px + 0.3vw); color : #b1b1b1; font-weight : 200; margin : 5% 0 2%; word-break : keep-all; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a { font-size : calc(12px + 0.3vw); color : #b1b1b1; padding : 1% 0; position : relative; overflow : hidden; transition : .4s; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a:hover { color : #68dd4b; transition : .4s; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a .arrow { width : 20px; height : 12px; font-size : 12px; display : inline-block; color : inherit; overflow : hidden; position : relative; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a .arrow::after { content : "→"; position : absolute; top : 50%; transform : translateY(-50%); left : -100%; transition : .4s; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a:hover .arrow::after { left : 20%; transition : .4s; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introduceImg { width : calc(200px + 9vw); height : calc(130px + 7.5vw); } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introduceImg img { width : 100%; height : 100%; object-fit : cover; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap { width : 100%; height : auto; display : flex; justify-content : space-around; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap .introduceIconBox { width : clac(100% / 3); height : auto; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap .introduceIconBox .introduceIcon { width : calc(45px + 0.5vw); height : calc(55px + 0.5vw); display : inline-block; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap .introduceIconBox .introduceIcon img { width : 100%; height : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap .introduceIconBox .iconTit { font-size : calc(14px + 0.4vw); font-weight : 500; color : #fff; margin : 9% 0 3%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceBotWrap .introduceIconBox .iconText { font-size : 16px; font-weight : 300; color : #cdcdcd; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessTitBox { width : 100%; height : auto; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessTitBox .businessTit { width : auto; height : auto; font-size : calc(14px + 0.6vw); color : #fff; font-weight : 500; word-break : keep-all; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox { width : 100%; height : 40vmin; display : flex; justify-content : space-between; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide { width : 70%; height : auto; position : relative; z-index : 1; overflow : hidden; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide a { width : 100%; height : 100%; display : inline-block; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap { width : 100%; height : 100%; display : flex; flex-direction : column; justify-content : space-between; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessImg { width : 80%; height : 65% } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessImg img { width : 100%; height : 100%; object-fit : cover; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessTextBox { width : 100%; height : auto; text-align : left; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessTextBox .businessContTit { font-size : calc(16px + 1vw); color : #fff; font-weight : 500; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessTextBox .businessContText { font-size : calc(12px + 0.2vw); color : #ededed; font-weight : 200; margin-top : 1%; word-break : keep-all; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessSlide a:hover .businessWrap .businessTextBox .businessContTit { color : #68dd4b; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox { width : 25%; height : auto; position : relative; z-index : 2; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox .businessUl { width : 100%; height : 100%; display : flex; flex-direction : column; justify-content : space-between; overflow : scroll; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width : none; /* Firefox */ } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox .businessUl::-webkit-scrollbar { display : none; /* Chrome, Safari, Opera*/ } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox .businessUl .businessLi { font-size : calc(12px + 0.2vw); color : #8f8f8f; padding : 5% 0; cursor : pointer; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox .businessUl .businessLi.clicked { color : #fff; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .businessSlideBox .businessListBox .businessUl .businessLi:hover { color : #fff; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap.CSwrap { justify-content : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csCenterTit { font-size : calc(14px + 0.6vw); color : #fff; font-weight : 500; word-break : keep-all; margin-bottom : 5%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap { width : 100%; height : 40vmin; display : grid; border : 5px solid #5a5a5a42; grid-template-columns : 1fr 1fr; position : relative; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBox { width : 100%; height : auto; display : flex; flex-direction : column; justify-content : center; align-items : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBox .csIcon { width : calc(40px + 0.5vw); height : calc(30px + 0.5vw); margin-bottom : 5%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBox .csIcon img { width : 100%; height : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBox p { font-size : calc(14px + 0.2vw); color : #ededed; font-weight : 300; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBox a:hover p { color : #68dd4b;} #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBoxRowLine { width : 1px; height : 100%; position : absolute; top : 50%; left : 50%; transform : translate(-50%,-50%); background : #ffffff2e; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csBoxWrap .csBoxColumnLine { width : 100%; height : 1px; position : absolute; top : 50%; left : 50%; transform : translate(-50%,-50%); background : #ffffff2e; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .cont_next, #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .cont_prev { color : #ffffff38; } @media (min-width:641px) and (max-width:1024px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #Full_Division_blurSlide { padding : 5%;} #Full_Division_blurSlide .blurSlideWrap { flex-direction : column; justify-content : space-evenly; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox { width : 100%; height : auto; align-items : center; text-align : center;} #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .Tit span { display : inline;} #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .TitLine { width : calc(20px + 2vw); height : 1px; margin : 2% 0;} #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .subTitBox .subTit { display : inline;} #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox { width : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox .introduceText { width : 100%; } } @media (max-width:640px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #Full_Division_blurSlide { height : 85vh; padding : 5%;} #Full_Division_blurSlide .blurSlideWrap { flex-direction : column; justify-content : space-evenly; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox { width : 100%; height : auto; align-items : center; text-align : center; display : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .Tit span { display : inline;} #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .TitLine { width : calc(20px + 2vw); height : 1px; margin : 2% 0;} #Full_Division_blurSlide .blurSlideWrap .blurSlideTitBox .subTitBox .subTit { display : inline;} #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox { width : 100%; justify-content: space-around; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .contTitBox .contTitSlide .swiper-slide .contTit span { line-height : 0em; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox { height : 70vh; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap { width : 90%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceTopWrap { flex-direction : column-reverse; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceTopWrap .introduceImg { width : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceTopWrap .introuduceTitBox { width : 100%; margin-top : 7%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceTopWrap .introuduceTitBox .introduceText { width : 100%; margin : 2% 0 0; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a { color : #68dd4b; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .introduceTopWrap .introuduceTitBox a .arrow::after { left : 20%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceBotWrap .introduceIconBox .introduceIcon { width : 35px; height : 40px; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .introduceBotWrap .introduceIconBox .iconText { display : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessTitBox { display : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox { flex-direction : column; justify-content: flex-end; height : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessSlide { width : 100%; height : 70%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessSlide .businessWrap { justify-content : space-evenly;} #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessSlide .businessWrap .businessImg { width : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessListBox { width : 100%; height : 25%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessListBox .businessUl { flex-direction : row; flex-wrap : wrap; height : 100%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .businessSlideBox .businessListBox .businessUl .businessLi { width : 50%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap.CSwrap { justify-content : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContWrap .csCenterTit { margin-bottom : 15%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap { height : 65%; display : flex; flex-direction : column; justify-content : space-between; border : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap .csBox { flex-direction : column; align-items : center; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap .csBox .csIcon { width : 35px; height : 30px; margin-bottom : 0; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap .csBox p { margin-top : 5%; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap .csBoxRowLine, #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .mainContBox .mainContSlide .mainContWrap .csBoxWrap .csBoxColumnLine { display : none; } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .cont_next { top : 5%; left : 10%; color : #fff; transform : scale(0.4); } #Full_Division_blurSlide .blurSlideWrap .blurSlideContBox .cont_prev { top : 5%; left : 0; color : #fff; transform : scale(0.4);} }