/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

/*@import url(/css/NotoSansCJKkr.css);*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 16px;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	/*line-height: 1;*/
	font-family: 'Noto Sans Korean','Malgun Gothic','맑은 고딕',helvetica,'Apple SD Gothic Neo', sans-serif;
	font-weight:400;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a{
    text-decoration:none;
    display:block;
}

li{
    list-style:none;
}

div, a, li, p, input, textarea {
    box-sizing:border-box;
}

input { -webkit-appearance: none; -webkit-border-radius: 0; }

/* clearfix */
.clearFix{content:""; display:block; clear:both;}

/* font */
/*.title{font-size:6vw; font-weight:700; color:#000; line-height:9.5vw; margin-bottom:8vw;}*/
/*.title span{display:block;}*/
/*.subTitle{font-size:4vw; font-weight:700; color:#000; line-height:5.75vw; margin-bottom:4vw}*/
/*.contents{font-size:3vw; color:#373737; line-height:5.25vw;}*/

/* color */
.colorWhite{color:#fff;}

/* textOverflow */
.textOverflow{text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;overflow:hidden;}

/* show */
.show{display:block !important;}

/* header */
#header{
	width:100%; 
	box-sizing:border-box;
	position:fixed; 
	left:0; top:0; 
	z-index:100; 
	padding:12.5px 20px;
}
.header_cont{
	width:100%; 
	position:relative;
}
.commonLogo{
	width:31.5vw;
	display:inline-block;
}
.commonLogo img{
	max-width: 70%;
	padding-top: 7px;
}
#logoPc{
	display:none;
}

#hamBtn{
	position:absolute; 
	right: 5px; top: 25%;
}
#hamBtn img{
	width:5vw; 
	max-width:30px;
}

#hamMenu{
	width:100%; 
	height:100%; 
	background:#fff; 
	position:fixed; 
	overflow:auto; 
	right:-100%; top:0;
}
#hamCloseBtn{
	width:5.5vw; 
	max-width:30px; 
	position:absolute; 
	padding:10px; 
	right:28px; 
	top:2vw;
}
#hamMenuLogo{
	width:31.5vw; 
	position:absolute; 
	padding-left:20px; 
	left:20px; top:13px;
}
#hamMenuLogo img{
	width:100%;
}
#hamList{
	width:100%; 
	padding-top:50vw;
}
#hamList li{
	text-align:center; 
	margin-bottom:20vw;
}
#hamList li a{
	font-size:5vw; 
	font-weight:700; 
	color:#000; 
	letter-spacing:0.25vw;
}
#hamListDownload{
	font-size:3vw !important; 
	border:1px solid #000; 
	border-radius:10px; 
	display:inline-block;
	padding:3.75vw 7.5vw;
}
#hamListDownload img{
	width:3vw; 
	margin-left:0.5vw;
}

#menu{
	display:inline-block; 
	position:absolute; 
	top:0; right:0; 
	display:none;
}
#menu li{
	float:left;
	padding:0 65px; 
}
#menu li a{
	height:50px; 
	line-height:50px;
	color:#fff; 
	font-size:1rem; 
	font-weight:600;
}
#menu li:last-child{
	padding-right:0;
}
#menu li:last-child a{
	/*padding: 0px 35px;*/
	border-radius: 50px;
	/*background: #a632f0;;*/
}
#listDownLoad{
	padding:0 35px !important; 
	line-height:45px !important; 
	border:2px solid #e5e5e5; 
	border-radius:10px; 
	font-weight:400 !important;
}

/* content */
.container{
	width:100%;
}
.content{
	width:100%; 
	position:relative;
	/* padding:12.5vw 40px*/
}
.common_cont{
	position:relative; 
	padding: 0 25px; 
	width: 100%;
}


/* 메인 공통 */
.common_h2{
	font-size: 25px;
    font-weight: bold; 
    line-height: 35px;
    color: #41414d;
    padding-top: 70px;
}
.common_h2 span{
    display: block;
}
.common_h3{
    padding-top: 30px;
    color: #41414d;
    font-size: 16px;
    font-weight: bold;
}
.common_p{
	padding-top: 10px;
    color: #78787f;
    font-size: 14px;
    line-height: 20px;
}
.common_table{
	/*padding-top: 30px;*/
}
.common_list{
	padding-top: 30px;
    overflow: hidden;
}

/* 스와이퍼 공통 */
.swiper-button-next::after, .swiper-button-prev::after{
	content:"" !important;
}
.swiper-button-next{
	/*width: 40px !important; */
	/*height: 40px !important; */
	right:-3vw !important;  
	background:url(/img/btn_r_click.png) no-repeat; 
	background-size:cover; 
	background-position:center;
	/*margin-right: 20px;*/
}
.swiper-button-prev{
	width: 40px !important; 
	height: 40px !important; 
	left:-3vw !important; 
	background:url(/img/btn_l_click.png) no-repeat; 
	background-size:cover; 
	background-position:center;
	/*margin-left: 20px;*/
}

.category_box .swiper-button-next {
	width: 15px !important;
}

/* contents slide */
#process{
	/*background:#f7f7f7*/
}
.contents_num{
	font-size:3.5vw; 
	margin-bottom:2vw;
}
.contents_title{
	height:8vw; 
	font-size: 16px; 
	line-height: 32px; 
	font-weight:700; 
	margin-bottom:1vw;
}
.contents_description span{
	display: block;
	font-size: 12px;
	line-height: 20px;
}


/* footer */
#footer{
	padding: 70px 0;
	width:100%; 
	box-sizing:border-box; 
	background:#1d1d1d
}
#footer h2{
	color:#fff;
	padding-top: 0;
}
#footer p{
	color:#818181; 
	font-size: 14px; 
	margin-bottom: 10px;
}
#footerTermsLink{
	color:#818181; 
	font-size: 14px;
	padding-top: 20px;
	padding-bottom: 10px; 
	margin-bottom: 15px; 
	display:inline-block; 
	border-bottom:1px solid #818181
}

.widthBtn {
	width: 200px;
	padding-top: 30px;
}
.widthBtnImg {
	width: 100%;
}

@media (min-width: 414px){
	.widthBtn {
		width: 230px;
		/*padding-top: 30px;*/
	}
}

@media (min-width: 600px){
	/* 메인 공통 */
	.common_h2{
	    font-size: 35px;
        line-height: 45px;
	}
	.common_h2 span{
		display: block;
	}
	.common_h3{
        font-size: 19px;
	}
	.common_p{
	    padding-top: 10px;
        color: #9a9ba4;
        font-size: 14px;
        line-height: 20px;
	}
	.common_list{
        overflow: hidden;
	}


	.contents_description span{
	    display: block;
	    font-size: 13px;
	    line-height: 20px;
	}
}


@media (min-width: 768px){
	/* 메인 공통 */
	.common_box{
		padding: 0 10px;
	}
	.common_h2{
	    font-size: 45px;
        line-height: 55px;
        padding-top: 100px;
	}
	.common_h2 span{
		/*display: inline-block;*/
	}
	.common_h3{
        padding-top: 60px;
        /*font-size: 22px;*/
        font-size: 20px;
        display: inline-block;
	}
	.common_p{
	    padding-top: 15px;
        font-size: 16px;
        line-height: 23px;
        display: inline-block;
	}
	.common_list{
	    padding-top: 45px;
	}
	
	.contents_title{
		height: 5vw;
		font-size: 19px;
		line-height: 32px;
	}
	.contents_description span{
		font-size: 14px;
	}
	/*#contents img, #process img{
		    margin-bottom: 1vw;
	}*/
	
	.footer_cont{
		overflow: hidden;
	}
	.footer_box {
		float: left;
	}
	.widthBtn {
		width: 230px;
		padding-top: 0px;
		float: right;
	}
	.widthBtnImg {
		width: 100%;
	}
	
}
@media (min-width: 960px){
	/* 메인 공통 */
	.common_h2{
		padding-top: 100px;
	}
	.common_h2 span{
		display: block;
	}
	.common_p{
		display: block;
	}
	.common_p span{
		display: block;
	}
	.common_list{
		padding-top: 60px;
	}
	/*#contents img, #process img{
		margin-bottom: 2vw;
	}*/
	.widthBtn {
		width: 250px;
	}
	.widthBtnImg {
		padding-top: 5px;
	}
}

@media (min-width: 1200px){
	/* 메인 공통 */
	.commonLogo img{
		max-width:100%;
	}
	.common_box{
		padding: 0 15px;
	}
	.common_h2{
		padding-top: 50px;
		/*font-size: 52px;*/
		font-size: 48px;
		line-height: 65px;
	}
	.common_h2 span{
		display: block;
	}
	.common_h3{
		/*padding-top: 65px;*/
		padding-top: 56px;
	}
	.common_p{
		/*font-size: 20px;*/
		font-size: 16px;
        padding-top: 25px;
        /*line-height: 28px;*/
	}
	.common_p span{
		display: block;
	}
	.common_list{
		padding-top: 65px;
	}
	.common_table{
		padding-top: 0;
	}
	.title{
		font-size: 22px; 
		line-height: 20px;
	}
	/*.subTitle{
		font-size:1.625rem; 
		line-height:normal;
	}*/
	.contents{
		font-size:1.125rem; 
		line-height:32px;
	}
	.contents span{
		display:block;
	}
	.content{
		width:1120px; 
		margin:0 auto; 
		padding:20px 0;
	}
	.contents_description span{
		font-size: 16px;
	}
	
    /* header */	
	#header{
		height:90px; 
		padding:20px;
	}
	.header_cont{
		width:1120px; 
		margin:0 auto;
	}
	.header_box{
		padding: 0 40px;
	}
	.commonLogo{
		width:170px; 
		padding:0;
	}
	#hamBtn{
		display:none;
	}
	#menu{
		display:inline-block; 
		margin-right: 40px;
	}
	
    /* contents */	
	.contents_num{
		font-size:1.375rem; 
		margin-bottom:20px;
	}
	.contents_title{
		height:55px; 
		font-size:1.375rem; 
		line-height:28px; 
		margin-bottom:10px;
	}
	.contents_description{
		font-size:1rem;
	}
	.contents_description span{
		line-height:28px; 
		margin-bottom:1px;
	}
	/*#contents img, #process img{
		width: 100%;	
		margin-bottom:10px;
	}*/

	
    /* sample */
	#sampleImgTop{
		width:360px !important; 
		position:absolute; 
		right:0; top:0; 
		margin:100px 0 0 0 !important;
	}
	.sampleBottom{
		margin-top:100px; 
		overflow:hidden; 
		margin-bottom:100px;
	}
	.sampleBottom_text{
		width:calc(100% - 355px); 
		padding-left:120px; 
		float:right;
	}
	#sampleImgBottom{
		width:355px !important; 
		margin:0 !important;
	}
	
    /* footer */	
	.footer_cont{
		width:1120px; 
		margin:0 auto;
		overflow: hidden;
		padding-top: 10px;
	}
	.widthBtn {
		float: right;
		margin-top: -10px;
	}
	.widthBtnImg {
		padding-top: 10px;
	}
	#hamMenu {
		display: none !important;
	}
}