@charset "UTF-8";

/* 공통 */
.inner { width: 1200px; margin: 0 auto; }


.visual { overflow: hidden; }
.visual .vs_slider .vs_wrap { position: relative; }
.visual .vs_slider .vs_wrap .vs_text { position: absolute; top: 250px; left: 250px; opacity: 0; font-size: 42px; font-family: "Montserrat", sans-serif; text-shadow: 0 0 3px rgba(255,255,255,0.7); letter-spacing: -0.7px; }

.product { padding: 100px 0; }
.product > div ul li { float: left; width: 33.333333%; padding: 0 40px; }
.product > div > h2 { text-align: center;}
.product > div > p { margin-top: 10px; font-size: 14px; text-align: center; }
.product > div ul { margin-top: 50px; }
.product > div ul li img { width: 100%; opacity: 0.7; transition: all 0.7s; }
.product > div ul li:hover img { opacity: 1; }
.product > div ul li p { padding-top: 20px; text-align: center; font-family: "Montserrat", sans-serif; }

.notice { background-color: #f4f4f4; padding: 100px 0; }
.notice > div > h2 { text-align: center; }
.notice > div > p { margin-top: 10px; font-size: 14px; text-align: center; }

.notice > div .nt_list { width: 600px; margin: 0 auto; padding: 20px 0; }
.notice > div .nt_list dl { padding: 0 10px; }
.notice > div .nt_list dl:not(:last-child) { border-bottom: 1px solid #d9d9d9; margin-bottom: 5px; padding-bottom: 5px; }
.notice > div .nt_list dl dt { float: left; }
.notice > div .nt_list dl dt a:hover { text-decoration: underline !important; }
.notice > div .nt_list dl dd { float: right; color: #a3a3a3; font-weight: 400; font-size: 14px; line-height: 33px; }

.notice > div .nt_wrap { text-align: center; }
.notice > div .nt_wrap a { width: 100px; height: 40px; line-height: 38px; text-align: center; display: inline-block; color: #333; border: 1px solid #333; font-size: 14px; transition: all 0.3s; }
.notice > div .nt_wrap a:hover { color: #fff; background-color: #333; }

@media (max-width: 768px) {
	.inner { width: 100%; }
	.product > div ul li { width: 100%; padding: 0 40px; }
	.product > div ul li:not(:last-child) { margin-bottom: 40px; }
	.product > div ul li p { font-size: 20px; }
	
	.notice > div .nt_list { width: 100%; margin: 0 auto; padding: 20px 20px; }
	.notice > div .nt_list dl dt a { font-size: 14px; line-height: 33px; }
	
	.visual .vs_slider .vs_wrap { height: 600px; background-position: center center; background-size: cover; }
	.visual .vs_slider .vs_wrap.bg1 { background-image: url(/asset/gnkglobal/img/main/main_visual01.jpg)}
	.visual .vs_slider .vs_wrap.bg2 { background-image: url(/asset/gnkglobal/img/main/main_visual02.jpg)}
	.visual .vs_slider .vs_wrap.bg3 { background-image: url(/asset/gnkglobal/img/main/main_visual03.jpg)}
	.visual .vs_slider .vs_wrap img { display: none; }
	.visual .vs_slider .vs_wrap .vs_text { left: 20px; top: 200px; color: #fff; text-shadow: 0 0 3px rgba(0,0,0,0.7); }
}