/* A A A : A : A : A : */ #link_Slider { width : 100%; height : auto; margin-top : 115px; overflow : hidden; position : relative; padding-top : 39%; min-height : 475px; } #link_Slider h1 { font-size : 0; } #link_Slider .link { width : 100%; height : 100%; position : absolute; top : 0; left : 0; } #link_Slider .link .link_Slide { width : 100%; height : 100%; display : flex; justify-content : center; padding : 0 5%; } #link_Slider .link .link_Slide01 { width : 100%; height : auto; background-image : url("../../../../images/slide1.jpg"); background-size : cover; background-position : center; background-repeat : no-repeat; } #link_Slider .link .link_Slide02 { width : 100%; height : auto; background-image : url("../../../../images/slide2.jpg"); background-size : cover; background-position : center; background-repeat : no-repeat; } #link_Slider .link .link_Slide03 { width : 100%; height : auto; background-image : url("../../../../images/slide3.jpg"); background-size : cover; background-position : center; background-repeat : no-repeat; } #link_Slider .link .link_Slide .slideWrap { width : 100%; height : 100%; display : flex; flex-direction : column; justify-content : center; align-items : center; max-width : 1200px; } #link_Slider .link .link_Slide .slideWrap .slideTextBox { width : auto; height : auto; text-align : center; margin-bottom : 8%; } #link_Slider .link .link_Slide .slideWrap .slideTextBox .topTit { width : 100%; height : auto; font-size : clamp(18px,2.5vw,36px); font-weight : 700; color : #fff; word-break : keep-all; margin-bottom : clamp(12px,1.3vw,20px);display : none; text-shadow : 3px 3px 3px #555555;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .subTit { width : 100%; height : auto; font-size : clamp(16px,2.1vw,30px); font-weight : 400; color : #fff; word-break : keep-all; display : none; transition : .4s; text-shadow : 3px 3px 3px #555555;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .subTit b { font-size : inherit;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .subTit svg { font-size : inherit; filter : drop-shadow(3px 3px 3px #555555);} #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox { margin-bottom : 15%; transition : 2s;} #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox .topTit { display : block; transition : 1.5s; } #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox .subTit { display : block; transition : 2s; } #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox .subTit svg { display : inline;} #link_Slider .link .swiper-button-next.link_next, #link_Slider .link .swiper-button-prev.link_prev { color : #fff; z-index : 1; } #link_Slider .link .swiper-pagination.link_pagination { z-index : 1; } #link_Slider .link .swiper-pagination.link_pagination .swiper-pagination-bullet { width : clamp(10px,3vw,14px); height : clamp(10px,3vw,14px); border : 3px solid #fff; opacity : .8; background : none; cursor : pointer; } #link_Slider .link .swiper-pagination.link_pagination .swiper-pagination-bullet:hover { background : #fff; opacity : 1; } #link_Slider .link .swiper-pagination.link_pagination .swiper-pagination-bullet-active { background : #fff; opacity : 1; } #link_Slider .slideBot { width : 40%; height : auto; position :absolute; left : 50%; top : 75%; transform : translate(-50%, -50%); display : flex; z-index : 20; max-width : 690px;} #link_Slider .slideBot a { width : calc(100% / 3); height : auto; margin-right : clamp(10px,2vw,35px); } @media (min-width:641px) and (max-width:1024px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #link_Slider { min-height : auto; padding-top : 50%;} #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox { margin-bottom : 17%;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .topTit br { display : block; } #link_Slider .link .link_Slide .slideWrap .slideTextBox .slideLogo { width : calc(150px + 35vw); padding : 4% 0; } #link_Slider .link .link_Slide .slideWrap .slideTextBox .slideBtn { padding : 1.7% 2.4%; margin-top : 5%; } #link_Slider .link .swiper-button-next.link_next, #link_Slider .link .swiper-button-prev.link_prev { display : none; } #link_Slider .slideBot { top : 70%; width : 50%; max-width : 400px; } } @media (max-width:640px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #link_Slider { min-height : auto; padding-top : 100vw; margin-top : 90px; } #link_Slider .link .link_Slide .slideWrap { align-items : center; } #link_Slider .link .link_Slide03 { background-size : 220% 100%; background-position : 75% bottom;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .topTit br { display : block; } #link_Slider .link .link_Slide .slideWrap .slideTextBox.colorBack .topTit, #link_Slider .link .link_Slide .slideWrap .slideTextBox.whiteBack .topTit { font-size : 14px; } #link_Slider .link .link_Slide .slideWrap .slideTextBox.colorBack .slideLogo, #link_Slider .link .link_Slide .slideWrap .slideTextBox.whiteBack .slideLogo { width : 160px; padding : 6% 0; } #link_Slider .link .link_Slide .slideWrap .slideTextBox.colorBack .subTit, #link_Slider .link .link_Slide .slideWrap .slideTextBox.whiteBack .subTit { font-size : 14px; } #link_Slider .link .link_Slide .slideWrap .slideTextBox .slideBtn { background : none; color : #fff; padding : 2.7% 5.4%; margin-top : 7%; } #link_Slider .link .swiper-button-next.link_next, #link_Slider .link .swiper-button-prev.link_prev { display : none; } #link_Slider .slideBot { top : 78%; width : 90%; max-width : 300px;} } @media (max-width:300px) { /* **************************************************************************************************************************************************************************** */ /* */ /* */ /* 1단 배경 Fixed */ /* */ /* */ /* **************************************************************************************************************************************************************************** */ /* A A A : A : A : A : */ #link_Slider .link .link_Slide .slideWrap .slideTextBox .topTit { font-size : 14px;} #link_Slider .link .link_Slide .slideWrap .slideTextBox .subTit { font-size : 13px;} #link_Slider .link .link_Slide.swiper-slide-active .slideWrap .slideTextBox { margin-bottom : 26%;} #link_Slider .slideBot { width : 90%; top : 72%;} }