@charset "utf-8";

/* skip 
------------------------------------------------------- */
.skip_nav a { position: absolute; top: -30px; left: 0; background: #000; height: 30px; line-height: 30px; color: #fff; font-size: 1.2rem; padding: 0 6px; z-index: 100;}
.skip_nav a:focus,
.skip_nav a:active {top: 0;}

/* Header 
------------------------------------------------------- */
.wrap { position: relative; min-height: 100%; }
.header { position: relative; width: 100%; margin:0 auto; z-index: 90; }
.gnb_body { background: #fff; border-bottom: 1px solid #d9e3ef; }
.gnb_top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 80px; background: #fff; }
.gnb_top .flex_left { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.gnb_top .flex_left .logo a { height: 80px; padding: 12px; margin-left: 40px; }
.gnb_top .flex_left .logo a img { width: 290px; height: 50px; }
.gnb_top .flex_right { width: 50%; gap: 10px; margin-right: 50px;
	display: -webkit-box; display: -ms-flexbox; display: flex; 
	-webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end;
	-webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.gnb_top .flex_right .btn { font-size: 1.6rem; padding: 5px 10px; border-radius: 5px !important; border: none; transition: all 0.3s; }
.gnb_top .flex_right .btn:hover { color: #fff; background: var(--hl-primary); text-decoration: underline; }
.gnb_top .flex_right .btn_login { color: #d7376c; padding: 5px 10px !important; font-size: 1.6rem; }


/* 메인 메뉴 */
.gnb { width: 100%; height:69px;  margin: 0 auto; border-top: 1px solid #d9e3ef; }
.gnb ul { 
	display: -webkit-box; display: -ms-flexbox; display: flex; 
	-webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; 
	-webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; 
}
.gnb ul li { position:relative; width:25%; text-align: center; transition: all 0.3s;}
.gnb ul li a:hover { color: var(--hl-primary); }
.gnb ul li:last-child a span { border-right:0 none; }
.gnb > ul > li > a { display:block; font-size:2.0rem; font-weight:600; padding:19px 0; }
.gnb ul li a span { display:block; border-right:1px solid rgba(221,221,221,0.5); color: #555; transition: all 0.3s; }
.gnb ul li a span:hover { color: var(--hl-primary);  }

/* Header-서브메뉴 배경 
------------------------------------------------------- */
/* .gnb_view_div, .gnb_view { display: block !important; } */
.gnb_view_div { display:none; position: absolute; top:150px; left:0; width:100%; height:240px; background: #fff; 
	-moz-box-shadow: 0 10px 10px rgba(0,0,0,0.2); box-shadow: 0 10px 10px rgba(0,0,0,0.2); z-index:10; }
.gnb_view { display:none; height:240px; }
.gnb_view:hover { background: #f8f8f8; border-top: 2px solid var(--hl-primary); }
.gnb_view ul { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: flex-start; height: 240px; 
	-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.gnb_view ul li { width:100%; text-align: center; }
.gnb_view ul li a { font-size:1.6rem; padding: 10px 0 5px 0; transition: all 0.1s; }
.gnb_view ul li a:hover { border-bottom: 2px solid var(--hl-primary); }
.gnb1 { position:absolute; left:0; width:100%; z-index:100; }
.menu,.sidr { display:none; }
.more_btn2 { position:absolute; left:320px; top:20px; }
.header_m { display: none; }

@media all and (max-width:1024px){
	.gnb_body { display: none; }
    .header_m { display: block; position: fixed; top: 0; left: 0; width: 100%; background: #fff; height: 65px; border-bottom: 1px solid #d9e3ef;}
    .header_m .logo a { padding: 10px 15px; }
	.header_m .logo a img { width: 240px; }
    .header_m .menu { display: block; position: absolute; right: 0; top: 0; }
	.header_m .menu .side_top { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 50px; }
	.header_m .menu .side_top > li { width: 50%; }
	.header_m .menu .side_top > li > .side_btn { width: 100%; padding: 10px; text-align: center; background: #f3f4fc; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
	.header_m .menu .side_top > li > .side_btn:active,
	.header_m .menu .side_top > li > .side_btn:focus { background: var(--hl-primary); color: #fff; box-shadow: none; }
	.header_m .menu .right_menu { display: inline-block; cursor:pointer; }
	.header_m .menu .right_menu:active { background: #f0f0f0; }
	.header_m .menu .menu_btn { display: block; padding: 20px; background:url('../img/mobile_menu.png') center center no-repeat; color:transparent; text-overflow: ellipsis; }
	.header_m .menu .close_btn { position: absolute; display: inline-block; right: 0; height: 50px; padding: 5px 20px; }
    .header_m .menu .close_btn img { display: inline-block; }
    .header_m .menu .sidr { display: block; position: fixed; top: 0; right: -320px; width: 320px; height: 100vh; overflow: auto; padding: 10px 20px; background: #fff; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 999; }
	.header_m .menu .sidr.active { right: 0; }
	.header_m .menu .sidr .side_menu:first-of-type { margin-top: 50px; }
	.header_m .menu .sidr .side_title { position: relative; display: block; padding: 20px 10px 10px; border-bottom: 1px solid var(--hl-primary); font-size: 2.0rem; color: var(--hl-primary); }
	.header_m .menu .sidr .side_title::before { position: absolute; content: '+'; top: 0; right: 10px; margin-top: 16px; font-size: 26px; color: var(--hl-primary); -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
	.header_m .menu .sidr .side_title.active::before { transform: rotate(-135deg); }
	.header_m .menu .sidr .side_list { display: none; }
	.header_m .menu .sidr .side_list li { line-height: 2.0; }
	.header_m .menu .sidr .side_list li a { display: block; width: 100%; margin-top: 5px; padding: 5px 5px 5px 10px ; border-radius: 10px; }
	.header_m .menu .sidr .side_list li:hover a,
	.header_m .menu .sidr .side_list li:active a { background: var(--hl-primary); color: #fff; }
	.bg_cover { position: fixed; top: 0; right: 0; width: 100%; height: 100%; visibility: hidden; background: rgba(0, 0, 0, 0.8); opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 100; }
	.bg_cover.active { opacity: 1; right: 320px; visibility: visible; }
}

/*sub_page_menu
=============================================================== */
.snb_nav.fixed { position: fixed; left: 0; top: 0; width: 100%; transition: all 0.3s; -moz-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);box-shadow: 0 8px 15px rgba(0,0,0,0.15); z-index: 15; }
.snb_nav { 
	width: 100%; height: 45px; background: #f6faff; border-bottom: 1px solid #d9e3ef;  
	.snb_ul { display: flex; }
	.snb_ul > li { 
		position: relative; 
		.btn_home { display: flex; align-items: center; justify-content: center; width: 60px; height: 45px; border-right: 1px solid #e9e9e9; border-left: 1px solid #e9e9e9; text-indent: -100000px; }	
		.btn_home > img { width: 24px; height: 24px; }
		.snb_toggle { position: relative; display: block; min-width: 250px; padding: 0 30px 0 14px; line-height: 45px; text-align: left; border-right: 1px solid #e9e9e9; }
		.snb_toggle > img { position: absolute; right: 10px; top: calc(50% - 4px); width: 14px; height: 8px; }
		.layer { position: absolute; width: 100%; height: auto; top: 45px; left: -1px; min-width: 251px; border: 1px solid #e9e9e9; border-top: 0; background: #fff; z-index: 9; }
		.layer .list > li { 
			width: 100%; border-bottom: 1px solid #f2f2f2;
			&:last-child {border-bottom: none;}
		} 
		.layer .list .item > a, 
		.layer .list .item > a.link {
			display: block; padding: 13px 10px 13px 14px; font-size: 1.5rem; line-height: 20px; transition: all 0.3s;	
			&:hover { color: var(--hl-primary); background: #f7f7f7; }
		}
	}

	@media screen and (max-width:1024px) {
		&.snb_nav.fixed { top: 65px; }
		position: fixed; top: 65px; z-index: 15;
		> .inner { padding: 0; }
	}
	@media screen and (max-width:560px) { 
		.snb_ul > li:nth-of-type(1) { display: none; }
		.snb_ul > li:nth-of-type(2) { width: 50%; }
		.snb_ul > li:nth-of-type(3) { width: 50%; }
		.snb_ul > li .snb_toggle { min-width: auto; font-size: 1.4rem;}
		.snb_ul > li .layer { min-width: auto; }
		.snb_ul > li .layer .list .item > a, 
		.layer .list .item > a.link { font-size: 1.3rem; }
	}
	@media screen and (max-width:400px) { 
		.snb_ul > li .snb_toggle { font-size: 1.2rem; letter-spacing: -1px;}
	}
} 

/* site map 
=============================================================== */
.pop_sitemap { 
	display: none; position: absolute; top: 0; left: 0; width: 100%; height: 360px; padding: 20px; background: #fff; box-shadow: 0 1px 10px rgba(0,0,0,0.3); z-index: 1000; 
	> .site_close { position: relative; float: right; cursor: pointer; }
	> .site_close > img { display: block; width: 20px; height: 20px; margin: 10px; }
	> .sitemap {
		display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; width: 100%; margin: 0 auto;  
		> .side_menu > .side_title { padding: 10px 0 20px 0; font-size: 2.4rem; font-weight: 600; border-bottom: 2px solid var(--hl-primary); }
		> .side_menu > .side_list > li { color: #333; background-size: 100%; }
		> .side_menu > .side_list > li > a { 
			display: block; padding: 6px 10px; background: #fff; transition: all 0.3s;	
			&:hover { color: #fff; background: var(--hl-primary); }
		}
	}
	@media screen and (max-width:1280px) {
		height: 650px;
	}
	@media screen and (max-width:1024px) {
		> .sitemap { display: none; }
	}
}
/* container 
------------------------------------------------------- */
.main_container { position: relative; width: 100%; }
.container { position: relative; width: 100%; min-height: 600px; padding-bottom: 70px; }
.inner { width: 1300px; margin: 0 auto; } 
.main_title { font-size: 3.0rem; font-weight: bold; }

/* 메인 슬라이드 */
.main_visual { position: relative; }
.carousel { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 100%; min-height: 560px; overflow: hidden;  }
.carousel_item { 
	position: absolute; width: 100%; height: 100%;
	background-color: #555; visibility: visible; transition: 1.0s all linear; z-index: 0;
	display: -webkit-box; display: -ms-flexbox; display: flex;
	-webkit-align-items: center; align-items: center;
	-webkit-justify-content: flex-end; justify-content: flex-end;
	-webkit-flex-shrink: 0; flex-shrink: 0;
}

.carousel_item_info { 
	position: absolute; -webkit-order: 1; order: 1; left: 0; margin: auto 10%;
	display: -webkit-flex; display: flex; width: 80%; height: 100%; z-index: 10; 
	-webkit-justify-content: center; justify-content: center;
	-webkit-flex-direction: column; flex-direction: column; 
}

.carousel_item_image {
	position: relative; width: 100%; height: 100%; opacity: 0.5;
	background-position: center; background-size: cover; /* transform: translateY(100%); */ transition: 1.0s all ease-in-out;
	-webkit-flex-basis: 100%; flex-basis: 100%;
	-webkit-align-self: flex-end; align-self: flex-end;
	-webkit-order: 2; order: 2;
}

/* .carousel_item_title { font-size: 3.7rem; line-height: 45px; font-weight: 700; color: #fff; margin-bottom: 30px; word-break: keep-all; opacity: 0; visibility: hidden; transform: translateY(100px); transition: 0.6s all ease-in-out; transition-delay: 0.2s;} */
.carousel_item_subtitle { font-size: 3.5rem; margin: 0; color: #b5fffb; font-weight: 500; opacity: 0; visibility: hidden; transform: translateY(120px); transition: 0.8s all ease-in-out; transition-delay: 0.3s;}
.carousel_item_description { font-size: 2.0rem; color: #b5fffb; margin-top: 10px; line-height: 22px; word-break: keep-all; opacity: 0; visibility: hidden; transform: translateY(150px); transition: 1.0s all ease-in-out; transition-delay: 0.4s;}
.carousel_item_1 .carousel_item_image{height: 100%; background: url('../img/visual_1920_01.jpg') center center no-repeat; }
.carousel_item_2 .carousel_item_image{height: 100%; background: url('../img/visual_1920_02.jpg') center center no-repeat; }
.carousel_item_3 .carousel_item_image{height: 100%; background: url('../img/visual_1920_03.jpg') center center no-repeat; }
.carousel_item_4 .carousel_item_image{height: 100%; background: url('../img/visual_1920_04.jpg') center center no-repeat, linear-gradient(90deg, #36a592, #36a592, #318fa9,#318fa9); }
.carousel_item_5 .carousel_item_image{height: 100%; background: url('../img/visual_1920_05.jpg') center center no-repeat, linear-gradient(90deg, #d84178, #d84178, #f38d65,#f38d65); }
.carousel_item_6 .carousel_item_image{height: 100%; background: url('../img/visual_1920_06.jpg') center center no-repeat, linear-gradient(90deg, #3b168a, #3b168a, #0e318b, #0e318b); }

.carousel_item_title { font-size: 5.0rem; font-weight: 600; color: #fff; text-align: center; -webkit-animation: txt 6.0s infinite; animation: txt 6.0s infinite;}
@-webkit-keyframes txt {
	0% { -webkit-transform:translateX(400px); opacity: 0;} 
	20% { -webkit-transform:translateX(0); opacity: 1; } 
	90% { -webkit-transform:translateX(0); opacity: 1;} 
	100% { opacity: 0; }
}
@keyframes txt {
	0% { transform:translateX(400px); opacity: 0; } 
	20% { transform:translateX(0); opacity: 1;} 
	90% { transform:translateX(0); opacity: 1;} 
	100% { opacity: 0; }
}

.carousel_controll { position: absolute; bottom: 0; right: 96px; color: #fff; z-index: 2; }
.carousel_controll .img_stop,
.carousel_controll .img_play { display: inline-block; padding: 14px 16px; width: 45px; height: 50px; background: rgba(255,255,255,0.3);  cursor: pointer; }
.carousel_controll .img_stop:hover, .carousel_controll .img_play:hover { background: rgba(0, 0, 0, 0.6); }

.carousel_nav { position: absolute; right: 0; bottom: 0; z-index: 2; background-color: #fff;}
.carousel_icon { display: inline-block; width: 16px; vertical-align: middle; fill: #5d5d5d; }
.carousel_arrow { position: relative; display: inline-block; height: 50px; padding: 11px 15px; cursor: pointer; vertical-align: middle; transition: all 0.3s; }

.carousel_arrow:nth-of-type(1) > img,
.carousel_arrow:nth-of-type(2) > img { transition: all 0.3s; }
.carousel_arrow:nth-of-type(1):hover > img { transform: translateX(-5px); }
.carousel_arrow:nth-of-type(2):hover > img { transform: translateX(5px); }
.carousel_arrow:nth-child(1):after,
.carousel_arrow:nth-child(2):after { position: absolute; content: ""; top: 50%; width: 1px; height: 14px; right: -3px; margin-top: -7px; background-color: #b0b0b0; }
.carousel_arrow:hover { background: var(--hl-primary); }

.ca_active { display: -webkit-box; display: -ms-flexbox; display: flex; visibility: visible; z-index: 1; }
.ca_active .carousel_item_subtitle,
.ca_active .carousel_item_title,
.ca_active .carousel_item_description,
.ca_active .carousel_item_btn { opacity: 1; visibility: visible; transform: translateY(0); transition: 1.0s all ease-in-out; }
.ca_active .carousel_item_image { opacity: 1; transition: 1.0s all ease-in-out; }

@media screen and (max-width:1280px) { 
	.carousel { width: 100%; min-height: 450px; }
}
@media screen and (max-width:800px) {
	.carousel { min-height: 300px; }
	.carousel_item_info { width: 100%; padding: 0 20px; margin: 0; }
	.carousel_item_title { font-size: 3.0rem; line-height: normal;}
	.carousel_item_subtitle { font-size: 1.8rem; }
	.carousel_item_description { font-size: 1.4rem; }
}

@media screen and (max-width:360px) {
	.carousel_item_title { font-size: 2.6rem; }
	.carousel_item_subtitle { font-size: 1.6rem; }
	.carousel_item_description { font-size: 1.2rem; }
	.title_area .main_title { padding: 20px 0; }
}



/* 바로가기 아이콘
------------------------------------------------------- */
.main_icon ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 20px; }
.main_icon .main_i { width: calc(100% / 5 - (2rem * 4 / 5)); border-radius: 10px; background: #fff; }
.main_icon .main_i a { position:relative; width: 100%; overflow: hidden; border-radius: 10px; }
.main_icon .main_i span { display: block; width: 94px; height: 94px; font-size: 0; margin: 20px auto;
	transform: scale(80%); opacity: 0.3; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
.main_icon > .icon_02 > .main_i span { opacity: 0.5; }
.main_icon .main_i .con_01 { background: url('../img/main_icon_01_h.png') no-repeat; }
.main_icon .main_i .con_02 { background: url('../img/main_icon_02_h.png') no-repeat; } 
.main_icon .main_i .con_03 { background: url('../img/main_icon_03_h.png') no-repeat; }
.main_icon .main_i .con_04 { background: url('../img/main_icon_04_h.png') no-repeat; }
.main_icon .main_i .con_05 { background: url('../img/main_icon_05_h.png') no-repeat; }
.main_icon .main_i .con_06 { background: url('../img/main_icon_06_h.png') no-repeat; }
.main_icon .main_i .con_10 { background: url('../img/main_icon_10_h.png') no-repeat; }
.main_icon .main_i .con_11 { background: url('../img/main_icon_11_h.png') no-repeat; } 
.main_icon .main_i .con_12 { background: url('../img/main_icon_12_h.png') no-repeat; }
.main_icon .main_i .con_13 { background: url('../img/main_icon_13_h.png') no-repeat; }
.main_icon .main_i .con_14 { background: url('../img/main_icon_14_h.png') no-repeat; }
.main_icon .main_i .con_15 { background: url('../img/main_icon_15_h.png') no-repeat; }
.main_icon .main_i:hover { -moz-box-shadow: 0px 10px 10px 0px #bbbbbb; box-shadow: 0px 10px 10px 0px #bbbbbb; }
.main_icon .main_i:hover span { transform: scale(100%); opacity: 1; }

.main_icon .main_i .con_t { position:relative; text-align: center; height: 50px; border-radius: 0 0  10px 10px; color: var(--hl-primary); font-size: 1.8rem; font-weight: 600; padding: 10px; background: #fff; transition: all 0.3s; }
.main_icon .main_i .con_t::after { position: absolute; display: block; content: ''; left: 0; bottom: -50px; width: 100%; height: 50px; background: var(--hl-primary); border-radius: 0 0 10px 10px; transition: all 0.5s; z-index: -1;}
.main_icon .main_i:hover .con_t { color: #fff; z-index: 1; }
.main_icon .main_i:hover .con_t::after { bottom: 0; }

@media screen and (max-width: 1300px){
	.main_icon .main_i .con_t { height: 76px; }
	.main_icon .main_i .con_t::after { height: 76px; }
}
@media screen and (max-width: 840px){
	.main_icon .main_i { width: calc(100% / 3 - (20px * 2 / 3)); }
	/* .main_icon .main_i { width: calc(100% /2 - (20px * 1 / 2)); } */
	.main_icon .main_i .con_t { height: 50px; }
	.main_icon .main_i .con_t::after { height: 50px; }
	.main_icon .main_i span { margin: 10px auto; transform: scale(60%); }
	.main_icon .main_i:hover span { transform: scale(80%); }
}
@media screen and (max-width: 700px){
	.main_icon .main_i { width: calc(100% /2 - (20px * 1 / 2)); }
}
@media screen and (max-width: 500px){
	.main_icon .main_i .con_t { height: 76px; }
	.main_icon .main_i .con_t::after { height: 76px; }
}
@media screen and (max-width: 460px){
	.main_icon .main_i span { margin: 10px auto 0; }
}
@media screen and (max-width: 373px){
	.main_icon .main_i .con_t { padding: 10px; font-size: 1.7rem; height: 70px; }
	.main_icon .main_i .con_t::after { height: 70px; }
	.main_icon .main_i::after { left: -170px; }
}

/* 메인 - 공지사항
------------------------------------------------------- */
.main_box_area { padding: 70px 0;}
.main_box_area .tab_interface { display: -webkit-box; display: -ms-flexbox; display: flex;  
	-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;
}
.main_box_area .tab_interface .tab_title { font-size: 2.6rem; font-weight: 700; color: var(--hl-primary); }
.main_box_area .tab_interface ul { display: -webkit-box; display: -ms-flexbox; display: flex; 
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
    -webkit-box-align: end; -ms-flex-align: end; align-items: end; margin-bottom: 20px;
}
.main_box_area .tab_interface .more_con { position: relative; text-align: right; height: 36px;}
.main_box_area .tab_interface > .tab_list [aria-selected='true'] { position: relative; color: #333; z-index: 1; }
.main_box_area .tab_interface .more_con > a { position: absolute; display: inline-block; width: 100px; top: 0; right: 0; padding: 6px 0; font-size: 1.8rem; color: #757575; border-radius: 20px; transition: all 0.3s; }
.main_box_area .tab_interface .more_con > a:active,
.main_box_area .tab_interface .more_con > a:hover { color: #ffffff; background: var(--hl-primary); padding-right: 25px; }

/* .main_box_area .tab_con { width: 100%; } */
.main_box_area .tab_con .con_sec .flex { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 20px; }
.main_box_area .tab_con .con_sec .flex a { display: block; }
.main_box_area .tab_con .con_sec .flex .tab_box01 { width: calc(100% / 4 - (20px * 3 / 4)); background: #fff; border: 1px solid #ddd; text-decoration: none; transition: all 0.3s;}
.main_box_area .tab_con .con_sec .flex .tab_box01:hover { border: 1px solid var(--hl-primary); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); transform: translateY(-10px);}
.main_box_area .tab_con .con_sec .flex .item_01 { display: -webkit-box; display: -ms-flexbox; display: flex; }
.main_box_area .tab_con .con_sec .flex .item_01 > .tit { display: inline-block; padding: 10px; color: #fff; background: #5c78e5;}
.main_box_area .tab_con .con_sec .flex .item_01 > .receipt { display: inline-block; padding: 6px 10px; background: #ccc;}
.main_box_area .tab_con .con_sec .flex .item_01 > .deadline{ display: inline-block; padding: 6px 10px; color: #fff; background: #707070;}
.main_box_area .tab_con .con_sec .flex .item_01 > .new_icon { display: inline-block; padding: 6px 10px; color: #fff; background: #ff5c99; }
.main_box_area .tab_con .con_sec .flex .item_02 { font-size: 1.8rem; max-height: 100px; min-height: 80px; margin: 16px; word-break: break-all;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.main_box_area .tab_con .con_sec .flex .item_03 { padding: 14px 16px; color: #555; border-top: 1px dashed #ddd;}

@media screen and (max-width:1000px) {
	.main_box_area .tab_con .con_sec .flex { flex-wrap: wrap; }
	.main_box_area .tab_con .con_sec .flex .tab_box01 { width: calc(100% / 2 - (20px * 1 / 2)); }
	.tab_auto::-webkit-scrollbar { width: 100%; height: 4px; }
    .tab_auto::-webkit-scrollbar-track { background-color: #eee; border-radius: 2px; }
    .tab_auto::-webkit-scrollbar-thumb { background-color: #aab2ca; border-radius: 2px; }
    .tab_auto::-webkit-scrollbar-thumb { background-color: #aab2ca; border-radius: 2px; margin: 0 20px; }
}

@media screen and (max-width:420px) {
	.main_box_area { padding: 40px 0; }
	.main_box_area .tab_con .con_sec .flex .tab_box01 { width: 100%; }
	.main_box_area .tab_con .con_sec .flex .item_02 { min-height: auto; }
}


/* Family site 
------------------------------------------------------- */
.footer_area { position: relative; top: 0; width: 100%; background: #3b3d49; z-index: 20; }
.foot_top { height: 70px; background: #525565; }
.foot_top .flex { 
    display: -webkit-box; display: -ms-flexbox; display: flex; gap: 20px;
    -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; 
    -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 12px 0;}
.foot_top .flex .flex_con { position: relative; width: calc(100% / 4 - ( 20px * 3 / 4)); box-shadow: 0 0 0 1px #cbcee2 inset; -webkit-box-shadow: 0 0 0 1px #cbcee2 inset; }
.foot_top .flex .flex_tit { width: 10%; color: #cbcee2; }
.foot_top .flex li:first-child { border: none; }
.foot_top .flex li a { color:#cbcee2; }
.foot_top .flex a.toggle { position: relative; display: block; padding: 13px 10px; background:url('../img/footer_arrow.png') no-repeat right 20px top 50%; text-align: left; font-weight: 400; text-decoration: none;  } 
.foot_top .flex .foot_layer { position: absolute; bottom: 44px; width: 100%; background: #525565; border: 1px solid #cbcee2; border-bottom: none; height: auto; display: block; z-index: 20; } 
.foot_top .flex .foot_layer > .flex_list > li { width: 100%; color: #cbcee2; letter-spacing: -1px;} 
.foot_top .flex .foot_layer > .flex_list > li:last-child { border-bottom: none; } 
.foot_top .flex .foot_layer > .flex_list > .item > a, 
.foot_top .flex .foot_layer > .flex_list > .item > a:link { display: flex; align-items: flex-end; padding: 5px 10px; color:#cbcee2; line-height: 20px; } 
.foot_top .flex .foot_layer > .flex_list > .item > a:hover { background: #525565; color: #3dbfd4; } 
.footer_area .foot_con .box { text-align: left; font-size: 1.3rem; color: #fff; }
.footer_area .foot_con .box .ie10_chrome { font-weight: 100; color: #a5a8be; margin-top: 3px; }
.newpage_svg01 { width: 14px; height: 14px; margin-left: 5px; margin-bottom: 2px; filter: brightness(0) contrast(100) invert(1);}

.foot_con { 
	display: -webkit-box; display: -ms-flexbox; display: flex;
	-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; 
	-webkit-box-align: center; -ms-flex-align: center; align-items: center; 
	height: 120px; font-size: 1.5rem; gap: 20px; }
.foot_con .familySite { width: 300px; -ms-flex-negative: 1; flex-shrink: 1; }
.foot_con .familySite .flex_con { position: relative; width: 100%; box-shadow: 0 0 0 1px #cbcee2 inset; background: #3b3d49; }
.foot_con .familySite li:first-child { border: none; }
.foot_con .familySite li a { color:#cbcee2; }
.foot_con .familySite a.toggle { position: relative; display: block; padding: 13px 30px; background:url('../img/footer_arrow.png') no-repeat right 20px top 50%; text-align: left; font-weight: 400; text-decoration: none;  } 
.foot_con .familySite .foot_layer { position: absolute; bottom: 44px; width: 100%; background: #3b3d49; border: 1px solid #cbcee2; border-bottom: none; height: auto; display: block; z-index: 20; box-sizing: border-box;} 
.foot_con .familySite .foot_layer > .flex_list > li { width: 100%; color: #cbcee2; } 
.foot_con .familySite .foot_layer > .flex_list > li:last-child { border-bottom: none; } 
.foot_con .familySite .foot_layer > .flex_list > .item > a, 
.foot_con .familySite .foot_layer > .flex_list > .item > a:link { display: block; padding: 10px 10px 10px 30px; color:#cbcee2; line-height: 20px; } 
.foot_con .familySite .foot_layer > .flex_list > .item > a:hover { background: #3b3d49; color: #3dbfd4; text-decoration: underline; } 


@media screen and (max-width:1024px) {
    .foot_top .flex .foot_layer > .flex_list > .item > a, 
    .foot_top .flex .foot_layer > .flex_list > .item > a:link { font-size: 14px; }
}

@media screen and (max-width:900px) {
	.foot_con { height: auto; padding: 30px 0;}
}
@media screen and (max-width:800px) {
	.foot_top .flex li:first-child { width: 30%; word-break: keep-all; }
	.foot_top .flex .flex_con:nth-of-type(3) { width: 70%; } 
	.foot_top .flex .flex_con:nth-of-type(2), 
	.foot_top .flex .flex_con:nth-of-type(4), 
	.foot_top .flex .flex_con:nth-of-type(5) { display: none; } 
}
@media screen and (max-width:600px) {
	.foot_con { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
	.foot_con .familySite { width: 100%; background: #525565; }
	.foot_con .flex .foot_layer > .flex_list > .item > a:link { padding: 10px;}
}
@media screen and (max-width:360px) {
	.foot_top .flex a.toggle { padding: 13px 10px; }
	.foot_top .flex .foot_layer > .flex_list > .item > a, 
	.foot_top .flex .foot_layer > .flex_list > .item > a:link { padding: 10px; font-size: 1.4rem; }
}
/*-------------------------------------------------------

	■ index_반응형

------------------------------------------------------- */
@media all and (max-width:1299px){
	.gnb { width: 100%;}
    .inner { width: 100%; padding: 0 20px; }
	.sub_nav .inner { padding: 0;}
}

@media all and (max-width:1024px){
	.container { margin-top: 100px; }
	.main_container { padding-top: 65px; }
}

@media screen and (max-width: 800px){
	.img_100 { width: 100%; }
}

@media screen and (max-width: 373px){
	.title_area .con_more { font-size: 1.6rem; }
}