@charset "utf-8";

/* 메인페이지 스타일만 정의 */


/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {
	
	.visual {position:relative; height:100%; margin:0 auto; overflow:hidden;}
	.visual .sliderWrap {max-width:1200px; width:100%; height:auto; margin:0 auto; position:relative;}
	.visual .sliderWrap>div {position:absolute; top:250px; width:606px; height:487px;}
	.visual .sliderObj li {opacity:0;}
	.visual .sliderObj .sliderWrap>div p {font-family:'ssFlower'; color:#fff; line-height:0.3; letter-spacing:-4px; text-align:center; text-shadow:3px 3px 3px rgba(0,0,0,.15);}
	.visual .sliderObj .sliderWrap>div p:first-child {padding-top:160px;}
	.visual .sliderObj .sliderWrap>div p:first-child .slogan {font-size:136px; text-transform:uppercase;}
	.visual .sliderObj .sliderWrap>div p:first-child>span {font-size:200px; vertical-align:top;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:first-child {margin-right:10px;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:last-child {margin-left:10px;}
	.visual .sliderObj .sliderWrap>div p:last-child {font-size:90px; line-height:0.8; padding-top:25px;}
	
	.visual .sliderObj .sliderWrap {width:100%; height:100%;}
	.visual .sliderWrap.right:before {position:absolute; bottom:-40px; right:-153px; width:153px; height:148px; display:inline-block; content:""; background:url(../images/type1/shape1_right.png);}
	.visual .sliderWrap.right:after {position:absolute; bottom:50px; left:-90px; z-index:999990; width:186px; height:177px; display:inline-block; content:""; background:url(../images/type1/shape1_left.png);}
	.visual .sliderWrap.right>div {right:-45px; background:url(../images/type1/shape1.png)no-repeat center;}
	.visual .sliderWrap.right>div p {padding-right:45px;}
	.visual .sliderWrap.left:before {position:absolute; bottom:50px; right:-153px; z-index:999990; width:186px; height:177px; display:inline-block; content:""; background:url(../images/type1/shape2_right.png);}
	.visual .sliderWrap.left:after {position:absolute; bottom:-40px; left:-50px; z-index:999990; width:152px; height:148px; display:inline-block; content:""; background:url(../images/type1/shape2_left.png);}
	.visual .sliderWrap.left>div {left:-45px; background:url(../images/type1/shape2.png)no-repeat center;}
	.visual .sliderWrap.left>div p {padding-left:45px;}
	
	.visual .sliderButton2 {position:absolute; top:450px; width:100%; height:155px; z-index:999990;}
	.visual .sliderButton2>div {max-width:100%; margin:0 auto; text-align:center;}
	.visual .sliderButton2>div a {display:inline-block; width:181px; height:155px; background:url(../images/type1/btn_counsel.png)no-repeat; color:#fff; font-size:22px; line-height:1; padding-top:40px;}
	.visual .sliderButton2>div a span {display:inline-block; width:100%; padding-top:10px;}
	
	.main>div {max-width:1200px; margin:0 auto;}
	
	.main.photo {background:#fbb253; text-align:center;}
	.main.photo>div {color:#fff; padding:50px 0 90px;}
	.main.photo>div h2 {font-size:100px; font-family:'ssFlower';}
	.main.photo>div p {font-size:20px; margin-bottom:50px;}
	.main.photo>div>.classSlider {position:relative; overflow:hidden; height:56px;}
	.main.photo>div>.classSlider>a {position:absolute; top:0; width:140px; background:#fbb253;}
	.main.photo>div>.classSlider>a.stop {left:0;}
	.main.photo>div>.classSlider>a.play {right:0;}
	.main.photo>div>.classSlider ul {
		overflow:hidden; padding:0 140px; height:56px;
		z-index:0; position:absolute; font-size:0; line-height:0; white-space:nowrap;
	}
	.main.photo>div>.classSlider ul li {display:inline-block;}
	.main.photo>div>.classSlider ul li+li {background:url(../images/main/line.jpg)no-repeat 0 center;}
	.main.photo>div>.classSlider ul li a {
		color:#fff; font-size:32px; padding:0 80px;
		display:inline-block; height:56px; line-height:56px;
	}
	
	
	.main.quick {text-align:center; background:url(../images/main/quick_bg.jpg)no-repeat center; background-size:cover; padding:100px 0;}
	.main.quick ul {overflow:hidden; width:100%;}
	.main.quick ul li {float:left; width:25%; padding-top:10px;}
	.main.quick ul li a {color:#fff;}
	.main.quick ul li a h3 {font-size:30px; margin:25px 0 30px; font-weight:400;}
	.main.quick ul li a p {font-size:18px; line-height:1.2;}
	.main.quick ul li a img {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.main.quick ul li a:hover img {
		-webkit-transform: scale(1.06);
		transform: scale(1.06);
	}
	.main.quick ul li a:hover h3 {transition-duration:0.3s;}
	.main.quick ul li:nth-child(1) a:hover h3 {color:#ff9f37;}
	.main.quick ul li:nth-child(2) a:hover h3 {color:#fffe58;}
	.main.quick ul li:nth-child(3) a:hover h3 {color:#68ff4f;}
	.main.quick ul li:nth-child(4) a:hover h3 {color:#64f6ff;}


	.main.smart {background:#6ddcf2; text-align:center;}
	.main.smart>div {overflow:hidden; padding:65px 0;}
	.main.smart>div>div {float:left;}
	.main.smart>div>div:first-child {width:60%;}
	.main.smart>div>div:last-child {width:40%; color:#fff; padding:60px 0;}
	.main.smart>div>div:last-child h2 {font-family:'ssFlower'; font-size:120px;}
	.main.smart>div>div:last-child p {font-size:26px; line-height:1.2; margin:50px 0;}
	.main.smart>div>div:last-child a {display:inline-block; padding:20px 30px 25px; border:1px solid #fff; font-size:24px; letter-spacing:1px; line-height:1; color:#fff;}
	.main.smart>div>div:last-child a:hover {background:rgba(255,255,255,1); color:#6ddcf2;}
}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px), print {
	
	/* body {border:3px solid blue;} */
	
	.visual {position:relative; height:100%; margin:0 auto; overflow:hidden;}
	.visual .sliderWrap {width:100%; height:100%; margin:0 auto; position:relative;}
	.visual .sliderWrap>div {top:250px; width:405px; height:326px;}
	.visual .sliderObj li {opacity:0;}
	.visual .sliderObj .sliderWrap>div p {font-family:'ssFlower'; color:#fff; line-height:0.6; letter-spacing:-2px; text-align:center; text-shadow:3px 3px 3px rgba(0,0,0,.15);}
	.visual .sliderObj .sliderWrap>div p:first-child {padding-top:90px;}
	.visual .sliderObj .sliderWrap>div p:first-child .slogan {font-size:96px; text-transform:uppercase;}
	.visual .sliderObj .sliderWrap>div p:first-child>span {font-size:120px; vertical-align:top;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:first-child {margin-right:10px;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:last-child {margin-left:10px;}
	.visual .sliderObj .sliderWrap>div p:last-child {font-size:54px; line-height:0.8; padding-top:15px;}
	
	.visual .sliderWrap.right:before {position:absolute; bottom:-60px; right:0; z-index:999990; width:153px; height:148px; display:inline-block; content:""; background:url(../images/type1/shape1_right.png);}
	.visual .sliderWrap.right:after {position:absolute; bottom:50px; left:-100px; z-index:999990; width:186px; height:177px; display:inline-block; content:""; background:url(../images/type1/shape1_left.png);}
	.visual .sliderWrap.right>div {position:absolute; right:-80px; background:url(../images/type1/shape1.png)no-repeat center; background-size:405px; /* border:1px solid red; */}
	.visual .sliderWrap.right>div p {padding-right:30px;}
	.visual .sliderWrap.left:before {position:absolute; bottom:50px; right:-100px; z-index:999990; width:186px; height:177px; display:inline-block; content:""; background:url(../images/type1/shape2_right.png);}
	.visual .sliderWrap.left:after {position:absolute; bottom:-60px; left:0; z-index:999990; width:153px; height:148px; display:inline-block; content:""; background:url(../images/type1/shape2_left.png);}
	.visual .sliderWrap.left>div {position:absolute; left:-80px; background:url(../images/type1/shape2.png)no-repeat center; background-size:405px; /* border:1px solid red; */}
	.visual .sliderWrap.left>div p {padding-left:30px;}
	
	.visual .sliderButton2 {display:none;}
	
	.main>div {max-width:1200px; margin:0 auto;}
	
	.main.photo {background:#fbb253; text-align:center;}
	.main.photo>div {color:#fff; padding:50px 0 70px;}
	.main.photo>div h2 {font-size:90px; font-family:'ssFlower';}
	.main.photo>div p {font-size:18px; margin-bottom:40px;}
	.main.photo>div>.classSlider {position:relative; overflow:hidden; height:35px;}
	.main.photo>div>.classSlider>a {position:absolute; top:0; width:90px; background:#fbb253;}
	.main.photo>div>.classSlider>a.stop {left:0;}
	.main.photo>div>.classSlider>a.play {right:0;}
	.main.photo>div>.classSlider>a>img {width:24px;}
	.main.photo>div>.classSlider ul {
		overflow:hidden; padding:0 90px; height:35px;
		z-index:0; position:absolute; font-size:0; line-height:0; white-space:nowrap;
	}
	.main.photo>div>.classSlider ul li {display:inline-block;}
	.main.photo>div>.classSlider ul li+li {background:url(../images/main/line.jpg)no-repeat 0 center;}
	.main.photo>div>.classSlider ul li a {
		color:#fff; font-size:24px; padding:0 60px;
		display:inline-block; height:35px; line-height:35px;
	}	
	
	.main.quick {text-align:center; background:url(../images/main/quick_bg.jpg)no-repeat center; background-size:cover; padding:70px 0 50px;}
	.main.quick ul {overflow:hidden; width:100%;}
	.main.quick ul li {float:left; width:50%; padding-top:10px; padding-bottom:50px;}
	.main.quick ul li a {color:#fff;}
	.main.quick ul li a h3 {font-size:26px; margin:20px 0; font-weight:400;}
	.main.quick ul li a p {font-size:16px; line-height:1.2;}
	.main.quick ul li a img {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.main.quick ul li a:hover img {
		-webkit-transform: scale(1.06);
		transform: scale(1.06);
	}
	.main.quick ul li a:hover h3 {transition-duration:0.3s;}
	.main.quick ul li:nth-child(1) a:hover h3 {color:#ff9f37;}
	.main.quick ul li:nth-child(2) a:hover h3 {color:#fffe58;}
	.main.quick ul li:nth-child(3) a:hover h3 {color:#68ff4f;}
	.main.quick ul li:nth-child(4) a:hover h3 {color:#64f6ff;}


	.main.smart {background:#6ddcf2; text-align:center;}
	.main.smart>div {overflow:hidden; padding:50px 30px 30px;}
	.main.smart>div>div {float:left; width:100%;}
	.main.smart>div>div:first-child img {width:80%;}
	.main.smart>div>div:last-child {color:#fff; padding:20px 0;}
	.main.smart>div>div:last-child h2 {font-family:'ssFlower'; font-size:90px;}
	.main.smart>div>div:last-child p {font-size:18px; line-height:1.2; margin:20px 0 30px; word-break:keep-all;}
	.main.smart>div>div:last-child p br {display:none;}
	.main.smart>div>div:last-child a {display:inline-block; padding:15px 30px 20px; border:1px solid #fff; font-size:20px; letter-spacing:1px; line-height:1; color:#fff;}
	.main.smart>div>div:last-child a:hover {background:rgba(255,255,255,1); color:#6ddcf2;}
}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px), print {
	
	/* body {border:3px solid red;} */
	
	.visual .sliderWrap>div {top:200px; width:300px; height:241px;}
	.visual .sliderObj .sliderWrap>div p {line-height:0.5; letter-spacing:-2px;}
	.visual .sliderObj .sliderWrap>div p:first-child {padding-top:70px;}
	.visual .sliderObj .sliderWrap>div p:first-child .slogan {font-size:72px;}
	.visual .sliderObj .sliderWrap>div p:first-child>span {font-size:90px;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:first-child {margin-right:7px;}
	.visual .sliderObj .sliderWrap>div p:first-child>span:last-child {margin-left:7px;}
	.visual .sliderObj .sliderWrap>div p:last-child {font-size:46px; line-height:0.8; padding-top:15px;}
	
	.visual .sliderWrap.right>div {right:-40px;}
	.visual .sliderWrap.left>div {left:-40px;}
	.visual .sliderWrap.right>div,
	.visual .sliderWrap.left>div {background-size:300px;}
	
	.visual .sliderWrap.right:before {bottom:-110px; right:-20px;}
	.visual .sliderWrap.right:after {bottom:30px; left:-140px;}
	.visual .sliderWrap.right>div p {padding-right:20px;}
	.visual .sliderWrap.left:before {bottom:30px; right:-140px;}
	.visual .sliderWrap.left:after {bottom:-110px; left:-20px;}
	.visual .sliderWrap.left>div p {padding-left:20px;}
	
	
	
	
	.main.photo>div {color:#fff; padding:50px 0;}
	.main.photo>div h2 {font-size:80px; font-family:'ssFlower';}
	.main.photo>div p {font-size:16px; margin-bottom:20px; padding:0 30px; word-break:keep-all;}
	.main.photo>div>.classSlider {position:relative;}
	.main.photo>div>.classSlider>a {position:absolute; top:0; width:60px;}
	
	.main.photo>div>.classSlider ul {overflow:hidden; padding:0 60px; height:35px;}
	.main.photo>div>.classSlider ul li a {color:#fff; font-size:20px; line-height:35px; padding:0 50px;}
	
	.main.quick {text-align:center; background:url(../images/main/quick_bg.jpg)no-repeat center; background-size:cover; padding:50px 30px;}
	.main.quick ul {overflow:hidden; width:100%;}
	.main.quick ul li {float:left; width:100%; padding-top:10px; padding-bottom:50px;}
	.main.quick ul li a {color:#fff;}
	.main.quick ul li a h3 {font-size:22px; margin:20px 0 10px; font-weight:500;}
	.main.quick ul li a p {font-size:16px; line-height:1.4; word-break:keep-all;}
	.main.quick ul li a p br {display:none;}
	
	.main.smart>div>div:last-child h2 {font-size:80px;}
	.main.smart>div>div:last-child p {font-size:16px; line-height:1.4;}
	.main.smart>div>div:last-child a {letter-spacing:0;}
	
	
	

	
	
}