@charset "utf-8";

/* 공통 css */
ul,ol,li{list-style:none}
body{font-size:16px; line-height:1; color:#333;}
.container_fix{width:1230px;padding:0 15px}
.sub-html .container_fix{position:relative}
.sub-html .at-wrapper{padding-top:80px; background-color: black;}

.page-wrap { color: white;}

@media (max-width:991px){
	.sub-html .at-wrapper{padding-top:68px}
}
@media (max-width:768px){
	.sub-html .at-wrapper{padding-top:58px}
}
@media (max-width:480px){
	.sub-html .at-wrapper{padding-top:40px}
}

/*********************************************************************
	탑배너. html > page > top_banner.php
*********************************************************************/
.sub_text{margin:0; padding:58px 0 54px}
@media (max-width:991px){
	.sub_text.ca_it_mb{padding:0}
}
@media (max-width:768px){
	.sub_text{padding:50px 0 30px;}
}

/*헤더 메뉴*/

header.header{position:fixed; width:100%; top:0; left:0; background:transparent; transition: transform 0.5s ease-in-out; z-index:11;}
header.header.fixed { transform: translateY(-100%);}
header.header .header_wrap{width:1730px; max-width:100%; margin:0 auto; padding:0 15px; display:table;}
header.header .header_wrap > div{display:table-cell; vertical-align:middle;}
header.header .header_wrap > div.header_logo{width:105px;}
header.header .header_wrap > div.header_logo .logo_b{display:none;}
header.header .header_wrap > div.header_menu{width:calc(100% - 185px); text-align:right;}
header.header .header_wrap > div.header_menu .menu_ul{}
header.header .header_wrap > div.header_menu .menu_ul > li{display:inline-block; vertical-align:top; padding:0; padding-left: 75px;}
header.header .header_wrap > div.header_menu .menu_ul > li > a{font-size:18px; color:#fff; font-weight:500; transition:all 0.3s; display:block;  line-height:100px;}
header.header .header_wrap > div.header_menu .menu_ul > li > a:hover{color:#fff;}
header.header .header_wrap > div.header_menu .menu_ul > li > a span{ position:relative;}

header.header .header_wrap > div.header_menu .menu_ul > li > a:hover span::after,
header.header.on .header_wrap > div.header_menu .menu_ul > li.active > a span::after{width:100%;}
header.header .header_wrap > div.header_menu .menu_ul > li > .sub-1div{display:none;}
header.header .header_btn{width:80px;}
header.header .header_btn > a{display:inline-block;}
header.header .header_btn > a.search_btn{width:24px; height:23px; position:relative; margin-right:25px;}
header.header .header_btn > a.search_btn span.circle{width:20px; height:20px; border:2px solid #fff; position:absolute; top:0; left:0; border-radius:50%; transition:all 0.3s;}
header.header .header_btn > a.search_btn span.line{width:2px; height:8px; background:#fff; position:absolute; right:3px; bottom:0; transform:rotate(-45deg); transition:all 0.3s;}
header.header .header_btn > a.all_btn{width:26px; height:22px; position:relative; z-index:5;}
header.header .header_btn > a.all_btn span{display:block; width:100%; height:2px; background:#fff; position:absolute; right:0; top:0; transition:all 0.3s;}
header.header .header_btn > a.all_btn span:nth-child(2){top:10px;}
header.header .header_btn > a.all_btn span:nth-child(3){top:20px;}
header.header .header_btn > a.all_btn.active span{transform:rotate(-45deg); top:9px;}
header.header .header_btn > a.all_btn.active span:nth-child(2){opacity:0; visibility:none; right:-100%; transform:rotate(0);}
header.header .header_btn > a.all_btn.active span:nth-child(3){transform:rotate(45deg); top:9px;}

/*헤더 검색바*/
header.header .search_drop{width:100%; position:absolute; top:80px; left:0; text-align:center; background:#fff; padding:30px 0; border-top:1px solid #e1e1e1;  opacity:0; visibility:hidden;
transition:all 0.3s;}
header.header .search_drop.active{opacity:1; visibility:visible;}
header.header .search_drop .header_search{width:600px; margin:0 auto; position:relative;}
header.header .search_drop .header_search input{width:100%; height:60px; border:0; border-bottom:1px solid #999999; font-size:20px; color:#111;
font-weight:300; padding:0 50px 0 5px;}
header.header .search_drop .header_search input::placeholder{color:#999;}
header.header .search_drop .header_search button{display:block; width:24px; height:23px; position:absolute; background:none; outline:none; border:0;
top:20px; right:15px;}
header.header .search_drop .header_search button span.circle{width:20px; height:20px; border:2px solid #111111; position:absolute; top:0; left:0; border-radius:50%;}
header.header .search_drop .header_search button span.line{width:2px; height:8px; background:#111111; position:absolute; right:3px; bottom:0; transform:rotate(-45deg);}
header.header .search_drop .search_close{display:block; width:26px; height:22px; position:absolute; right:-40px; top:20px;}
header.header .search_drop .search_close span{display:block; width:100%; height:2px; background:#000000; position:absolute; right:0; top:0; transition:all 0.3s;
transform:rotate(-45deg); top:10px;}
header.header .search_drop .search_close span:nth-child(2){transform:rotate(45deg);}


/*헤더 전체메뉴*/
header.header .all_menu{width:100%; position:absolute; top:80px; left:0; background:#000000; padding:0px 0 30px; height:400px; opacity:0; visibility:hidden;
transition:all 0.3s;}

header.header .all_menu .container_fix{width:1230px; max-width:100%; margin:0 auto; padding:0 15px; display:table;}
header.header .all_menu .container_fix > div{display:table-cell; vertical-align:middle;}
header.header .all_menu .container_fix > div.header_btn{opacity:0; visibility:hidden;}
header.header .all_menu .container_fix > div.fake_logo{width:105px; opacity:0; visibility:hidden;}
header.header .all_menu .all_menu_box{width:calc(100% - 185px); text-align:center;}
header.header .all_menu .all_ul > li{display:inline-block; vertical-align:top; padding:0 33px; position:relative;}
header.header .all_menu .all_ul > li > a{font-size:20px; color:#fff; font-weight:500; transition:all 0.3s; display:block; opacity:0; visibility:hidden;}
header.header .all_menu .all_ul > li:hover > a{color:#fff;}
header.header .all_menu .all_ul > li > .all_sub_div{text-align:left; position:absolute;}
header.header .all_menu .all_ul > li > .all_sub_div > ul{}
header.header .all_menu .all_ul > li > .all_sub_div > ul > li{margin-bottom:25px;}
header.header .all_menu .all_ul > li > .all_sub_div > ul > li:last-child{margin-bottom:0;}
header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a{display:inline-block; font-size:16px; color:white; white-space:nowrap; transition:all 0.3s;}

header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a > span{position:relative;}

header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a:hover > span::after{width:100%;}

@media (max-width:991px){
    header.header .all_menu.active{opacity:1; visibility:visible;}
	header.header{padding:20px 0;}
    header.header.on {background-color: black;}
	header.header .header_wrap{width:100%; display:flex; justify-content:space-between; /* padding:0 30px; */}
	header.header .header_wrap > div.header_logo{width:auto;}
	header.header .header_wrap > div.header_menu{display:none;}
	header.header .header_wrap > div.header_btn{width:auto; white-space:inherit; margin-top: 3px;}

	header.header .search_drop{top:68px;}
	header.header .search_drop .header_search{width:80%;}

	header.header .all_menu{position:fixed; top:68px; height:calc(100% - 68px); padding:50px 0;}
	header.header .all_menu .container_fix{display:block; /* padding:0 30px; */}
	header.header .all_menu .container_fix > div{display:block;}
	header.header .all_menu .container_fix > div.header_btn{display:none;}
	header.header .all_menu .container_fix > div.fake_logo{display:none;}
	header.header .all_menu .all_menu_box{width:100%;}
	header.header .all_menu .all_ul > li{padding:0 0px; display:block;}
	header.header .all_menu .all_ul > li > a{font-size:20px; opacity:1; color:white; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #333333;
	text-align:left;}
    header.header .all_menu .all_ul > li > a.active {border-bottom:1px solid white;}
	header.header .all_menu.active .all_ul > li > a{visibility:visible;}

	header.header .all_menu .all_ul > li > a .arrow{display:block; width:10px; height:7px; position:absolute; right:4px; top:7px; transition:all 0.4s;}
	header.header .all_menu .all_ul > li > a .arrow::before{content:""; width:1px; height:10px; background:white; position:absolute; left:1px; bottom:0;
	transform:rotate(-45deg);}
	header.header .all_menu .all_ul > li > a .arrow::after{content:""; width:1px; height:10px; background:white; position:absolute; right:1px; bottom:0;
	transform:rotate(45deg);}
	header.header .all_menu .all_ul > li > a.active .arrow{transform:rotate(180deg);}
	header.header .all_menu .all_ul > li > .all_sub_div{margin-bottom:20px; position:relative; display:none;}
	header.header .all_menu .all_ul > li > a.active + .all_sub_div{display:block;}
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li{margin-bottom:20px;}
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a{display:block; font-size:16px;}
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a > span::after{bottom:-2px;}	
}
@media (max-width:768px){
	header.header{padding:20px 0;}

	header.header .search_drop{top:58px;}
	header.header .all_menu{top:60px; height:calc(100% - 60px);}
}
@media (max-width:480px){
	header.header{padding:20px 0;}
	header.header .header_wrap > div.header_logo img{width:90px;}
	header.header .header_btn > a.search_btn{width:20px; height:19px; margin-right:10px;}
	header.header .header_btn > a.search_btn span.circle{width:16px; height:16px; border:1px solid #fff;}
	header.header .header_btn > a.search_btn span.line{width:1px; height:6px; right:4px;}
	header.header .header_btn > a.all_btn{width:22px; height:18px;}
	header.header .header_btn > a.all_btn span{height:1.5px;}
	header.header .header_btn > a.all_btn span:nth-child(2){top:8px;}
	header.header .header_btn > a.all_btn span:nth-child(3){top:16px;}

	header.header .search_drop{top:40px;}
	header.header .search_drop .header_search{width:calc(100% - 120px);}
	header.header .search_drop{padding:15px 0;}
	header.header .search_drop .header_search input{height:40px; font-size:14px; padding:0 30px 0 5px;}
	header.header .search_drop .header_search button{width:20px; height:19px; top:11px; right:6px;}
	header.header .search_drop .header_search button span.circle{width:16px; height:16px; border:1px solid #111111;}
	header.header .search_drop .header_search button span.line{width:1px; height:6px; right:4px;}
	header.header .search_drop .search_close{width:22px; height:18px; right:-35px; top:12px;}
	header.header .search_drop .search_close span{height:1px; top:8px;}
	header.header .search_drop .search_close span:nth-child(2){transform:rotate(45deg);}
	
	header.header .all_menu{top:60px; height:calc(100% - 60px);}
	header.header .all_menu .all_ul > li > a{font-size:16px; padding-bottom:24px; margin-bottom:24px;}
	header.header .all_menu .all_ul > li > a .arrow{right:4px; top:7px}
	header.header .all_menu .all_ul > li > a.active .arrow{top:5px;}
	header.header .all_menu .all_ul > li > .all_sub_div{padding-bottom:40px; border-bottom: 1px solid #333333 }
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li{margin-bottom:15px;}
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a{font-size:14px;}
	header.header .all_menu .all_ul > li > .all_sub_div > ul > li > a > span::after{bottom:-2px;}	
}


/*헤더 on시 클래스*/
/* header.header.on, header.header.fixed{background:#fff;} */
header.header.on .header_wrap > div.header_logo .logo_w, header.header.fixed .header_wrap > div.header_logo .logo_w{display:none;}
header.header.on .header_wrap > div.header_logo .logo_b, header.header.fixed .header_wrap > div.header_logo .logo_b{display:block;}

header.header.on .header_wrap > div.header_menu .menu_ul > li > a:hover, header.header.fixed .header_wrap > div.header_menu .menu_ul > li > a:hover,


header.header.on .header_btn > a.search_btn span.circle, header.header.fixed .header_btn > a.search_btn span.circle{border-color:#111111; }
header.header.on .header_btn > a.search_btn span.line, header.header.fixed .header_btn > a.search_btn span.line{background:#111111;}
header.header.on .header_btn > a.all_btn span, header.header.fixed .header_btn > a.all_btn span{background:white;}

/* 푸터 */
.fix_footer{background:#000000;margin-top:100px}
.fix_footer.no_margin{margin-top:0}
.fix_footer .fix_links_box{border-top:0;border-bottom:0}
.fix_footer .fix_links_box .container_fix{display:flex;align-items:center;justify-content:space-between;align-items:center;-ms-display:flex;-ms-justify-content:center;-ms-align-items:cente;border-bottom:1px solid rgba(159,159,159,0.2)}
.fix_footer .fix_links_box ul{width:100%;padding:0}
.fix_footer .fix_links_box .fix_links{}
.fix_footer .fix_links_box .fix_links li a{font-size:16px; color:rgb(255, 255, 255, 0.35); font-weight:500;}
.fix_footer .fix_links_box .fix_links > li + li{padding-left:13px; margin-left:10px}
.fix_footer .fix_links_box .fix_links > li + li:after{display:none}
.fix_footer .fix_links_box .fix_sns{text-align:right}
.fix_footer .fix_infos_box{padding:30px 0 40px}
.fix_footer .fix_infos_box .info_ul > li,
.fix_footer .fix_infos_box h4{font-size:15px; color:rgb(255, 255, 255, 0.3); font-weight:400}
.fix_footer .fix_infos_box h4{margin-top:18px}