@charset "utf-8";
/* CSS Document */
*/
:root{
	--root--gm:GmarketSans;
	--root--es:EnjoyStories;
}

body {position: relative; background:url('/img/geumjeong/intro/body_bg.jpg') 0 0 no-repeat; background-size: cover; background-attachment: fixed;}
body::before {position: absolute; top:0; left:0; width:728px; height: 628px; content: ""; background: url('/img/geumjeong/intro/bg1.png') 0 0 no-repeat;}
body::after {position: absolute; bottom:0; right:0; width:583px; height: 403px; content: ""; background: url('/img/geumjeong/intro/bg2.png') right bottom no-repeat;}


#wrapper {width:100%;height:100%; /*background: linear-gradient(160deg, #fffaf1 0%, #def8ef 100%);*/ }



/* ---- 상단영역 ---- */
#header{position:relative;top:0;left:0;width:100%;min-width:320px; text-align: center; padding-top: 100px; z-index: 2;}
#header .logo a {display:block;}


/* ---- 컨텐츠영역 ---- */
#intro_content {position: relative; margin: 0 auto; max-width: 1400px; z-index: 2;}
#intro_content .list {display: flex; flex-wrap: wrap; justify-content: space-between; padding: 90px 0 120px 0; margin: 0 auto; max-width: 760px; }
#intro_content .list li {position: relative; display: block; width: 350px; height: 380px; text-align: center;}
#intro_content .list li a {position: relative; display:block; font-family: 'GmarketSans'; width: 100%; height: 100%; border-radius: 40px 40px 100px 40px; box-shadow: 5px 20px 50px rgba(0,0,0,0.1); padding:230px 10px 10px; box-sizing: border-box; transition:transform 0.3s ease;}
#intro_content .list li a:hover {transform:translateY(-30px); text-decoration: none;}
#intro_content .list li a strong {display: block; font-size: 30px; margin-bottom: 20px; line-height: 1.0; font-weight: 500;}
#intro_content .list li a .txt {font-size:18px; color: #666;}
#intro_content .list li a .btn {position: absolute; bottom:0; right: 0; width: 58px; height: 58px; border-radius: 24px;}

#intro_content .list li.style1 a {background:#fff url('/img/geumjeong/intro/box_ico01.png') center 90px no-repeat;}
#intro_content .list li.style1 a strong {color: #2e3192;}
#intro_content .list li.style1 a:hover {border: 1px solid #2e3192;}
#intro_content .list li.style1 a .btn {background:#2e3192 url('/img/geumjeong/intro/ico_arrow.png') center center no-repeat; box-shadow: 5px 5px 14px rgba(46,49,146,0.3);}
#intro_content .list li.style2 a {background:#fff url('/img/geumjeong/intro/box_ico02.png') center 90px no-repeat;}
#intro_content .list li.style2 a strong {color: #047c5d;}
#intro_content .list li.style2 a:hover {border: 1px solid #047c5d;}
#intro_content .list li.style2 a .btn {background:#047c5d url('/img/geumjeong/intro/ico_arrow.png') center center no-repeat; box-shadow: 5px 5px 14px rgba(4,124,93,0.3);}


/* ---- 하단영역 ---- */
#footer {clear:both;position: relative;padding: 50px 40px 40px;width:100%;font-family:'GmarketSans'; font-size: 16px; color: #676767; text-align: center; box-sizing: border-box; word-break:keep-all; z-index: 2;}
#footer .footWrap{margin: 0 auto;max-width: 1400px;}
#footer .footWrap .foot_infor address{margin-bottom: 10px;}
#footer .footWrap .foot_infor address span {display: inline-block; margin-right: 55px;}
#footer .footWrap .foot_infor address strong {display: inline-block; margin-right: 16px; font-weight: 500;}
#footer .footWrap .foot_infor small{display: block; margin-bottom: 25px; font-size:14px; word-break: break-all; font-weight: 400;}




/*
================================================================================
반응형
================================================================================
*/

@media (max-width: 1000px) {
    #wrapper {width: auto; padding-right: 5%; padding-left: 5%;}
	body::before {width:100%; height: 100%; background-size:60%;}
}


 /* Tablet Device */
 @media all and (max-width:800px){
	 body::before {background-size:70%;}
	 body::after {width:100%; height: 100%; background-size:70%;}
	 
	 #header {padding-top: 70px;}
	 
	 #intro_content .list {display: block; max-width: none; width: 100%; padding: 60px 0 60px 0;}
	 #intro_content .list li {width: 100%; height: inherit; text-align: left; margin-bottom: 30px;}
	 #intro_content .list li:last-child {margin-bottom: 0;}
	 #intro_content .list li a {padding:70px 30px 60px 140px;}
	 #intro_content .list li a:hover {transform:translateY(0px);}
	 #intro_content .list li a strong {font-size: 24px; margin-bottom: 10px;}
	 #intro_content .list li a .txt {font-size: 16px;}
	 
	 #intro_content .list li.style1 a {background-position:46px 66px; background-size: 58px 48px;}
	 #intro_content .list li.style2 a {background-position:46px 66px; background-size: 68px 55px;}
	 
}


/* Mobile Device */
@media all and (max-width:500px){
	#intro_content .list {padding: 60px 0 20px 0;}
	#intro_content .list li a {padding:60px 20px 60px 120px; border-radius: 30px 30px 80px 30px;}
	#intro_content .list li a strong {font-size: 20px;}
	#intro_content .list li a .txt {font-size: 15px;}
	#intro_content .list li a .btn {width: 48px; height: 48px; border-radius: 20px;background-size: 50%;}
	#intro_content .list li.style1 a .btn,
	#intro_content .list li.style2 a .btn {background-size: 34%;}
	
	#intro_content .list li.style1 a {background-position:36px 56px;}
	#intro_content .list li.style2 a {background-position:30px 56px;}
	
	#footer .footWrap .foot_infor address span { margin-right:0;}
}