@charset "utf-8";

label, input, select{vertical-align:middle;}
body{font-size:14px; font-family:'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', Dotum, "돋움",Gulim, "굴림", Verdana, Tahoma, AppleGothic, sans-serif; color:#333; letter-spacing:0; }
input, textarea, select{ font-family:'Noto Sans KR', sans-serif !important; }
input[type="checkbox"]{ border:1px solid #ddd;}

/* header */
#header{ position:fixed; left:0; top:0; width:100%; height:100px; border-bottom:1px solid rgba(204,204,204,.3); z-index:9999; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#header .inner{ margin:0 auto; width:calc(100% - 30px); max-width:1416px; }
#header h1{ display:inline-block; vertical-align:top; margin-top:22px;-webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#header h1 a{ display:block; width:237px; height:57px; background:url('../images/common/logo.png') no-repeat center; background-size:cover; text-indent:-9999px; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#header #gnb{ float:right; font-size:0; }
#header #gnb > li{ position:relative; display:inline-block; vertical-align:Top; margin-right:50px; }
#header #gnb > li:last-child{ margin-right:0; }
#header #gnb > li > a{ display:block; font-size:17px; line-height:100px; color:#fff; font-weight:600; font-family: 'Montserrat', sans-serif; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
#header #gnb .dep02{ display:none; position:Absolute; left:50%; top:calc(100% + 1px); margin-left:-70px; padding:20px 10px; width:140px; background:#fff; box-sizing:border-box; box-shadow:0 10px 10px rgba(0,0,0,.05) }
#header #gnb .dep02.wide{ width:280px; font-size:0; margin-left:-140px; }
#header #gnb .dep02.wide li{ display:inline-block; vertical-align:top; width:50%; }
#header #gnb .dep02 li{ margin-bottom:10px; }
#header #gnb .dep02 li:last-child{ margin-bottom:0; }
#header #gnb .dep02 li a{ display:block; font-size:16px; line-height:30px; letter-spacing:-0.05em; color:#666; text-align:Center; font-family: 'Montserrat', 'Noto Sans KR', sans-serif; }
#header #gnb .dep02 li a:hover{ color:#2fa8e1; }
#header #gnb .dep02 li a span{ display:inline-block; position:relative;  background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1)), linear-gradient(to right, rgba(47, 168, 225, 1), rgba(47, 168, 225, 1), rgba(47, 168, 225, 1)); background-size: 100% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 500ms;  }
#header #gnb .dep02 li a:hover span{ background-size: 0 2px, 100% 2px; }

#header.scroll{ height:80px; background:#fff; border-bottom-color:#ddd; }
#header.scroll h1{ margin-top:12px; }
#header.scroll h1 a{ background:url('../images/common/logo_on.png') no-repeat center; background-size:cover;  }
#header.scroll #gnb > li > a{ color:#222; line-height:80px; }
#header.scroll #gnb > li:hover > a{ color:#2fa8e1; }

#header.black{ background:#fff; border-bottom-color:#ddd; }
#header.black h1 a{ background:url('../images/common/logo_on.png') no-repeat center; background-size:cover;  }
#header.black #gnb > li > a{ color:#222; }
#header.black #gnb > li:hover > a{ color:#2fa8e1; }

/* footer */
#footer{ position:relative; padding:80px 0; background:#191b1d; }
#footer .inner{ margin:0 auto; width:calc(100% - 30px); max-width:1440px; }
#footer .btn_top{ position:absolute; right:60px; top:50%; margin-top:-30px; width:60px; height:60px; font-size:12px; line-height:22px; color:#fff; font-weight:600; background:#2fa8e1; outline:none; font-family: 'Montserrat', sans-serif;}
#footer .btn_top span{ display:block; position:relative; padding-top:17px; }
#footer .btn_top span:before{ content:''; position:Absolute; left:50%; margin-left:-6px; top:0; width:12px; height:16px; background:url('../images/btn/btn_top.png') no-repeat center; background-size:cover; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
#footer .btn_top span:after{ content:''; position:Absolute; left:50%; margin-left:-6px; top:10px; width:12px; height:16px; background:url('../images/btn/btn_top.png') no-repeat center; background-size:cover; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; opacity:0; }

#footer .sns_list{ margin-bottom:35px; font-size:0; text-align:center; }
#footer .sns_list li{ display:inline-block; vertical-align:top; margin-right:27px; }
#footer .sns_list li:last-child{ margin-right:0; }
#footer .sns_list li a{ display:block; }
#footer .sns_list li.sns01 a{ width:35px; height:24px; background:url('../images/icon/f_sns01.png') no-repeat center; background-size:cover; }
#footer .sns_list li.sns02 a{ width:30px; height:24px; background:url('../images/icon/f_sns02.png') no-repeat center; background-size:cover; }
#footer .sns_list li.sns03 a{ width:24px; height:24px; background:url('../images/icon/f_sns03.png') no-repeat center; background-size:cover; }
#footer .sns_list li.sns04 a{ width:13px; height:24px; background:url('../images/icon/f_sns04.png') no-repeat center; background-size:cover; }
#footer .info_list{ margin-bottom:20px; font-size:0; text-align:center; }
#footer .info_list li{ display:inline-block; vertical-align:top; margin-right:25px; font-size:15px; line-height:25px; color:#666; letter-spacing:-0.05em; }
#footer .info_list li strong{ font-weight:400; color:#999; }
#footer .copy{ font-size:14px; line-height:24px; color:#444;  letter-spacing:-0.05em; text-align:Center; }
#footer .copy span{ color:#2fa8e1; }

/* common */
.layout{ margin:0 auto; width:calc(100% - 30px); max-width:1416px; }

#sub .contents{ padding:150px 0; position:relative; z-index:1; background:#fff;  }

#s_visual{ position:relative; display:flex; flex-wrap:wrap; padding-top:100px; height:540px; align-items: center; justify-content: center; text-align:Center; box-sizing:border-box; overflow:hidden; }
#s_visual .bg{ position:fixed; left:0; top:0; width:100%; height:540px;}
#s_visual .slogan{ position:relative; z-index:1; }
#s_visual .slogan h2{ display:block; margin-bottom:25px; font-size:56px; line-height:66px; color:#fff; font-weight:700; font-family: 'Montserrat', sans-serif; }
#s_visual .slogan span{ display:block; font-size:20px; line-height:30px; color:#fff; letter-spacing:-0.05em; }
.s_visual01 .bg{ background:url('../images/sub/sub_v01.jpg') no-repeat center; background-size:cover; }
.s_visual02 .bg{ background:url('../images/sub/sub_v02.jpg') no-repeat center; background-size:cover; }
.s_visual03 .bg{ background:url('../images/sub/sub_v03.jpg') no-repeat center; background-size:cover; }
.s_visual04 .bg{ background:url('../images/sub/sub_v04.jpg') no-repeat center; background-size:cover; }
.s_visual05 .bg{ background:url('../images/sub/sub_v05.jpg') no-repeat center; background-size:cover; }
.s_visual06 .bg{ background:url('../images/sub/sub_v06.jpg') no-repeat center; background-size:cover; }

.titS01{ margin-bottom:90px; text-align:center; }
.titS01 .tit{ display:block; font-size:40px; line-height:50px; color:#222; letter-spacing:-0.05em; font-weight:700; font-family:'Montserrat', 'Noto Sans KR', sans-serif; }

.nav{ margin-top:20px; font-size:0; }
.nav > li{ display:inline-block; vertical-align:top; position:relative; margin-right:48px; font-size:16px; line-height:26px; color:#999; letter-spacing:-0.05em; font-family:'Montserrat', 'Noto Sans KR', sans-serif; }
.nav > li.en{ letter-spacing:0; }
.nav > li:last-child{ margin-right:0; }
.nav > li:after{ content:''; position:absolute; right:-28px; top:50%; margin-top:-4px; width:7px; height:11px; background:url('../images/icon/nav_ar.png') no-repeat center; background-size:cover; }
.nav > li:last-child:after{ display:none; }
.nav > li .home{ display:block; width:16px; height:26px; text-indent:-9999px; background:url('../images/icon/home.png') no-repeat center; background-size:100% auto; }

/* 전자상거래 표준약관 */
.yg{font-size:14px; line-height:24px; word-break:keep-all}
.yg h2{margin-top:70px; font-size:22px; font-weight:700; color:#333;}
.yg h3{margin-top:40px; margin-bottom:5px; font-size:18px; font-weight:700; color:#444;}
.yg h4{margin-top:20px; margin-bottom:5px; font-size:16px; font-weight:500; color:#555;}
.yg p{margin:5px 0;}

.fly_w{margin-top:10px; background:#f2f2f2; box-sizing:border-box; padding:20px;}
.fly_w > li:first-child{margin-top:0;}
.fly_w > li > ul{margin-top:0; padding:0 0 0 15px; background:none;}
.fly_w > li > ul > li{padding:0; margin:0;}
.fly_w > li > ul > li:before{display:none;}
.fly_w > li > ol{margin-top:0; padding:0 0 0 15px; background:none;}
.fly_w > li > ol > li{padding:0; margin:0;}
.fly_w > li > ol > li:before{display:none;}

ul.fly_w > li{position:relative; padding-left:10px; margin-top:5px; color:#777;}
ul.fly_w > li:before{content:'-'; position:absolute; top:0; left:0;}
ol.fly_w > li{position:relative; margin-top:5px; color:#777;}

.yg_table{overflow:hidden; margin-top:15px;}
.yg_table div{float:right; width:calc(50% - 10px);}
.yg_table div:first-child{float:left;}
.yg_table div > strong{display:block; text-align:center; background:#333; color:#fff; font-size:15px; font-weight:500; padding:15px 0;}
.yg_table div table{width:100%; box-sizing:border-box;}
.yg_table div table thead th{text-align:center; color:#333; font-weight:700; border-bottom:1px solid #ddd; padding:10px 0; background:#f2f2f2;}
.yg_table div table tbody th{text-align:center; border-bottom:1px solid #ddd; color:#333; padding:10px 0; font-weight:500; background:#f9f9f9}
.yg_table div table tbody td{border-bottom:1px solid #ddd; padding:5px 20px; border-left:1px solid #ddd;}

#privacy_box select { padding-left:10px; margin-top: 20px; width: 320px; height: 40px; font-size: 14px; border-color: #bbb;}


/* 팝업 */
.popup_bx {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 1000000; background-color: rgba(0,0,0,.6); overflow-y: auto; box-sizing: border-box; padding: 50px 15px; display: none;}
.popup_bx .pop_w {display: table; table-layout: fixed; width: 100%; height: 100%;}
.popup_bx .pop_inner {display: table-cell; height: 100%; vertical-align: middle;}
.popup_bx .close_btn {background-color: #000000; height: 50px; display:flex; justify-content:center; align-items:center; table-layout:fixed; font-size: 14px; color: #ffffff; letter-spacing: -0.05em; word-break: keep-all; text-align: center; cursor: pointer;}
.popup_bx .license_pop {max-width: 520px; margin: 0 auto;}
.popup_bx .license_pop img {max-width: 100%;}
.popup_bx .license_pop img {max-width: 100%;}


/* PC */
@media all and (min-width:1025px){
.pc_show{ display:block !important;}
.pc_i_show{ display:inline-block !important;}
.m_show{ display:none !important;}
.m_i_show{ display:none !important;}

#header:hover{ background:#fff; border-bottom-color:#ddd; }
#header:hover h1 a{ background:url('../images/common/logo_on.png') no-repeat center; background-size:cover;  }
#header:hover #gnb > li > a{ color:#222; }
#header:hover #gnb > li:hover > a{ color:#2fa8e1; }

#header .btn_m_menu{ display:none !important;  }
#header .m_menu_wrap{ display:none !important; }

#footer .btn_top:hover span:before{ top:-10px; opacity:0; }
#footer .btn_top:hover span:after{ top:0; opacity:1;}

}

@media all and (max-width:1100px){	
	#header #gnb > li{ margin-right:40px; }
}
/* 태블릿&모바일 공통*/
@media all and (max-width:1024px){	
	.pc_show{ display:none !important;}
	.pc_i_show{ display:none !important;}
	.m_show{ display:block !important;}
	.m_i_show{ display:inline-block !important;}
	
	/* header */
	#header{ height:60px; }
	#header h1{ margin-top:13px; }
	#header h1 a{ width:140px; height:34px; }
	#header #gnb{ display:none; }
	#header .btn_m_menu{ float:right; display:inline-block; position:relative; margin-right:-15px; width:54px; height:60px; background:transparent; }
	#header .btn_m_menu span{ position:absolute; left:15px; width:24px; height:2px; background:#fff; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s; }
	#header .btn_m_menu span:nth-child(1){ top:20px; }
	#header .btn_m_menu span:nth-child(2){ top:29px; }
	#header .btn_m_menu span:nth-child(3){ top:38px; }
	
	#header .btn_m_menu.close span{ background:#222; }
	#header .btn_m_menu.close span:nth-child(1){top:29px; -webkit-transform: rotate( 225deg ); -moz-transform: rotate( 225deg ); transform: rotate( 225deg );}
	#header .btn_m_menu.close span:nth-child(2){ opacity:0; }
	#header .btn_m_menu.close span:nth-child(3){top:29px; -webkit-transform: rotate( -225deg ); -moz-transform: rotate( -225deg ); transform: rotate( -225deg );}

	#header .m_menu_wrap{ display:none; position:fixed; left:0; top:61px; padding:30px 0; width:100%; height:calc(100% - 61px); background:#fff; z-index:1000; box-sizing:border-box; overflow-y:auto; }
	#header .m_menu_wrap #m_gnb{ }
	#header .m_menu_wrap #m_gnb > li > a{ display:block; font-size:24px; line-height:60px; color:#222; letter-spacing:-0.05em; font-weight:600; font-family: 'Montserrat', sans-serif; text-align:center; }
	#header .m_menu_wrap #m_gnb .dep02{ display:none; padding:18px 0; background:#2fa8e1; }
	#header .m_menu_wrap #m_gnb .dep02.wide{ font-size:0; text-align:left; }
	#header .m_menu_wrap #m_gnb .dep02.wide li{ display:inline-block; vertical-align:top; width:50%; }
	#header .m_menu_wrap #m_gnb .dep02 li{ margin-bottom:10px; }
	#header .m_menu_wrap #m_gnb .dep02 li:last-child{ margin-bottom:0; }
	#header .m_menu_wrap #m_gnb .dep02 li a{ display:block; font-size:20px; line-height:30px; color:#fff; letter-spacing:-0.05em; font-family:'Montserrat', 'Noto Sans KR', sans-serif; text-align:center; }
	
	#header.m_on{ background:#fff; border-bottom-color:#ccc; }
	#header.m_on h1 a{ background:url('../images/common/logo_on.png') no-repeat center; background-size:cover; }

	#header.scroll{ height:60px; }
	#header.scroll h1{ margin-top:13px; }
	#header.scroll .btn_m_menu span{ background:#222; }
	
	#header.black .btn_m_menu span{ background:#222; }

	/* footer */
	#footer{ padding:40px 0; }
	#footer .btn_top{ right:15px; top:40px; margin-top:0; width:50px; height:50px; font-size:11px; line-height:16px; }
	#footer .btn_top span{ padding-top:14px; }
	#footer .btn_top span:before{  margin-left:-4px; width:9px; height:12px; }

	#footer .sns_list{ margin-bottom:20px; text-align:left; }
	#footer .sns_list li{ margin-right:13px; }
	#footer .sns_list li.sns01 a{ width:26px; height:18px; }
	#footer .sns_list li.sns02 a{ width:22px; height:18px; }
	#footer .sns_list li.sns03 a{ width:18px; height:18px; }
	#footer .sns_list li.sns04 a{ width:10px; height:18px; }
	#footer .info_list{ margin-bottom:13px; text-align:left; }
	#footer .info_list li{ display:block; margin-right:0; font-size:12px; line-height:20px; }
	#footer .copy{ font-size:11px; line-height:16px; text-align:left; }

	/* common */
	#sub .contents{ padding:85px 0; }

	#s_visual{ padding-top:60px; height:320px; }
	#s_visual .bg{ height:320px;}
	#s_visual .slogan h2{ margin-bottom:12px; font-size:32px; line-height:37px; }
	#s_visual .slogan span{ font-size:14px; line-height:20px; }
	
	.titS01{ margin-bottom:55px; }
	.titS01 .tit{ font-size:24px; line-height:29px; }

	.nav{ margin-top:13px; }
	.nav > li{ margin-right:28px; font-size:12px; line-height:17px; }
	.nav > li:after{ right:-18px; margin-top:-4px; width:6px; height:9px; }
	.nav > li .home{ width:12px; height:17px; }

	/* 전자상거래 표준약관 */
	.yg{font-size:12px; line-height:18px;}
	.yg h2{margin-top:50px; font-size:18px;}
	.yg h3{margin-top:20px; margin-bottom:5px; font-size:15px;}
	.yg h4{margin-top:10px; margin-bottom:5px; font-size:14px;}
	.yg p{margin:5px 0;}

	.fly_w{margin-top:5px; padding:10px;}
	.fly_w > li > ul{padding:0 0 0 5px;}
	.fly_w > li > ol{padding:0 0 0 5px;}

	ul.fly_w > li{padding-left:10px; margin-top:3px;}
	ol.fly_w > li{margin-top:3px;}

	.yg_table{margin-top:10px;}
	.yg_table div{width:100%; margin-top:10px;}
	.yg_table div:first-child{margin-top:0;}
	.yg_table div > strong{font-size:12px; padding:8px 0;}
	.yg_table div table{ table-layout:fixed; }
	.yg_table div table thead th{padding:5px 0;}
	.yg_table div table tbody th{padding:5px 0;}
	.yg_table div table tbody td{padding:0 10px}
	#privacy_box select { margin-top: 15px; width: 300px; height: 30px; font-size: 12px; }




	/* 팝업 */
	.popup_bx .close_btn {font-size: 13px; height: 35px;}
}

/* 모바일 */
@media all and (max-width:768px){
	
	.s_visual01 .bg{ background:url('../images/sub/sub_v01_m.jpg') no-repeat center; background-size:cover; }
	.s_visual02 .bg{ background:url('../images/sub/sub_v02_m.jpg') no-repeat center; background-size:cover; }
	.s_visual03 .bg{ background:url('../images/sub/sub_v03_m.jpg') no-repeat center; background-size:cover; }
	.s_visual04 .bg{ background:url('../images/sub/sub_v04_m.jpg') no-repeat center; background-size:cover; }
	.s_visual05 .bg{ background:url('../images/sub/sub_v05_m.jpg') no-repeat center; background-size:cover; }
	.s_visual06 .bg{ background:url('../images/sub/sub_v06_m.jpg') no-repeat center; background-size:cover; }

}