.doc{font-size: 16px;}
.main #footer{margin: 0}


:root{
    --maincolor:#173c76;
    --subcolor:;
}


@charset "utf-8";
/* CSS Document */
body{ font-size:16px}
.box0{ margin:0 3%}
.box1{ width:1200px; margin:0 auto; max-width:95%}
.box2{ width:1500px; margin:0 auto; max-width:95%}

.PC{ display:block !important}
.PHONE{ display:none !important}
.en_st{ font-family:'Ms'}
.not_st{ font-family:'noto sans kr'}



/*.container_title{ text-align:center; font-size:2.375em; color:#000; font-weight:300; font-family:'Ms','notokr';position: relative;}
.container_title:before{content:""; width:1px; height:.75em; background:#000; position:absolute; top:-25px; left:50%; margin-left:0;}
*/
.container_title { font-size:2.375em; line-height:1; font-weight:300; margin:0 0 55px 0; text-align:center; position:relative; padding-top:20px }
/*.container_title:before { content:""; width:1px; height:.75em; background:#222; position:absolute; top:-25px; left:50%; margin-left:0 }*/



#header{position: absolute; left:0; top:0; width:100%; z-index:1000; border-bottom:1px solid rgba(255,255,255,.4); transition:.3s; background:#fff; box-shadow: 0 1px 13px rgb(0 0 0 / 10%);}
#header:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; opacity:1; z-index:-1}
#header .top_wrap,
#header .va_wrap{ height:5em}
#header .top_wrap .logo{}
#header:hover .gnb_wrap .gnb > li .dp1{ color:#444;}
#header:hover .etc_wrap .mem_wrap > li a{color:#666;}
#header:hover .etc_wrap .all_wrap .all_btn .xi{ color:#444;}
#header .logo{ position:relative; z-index:1}
#header .gnb_wrap{ position:absolute; width:100%; left:0; top:0; box-sizing:border-box; padding:0 15em; text-align:right;}
#header .gnb_wrap .gnb{ display:inline-flex; justify-content:center; margin:0 auto}
#header .gnb_wrap .gnb:before{ content:""; position:absolute; left:0; top:5em; width:100%; height:calc(100% - 5em); background:#fff; transform:scaleY(0); transform-origin:left top; transition:.5s; z-index:-1; border-top:1px solid #ddd; box-sizing:border-box}
#header .gnb_wrap .gnb > li{ position:relative; min-width: 160px;}
#header .gnb_wrap .gnb > li .dp1{ font-weight:500; color:#313232; position:relative; z-index:1; transition:.3s; padding:0 1em; min-width:7em}
#header .gnb_wrap .gnb > li .dp1 .va{ padding-top:.25em; font-family: 'noto sans kr'}
#header .gnb_wrap .gnb > li.point .dp1{ color:var(--maincolor)}
#header .gnb_wrap .gnb > li.point .dp1 .xi{ font-size:1.125em}
#header .gnb_wrap .gnb > li:hover .dp1:after{ transform:scaleX(1)}
#header .gnb_wrap .gnb > li:hover .dp1,
#header .gnb_wrap .gnb > li.on .dp1{ color:var(--maincolor)}
#header .gnb_wrap .gnb > li:hover .dp1:after{ transform:scaleX(1)}
#header .gnb_wrap .gnb > li .dp1 .va{ font-size:1.125em; font-weight:500}
#header .gnb_wrap .gnb > li .dp2{ display:block; opacity:0; height:0; overflow:hidden}
#header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; padding:.8em 0; color:#5c5e5e}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a,
#header .gnb_wrap .gnb > li .dp2 > li.on > a{ color:var(--maincolor)}
#header .gnb_wrap .gnb > li .dp3{ display:none}
#header .gnb_wrap:hover .gnb:before{transform:scaleY(1); transition:.3s; transition-delay:.1s}
#header .gnb_wrap:hover .gnb:after{ visibility:visible; transition-delay:.3s}
#header .gnb_wrap:hover .gnb > li .dp2{ opacity:1; height:calc(100% - 5em); overflow: visible; transition:.3s; transition-delay:.1s; padding:1em 0 2em 0}
#header .gnb_wrap  + .gnb_bg{ position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:-2;opacity:0;visibility:hidden;}
#header .gnb_wrap:hover + .gnb_bg{opacity:1; visibility: visible; transition:.3s; transition-delay:.1s;}
#header .gnb_wrap .slideDot{ position:absolute; left:0; top:.5em; color:#af1f24; font-size:1.25em; line-height:1; margin-left:-.5em; text-align:center; visibility:hidden; opacity:0; }
#header .gnb_wrap .slideDot:before{content:"\e914"}
#header .gnb_wrap .slideDot.on{ visibility:visible; opacity:1}
#header .gnb_wrap .slideDot.trans{ transition:1s}
#header .gnb > li.m_guide{ display:none;}

#header .all_wrap{ }
#header .all_wrap .all{ position: fixed; z-index:1; right:0; top:0; width:100%; height:100%; opacity:0; visibility:hidden; transition:.3s}
#header .all_wrap .all:before{ content:""; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:.5}
#header .all_wrap .all .in{ position: absolute; top:-100%; width:100%; height:100%; background:#fff; transition:.3s; padding:9em 0; }
#header .all_wrap.on .all{ opacity:1; visibility:visible}
#header .all_wrap.on .all .in{ top:0}
#header .all_wrap .gnb > li{ width:33.33%; position:relative; box-sizing:border-box; padding:0 .3em; margin-bottom:2.5em;}
#header .all_wrap .gnb > li:before,
#header .all_wrap .gnb > li:after { content:""; position:absolute; top:0; left:4%; width:92%; height:8px; transform:skew(-45deg); transition:.5s;}
#header .all_wrap .gnb > li:before{ background:#ccc;}
#header .all_wrap .gnb > li:after { background:#ff6e3d; width:0;}
#header .all_wrap .gnb > li:hover:after { width:96%;}
#header .all_wrap .gnb > li .dp1{ height:70px; font-size:1.250em;}
#header .all_wrap .gnb > li .dp2{ margin:0 8px; padding:1rem 0; background:#fff; border:1px solid #ddd; box-shadow:1px 1px 5px rgba(0,0,0,.1); height:160px;}
#header .all_wrap .gnb > li .dp2 .va_wrap{ height:inherit;}
#header .all_wrap .gnb > li .dp2 > li{ padding:.5em 1.5em;  display:block;}
#header .all_wrap .gnb > li .dp2 > li > a{ position:relative; font-size:.938em; transition:.2s; text-align: left; padding-left:10px;}
#header .all_wrap .gnb > li .dp2 > li > a:after{ content:""; position:absolute; left:0; top:.5em; width:4px; height:2px; background:#999;}
#header .all_wrap .gnb > li .dp2 > li:hover > a{ margin-left:.3em;}
#header .all_wrap .gnb li:hover > a{ color:#ee4309;}
#header .all_wrap .gnb li:hover .dp2{ background:#fcfcfc; border-color:#ccc; transition:.2s;}
#header .all_wrap .tit_wrap .allClose{ position:absolute; top:1%; right:4%; font-size:1.8em; color:#999; transition:.3s;}
#header .all_wrap .tit_wrap .allClose:hover{ color:#d85529;}

#header .etc_wrap {}
#header .etc_wrap .all_wrap .all_btn{ display:block; color:#fff; text-align:center; position:relative; border:1px solid #ddd; width:3em; height:3em; font-size:1.125em; transition:.3s; color:#111;}
#header .etc_wrap .all_wrap .all_btn .xi{ position:relative}
#header .etc_wrap .all_wrap .all_btn:hover{border:1px solid var(--maincolor);}
#header .etc_wrap .all_wrap .all_btn:hover .xi{ color:var(--maincolor);}

.sub #header{ position: relative;}


/*nav*/

.l-nav .gnb{ display:block;}
.l-nav .gnb > li{ display:block;}
.l-nav .gnb > li:first-child .dp1.va_wrap{border-top:1px solid #ddd;}
.l-nav .gnb > li .va_wrap{ display:block; text-align:left;}

.l-nav .gnb > li .dp1.va_wrap{padding:1.5em 3em 1.5em 1em;  position:relative; border-bottom: 1px solid #ddd;}

.l-nav .gnb > li .dp1 .va{padding:2em 0; display:inline;}
.l-nav .gnb > li .dp1 .va:after{ content:'+'; position:absolute; top:16px; right:20px; font-size:1.5em; font-weight: bold; color:var(--maincolor);}

.l-nav .gnb .dp1.on{ background-color:var(--maincolor);}
.l-nav .gnb .dp1.on .va{color:#fff;}
.l-nav .gnb .dp1.on .va:after{ content:'-'; color:#fff; font-size:2em; top:9px;}

.l-nav .gnb > li .dp2 {display: none;}
.l-nav .gnb > li .dp2 > li{ display:block;}
.l-nav .gnb > li .dp2 .va_wrap{ border-bottom: 1px solid #ddd; background: #fbfbfb;}
.l-nav .gnb > li .dp2 .va{padding:1em 0; padding-left: 1.8em; position:relative; font-size:.9rem;}
.l-nav .gnb > li .dp2 .va:after{content:'-'; color:#333; position:absolute; top:13px; left:10px;}

.l-nav .gnb > li .dp3,
.l-nav .gnb > li.m_guide,
.l-nav .gnb > li.m_mypage{ display:none;}



.l-nav .nav_logo{ margin:1em 0.5em; position:relative;}
.l-nav .nav_logo img{ width:155px; margin:.5em 0;}
.I-nav .nav_close { position:absolute; top:0; right:0;}
.l-nav .xi-close{color:#aaa; font-size:2.25em; position: absolute; top: .5em; right: .5em;}

.l-nav .nav_top{ background:#f5f5f5; padding:.5em; margin-bottom:.5em;}
.l-nav .nav_top li a{ background:#fff; border:1px solid #ddd; font-size:.875em; margin-right:5px; padding:.5em 1.5em;}

.l-wrapper{ overflow:hidden}
.l-main {
  -webkit-transition: -webkit-transform 500ms ease;
  -moz-transition: -moz-transform 500ms ease;
  -o-transition: -o-transform 500ms ease;
  transition: transform 500ms ease;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  position: relative;
  z-index: inherit;
  overflow: hidden;  
}

.l-nav {
  -webkit-transition: opacity 700ms ease;
  -moz-transition: opacity 700ms ease;
  -o-transition: opacity 700ms ease;
  transition: opacity 700ms ease;
  opacity: 0;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  z-index:1
}
.l-nav::-webkit-scrollbar {width: 0;}

html.l-nav-open .l-nav{width: 300px;}

html.l-nav-open,
html.l-nav-open body {
  height: 100%;
  overflow: hidden
}
html.l-nav-closing body {
  background: none;
}
html.l-nav-open .l-main {
  -webkit-transform: translate3d(-300px, 0, 0);
  -moz-transform: translate3d(-300px, 0, 0);
  -o-transform: translate3d(-300px, 0, 0);
  transform: translate3d(-300px, 0, 0);
}
html.l-nav-open .l-nav {
  -webkit-overflow-scrolling: touch;
  -moz-overflow-scrolling: touch;
  -ms-overflow-scrolling: touch;
  -o-overflow-scrolling: touch;
  overflow-scrolling: touch;
  opacity: 1;
  -webkit-box-shadow: 0 0 0.5625rem #666;
  box-shadow: 0 0 0.5625rem #666;
	background: #fff;
	z-index: 1001
}
.l-nav-open .l-nav,
.l-nav-closing .l-nav {
  display: block;
}




#footer{background:#111;}
#footer .f_top{border-bottom: 1px solid rgba(255,255,255,.2);}
#footer .f_menu{}
#footer .f_menu > li{ display:inline-block; margin-right:3em; position:relative;}
#footer .f_menu > li a{ color:#fff; font-size:.938em; padding: 10px 0; display:block; font-weight: 300;}

#footer .info_wrap{ padding:2em 0 0;}
#footer .info_wrap .f_logo{}
#footer .info_wrap .info{ box-sizing:border-box; padding-left: 2em;}
#footer .info_wrap .info > li{ margin-right:2em; color:#fff; opacity:.8; line-height:1.6; letter-spacing:0;  font-size:.938em; font-weight:300;}
#footer .copyright{font-size:.813em;  font-weight:300; letter-spacing:.5px; font-family:'Ms'; height:50px;}
#footer .f_logo{width:15%}
#footer .ft_info{width:85%}
#footer .ft_info > .info{width:50%}
#footer .ft_info > .info .cs{font-weight:600;}
#footer .ft_info > .info .tel{font-size:30px; font-weight:600;font-family: 'Ms';}




.goTop{ z-index:998; position:fixed; right:2em; bottom:2em; width:3.6em; height:3.6em; background:#ff830b; border-radius:100%; transition:.2s;}
.goTop .xi{ display:block; line-height:1em;  color:#fff;}
.goTop .tt{ font-size:.750em;  color:#fff;}
.goTop:hover{ background:#e65d1f;}

.main #contents .sub_visual_wrap,
.main .sub_tit{display:none;}
#contents{}
/*#contents .doc{ padding:4em 0 10em 0}*/
#contents .sub_visual_wrap{ position:relative}
#contents .sub_visual_wrap .va_wrap{ position:relative; height:20em; overflow:hidden}
#contents .sub_visual_wrap .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:cover; background-color:#aaa; transform:scale(1,1); transition:2s}
#contents .sub_visual_wrap .slogan{ position:relative; margin-top:-2em;}
#contents .sub_visual_wrap .slogan .tit{ font-size:2.5em; font-weight:600; color:#fff; margin-right:5em; opacity:0; transition:1s;}
#contents .sub_visual_wrap .slogan .sec{ display:block; width:0; height:.1em; margin:1.25em auto; background:#fff; transition:1s; transition-delay:.5s}
#contents .sub_visual_wrap .slogan .nav{ font-size:.875em; color:#fff; opacity:0; line-height:1.5; transition:1s; transition-delay:.5s; display:none;}
#contents .sub_visual_wrap .slogan .nav .xi{ font-size:1em;}
#contents .sub_visual_wrap .slogan .nav .arrow{ margin:0 .3em 0 .2em}
#contents .sub_visual_wrap .slogan .nav .arrow:before{content:"\e93f"}
.load #contents .sub_visual_wrap .slogan .tit{ margin-right:0; opacity:1}
.load #contents .sub_visual_wrap .slogan .sub_slogan{ margin-left:0; opacity:1;}
.load #contents .sub_visual_wrap .slogan .nav{ opacity:1}
.load #contents .sub_visual_wrap .slogan .sec{ width:2.5em}
#contents .sub_visual_wrap .sub_gnb_wrap{ position:absolute; left:0; bottom:0; width:100%}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb{ text-align:center; margin-top:-1em; display:block;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp1{ display:none}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on .dp2{ display:block}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2{ font-size:0;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{/* max-width:33.33%*/ max-width:20%; display:inline-block; vertical-align: top; font-size:1rem;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ background:var(--maincolor); height:3.8em; color:#fff; border-left:1px solid rgba(255,255,255,.1);transition:.3s;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:1.125em; transition:.3s;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a .va{ opacity:1;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a{ background:#fff; color:#000;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a .va,
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on:hover > a .va{ opacity:1;}


.agree_box{ border:1px solid #ddd; background:#f9f9f9; border-radius:5px}
.agree_box:after{ display:block; clear:both; content:'';}
.agree_box .con{  padding:2em; font-size:1em; color:#333}
.agree_box .con.page_prv{ border:1px solid #ededed; margin:1em; background:#fff; font-size:.938em;}
.agree_box .con.scrollst{ height:9.5em; overflow-y:scroll; border:1px solid #ededed; margin:1em; background:#fff;}
.agree_box .con.scrollst .agree_wrap{ font-size: .938em;}
.agree_box .btn{ border-top:1px solid #ddd; background:#f5f5f5; padding:.5em 2em; text-align:right; font-size:.813em}
.agree_box .btn label{ margin-left:2em}
.cont_check{ color:#777; margin-top:7px;}
.cont_check .xi{ font-size: 1.5em;}

.prv_box .prv_tit{margin:1.5em 0 1em; font-size: 1.375em; font-weight: 500; color: #222;}
.prv_box .prv_stt{margin:1em 0; font-size: 1.125em; color: #222;}
.prv_box p{margin-bottom:7px;}

.sub_tbl .tbl_st {border:1px solid #ccc;  border-top:2px solid #85a1b9; width:100%;}
.sub_tbl .tbl_st tbody th {background:#f0f4f7; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:1em 1.5em; color:#333; }
.sub_tbl .tbl_st tbody td {background:#fff;  color:#666; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:1em 1.5em; line-height:1.5; text-align:left;}
.sub_tbl .tbl_st .bg_st1{background-color:#f9f9f9; text-align: center;}
.agree_box .st_list{padding-left:.6em;}
.agree_box .st_list > li{font-size: .938em; padding-left: .6em; margin-top: 5px; position: relative;}
.agree_box .st_list > li:before{content:''; width:3px; height: 3px; background: #ff8e2e; position: absolute; top: 9px; left: 0;}

/*======================================================================sub======================================================================*/


/*공통*/
.sub_tit{margin-top:3em;}
.sub_tit .t1{ text-align:center; font-size:2.5em; color:#000; font-weight:300; font-family:'Ms','notokr';}
.sub_tit .line{ display:block; width:1px; height:.75em; background:#000; margin-bottom:.25em; margin-left:10px;}
.sub_tit .t1 .line{ margin-left:auto; margin-right:auto}
.load .sub_tit .line{transform: scaleY(1); visibility: visible; opacity: 1; transition:.5s; transition-timing-function:ease-in;}
.sub_stt{ position: relative; padding-left: 27px; font-size: 1.5em; color: #000; margin-bottom: 1em;}
.sub_stt:before{ content: ''; display: block; position: absolute; top: 11px; left: 0; width: 16px; height: 16px; background-color:#fd972b;}
.page_tt{ font-size: 1.5em; margin-bottom: .5em; margin-top: 2.5em; color: #222;}


/*기업정보*/
.vou_wrap .vou_img_top{ height:350px; background-image: url(/images/sub/ceo_bg.jpg); margin-bottom:2.5em;}
.vou_wrap .vou_info{ width:100%; margin:-13em auto 0; box-sizing:border-box; padding:5em 3em; box-shadow:3px 3px 10px rgba(0,0,0,0.1); background:#fff;}
.vou_wrap .vou_info .logo_t{margin-bottom:5px;}
.vou_wrap .vou_info .logo_t img{width:70px; height: auto;}
.vou_wrap .vou_info .v_tt{ font-size:2.5em; text-align:center; color:#e65015; margin-bottom:.5em; font-weight:600;}
.vou_wrap .vou_info .v_line{ width:50px; height: 2px; background: #ddd; margin: 1em auto 2em;}
.vou_wrap .vou_info .v_tx{ text-align:center; font-size:1.2em; margin-top:.6em; font-weight:400; color:#333;}
.back_line{background: linear-gradient(to top, #ffe585 35%, transparent 50%); vertical-align:baseline;}
.org_box{background-color:#f9f9f9; padding: 5em 0; margin-top:6em;}	

.cp_info{}
.cp_info > li{flex: 16.66%; text-align: center; margin-bottom: 2em;}
.cp_info > li .in{padding:0 .5em;}
.cp_info > li .in .icon_w{width:5em; height: 5em; border:2px dotted #ccc; border-radius: 50%; margin: 0 auto 10px;}
.cp_info > li .in .icon_w .xi{font-size:1.825em; color: var(--maincolor);}
.cp_info > li .in .tt{ color:#999;}
.cp_info > li .in .tw{font-size:1.068em; color:#444; line-height: 1.2; margin-top:7px;}

/*인사말*/
.about_tit{ background-color:#aaa;  padding: 8em 0;}	
.about_tit .in_tt { font-size:5em; font-weight: 900; line-height: 1; width:40%; padding-top: 70px;}
.about_tit .in_tt .t1{ color: #fff; font-style: italic; margin-bottom:10px;}
.about_tit .in_tt .t2{ color: transparent; -webkit-text-stroke: 1px #fff; font-style: italic;}
.about_box{background-color:#fff; padding:5em; width:60%; box-sizing: border-box;}
.about_box .page_tx{ margin-top: 20px; line-height: 1.7;}
.about_box .page_stt{ font-size:1.8em; font-weight: 600; margin-bottom: 30px;}
.about_box .name_w{text-align:right; font-size:1.068em; margin-top: 40px; }
.about_box .name_w .name{font-size:1.625em; font-weight: 500; letter-spacing: 1.5px; margin-left:10px; font-family: 'Nanum Brush Script', cursive;}


/*연혁*/
.sub_history_wrap{padding: 30px 0;}
.history_wrap{ position:relative; overflow:hidden; padding:2em 0}
.history_wrap:before,
.history_wrap .lineAni{ content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#ddd}
.history_wrap .lineAni{ height:0; background:var(--maincolor); transition:.3s}
.history_wrap .lineAni:before,
.history_wrap:after{ content:""; position:absolute; left:50%; top:0; margin-left:-.5em; width:1em; height:1em; background:#fff; border:.25em solid var(--maincolor); border-radius:100%; box-sizing:border-box}
.history_wrap:after{ top:auto; bottom:0}
.history_wrap .history > li{ margin-top:2em}
.history_wrap .history > li:first-child{ margin-top:0}
.history_wrap .history > li .year_tt{ margin-bottom: 1em;}
.history_wrap .history > li .year_tt .wrap_in{ position:relative; overflow:hidden;}
.history_wrap .history > li .year_tt .tt{ display:inline-block; position:relative; padding:0 .5em; font-size:3.5em; font-weight:700; letter-spacing:-3px; color:var(--maincolor); font-family: Georgia, "Times New Roman", Times, serif}
.history_wrap .history > li .year_tt .tt:before{ content:""; position:absolute; right:100%; top:50%; margin-top:3px; width:100%; border-top:2px dotted #aaa}
.history_wrap .history > li .year_tt .tt:after{ content:"'"; font-weight:400; font-style:italic}    
.history_wrap .history > li .list{ width:50%; margin-top:1em}
.history_wrap .history > li .list > li{ margin-top:.5em}
.history_wrap .history > li .list > li:first-child{ margin-top:0}
.history_wrap .history > li .list .wrap_in{ padding:0 2em}
.history_wrap .history > li .list .wrap_in .detail > li .tt:after{ display: block; clear: both; content: '';}
.history_wrap .history > li .list .ynm{ color: #999; font-weight: 600; font-size: 1.125em; margin-right: 13px; float: left;}
.history_wrap .history > li .list .detail{ width: 100%;}
.history_wrap .history > li .list .detail > li{ margin-top:.5em}
.history_wrap .history > li .list .detail > li:first-child{ margin-top:0}
.history_wrap .history > li .list .detail .tt{ position:relative; padding:0 1.5em; margin-top:.125em; color:; font-size: 1.125em;}
.history_wrap .history > li .list .detail .tt:before{ content:""; position:absolute; left:0; top:.7em; width:.75em; border-top:2px solid #ddd}
.history_wrap .history > li .list .detail .tt .xi{font-size: 1em;}
.history_wrap .history > li:nth-child(2n) .year_tt{ justify-content:flex-end; text-align:right}
.history_wrap .history > li:nth-child(2n) .year_tt .tt:before{ right:auto; left:100%}
.history_wrap .history > li:nth-child(2n) .list{ order:-1}
.history_wrap .history > li:nth-child(2n) .list > li > .flex{ justify-content:flex-end}
.history_wrap .history > li:nth-child(2n) .list .detail{ order:-1}
.history_wrap .history > li:nth-child(2n) .list .detail .tt{ text-align:right}
.history_wrap .history > li:nth-child(2n) .list .detail .tt:before{ left:auto; right:0}
.history_wrap .history > li:nth-child(2n) .list .ynm{ float: right; margin-left: 13px; margin-right: 0;}


/*오시는 길*/
.location_box .root_daum_roughmap{ width:100% !important;}
.location_box .map_tw{padding-bottom:1em; font-size:1.375em; font-weight:500;}
.location_box .map_tw .xi{ width: 1.85em; height: 1.85em; line-height: 1.85em; background: var(--maincolor); border-radius: 50%; text-align: center; margin-right: 15px; color: #fff;}
.location_box .map_view{ border-top:3px solid var(--maincolor); box-shadow:0 .25em .5em rgba(0,0,0,.2); transition:.3s; padding:1em; border-radius:0 0 1em 1em}
.location_box .map_view .tt {padding-bottom:10px; font-size:1.125em; color:#222; letter-spacing:-2px; vertical-align:middle;}
.location_box .map_view .xi {vertical-align:middle; font-size:1.125em; padding-right:5px;}
.location_box{ margin: 0 auto; padding: 0 1em;}
.location_box .info_list{margin-top:1em;}
.location_box .info_list > li { overflow:hidden; padding:2.5em 1em; border-bottom:1px solid #ddd}
.location_box .info_list > li h3 { float:left; color:#222; font-size:1.375em; font-weight:500; position: relative; padding-top:7px;}
.location_box .info_list > li h3:before{content:''; width:25px; height: 2px; background: var(--maincolor); position: absolute; top:0; left: 0;}
.location_box .info_list > li h3 .xi { font-size:1.125em; margin-right: 5px;}
.location_box .info_list > li .info { margin:0 0 0 240px;}
.location_box .info_list > li .info .in_list{background: #f9f9f9; border: 1px solid #ddd; padding: 1.5em;}
.location_box .info_list > li .info .in_list > li{ color: #333; margin-bottom: 10px;}
.location_box .info_list > li .info .in_list > li:last-child{margin-bottom:0;}
.location_box .info_list > li .info .in_list > li:before{content:'-'; margin-right:5px;}



/*문의*/
.tbl_tx{font-size:.938em; color:333; margin-bottom: 10px;}
.tbl_av{display:none;}



/*======================================================================main======================================================================*/


.btn_fix{ position:fixed; bottom:1.5em; right:1em; z-index: 10000;}
.btn_fix .top_btn{font-size:1.5em; width:3.2em; height: 3em; line-height: 3em; background:#333; color:#fff; border-radius: 10px; text-align: center; box-shadow: 0 5px 0 rgb(0 0 0 / 15%); margin-top: 7px; display: block;}
.main .btn_fix .top_btn.main{display: block; }
.sub .btn_fix .top_btn.sub{display: block;scroll-behavior: smooth;}
.sub .btn_fix .top_btn.main{display: none; }
.main .btn_fix .top_btn.sub{display: none;}

.qk_list .qk_btn{ display:block; width:3.2em; height: 3.2em; line-height: 1.2; border-radius: 10px; text-align: center; box-shadow: 0 3px 0 rgb(0 0 0 / 15%); font-size: 1.5em; margin-top: 5px;}
.qk_list .qk_btn.inq_btn{background:var(--maincolor); color:#fff!important;}
.qk_list .qk_btn.kakao_btn{background:#ffcf3d; color:#512929!important;}
.qk_list .qk_btn.store_btn{background: #3bb51c;color: #fff !important;}
.qk_list .qk_btn.blog_btn{background: #3bb51c;color: #fff !important;}
.qk_list .qk_btn.ins_btn{background:linear-gradient(120deg, #574dc0, #b23086, #f09336); color:#fff!important;}
.qk_list .qk_btn .xi{font-size:1.2em;}
.qk_tit{display:block;font-size: 13px; }

.mainNav_wrap{ position:fixed; z-index:999; right:0; top:0; height:100%}
.mainNav > li *{transition:.3s}
.mainNav > li > a{ display:block; text-align:right; padding:.5em 1em}
.mainNav > li > a .line,
.mainNav > li > a .tt{ display:inline-block; *display:inline; zoom:1; vertical-align:middle}
.mainNav > li > a .line{ width:.6em; height:.6em; border:1px solid var(--maincolor); margin-left:1em; opacity:.5}
.mainNav > li > a .tt{ color:var(--maincolor); font-size:.938em; opacity:0; visibility:hidden; letter-spacing:0; text-transform:uppercase;}
.mainNav > li.on > a{}
.mainNav > li.on > a .tt{opacity:1; visibility:visible}
.mainNav > li.on > a .line{ background:var(--maincolor); opacity:1}
.mainNav > li:hover:not(.on) > a .tt{ opacity:1}

.section{display: flex; align-items: center; overflow: hidden; background-position: center top; background-repeat: no-repeat;}
.section > *{ width: 100%;}

.mainSlider{ position:relative}
.mainSlider .el{ height:100vh; position:relative; overflow:hidden; background-color:#fff}
.mainSlider .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transform:scale(1.3); transition-delay:.5s}
.mainSlider .slogan{position: absolute; top: 33vh; left: 50%; transform: translate(-50%); width: 1300px; max-width: 80%; text-align: center; color:#fff;}
.mainSlider .slogan .t1{font-size:4.25em; font-weight: 800; letter-spacing: 1px; transform: translateY(1em); opacity: 0;}
.mainSlider .slogan .t3{font-size:1.375em; line-height: 1.5; transform: translateY(1em); opacity: 0;}
.mainSlider .slogan .bar{width:80px; height: 1px; background: #fff; margin: 30px auto 40px; opacity: .75; transform: translateY(1em); opacity: 0;}
.mainSlider .main_arr{ position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10;}
.mainSlider .main_arr .xi{font-size: 2.125em; color:#fff; opacity: 1; width:2em; height: 2em; line-height: 2em; border-radius: 50%; text-align: center; border:1px solid #fff; cursor: pointer; transition: .3s;}
.mainSlider .main_arr .xi:hover{background: rgba(255,255,255); color: #333;}

.mainSlider .el.swiper-slide-active .bg{transform:scale(1) rotate(.001deg); transition:2.5s; transition-delay:0; transition-timing-function:ease-in}
.mainSlider .el.swiper-slide-active .slogan .t1{ transform:translateY(0); opacity:1; transition:1s; transition-delay:.5s}
.mainSlider .el.swiper-slide-active .slogan .bar{ transform:translateY(0); opacity:1; transition:1s; transition-delay:1s}
.mainSlider .el.swiper-slide-active .slogan .t3{ transform:translateY(0); opacity:.9; transition:1s; transition-delay:1.5s}

.mainSlider .mainSlider-pagination{position: absolute; top: 75vh; z-index: 10; left: 50%; transform: translateX(-50%);}
.mainSlider .mainSlider-pagination span{ position:relative; width:1.5em; height:1.5em; background:#fff; border:1px solid #fff; border-radius:0; font-size:.5em; opacity:1; margin:0 .25em; transition:.3s; border-radius:.25em; display: inline-block}
.mainSlider .mainSlider-pagination span:before{ content:""; position:absolute; left:0; bottom:0; width:0; height:100%; background:#fff}
.mainSlider .mainSlider-pagination span.swiper-pagination-bullet-active{ width:15em; background:none}
.mainSlider .mainSlider-pagination span.swiper-pagination-bullet-active:before{ width:100%; transition:3.5s; transition-delay:.5s}


.cont_wrap .main_tit .t1{font-size:1.25em; font-weight: 700; color: var(--maincolor)}
.cont_wrap .main_tit .line{width:40px; height: 1px; background-color:#999; margin: 1.5em 0;}
.cont_wrap .main_tit .t2{font-size: 2.85em; font-weight: 700; color: #333; margin-bottom:10px;}
.cont_wrap .main_tit .t3{font-size: 1.125em; color: #666; line-height:1.6; margin-bottom: 3.5em;}

.cont_wrap .img{flex:50%; box-sizing:border-box; padding: 7em 1em 2em 2em; height: 100vh;}
.cont_wrap .img .in_img{ height: 100%;}
.cont_wrap .img.st2{ padding: 7em 2em 2em 1em;}
.cont_wrap .txt{flex:50%; box-sizing:border-box; padding: 0 5em; height: 100vh;}
.cont_wrap .txt .in_txt{width:100%;}
.cont_wrap .txt .in_txt .more_btn a{ position: relative; padding: 15px 25px; color: #aaa; width:200px; border: 1px solid #bbb; border-radius: 5px; text-align: center; box-sizing: border-box;}
.cont_wrap .txt .in_txt .more_btn a > i{z-index: 10;}
.cont_wrap .txt .in_txt .more_btn a:before{content:''; width:0; height: 100%; background:var(--maincolor); position: absolute; top: 0; left: 0; transition: .3s;}
.cont_wrap .txt .in_txt .more_btn a .xi{font-size: 1em;}
.cont_wrap .txt .in_txt .more_btn a:hover:before{width:100%;}
.cont_wrap .txt .in_txt .more_btn a:hover{border-color:var(--maincolor)}
.cont_wrap .txt .in_txt .more_btn a:hover > i{color:#fff;}

#section2 .cont_wrap .txt .in_txt{text-align:right;}
#section2 .cont_wrap .txt .in_txt .more_btn a{margin-left: auto;}
#section2 .cont_wrap .main_tit .line{margin-left: auto;}

#section3{position: relative;}
#section3:before{content:''; width:100%; height: 35%; background: url(/theme/aram/img/main/cs_img.jpg) no-repeat center top; background-size: cover; position: absolute; top: 0; left: 0; z-index: -10;}
#section3:after{content:''; width:100%; height: 65%; background: #f9f9f9; position: absolute; bottom: 0; left: 0; z-index: -10;}
#section3 .cont_wrap .main_tit .line{margin-left: auto; margin-right: auto; background: #fff;}
#section3 .cont_wrap .main_tit .t2{color: #fff;}

#section3 .tab_idx{width:560px; margin: 15px auto 2em;}
#section3 .tab_idx > li{flex:1 20%;}
#section3 .tab_idx > li > a{ padding:0 .5em; height:4.3em; border:1px solid #aaa; background: #fff; margin:0 .7em; color:#aaa; transition:.3s; border-radius: 50px;}
#section3 .tab_idx > li > a .xi{font-size:1.125em; margin-left:5px;}
#section3 .tab_idx > li > a .va{font-size:1.25em;}
#section3 .tab_idx > li > a:hover{ color:var(--maincolor); border-color:var(--maincolor);}
#section3 .tab_idx > li.on > a{color:#fff; border-color:var(--maincolor); background-color:var(--maincolor);}




