/*  */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css');

.openClose { position:absolute; right:20px; top:50%; display:block; width:27px; height:27px; transform:translate(0,-50%); text-indent:-9999px;
	background:url('../images/common/ico_close_wh.png')no-repeat center right / contain; } 
.open ~ .dim { display:block; z-index:30; position:fixed; top:85px; bottom:0; left:0; right:0; background:rgba(0,0,0,0.3); }

/* header */
.headerWrap { z-index:100; display:flex; justify-content:space-between; align-items:center; position:fixed; top:0; left:0; right:0; padding:20px 50px; transition:all 0.5s; } 
.headerWrap h1 a { display:block; width:272px; height:45px; background:url('../images/common/logo.png')no-repeat center / contain; text-indent:-9999px; }
.headerWrap .control { display:flex; align-items:center; }
.headerWrap .control li { display:block; margin-left:30px; text-indent:-9999px; cursor:pointer; }
.headerWrap .searchOpen { width:28px; height:28px; background:url('../images/common/icon_search.png')no-repeat center / contain; } 
.headerWrap .menuOpen { width:28px; height:25px; background:url('../images/common/icon_menu.png')no-repeat center / contain; } 

.headerWrap.scroll { background:#fff; box-shadow:0px 5px 20px 0 rgba(0, 0, 0, 0.1); } 
.headerWrap.scroll h1 a { background-image:url('../images/common/logo_scroll.png'); }
.headerWrap.scroll .searchOpen { background-image:url('../images/common/icon_search_scroll.png'); } 
.headerWrap.scroll .menuOpen { background-image:url('../images/common/icon_menu_scroll.png'); } 

#header .openClose { position:static; width:auto; height:auto; transform:translate(0,0); font-size:1.125em; font-weight:600; text-indent:0; }
#header .openClose span { display:block; line-height:27px; padding-right:45px; background:url('../images/common/ico_close.png')no-repeat center right / contain; }
#header .openClose.wh { color:#fff; }
#header .openClose.wh span { background-image:url('../images/common/ico_close_wh.png'); }

/* searchWrap */
#header .searchWrap { z-index:200; display:none; overflow:hidden; position:fixed; top:0; left:0; width:100%; padding-bottom:100px; background:#f1f0f4; }
#header .searchWrap .top { display:flex; justify-content:space-between; align-items:center; padding:20px 50px; }
#header .searchWrap .logo { display:block; width:272px; height:45px; background:url('../images/common/logo_scroll.png')no-repeat center / contain; text-indent:-9999px; }
#header .searchWrap .search_tit { font-size:1.875em; text-align:center; line-height:1; font-weight:600; }
#header .searchWrap .search_inp { display:flex; justify-content:center; align-items:center; margin:50px auto; }
#header .searchWrap .search_inp input { position:relative; width:600px; height:60px; padding:0 30px; background:#fff; border:0;
	box-sizing:border-box; }
#header .searchWrap .search_inp a { display:block; width:60px; height:60px; text-indent:-9999px;
	background:#2e4797 url('../images/common/ico_search.png')no-repeat center; }
#header .searchWrap .search_txt { padding:0 20px; text-align:center; }
#header .searchWrap .search_txt span { padding-left:25px; font-size:16px; font-weight:300; color:rgba(0, 0, 0, 0.5);
	background:url('../images/common/ico_noti.png')no-repeat center left; }

#header .searchWrap.open { display:block; }

/* menuWrap */
#header .menuWrap { z-index:200; display:none; overflow:hidden; position:fixed; top:0; left:0; bottom:0; right:0; color:#fff; 
	background:url('../images/common/menuWrap_bg.png')no-repeat center / cover;  }
#header .menuWrap .top { display:flex; justify-content:space-between; align-items:center; padding:20px 50px; }
#header .menuWrap .logo { display:block; width:272px; height:45px; background:url('../images/common/logo.png')no-repeat center / contain; text-indent:-9999px; }
#header .menuWrap .menu { position:absolute; top:50%; left:170px; right:50px; transform:translate(0,-50%); }
#header .menuWrap dl { display:flex; justify-content:flex-start; align-items:center;  }
#header .menuWrap dl + dl { margin-top:20px; }
#header .menuWrap dt { position:relative; padding:10px 0; width:340px; font-size:1.875em; font-weight:bold; }
#header .menuWrap dt:after { content:''; position:absolute; left:200px; top:50%; width:0; height:3px; margin-top:-1.5px; transition:all 0.5s; }
#header .menuWrap dd { display:none; }
#header .menuWrap dd li { display:inline-block; padding:10px 0; margin-right:30px; }
#header .menuWrap dd li a { position:relative; font-size:1.125em; padding-bottom:6px; font-weight:300; }
#header .menuWrap dd li a:after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:#fff; transition:all 0.5s; }
#header .menuWrap dd li:hover a:after { width:100%; }
#header .menuWrap a { color:#fff; }

#header .menuWrap dl:nth-of-type(1) dt:after { background:#2e4797; }
#header .menuWrap dl:nth-of-type(2) dt:after { background:#00b26b; }
#header .menuWrap dl:nth-of-type(3) dt:after { background:#4dafc1; }
#header .menuWrap dl:nth-of-type(4) dt:after { background:#ff9a66; }
#header .menuWrap dl:nth-of-type(5) dt:after { background:#98b4cc; }
#header .menuWrap dl:nth-of-type(6) dt:after { background:#d08dd7; }
#header .menuWrap dl:nth-of-type(7) dt:after { background:#aa7772; }
#header .menuWrap dl.on dt:after { width:100px; }
#header .menuWrap dl.on dd, #header .menuWrap dd:hover { display:block; }

#header .menuWrap .bottom { position:absolute; bottom:50px; left:50px; right:50px; display:flex; justify-content:space-between; align-items:center; }
#header .menuWrap .bottom p { font-size:14px; font-weight:300; color:#fff; }
#header .menuWrap .bottom .right a { display:inline-block; width:20px; height:20px; text-indent:-9999px; }
#header .menuWrap .bottom .right a + a { margin-left:20px; }

#header .menuWrap.open { display:block; }

/* footer */
.main #footer { background:#f1f0f4; padding:0 100px; margin-left:250px; }
#footer { padding:0 50px; }
.footWrap { position:relative; padding:50px 0 80px; border-top:3px solid #000; background:url('../images/common/foot_bg.png')no-repeat right bottom 80px; }
.topWrap { display:flex; flex-wrap:wrap; justify-content:space-between; padding-right:120px; }
.topWrap .left li { display:inline-block; margin-right:30px; margin-bottom:10px; font-size:1.125em; }
.topWrap .left li:after { content:"\2022"; display:inline-block; width:30px; margin-right:-30px; font-size:14px; font-weight:300; text-align:center; }
.topWrap .left li:last-child { margin-right:0; }
.topWrap .left li:last-child:after { display:none; }

.footWrap .sns { position:absolute; right:0; top:50px;  }
.footWrap .sns a { display:inline-block; width:20px; height:20px; text-indent:-9999px; }
.footWrap .sns a + a { margin-left:20px;  }
.snsF { background:url('../images/common/sns_face.png')no-repeat center; }
.snsF.wh { background-image:url('../images/common/sns_face_wh.png'); }
.snsI { background:url('../images/common/sns_inst.png')no-repeat center; }
.snsI.wh { background-image:url('../images/common/sns_inst_wh.png'); }
.snsY { background:url('../images/common/sns_yout.png')no-repeat center; }
.snsY.wh { background-image:url('../images/common/sns_yout_wh.png'); }

.footWrap .phone { margin:50px 0; }
.footWrap .phone span { font-size:14px; }
.footWrap .phone p { margin-top:10px; font-size:1.125em; font-weight:bold; color:#2e4797; }
.footWrap address { font-size:14px; }

/* layout */
.mon { font-family:'Montserrat', 'Spoqa Han Sans Neo'; }
body { font-size:16px; font-family:'Spoqa Han Sans Neo', 'sans-serif'; letter-spacing:-0.5px; }
input { display:block; font-family:'Spoqa Han Sans Neo', 'sans-serif'; font-size:18px; }
select { background:none; -webkit-appearance:none; -moz-appearance:none; font-family:'Spoqa Han Sans Neo', 'sans-serif'; font-size:18px; }
input[type=text], input[type=date], input[type=password], textarea { padding:5px; border:1px solid #e5e5e5; }
input:focus { outline:1px solid #757a8b; }
input::placeholder { color:#9fa0a0; font-size:18px; }
input:disabled { background:#f1f0f4; }
textarea { display:block; font-family:'Spoqa Han Sans Neo', 'sans-serif'; resize:none; font-size:18px; }
div, p, span, a { line-height:1.4; }

.flexStretch { display:flex; justify-content:space-between; align-items:stretch; flex-wrap:wrap; }

.mt20 { margin-top:20px !important; }
.mr20 { margin-right:20px !important; }
.ml20 { margin-left:20px !important; }

.pr50 { padding-right:50px !important; }
.pr70 { padding-right:70px !important; }
.pr90 { padding-right:90px !important; }
.pr100 { padding-right:100px !important; }

.pb50 { padding-bottom:50px !important; }
.pb60 { padding-bottom:60px !important; }
.pb70 { padding-bottom:70px !important; }

.w30 { width:30% !important; }
.w40 { width:40% !important; }
.w49 { width:49% !important; }
.w50 { width:50% !important; }
.w50_1 { width:calc(50% - 10px) !important; }
.w50_2p { width:calc(50% - 2%) !important; }
.h50 { height:50% !important; }
.h50_1 { height:calc(50% - 10px) !important; }
.h100 { height:100% !important; }

.w100 { width:100px !important; }
.w300 { width:300px !important; }
.wfull { width:100% !important; }

.col10 { width:10%; }
.col20 { width:20%; }
.col30 { width:30%; }
.col40 { width:40%; }
.col50 { width:50%; }
.col60 { width:60%; }
.col70 { width:70%; }
.col80 { width:80%; }
.col90 { width:90%; }

.c_red { color:#f73c71 !important; }
.c_grey { color:#757a8b !important; }
.c_blue { color:#2e4797 !important; }

.td_underline { text-decoration:underline; }

.bg_grey { background-color:#757b8b; color:#fff; }
.bg_mint { background-color:#98b4cc; color:#fff; }
.bg_navy { background-color:#2e4797; color:#fff; }
.bg_green { background-color:#00b26b; color:#fff; }
.bg_blue { background-color:#4dafc1; color:#fff; }
.bg_orange { background-color:#ff9a66; color:#fff; }

.pcView { display:block !important; }
.mobileView { display:none !important; }

@media (max-width:1280px) {
	.headerWrap, #header .menuWrap .top { padding:20px; }

	#header .menuWrap { overflow-y:auto; }
	#header .menuWrap .menu { position:static; transform:translate(0,0); padding:20px; }
	#header .menuWrap dl { display:block; }
	#header .menuWrap dt { width:auto; background:url('../images/common/menuWrap_open.png')no-repeat right center / 18px auto; }
	#header .menuWrap dt:after { display:none; }
	#header .menuWrap dl.on dd, #header .menuWrap dd:hover { display:none; }
	#header .menuWrap dt { padding:15px 0; font-size:1.5em; }
	#header .menuWrap dd ul { overflow:hidden; padding-top:10px; }
	#header .menuWrap dd li { float:left; display:block; width:50%; margin-right:0;  }
	#header .menuWrap dd li:before { content:"\2022"; display:inline-block; width:2em; font-size:10px; font-weight:300; text-align:center; }
	#header .menuWrap dd li a { padding-bottom:0; }
	#header .menuWrap dd li a:after { display:none; }
	#header .menuWrap .bottom { position:static; padding:20px; }
	
	#header .menuWrap dl.open dt { border-bottom:2px solid; background-image:url('../images/common/menuWrap_close.png'); }
	#header .menuWrap dl.open dd { display:block; }

	#header .menuWrap dl:nth-of-type(1).open dt { border-color:#2e4797; }
	#header .menuWrap dl:nth-of-type(2).open dt { border-color:#00b26b; }
	#header .menuWrap dl:nth-of-type(3).open dt { border-color:#4dafc1; }
	#header .menuWrap dl:nth-of-type(4).open dt { border-color:#ff9a66; }
	#header .menuWrap dl:nth-of-type(5).open dt { border-color:#98b4cc; }
	#header .menuWrap dl:nth-of-type(6).open dt { border-color:#d08dd7; }
	#header .menuWrap dl:nth-of-type(7).open dt { border-color:#aa7772; }

}

@media (max-width:768px) {
	body { font-size:14px; }
	input, input::placeholder { font-size:14px; }
	select { font-size:14px; }
	textarea { font-size:14px; }
	
	input.w300 { width:50% !important; }
	.openClose { width:18px; height:18px; }

	.pcView { display:none !important; }
	.mobileView { display:block !important; }


	.headerWrap, #header .menuWrap .top, #header .searchWrap .top { padding:10px 20px; }
	.headerWrap h1 a, #header .menuWrap .logo, #header .searchWrap .logo { width:200px; }
	.headerWrap .control li { margin-left:20px; }
	.headerWrap .menuOpen { width:22px; }
	.headerWrap .searchOpen { width:22px; }
	#header .openClose span { width:22px; height:22px; padding:0; text-indent:-9999px; }

	#header .menuWrap { background-image:url('../images/common/menuWrap_bg_m.png'); }
	#header .menuWrap .bottom { display:none; }

	#header .searchWrap { padding-bottom:40px; }
	#header .searchWrap .search_tit { margin-top:20px; font-size:1.5em; }
	#header .searchWrap .search_inp { margin:30px 20px; }
	#header .searchWrap .search_inp input { width:100%; height:50px; padding:0 20px; }
	#header .searchWrap .search_inp a { width:50px; height:50px; }
	#header .searchWrap .search_txt span { font-size:14px; }
	

	#footer { padding:0 20px; }
	.footWrap { padding:30px 0 50px; background:none; }
	.topWrap { padding-right:0; }
	.footWrap .phone { margin:20px 0 30px; }
	.footWrap .phone span, .footWrap address { font-size:12px; }
	.footWrap .phone p { margin-top:5px; font-size:1em; }
	.footWrap .sns { position:static; margin-bottom:30px; }
}



@media print {
	@page {
		size:210mm 297mm; /*A4*/
		margin:0mm
	}

	#header, #footer, .issueWrap, #contHead, .subTitle  { display:none !important; }
	#bodyArea .contentWrap { padding:5mm !important; }

	* {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
    }
}