*{margin: 0; padding: 0;}
li{list-style: none;}
a{text-decoration: none;}
img{vertical-align: top; max-width: 100%; height: auto;}
/**/
html, body {font-family: 'Noto Sans KR', sans-serif; overflow-x: hidden}
.pwrap {width: 90%; max-width: 1200px; position: relative; margin: 0 auto;}
.pwrap:after, ul:after {clear: both; content: ""; display: block;}

@media screen and (max-width : 768px){
    .pc {display: none !important;}
    
    .pwrap {box-sizing: border-box;}
    
}
@media screen and (min-width : 769px){
    .mob {display: none !important;}
}

/**/
.pf_visual {height: 100vh; position: relative;}

.pf_visual .videobox {position: relative; height: 100vh; background: url(../img/sunny00.jpg); background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}
.pf_visual .videobox:before {background: rgba(0,0,0,0.5); width: 100%; height: 100%; position: absolute; left: 0; top: 0; content: ""; z-index: -1;}

.pf_visual .textbox {position: absolute; top: 50%; transform: translateY(-50%); width: 100%; text-align: center;}
.pf_visual .wrap {height: 100%;}
.pf_visual dl {display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff; height: 100%; text-align: center;}
.pf_visual dl dt {font-size: 20px; font-family: 'Poppins', sans-serif;}
.pf_visual dl dd {font-size: 60px; font-weight: bold; line-height: 1.2;}

@media screen and (max-width:768px){
	
	.pf_visual .videobox {background: url(../img/sunny00_m.jpg); background-position: center;}
	
	.pf_visual dl dt {font-size: 3vw;}
    .pf_visual dl dd {font-size: 8vw;}
}

.pf_next {height: 560px; position: relative; overflow: hidden; background-image: url(../img/sejin_vg.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover;}
.pf_next .link {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 888;}
.pf_next .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.pf_next .textbox {position: absolute; top: 150px; color: #fff; z-index: 10; width: 95%; max-width: 1200px; left: 50%; transform: translateX(-50%);}
.pf_next .textbox dl dt {font-size: 20px; font-family: 'Poppins', sans-serif; font-weight: normal;}
.pf_next .textbox dl dd {font-size: 60px; font-weight: bold;}

@media screen and (max-width: 768px) {
    
    .pf_next {height: 250px;} 
    .pf_next .textbox {top: 50px;}
    .pf_next .textbox dl dd {font-size: 30px;}
    
}

.pf_link {padding: 60px 0 60px; text-align: center; background: #f3f4f6;}
.pf_link a {color: #333; font-size: 30px; font-weight: 600;}
.pf_link span {position: relative; top: -5px; margin-right: 20px;}
.pf_link img {vertical-align: middle;}

@media screen and (max-width: 768px) {
    
    .pf_link {padding: 70px 0 60px;}
    .pf_link a {font-size: 20px;}
    
}



/*ㅡㅡㅡㅡ D-wep ㅡㅡㅡㅡ*/
.sunny01 {padding: 100px 0 150px;}
.sunny01 .dl01 {margin-bottom: 40px;}
.sunny01 .dl01 dt {font-size: 30px; margin-bottom: 40px; font-family: 'Poppins', sans-serif; font-weight: bold;}
.sunny01 .dl01 dd {font-size: 18px; color: #666;}
.sunny01 .link {background: #333; color: #fff; font-size: 18px; padding: 15px 0; box-sizing: border-box; display: flex; align-items: center; justify-content: center; max-width: 180px; position: relative;}
.sunny01 .link a {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.sunny01 .link i {margin-left: 6%;}

.sunny02 {max-width: 1371px; margin: 0 auto 170px;}

.sunny03 {text-align: center; padding-bottom: 210px;}
.sunny03 dl {margin-bottom: 120px;}
.sunny03 dl dt {width: 60%; max-width: 715px; margin: 0 auto;}
.sunny03 dl dd {font-size: 35px; color: #666; font-weight: 500;}
.sunny03 ul {display: flex; justify-content: center; transform: translateX(7%); position: relative; z-index: 2;}
.sunny03 ul li:nth-of-type(2) {transform: translate(-20%,20%)}
.sunny03 ul li:nth-of-type(3) {transform: translate(-40%,40%)}
.sunny03 .box {position: relative;}
.sunny03 .box::after {display: block; padding-bottom: 13%; content: "";}
.sunny03 .bg {position: absolute; bottom: 0; left: 40%; transform: translateX(-50%);}

.sunny04 {position: relative; color: #fff;}
.sunny04 .pwrap {position: absolute; top: 0; left: 50%; transform: translateX(-50%); height: 100%;}
.sunny04 .box {position: absolute; right: -50px; top: 55%; transform: translateY(-50%); max-width: 550px; width: 45%;}
.sunny04 dl {margin-bottom: 40px;}
.sunny04 dl dt {font-size: 1.5vw; margin-bottom: 5%;}
.sunny04 dl dd {font-size: 3vw; font-weight: bold;}
.sunny04 p {font-size: 1vw; margin-bottom: 9%; width: 90%; word-break: keep-all; letter-spacing: 2px;}
.sunny04 ul {display: flex;}
.sunny04 ul li {margin-right: 5%;}
.sunny04 ul li:last-child {margin-right: 0;}

.sunny05 {background-image: url(../img/sunny13.png); background-repeat: no-repeat; background-position: center 110%; padding: 140px 0 280px;}
.sunny05 h2 {font-size: 60px; font-weight: 300; line-height: 1; margin-bottom: 70px;}
.sunny05 h2 span {font-weight: bold;}
.sunny05 ul li:nth-of-type(1) {margin-bottom: 60px;}

.sunny06 {height: 100vh; background-image: url(../img/sunny14.jpg); background-repeat: no-repeat; background-position: center; background-attachment: fixed; background-size: auto;}

@media screen and (max-width:768px){
	.sunny01 {padding: 10% 0 15%;}
	.sunny01 .dl01 {margin-bottom: 5%;}
	.sunny01 .dl01 dt {font-size: calc(18px + 2.3438vw); margin-bottom: 3%;}
	.sunny01 .dl01 dd {font-size: calc(12px + .8vw); word-break: keep-all;}
	.sunny01 .link {font-size: calc(12px + .4vw); padding: 15px 0; width: 50%;}

	.sunny02 { margin: 0 auto 20%;}

	.sunny03 {padding-bottom: 20%;}
	.sunny03 dl {margin-bottom: 12%;}
	.sunny03 dl dd {font-size: calc(16px + .5vw);}
	
	.sunny04 {background-image: url(../img/sunny07_m.jpg); background-repeat: no-repeat; background-position: top left; padding-top: 60%; background-size: contain; background-color: #0a2842; padding-bottom: 10%;}
	.sunny04 .pwrap {transform: none; position: relative; left: auto;}
	.sunny04 .box {position: static; right: 0; top: auto; transform: none; max-width: 550px; width: 80%; bottom: 10%; margin-left: auto;}
	.sunny04 dl {margin-bottom: 5%;}
	.sunny04 dl dt {font-size: calc(18px + .4vw); margin-bottom: 0;}
	.sunny04 dl dd {font-size: calc(22px + 1vw); font-weight: bold;}
	.sunny04 p {font-size: calc(14px + .4vw); margin-bottom: 9%; width: 90%; word-break: keep-all; letter-spacing: 2px;}
	.sunny04 ul li {margin-right: 5%;}

	.sunny05 {padding: 15% 0 25%;}
	.sunny05 h2 {font-size: calc(25px + .3vw); margin-bottom: 10%;}
	.sunny05 ul li:nth-of-type(1) {margin-bottom: 5%;}
	
	.sunny06 {height: 450px; background-image: url(../img/sunny14_m.jpg); background-size: cover; background-color: #c4c8cb; background-attachment: scroll;}
	
}



