@charset "utf-8";
/* CSS Document */
body{ font-size:17px}
.box0{ margin:0 3%}
.box1{ width:1200px; margin:0 auto; max-width:95%}
.box2{ width:1000px; margin:0 auto; max-width:95%}
.box3{ width:1400px; margin:0 auto; max-width:95%}
.box5{ width: 1700px; margin: 0 auto; max-width: 100%;}

.PC{ display:block !important}
.PHONE{ display:none !important}
.en{ font-family:'Ms','notokr';}


#header{ position: relative; left:0; top:0; width:100%; z-index:1000; /*transition:.3s;*/ background:#fff;}
#header:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#fff; opacity:.2}
#header .top_wrap,
#header .va_wrap{ height:5em; /*transition:.5s;*/}
#header .logo{ position:relative; height:100%; box-sizing:border-box; /*margin-left:-8em;*/ z-index:999999;}
#header .logo > a{ display:block; position:relative; width:auto; height:100%; top:0;}
#header .logo > a img{ max-height:100%; max-width:100%;}

#header .gnb_wrap{ position:absolute; width:100%; left:0; top:0; box-sizing:border-box; padding:0 25em; text-align:center}
#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:.3s;*/ z-index:-1; box-sizing:border-box; box-shadow:0 1px 4px rgba(0,0,0,.2)}
.scroll #header .gnb_wrap .gnb:before{height:calc(100% - 4.5em); top:4.5em;}
#header .gnb_wrap .gnb > li{ position:relative}
#header .gnb_wrap .gnb > li.m_member,
#header .gnb_wrap .gnb > li.m_mypage,
#header .gnb_wrap .gnb > li.m_guide {display:none;}
#header .gnb_wrap .gnb > li .dp1{ position:relative; z-index:1; /*transition:.3s;*/ color:#000; display:block; padding:0 1em; min-width:8em}
#header .gnb_wrap .gnb > li .dp1:after{content:""; position:absolute; bottom:0; width:0; margin-left:-1.5em; left:50%; height:3px; background:#6e30b2; transition:.3s;}
#header .gnb_wrap .gnb > li:hover .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after{ width:3em}
#header .gnb_wrap .gnb > li .dp1 .va{ padding-top:.25em; font-size:1.188em;}
#header .gnb_wrap .gnb > li:hover .dp1{ color:#000;}
#header .gnb_wrap .gnb > li.on .dp1 {}
#header .gnb_wrap .gnb > li:hover .dp1:after{ transform:scaleX(1)}x
#header .gnb_wrap .gnb > li .dp1 .va{ font-size:1.25em; 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:.75em 0;}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{font-size:.938em;}

#header .gnb_wrap .gnb > li .dp2 {border-right:1px solid #eee;}
#header .gnb_wrap .gnb > li:first-child .dp2 {border-left:1px solid #eee;}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a,
#header .gnb_wrap .gnb > li .dp2 > li.on > a{ color:#6e30b2;}
#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: hidden;transition:.3s;transition-delay:.1s;padding:1em 0 2em 0; box-sizing:border-box;}
#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 .gnb > li:hover .dp2 {background:#fff}

/*#header .gnb_wrap .gnb{ text-align:center;}
#header .gnb_wrap .gnb > li{ position:relative}
#header .gnb_wrap .gnb > li:before,
#header .gnb_wrap .gnb > li:before{ left:50%}
#header .gnb_wrap .gnb > li:after{ right:50%}
#header .gnb_wrap .gnb > li .dp1{ color:#333; display:block; padding:0 .5em; margin-left:.5em; min-width:8em; transition:.3s; position:relative; font-family:'Ms','notokr';}
#header .gnb_wrap .gnb > li .dp1 .va{ position:relative; z-index:1; font-size:1.25em; font-weight:500;}
#header .gnb_wrap .gnb > li .dp2{ position:absolute; left:50%; margin-left:-5.5rem; width:11rem; opacity:0; visibility:hidden; border:1px solid #ddd;  background:#fff;}
#header .gnb_wrap .gnb > li .dp2 > li{ display:block}
#header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; color:#888; text-align:center; padding:.8em .5em; border-top:1px dotted #999;}
#header .gnb_wrap .gnb > li .dp2 > li:first-child > a{ border-top:none}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:1em; position:relative;}
#header .gnb_wrap .gnb > li:hover .dp1,
#header .gnb_wrap .gnb > li.on .dp1{color:#7d1e70}
#header .gnb_wrap .gnb > li:hover:before,
#header .gnb_wrap .gnb > li.on:before,
#header .gnb_wrap .gnb > li:hover:after,
#header .gnb_wrap .gnb > li.on:after{ opacity:1; width:50%}
#header .gnb_wrap .gnb > li:hover .dp1:after,
#header .gnb_wrap .gnb > li.on .dp1:after{ opacity:1}
#header .gnb_wrap .gnb > li:hover .dp2{ opacity:1; visibility:visible}
#header .gnb_wrap .gnb > li .dp2 > li:hover > a{ color:#7d1e70}
#header .gnb_wrap .gnb > li .dp2:after{ content:""; position:absolute; left:0; top:-3px; width:0; height:3px; background:#391461; z-index:1; transition:.3s;}
#header .gnb_wrap .gnb > li:hover .dp2:after,
#header .gnb_wrap .gnb > li.on .dp2:after{ width:100%;}
#header .gnb > li.m_guide{ display:none;}*/

/*#header .all_wrap{ padding:0 1em;}
#header .all_wrap .all{ position: fixed; z-index:1; right:0; top:0; width:100%; height:35vh; 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:25%; position:relative; box-sizing:border-box; padding:0 .3em;}
#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:#6e30b2; 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:2rem 0; background:#fff; border:1px solid #ddd; box-shadow:1px 1px 5px rgba(0,0,0,.1); height:180px;}
#header .all_wrap .gnb > li .dp2 .va_wrap{ height:inherit;}
#header .all_wrap .gnb > li .dp2 > li{ padding:1em 1.5em;  display:block;}
#header .all_wrap .gnb > li .dp2 > li > a{ position:relative; font-size:.938em; transition:.2s; text-align: left;}
#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:#6e30b2;}
#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:#6e30b2;}*/

#header .all_wrap .all{ position:fixed; top:0; bottom:0; left:0; right:0; opacity:0; visibility:hidden;}
#header .all_wrap .all:before{ content:''; position:absolute; top:0; bottom:0; left:0; right:0; background:#000; opacity:.4;}
#header .all_wrap .all .wrap_in{ position:absolute; top:0; right:0; width:30%; height:100%; background: linear-gradient(0deg, rgba(35,35,35,1) 0%, rgba(92,92,92,1) 100%); box-shadow:0 -3px .5em rgba(0,0,0,.6); transform:translateX(100%);}
#header .all_wrap .all .all_gnb{ height:inherit; box-sizing:border-box;}
#header .all_wrap .all .all_gnb .flex{ display:block; text-align:left !important;}
#header .all_wrap .all .gnb{ padding:6.5em 3em 4em 3em;}
#header .all_wrap .all .gnb > li a{ color:#fff;}
#header .all_wrap .all .gnb > li{ display:flex; flex-wrap:wrap; padding:1.5em 0; border-top:1px solid rgba(255,255,255,.2);}
#header .all_wrap .all .gnb > li:first-child{ border-top-width:0;}
#header .all_wrap .all .gnb > li .dp1{ width:12em; text-align:left; height:auto; display:flex; align-items:flex-start;}
#header .all_wrap .all .gnb > li .dp1 .tt{ font-size:1.750em; font-weight:500; letter-spacing:-1px;}
#header .all_wrap .all .gnb > li .dp2{ flex:1;}
#header .all_wrap .all .gnb > li .dp2 > li{display:flex; flex-direction:column; text-align:left;}
#header .all_wrap .all .gnb > li .dp2 > li .va_wrap{text-align:left;}
#header .all_wrap .all .gnb > li .dp2 > li > a{/* padding:.25em 0;*/}
#header .all_wrap .all .gnb > li .dp2 > li > a:before{ content:""; display:inline-block; vertical-align:middle; width:0; height:1px; background:#fff; visibility:hidden; transition:.2s;}
#header .all_wrap .all .gnb > li .dp2 > li > a .tt{ display:inline-block;}
/*#header .all_wrap .all .gnb > li .dp2 > li:hover > a:before,
#header .all_wrap .all .gnb > li .dp2 > li.on > a:before{ width:2em; margin-right:1em; visibility:visible;}*/
#header .all_wrap.on .all{ opacity:1; visibility:visible;}
#header .all_wrap.on .all .wrap_in{ transform:translateX(0); transition:.4s;}
#header .all_wrap.on .all_btn .btn{ width:3.5em; height:3.5em; z-index:99; border:0; margin-top:30px;}
#header .all_wrap.on .all_btn .btn .ham{ background:transparent; transition:0s; width:100%;}
#header .all_wrap.on .all_btn .btn .ham:before,
#header .all_wrap.on .all_btn .btn .ham:after { width:100% !important; top:50% !important; background:#fff;}
#header .all_wrap.on .all_btn .btn .ham:before{ transform:rotate(45deg);}
#header .all_wrap.on .all_btn .btn .ham:after { transform:rotate(-45deg);}

#header .all_wrap .all_close{position:absolute; right:30px; top:20px; color:#fff; cursor:pointer; font-size:1.5em;}

#header .all_wrap .va_wrap,
.scroll #header .all_wrap .va_wrap{height:2.5em;}

#header .etc_wrap {}
#header .etc_wrap .all_wrap .all_btn{ display:block; color:#333; text-align:center; position:relative; transition:.3s;}
#header .etc_wrap .all_wrap .all_btn .xi{ position:relative;  font-size:2.25em;}
#header .etc_wrap .all_wrap .all_btn:hover .xi{ color:#6e30b2;}


#header .etc_wrap{ float:right; z-index:1; position:relative; /*margin-right:-6em;*/}
#header .etc_wrap:after{ display:block; clear:both; content:'';}
#header .etc_wrap .lang{ position:relative;}
#header .etc_wrap .lang .tit{ cursor:pointer; height:4.5em;}
#header .etc_wrap .lang .tit .tt{ position:relative; padding:0 2.2em .2em .6em; font-size:1em; color:#666; border-bottom:2px solid #aaa;}
#header .etc_wrap .lang:nth-child(2) .tit .tt{ border-left:none;}
#header .etc_wrap .lang .tit .tt:after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:#333; transition:.2s;}
#header .etc_wrap .lang .tit .xi{ position:absolute; top:3px; right:.9em; font-size:.9em}
#header .etc_wrap .lang .tit .xi:before{ content:"\e941";}
#header .etc_wrap .lang .tit .xi-globus{margin-right:5px;}
#header .etc_wrap .lang .tit .xi-share-alt{margin-right:5px;}
#header .etc_wrap .lang:hover .tit .tt{ color:#2c2f91;}
#header .etc_wrap .lang .list{ position:absolute; top:75%; left:0; right:0; height:0; padding:0 .5em; background:#fff; border:1px solid #666; overflow:hidden; opacity:0; transition:all 0.2s ease-in-out;}
#header .etc_wrap .lang .list > li > a{ display:block; margin-top:1px; padding:1em .5em; font-size:.688em; color:#888; letter-spacing:0; text-transform:uppercase;}
#header .etc_wrap .lang .list > li:first-child > a{ margin-top:0;}
#header .etc_wrap .lang .list > li:hover > a,
#header .etc_wrap .lang .list > li.on > a{ background:#f1f1f1; color:#000;}
#header .etc_wrap .lang:hover .list{ height:auto; padding-top:.5em; padding-bottom:.5em; opacity:1;}


.scroll #header{ background:#fff; box-shadow:0 1px 5px rgba(0,0,0,.3); position:fixed}
.scroll #header .top_wrap,
.scroll #header .va_wrap{ height:4.5em}

#footer{}
#footer .foot_wrap{ background:#333;}
#footer .foot_wrap .box1{ position:relative}
#footer .foot_wrap .con{}
#footer .foot_wrap .con .logo img{ height:80px; opacity:.6;}
#footer .foot_wrap .con .copy{ margin-top:3em; font-size:.688em; color:#fff; opacity:.5; letter-spacing:0; font-family:'Ms';}
#footer .foot_wrap .menu_wrap{ padding:.5em 0 .5em 0; border-bottom:1px solid rgba(255,255,255,.1)}
#footer .foot_wrap .footerLogo{ position:absolute; top:2em; width:8em; height:auto; opacity:.5;}
#footer .foot_wrap .info_wrap{ padding:1.5em 0 2em 12em}
#footer .foot_wrap .info_wrap > li{ line-height:1.8; padding-right:2em; font-size:.938em;}
#footer .foot_wrap .info_wrap > li .tt{ display:inline-block; margin-right:1.5em; color:#fff; font-size:.938em; opacity:.9; font-weight:300}
#footer .foot_wrap .info_wrap > li .tit{ color:#fff; letter-spacing:0;}
#footer .foot_wrap .info_wrap > li a:hover{ text-decoration:underline;}
#footer .foot_wrap .menu_wrap .menu > li > a{ position:relative; display:block; margin-right:2.5em; font-size:.938em; color:#fff; padding:1em 0 1em 0; letter-spacing:0}
#footer .foot_wrap .menu_wrap .menu > li:first-child > a:before{ display:none;}
#footer .foot_wrap .menu_wrap .menu > li > a:hover{ text-decoration:underline;}
#footer .foot_wrap .menu_wrap .family{ position:absolute; right:4.5em; top:0; display:inline-block;}
#footer .foot_wrap .menu_wrap .family .tit{ position:relative; color:#f9f9f9; letter-spacing:0; text-transform:uppercase; cursor:pointer;}
#footer .foot_wrap .menu_wrap .family .tit .tt{ display:inline-block; padding:0 8em 0 1.8em; font-size:.813em; background:#272727; height:50px; line-height:50px}
#footer .foot_wrap .menu_wrap .family .tit .xi{ position:absolute; right:1.2em; top:50%; margin-top:-.6em; font-size:.938em;}
#footer .foot_wrap .menu_wrap .family .tit .xi:before{ content:"\e944";}
#footer .foot_wrap .menu_wrap .family .list{ position:absolute; left:0; right:0; bottom:100%; margin-bottom:-1px; padding:.8em 0; max-height:15em; overflow-y:auto; background:#272727; border:1px solid #666; text-align:left;}
#footer .foot_wrap .menu_wrap .family .list > li > a{ display:block; padding:0 1.2em; font-size:.875em; color:#fff;}
#footer .foot_wrap .menu_wrap .family .list > li > a:hover{ text-decoration:underline;}
#footer .foot_wrap .menu_wrap .family .list{ display:none;}
#footer .foot_wrap .menu_wrap .family:hover .list{ display:block;}
#footer .foot_wrap .menu_wrap .family:hover .tit{ color:#fff;}
#footer .foot_wrap .hanwithLogo{ position:absolute; right:290px}

#footer .f_pop_wrap{float:right}



#footer .goTop{ position:absolute; right:-50px; background:#43576f; width:3.75em; color:#fff; margin-left:1em; top:0; height:50px}
#footer .goTop .tt{ display:block; font-size:.688em}
#footer .goTop .vm{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; max-width:100%; height:auto; white-space:normal}
#footer .goTop:hover{ background:#005aab}
#footer .gotop{ width:4em; height:3.5em; background:#43576f; color:#fff; border:1px solid transparent; margin-left:1em; text-align:center; transition:.3s}
#footer .gotop .xi{ display:block}
#footer .gotop .tt{ display:block; font-size:.688em; letter-spacing:0}
#footer .gotop:hover{ background:#fff; color:#1c2335; border-color:#1c2335}


#contents{}
#contents .doc{ padding:3em 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.25em; font-weight:500; color:#fff; margin-right:5em; opacity:0; transition:1s; font-family:'Ms','notokr';}
#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 .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:inline;}
#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; font-family:'Ms','notokr'; }
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{float:left;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ height:4.5em; color:#fefefe; position:relative;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:1.068em; font-weight:500;}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a{}
#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a:after{ content:''; display:block; width:50%; height:5px; background:#fff; position:absolute; top:0; left:50%; transform:translateX(-50%)}
#contents .sub_visual_wrap .sub_gnb_wrap .line{ width:100%; height:1px; background:rgba(255,255,255,.5); position:absolute; top:2px;}

.sub_tit .t1{ text-align:center; font-size:2.5em; color:#000; margin-top:1.5em; 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;}


.agree_wrap{ padding:.5em; font-size:.875em; line-height:1.5}
.agree_wrap strong{ vertical-align:inherit; font-weight:bold;}

/**/
.mainVisual .slides{height:600px;}
.mainVisual .el{ height:600px; position:relative; overflow:hidden}
.mainVisual .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center; transition:3s; background-size:cover;}
.mainVisual_wrap{ position:relative}
.mainVisual_wrap .control_wrap{ position:absolute; left:0; bottom:2em; width:100%; z-index:100}
.mainVisual_wrap .control_wrap .wrap_in{ display:flex; align-items:flex-end}
.mainVisual_wrap .control_wrap .paging ol{ display:flex; align-items:flex-end}
.mainVisual_wrap .control_wrap .paging ol > li > a{ display:block; width:1em; height:1em; margin-top:4em; background:#fff; text-indent:-2em; overflow:hidden; font-size:.75em; margin-right:.5em; opacity:.5; transition:.3s}
.mainVisual_wrap .control_wrap .paging ol > li > a.flex-active{ height:5em; margin-top:0; opacity:1}
.mainVisual_wrap .control_wrap .nav{ display:flex; margin-left:1em}
.mainVisual_wrap .control_wrap .nav.direct{ margin-left:auto}
.mainVisual_wrap .control_wrap .nav .btn{ display:block; width:3em; line-height:3em; border:1px solid #fff; text-align:center; color:#fff; margin-right:-1px; opacity:.5; transition:.3s}
.mainVisual_wrap .control_wrap .nav .btn:hover{ opacity:1}
.mainVisual_wrap .control_wrap .auto .flex-play{ display:none}
.mainVisual_wrap .control_wrap .auto.on .flex-pause{ display:none}
.mainVisual_wrap .control_wrap .auto.on .flex-play{ display:block}
.mainVisual_wrap .control_wrap .auto.on .flex-play .btn{ opacity:1}

.mainVisual  .slogan_wrap{ position: absolute; left:6em; top:7.5em; width:100%;}
.mainVisual  .slogan{ width:75%; margin:auto; position:relative; padding:50px}
.mainVisual  .slogan .t1{ font-weight:700; font-size:3.25em; color:#fff; padding-bottom:.25em; opacity:0; margin-left:-10%; text-shadow:1px 1px 3px rgba(0,0,0,0.2);  font-family:'Ms';}
.mainVisual  .slogan .t2{  font-size:1.25em; color:#eee; line-height:1.5; opacity:0; margin-left:-10%}
.mainVisual  .slogan .line{ position:absolute; background:#fff; width:10px; height:10px}
.mainVisual  .slogan .line.line1{ height:0; left:10%; bottom:90%}
.mainVisual  .slogan .line.line2{ width:0; right:90%; top:0}
.mainVisual  .slogan .line.line3{ height:0; left:0; top:0}
.mainVisual  .slogan .line.line4{ width:0; left:0; bottom:0}
.mainVisual  .slogan .line.line5{ height:0; left:20%; bottom:0}
.mainVisual .flex-active-slide .slogan .line{ transition:.5s}
.mainVisual .flex-active-slide .slogan .line.line1{ height:10%}
.mainVisual .flex-active-slide .slogan .line.line2{ width:10%; transition-delay:.5s}
.mainVisual .flex-active-slide .slogan .line.line3{ height:100%; transition-delay:1s}
.mainVisual .flex-active-slide .slogan .line.line4{ width:20%; transition-delay:1.5s}
.mainVisual .flex-active-slide .slogan .line.line5{ height:10%; transition-delay:2s}
.mainVisual .flex-active-slide .slogan .t1{ opacity:1; margin-left:0; transition:1s}
.mainVisual .flex-active-slide .slogan .t2{ opacity:1; margin-left:0; transition:1s; transition-delay:.5s}


.main_tit{ font-size:2.375em; text-align:center; font-weight:bold; letter-spacing:-1px; margin-bottom:1em; font-family:'arial';}
.main_tit .c1{ color:#7d1e70;}
.main_tit .c2{ color:#111; padding-left:6px}
.main_tit .c3{ color:#fff;}


.main_wrap{padding: 3em 0 3em 0;}
.main_wrap.bg1{ background-color:#ebf0f3}
.main_wrap.bg2{ background:url(../images/main/sec1_bg.jpg) no-repeat center center; background-size:cover}
.main_wrap .main_more{ width:2.250em; line-height:2.250em; text-align:center; border-radius:100%; display:inline-block}
.main_wrap .main_more:hover .xi{ transform:rotate(180deg);}
.main_wrap .main_more .xi{ font-size:1.375em; transition:.2s;}
.main_wrap .main_more .xi:before{ content:"\e913";}


#section0.section0{background:#f5f5f5;}
#section0.section0 .about_wrap{}
#section0.section0 .about_wrap .about_t1{font-size:3em; margin-bottom:.5em; color:#6e30b2;}
#section0.section0 .about_wrap .about_t2{font-size:1.2em;}
/*section3*/
#section3.section3{padding: 3em 0 0 0;}
#section3.section3 .con_tit{ font-size:2.125em; color:#555; margin-bottom:1em; letter-spacing:-1.5px; line-height:1.1}
#section3.section3 .con_tit .c1{ color:#111}
#section3.section3 .board2 .date_wrap{ width:28%; text-align:center; margin-left:-.5em}
#section3.section3 .board2 .date_wrap .t1{ font-size:1.250em; font-family:'Ms'; font-weight:600; padding-bottom:3px}
#section3.section3 .board2 .date_wrap .t2{ font-size:.750em; color:#555; font-family:'Ms';}
#section3.section3 .board2 .txt_wrap{ width:75%}
#section3.section3 .board2 .txt_wrap .in{ width:100%; white-space:pre-wrap; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:20px}
#section3.section3 .board2 .list > li:hover .txt_wrap > a{ color:#d82744; text-decoration:underline;}
#section3.section3 .rec_con{ background:url(../images/main/rec_bg.jpg) no-repeat center center; background-size:cover}
#section3.section3 .rec_con .t1{ color:#fff; font-size:1.570em; font-weight:300; line-height:1.5; padding-bottom:2em; padding-top:.5em}
#section3.section3 .main_list_col .btn_wrap .btn1{ border:1px solid #fff; height:3.2em; line-height:3.2em; padding:0 2em; color:#fff;}
#section3.section3 .main_list_col .btn_wrap .btn1:hover{ background:#fff; transition:.2s; color:#111}
#section3.section3 .main_list_col .btn_wrap .btn1 .tt{ vertical-align:middle; margin-right:1em}
#section3.section3 .main_list_col .btn_wrap .btn1 .xi{ vertical-align:middle; font-size:15px}
#section3.section3 .main_list_col .list_wrap.board .list{ padding:1em .3em 0 .3em}

.sub_prod_slide .prod_slide{ margin-left:-30px; max-height:450px; overflow:hidden; margin-bottom:2em}
.sub_prod_slide .prod_slide .el{ float:left; width:33.33%;}
.sub_prod_slide .prod_slide .in{ display:block; margin-left:30px;}
.sub_prod_slide .prod_slide .in .img{ background:#fff; overflow:hidden; text-align:center; }
.sub_prod_slide .prod_slide .in .img:hover img{ -webkit-transform:scale(1.05); 
-moz-transform:scale(1.05); /* FireFox */
-o-transform:scale(1.05); /* Opera */
transform:scale(1.05);
transition: transform .55s;
-o-transition: transform .55s;
-moz-transition: transform .55s;
-webkit-transition: transform .55s;}
.sub_prod_slide .prod_slide .in .tt{ width:100%; background:#fff; height:50px; line-height:50px;  margin-top:-1px; display:inline-block; box-sizing:border-box;}
.sub_prod_slide .prod_slide .in .tt > i{ text-align:left; color:#222; display:block; font-size:1.250em}
.sub_prod_slide .prod_slide .in .txt{ height:50px; display:block}
.sub_prod_slide .prod_slide .in .txt > i{ color:#555; font-weight:400; line-height:1.6; font-size:.938em}
.sub_prod_slide .prod_slide .in .ti{ margin-right:3px;}
.sub_prod_slide .prod_slide .in .go_btn{ display:flex; cursor:pointer; margin-top:2em; color:#7d1e70; transition:.3s all; justify-content:center; align-items:center; width:130px; height:50px; border:1px solid #7d1e70;}
.sub_prod_slide .prod_slide .in .go_btn .xi{/* width:2em; line-height:2em; height:2em;*/ border-radius:50%; /*background:#7d1e70;*/ color:#7d1e70; text-align:center; font-size:1.125em; transition:.3s;}
.sub_prod_slide .prod_slide .in .go_btn:hover{background:#7d1e70; color:#fff;}
.sub_prod_slide .prod_slide .in .go_btn:hover .xi{color:#fff;}

.sub_prod_slide .prod_slide .in .go_btn > i{ vertical-align:middle; font-size:.875em; }
.sub_prod_slide .prod_slide .in .go_btn > i.ti{ text-transform:uppercase; padding-right:5px}
.sub_prod_slide .main_arrow_wrap{ position:absolute; left:0; right:0; top:50%; display:none}
.sub_prod_slide .main_arrow_wrap li{ position:absolute; top:0; transform:translateY(-50%);}
.sub_prod_slide .main_arrow_wrap li.prev{ left:-2.25em;}
.sub_prod_slide .main_arrow_wrap li.next{ right:-2.25em;}
.sub_prod_slide .main_dot_wrap{ position:absolute; left:0; right:0; margin-top:1.875em; text-align:center;}

.sub_prod_slide .main_arrow_wrap li{ display:inline-block; width:4em; line-height:4em; background:rgba(255,255,255,.8); border:1px solid #ccc; border-radius:50%; text-align:center; color:#222; cursor:pointer; transition:.2s;}
.sub_prod_slide .main_arrow_wrap li .xi{ font-size:1.250em;}
.sub_prod_slide .main_arrow_wrap li.prev .xi:before{ content:"\e93b";}
.sub_prod_slide .main_arrow_wrap li.next .xi:before{ content:"\e93e";}
.sub_prod_slide .main_arrow_wrap li:hover{ background:rgba(255,255,255,1);}

.sub_prod_slide .main_dot_wrap .slick-dots > ul > li{ display:inline-block; padding:0 .375em;}
.sub_prod_slide .main_dot_wrap .slick-dots > ul > li button{ display:block; width:.75em; height:.75em; background:#ccc; border:none; border-radius:100%; overflow:hidden; text-indent:-9999px;}
.sub_prod_slide .main_dot_wrap .slick-dots > ul > li.slick-active button{ background:#005aab;}

/*main_sec2*/
#section2.section2{ /*background:url(../images/temp/portfolio.jpg?v=1) no-repeat center center; background-size:cover;*/background:#f5f5f5; padding:2em 0;}
#section2.section2 .main02_t_w .line { background:#fff; width:30px; height:3px; margin:-20px auto 10px auto;}
#section2.section2 .main02_t_w .ti {color:#fff; font-size:1.875em; font-family:'Ms';}
#section2.section2 .main02_t_w .tx {color:#fff; padding:40px 0; font-size:1.063em; line-height:1.6;}
#section2.section2 .main02_t_w .main02_more { display:inline-block; color:#134783; font-size:1em; padding:0 2em; height:3em; line-height:3em; background:#fff; border-radius:50px;}
#section2.section2 .main02_t_w .main02_more .tt{ vertical-align:middle; font-size:.938em}
#section2.section2 .main02_t_w .main02_more .xi { padding-left:18px; vertical-align:middle; font-size:1.250em}
#section2.section2 .main02_t_w .main02_more:hover{ background:#fff; border-color:transparent; transition:.3s; color:#116cb5;}
#section2.section2 .main02_t_w .main02_more:hover .xi {color:#116cb5; transition:.3s; }

/*제품 list*/
.prod_list_wrap .list{ padding:1px 15px 15px 1px;}
.prod_list_wrap .list > li{ width:25%}

.prod_list_wrap .list > li * { transition:.3s}
.prod_list_wrap .list > li > a > .resize .re > img{ width: 250px; height: 180px; object-fit: contain;}
.prod_list_wrap .list > li .resize.s2{ /*padding-bottom:55.666% !important*/}
.prod_list_wrap .list > li .prod_st{ z-index:1; border:1px solid #ddd; margin:-1px 15px 15px -1px; display:block; box-sizing:; /*padding:1em .25em 0;*/ background:#fff; height: 18em;}
.prod_list_wrap .list > li .prod_st .img_wrap{ display:block; padding:10px; overflow:hidden}
.prod_list_wrap .list > li .prod_st .con_wrap{ display:block; text-align:center; padding:1em 0em 1.5em 0em; }
.prod_list_wrap .list > li .prod_st .con_wrap .tit{ display:block; font-size:1em; color:#000; letter-spacing:-1px; /*text-overflow:ellipsis; white-space:nowrap; overflow:hidden;*/}
.prod_list_wrap .list > li .prod_st .con_wrap .txt{ display:block; font-size:.875em; color: #666; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-top:.8em;}
.prod_list_wrap .list > li .prod_st:hover{ z-index:2; box-shadow:1px 1px 15px rgba(125,30,112,.3)}
.prod_list_wrap .list > li .prod_st:hover .img_wrap img{ transform:scale(1.1,1.1)}

.prod_list_wrap .list > li .more_wrap{ position:relative;}
.prod_list_wrap .list > li .more_wrap { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,.5); opacity:0; transition:.3s}
.prod_list_wrap .list > li .more_wrap .xi{ position:absolute; width:60px; line-height:60px; left:50%; top:50%; margin:-30px 0 0 -30px; background:rgba(0,0,0,.8); text-align:center; border-radius:100%; color:#fff}
.prod_list_wrap .list > li .more_wrap .xi:before{ content:"\e97a"; font-family:xeicon!important; font-size:1.125em;}
.prod_list_wrap .list > li .more_wrap:hover { opacity:1;}


.main_con2 .con_wrap{}
.main_con2 .con_wrap > li.w1{ width:39%; background:url(../images/main_con3_1_bg.jpg) no-repeat 50% 50%; background-size:cover; align-items:stretch;}
.main_con2 .con_wrap > li.w2{ width:61%; background:url(../images/main_con3_2_bg.png) no-repeat right bottom #ebf0f3;}

.main_con2 .con_wrap > li.w1 > .in{ flex:1; text-align:center; border-left:1px solid rgba(255,255,255,.4);}
.main_con2 .con_wrap > li.w1 > .in:first-child{ border-left:none;}
.main_con2 .con_wrap > li.w1 > .in img{ display:inline-block;}
.main_con2 .con_wrap > li.w1 > .gr1{ background:linear-gradient(-180deg, rgba(255,255,255,0) 0%, rgba(194,181,97,.5) 100%);}
.main_con2 .con_wrap > li.w1 > .gr2{ background:linear-gradient(-180deg, rgba(255,255,255,0) 0%, rgba(25,157,163,.5) 100%);}

.business_cont{  margin-bottom:3em;}
.business_cont > li{width:25%;}
.business_cont > li .in{text-align:center; box-sizing:border-box; padding:2.5em 1em; border-right:1px solid rgba(255,255,255,.3);}
.business_cont > li .in .img_icon.va_wrap{ width:5.5em; height:5.5em; border-radius:50%; margin:0 auto; border: 3px solid rgba(255,255,255,.8);}
.business_cont > li .in .txt{ color:#fff; margin-top:20px; font-size:1.65em; font-family:'Ms'; font-weight:500;}
.business_cont > li .in .tw{ color:#eee; margin-top:12px; line-height:1.5; font-weight:300;}
.business_cont > li:last-child .in{ border-right:none;}


/*section4*/
#section4.section4{background:url(../images/temp/portfolio.jpg?v=1) no-repeat center center; background-size:cover; padding:5em 0 4em;}
#section4.section4 .main02_t_w .line { background:#fff; width:30px; height:3px; margin:-20px auto 10px auto;}
#section4.section4 .main02_t_w .ti {color:#fff; font-size:1.875em; font-family:'Ms';}
#section4.section4 .main02_t_w .tx {color:#fff; padding:40px 0; font-size:1.063em; line-height:1.6;}
#section4.section4 .main02_t_w .main02_more { display:inline-block; color:#134783; font-size:1em; padding:0 2em; height:3em; line-height:3em; background:#fff; border-radius:50px;}
#section4.section4 .main02_t_w .main02_more .tt{ vertical-align:middle; font-size:.938em}
#section4.section4 .main02_t_w .main02_more .xi { padding-left:18px; vertical-align:middle; font-size:1.250em}
#section4.section4 .main02_t_w .main02_more:hover{ background:#fff; border-color:transparent; transition:.3s; color:#116cb5;}
#section4.section4 .main02_t_w .main02_more:hover .xi {color:#116cb5; transition:.3s; }

/*section5*/
#section5.section5 { width:100%; overflow:hidden; margin:0 auto; }
#section5.section5 .buy dl:after,
#section5.section5:after { display:block; content:''; clear:both; }
#section5.section5 .buy,
#section5.section5 .support { width:100%; height:360px; position: relative; float: left; overflow: hidden; box-sizing:border-box; }
#section5.section5 .buy img.img_zoom,
#section5.section5 .support img.img_zoom{ width:100%; min-width:960px;}
#section5.section5 .buy dl{ min-width:700px; position:absolute; top:15%; left:50%; transform:translateX(-50%); box-sizing: border-box; text-align:center; }
#section5.section5 .support dl { min-width:700px; position:absolute; top:15%; left:0; box-sizing: border-box; text-align:center; }
#section5.section5 .buy dt,
#section5.section5 .support dt { width:100px; height:100px; margin:0 auto 1em;}
#section5.section5 .buy dt img,
#section5.section5 .support dt img { width:100%; }
#section5.section5 .buy dd,
#section5.section5 .support dd { line-height:45px; }
#section5.section5 .buy dd span.txt { display: block; font-size:30px; color:#fff;  text-overflow:ellipsis; letter-spacing:-0.02em; }
#section5.section5 .buy dd span.txt2 { display: block; font-size:18px; color:#fff; text-overflow:ellipsis; letter-spacing:-0.02em; }
#section5.section5 .buy dd span.tit { font-size:18px; color:#fff; font-weight:300; text-overflow:ellipsis; }
#section5.section5 .buy dd a { display:inline-block; margin-top:10px; color:#fff;}
#section5.section5 .buy dd a .tt{ padding-right:10px}
#section5.section5 .support dd span.txt { display: block; font-size:30px; color:#222; font-weight:500; text-overflow:ellipsis; }
#section5.section5 .support dd span.txt2 { display: block; font-size:18px; color:#555; text-overflow:ellipsis; letter-spacing:-0.02em; }
#section5.section5 .support dd span.tit { font-size:18px; color:#888; font-weight:300; text-overflow:ellipsis; letter-spacing:-0.02em; }
#section5.section5 .support dd a { display:inline-block; color:#555; margin-top:10px; }
#section5.section5 .support dd a .tt{ padding-right:10px}
.img_zoom:hover img, #section5.section5 div:hover .img_zoom{-webkit-transform:scale(1.05); -moz-transform:scale(1.05); /* FireFox */-o-transform:scale(1.05); /* Opera */transform:scale(1.05);transition: transform .55s;-o-transition: transform .55s;-moz-transition: transform .55s;-webkit-transition: transform .55s;}

/*section6*/
#section6.section6 { width:100%; margin:4.5em auto 120px;  }
#section6.section6 .news { max-width:1400px; position:relative; margin:0 auto; margin-bottom:60px; }
#section6.section6 .news:after,
#section6.section6 .calendar:after,
#section6.section6 .calendar dl:after,
#section6.section6 .new_video ul:after { display:block; content:''; clear:both; }
#section6.section6 .news dl { width:33%; position:relative; overflow:hidden; float:left; padding:0 10px; display:inline-block; box-sizing:border-box; }
#section6.section6 .news dl a { display:inline-block; overflow:hidden; width:100%; }
#section6.section6 .news dl img{ width:442px; position:relative; left:50%; margin-left:-226px; overflow:hidden; }
#section6.section6 .news dt { font-size:28px; color:#0a1015; font-weight:600; margin:40px 0 15px 0; }
#section6.section6 .news dd { font-size:20px; color:#0a1015; font-weight:300; }
#section6.section6 .news dd span{ font-size:16px; color:#aaa; display:block; margin-top:5px; }
#section6.section6 .calendar { max-width:1400px;  border-top:1px solid #ddd;  border-bottom:1px solid #ddd; margin:0 auto; padding:40px 0 0; margin-bottom:60px; box-sizing:border-box; }
#section6.section6 .calendar dl { width:100%;  margin-bottom:40px; display:block; height:100px; padding-right:50px; box-sizing:border-box;}
#section6.section6 .calendar dl:hover dd .tit{ color:#0b4da2}
#section6.section6 .calendar dt { width:100px; height:100px; background-color:#f5f5f5; text-align:center; padding-top: 25px; margin-right:25px; float:left; box-sizing:border-box; }
#section6.section6 .calendar dt .month { font-size:16px; color:#222; display:block; font-weight:500; }
#section6.section6 .calendar dt .num { font-size:30px; color:#222; display:block; font-weight:500; }
#section6.section6 .calendar dd .tit {  display:block; font-size:18px; color:#002222; font-weight:400; box-sizing:border-box; line-height:1.2em; height:50px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap; padding-top:20px;}
#section6.section6 .calendar dd.date { display:block; font-size:16px; color:#aaa; font-weight:300; margin-top:10px; }
#section6.section6 .new_video {max-width:1400px; margin:0 auto; }
#section6.section6 .new_video ul { width:100%; }
#section6.section6 .new_video li { width:32%; float:left; padding:0 0; overflow:hidden; display:block; box-sizing:border-box; }
#section6.section6 .new_video li:nth-child(2) { margin:0 2%; }
#section6.section6 .new_video li .sum { width:100%; height:120px; display:inline-block; position:relative; overflow:hidden; }
#section6.section6 .new_video li .sum img { width:auto; position:relative; max-width:452px; left:50%; margin-left:-230px; overflow:hidden; }
#section6.section6 .new_video li .tit { width:100%; text-align:left; font-size:20px; color:#222; padding-top:30px; display:inline-block; }


/*========================================================================sub_inc========================================================================*/

.line_ani,
.line_ani_wrap{ position:relative; z-index:inherit}
.line_ani .line{ position:absolute; background:#7d1e70; width:0; height:0}
.line_ani .line.lineT{ left:0; top:0; transition:width 0.4s;}
.line_ani .line.lineR{ right:0; top:0; transition:height 0.4s;}
.line_ani .line.lineB{ right:0; bottom:0; transition:width 0.4s;}
.line_ani .line.lineL{ left:0; bottom:0; transition:height 0.4s;}
.line_ani:hover .line.lineT,
.line_ani:hover .line.lineB{ width:100%; height:1px}
.line_ani:hover .line.lineR,
.line_ani:hover .line.lineL{ width:1px; height:100%}


.scrollAni{ visibility:hidden; transition:.8s; transition-timing-function:ease-in-out }
.scrollAni.on{ visibility:visible}
.scrollAni.fade{ opacity:0}
.scrollAni.fade.on{ opacity:1; transition-delay:.2s}
.scrollAni.moveL{ transform:translateX(-10em); opacity:0}
.scrollAni.moveL.on{ transform:translateX(0); opacity:1}
.scrollAni.moveR{ transform:translateX(10em); opacity:0}
.scrollAni.moveR.on{ transform:translateX(0); opacity:1}
.scrollAni.moveT{ transform:translateY(7em); opacity:0}
.scrollAni.moveT.on{ transform:translateY(0); opacity:1}
.scrollAni.moveB{ transform:translateY(-7em); opacity:0}
.scrollAni.moveB.on{ transform:translateY(0); opacity:1}
.scrollAni.scaleX{ transform:scaleX(0); transform-origin:left top}
.scrollAni.scaleX.on{ transform:scaleX(1)}
.scrollAni.scaleY{ transform:scaleY(0); transform-origin:left top}
.scrollAni.scaleY.on{ transform:scaleY(1)}
.scrollAni.delay1{ transition-delay:.3s;}
.scrollAni.delay2{ transition-delay:.6s;}
.scrollAni.delay3{ transition-delay:.9s;}
.scrollAni.delay4{ transition-delay:1.2s;}

.agree_box{ border:1px solid #ddd; background:#fff; border-radius:5px}
.agree_box:after{ display:block; clear:both; content:'';}
.agree_box .con{  padding:2em; font-size:1em; color:#333}
.agree_box .con.scrollst{ height:13em; overflow-y:scroll; border:1px solid #ededed; margin:1em; background:#fff;}
.agree_box .con.scrollst.h1{ height:10em}
.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;}

.page_tit{ margin-bottom:.75em; margin-top:4em}
.page_tit:first-child{ margin-top:0}
.page_tit .t1{ font-size:1.625em; color:#222; letter-spacing:-1px; display: inline-block;}
.page_tit .t3{ font-size:1.45em; color:#222; letter-spacing:-1px; display: inline-block;}
.page_tit .t2{ color:#666; font-size:.938em;}

/*========================================================================sub========================================================================*/

/*공통*/
.txt_bold{font-weight:bold; vertical-align:baseline;}

.sub_bg_gray{background:#f3f3f3; padding:3rem 0;}
.sub_bg_img{background-repeat:no-repeat; background-position:center; background-size:cover; background-attachment:fixed; padding:3rem 0;}
.sub_bg_img.st1{background-image:url('../images/sub/his_bg.jpg?v=1.1');}

/*about*/
#contents .doc.sub_about{padding-bottom:0;}

.sub_ctt_box.st1{display:flex; flex-direction:column; justify-content:space-between; margin-bottom:3.5rem;}
.sub_ctt_box.st1:last-of-type{margin-bottom:0;}
.sub_ctt_box.st1 .sub_ctt_head{width:100%; position:relative; padding-bottom:1rem;}
.sub_ctt_box.st1 .sub_ctt_head:before{content:''; display:block; width:100%; height:2px; background:#aaa; position:absolute; left:0; bottom:0;}
.sub_ctt_box.st1 .sub_ctt_head:after{content:''; display:block; width:4rem; height:2px; background:#6e30b2; position:absolute; left:0; bottom:0;}
.sub_ctt_box.st1 .sub_ctt_head .sub_ctt_tit{font-size:1.5em; padding-left:1rem;}
.sub_ctt_box.st1 .sub_ctt_head .sub_ctt_tit.s2{font-size:1.375em;}
.sub_ctt_box.st1 .sub_ctt_head .sub_ctt_tit_sub{padding:0 1rem; box-sizing:border-box; color:#555; opacity:.7;}
.sub_ctt_box.st1 .sub_ctt_body{width:100%; position:relative; padding:1rem; box-sizing:border-box; border:1px solid #ddd; border-radius:15px 0 15px 0; margin-top:1rem;}
/*.sub_ctt_box.st1 .sub_ctt_body:after{content:''; display:block; width:100%; height:2px; background:#ddd; position:absolute; left:0; bottom:0;}*/
.sub_ctt_box.st1 .sub_ctt_body.st2{box-shadow:4px 4px 7px 0px rgba(50, 50, 50, 0.3); padding:1.5rem;}
.sub_ctt_box.st1 .sub_ctt_body .t1{line-height:1.4; color:#333;}
.sub_ctt_box.st1 .sub_ctt_body .image_wrap{text-align:center;}

.sub_ctt_box.st2{display:flex; justify-content:space-between; margin-bottom:3.5rem;}
.sub_ctt_box.st2:last-of-type{margin-bottom:0;}
.sub_ctt_box.st2 .sub_ctt_head{width:24%; position:relative; padding-top:1rem;}
.sub_ctt_box.st2 .sub_ctt_head:before{content:''; display:block; width:100%; height:2px; background:#aaa; position:absolute; left:0; top:0;}
.sub_ctt_box.st2 .sub_ctt_head:after{content:''; display:block; width:4rem; height:2px; background:#6e30b2; position:absolute; left:0; top:0;}
.sub_ctt_box.st2 .sub_ctt_head .sub_ctt_tit{font-size:1.5em; padding-left:1rem;}
.sub_ctt_box.st2 .sub_ctt_head .sub_ctt_tit.s2{font-size:1.375em;}
.sub_ctt_box.st2 .sub_ctt_head .sub_ctt_tit_sub{padding:0 1rem; box-sizing:border-box; color:#555; opacity:.7;}
.sub_ctt_box.st2 .sub_ctt_body{width:74%; position:relative; padding:1rem; box-sizing:border-box;}
.sub_ctt_box.st2 .sub_ctt_body:after{content:''; display:block; width:100%; height:2px; background:#ddd; position:absolute; left:0; top:0;}
.sub_ctt_box.st2 .sub_ctt_body .t1{line-height:1.4; color:#333;}
.sub_ctt_box.st2 .sub_ctt_body .flex .ctt_text{width:calc(100% - 340px);}
.sub_ctt_box.st2 .sub_ctt_body .flex .ctt_text p{padding-left:10px; box-sizing:border-boxl; position:relative;}
.sub_ctt_box.st2 .sub_ctt_body .flex . p:before{content:''; display:block; width:4px; height:4px; border-radius:50%; position:absolute; left:0; top:8px; background:#6e30b2;}
.sub_ctt_box.st2 .sub_ctt_body .flex .ctt_img{width:300px; margin-left:auto;}

.dp1_1.dp2_5 .sub_ctt_box.st2 .sub_ctt_head{width:0;}
.dp1_1.dp2_5 .sub_ctt_box.st2 .sub_ctt_body{width:100%;}

.history_sm{}
.history_sm li{display:flex; margin-bottom:.75rem;}
.history_sm .his_tit{font-family:'Ms'; width:130px;}

/*카달로그*/
.brochure_box{ position: relative;}
.brochure_box:before{ content: ""; position: absolute; bottom: -55%; left: 0; width: 100%; height: 100%; background: #f5f5f5; z-index:-10;}
.sub_brochure .wrap_in{width:42em}
.sub_brochure .wrap_in .brochure_tt{ font-size:1.5em; margin-bottom:1.2em; font-weight:600; font-family:'Ms';}
.sub_brochure .wrap_in .img_wrap{ position:relative; width:50%; margin:0 auto 2em auto}
.sub_brochure .wrap_in .img_wrap:before{ content:""; position:absolute; width:100%; height:100%; right:-.5em; bottom:-.5em; background:#000; opacity:.2}
.sub_brochure .wrap_in .btn_wrap{}
.sub_brochure .wrap_in .btn_wrap > button{ flex:1 1 auto; margin:0 .75em; font-family:'Ms'; background:#473375; border-color:#473375; border-radius:50px !important;}
.sub_brochure .wrap_in .btn_wrap > button:hover{ opacity:1; background:#2b1e4a;}
.sub_brochure .wrap_in .btn_wrap > button .c_y{color:#ffc002;}
.bgfix{ background-repeat:no-repeat; background-position:center; background-size:cover;}


/*오시는 길*/
.map_tw{padding-bottom:2.5em;}
.map_tw .t1 {font-size:1.375em; padding-bottom:10px; font-weight:500;}
.map_tw .t2 {vertical-align:middle;}
.map_tw .t2 .tt1 {vertical-align:middle; color:#444;}
.map_tw .t2 .tt2 {font-size:1.375em; font-weight:700; vertical-align:middle;}
.map_tw .t2 .xi {margin-right:5px; font-size:1.125em; color:#fff; border-radius:100%; width:30px; height:30px; line-height:30px; text-align:center; background:#6e30b2}

.map_view{ border-top:3px solid #ddd; box-shadow:0 .25em .5em rgba(0,0,0,.2); transition:.3s; padding:1em; border-radius:0 0 1em 1em}
.map_view .tt {padding-bottom:10px; font-size:1.063em; color:#222; letter-spacing:-2px; vertical-align:middle;}
.map_view .xi {vertical-align:middle; font-size:1.188em; padding-right:5px;}
.map_view:hover{ border-color:#6e30b2 }
.root_daum_roughmap_landing{ width:100% !important;}

.map_info2 { font-weight:400}
.map_info2 .info_list > li:first-child{ border-top:1px solid #ddd;}
.map_info2 .info_list > li { overflow:hidden; padding:2em 1em; border-bottom:1px solid #ddd}
.map_info2 .info_list > li h3 { float:left; color:#222222; font-size:1.375em; font-weight:500;}
.map_info2 .info_list > li h3 .xi { font-size:1.5rem; vertical-align:top; }
.map_info2 .info_list > li .info{ box-sizing:border-box; padding-left:12em; color:#555;}
.map_info2 .info_list > li .info > li{ margin-bottom:18px;}
.map_info2 .info_list > li .info .info_tt{ font-size:1.125em; color:#222; margin-bottom:5px; position:relative; padding-left:.7em;}
.map_info2 .info_list > li .info .info_tt:before{ content:''; width:3px; height:3px; border-radius:50%; background:#6e30b2; position:absolute; top:9px; left:0;}

/*product*/

.resize.s3{padding-bottom:100% !important;}
.resize.s4{padding-bottom:66% !important;}
.resize.s5{padding-bottom:83% !important;}

.prod_wrap{margin-top:1.5rem;}
.prod_wrap .prod{ margin:0 -25px -25px 0}
.prod_wrap .prod > li{ width:25%}
.prod_wrap .prod > li .in{ /*border:1px solid #ddd;*/ margin:0 25px 25px 0; transition:.3s; position:relative; background:#fff; overflow:hidden; box-shadow:0 0 8px 3px rgba(0,0,0,.1);}
.prod_wrap .prod > li .in .img_wrap{ position:relative; margin:0 1em;}
.prod_wrap .prod > li .in .img_wrap .layer{ position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(255,255,255,.5); opacity:0; transition:.3s}
.prod_wrap .prod > li .in .img_wrap .layer .xi{ position:absolute; width:40px; line-height:40px; left:50%; top:50%; margin:-20px 0 0 -20px; background:rgba(0,0,0,.8); text-align:center; border-radius:100%; color:#fff}
.prod_wrap .prod > li .in .img_wrap .layer .xi:before{ content:"\e97a"; font-family:xeicon!important}
.prod_wrap .prod > li .in:hover .img_wrap .layer{ opacity:1}
.prod_wrap .prod > li .in .tit_wrap{ text-align:center; /*border-top:1px dashed #ccc; background:#f9f9f9;*/ padding:1em 0;} 
.prod_wrap .prod > li .in .tit_wrap .tit{font-size:1.25em; position:relative; padding-right:12px;}
.prod_wrap .prod > li .in .tit_wrap .tit span{position:relative; /*padding-right:20px;*/ text-align:center; display:inline-block;}
.prod_wrap .prod > li .in .tit_wrap .tit span:before{content:''; display:block; width:0; height:1px; background:#7d1e70; transition:.3s; position:absolute; left:0; bottom:-6px;}
.prod_wrap .prod > li .in:hover .tit_wrap .tit span:before{width:calc(100% + 30px);}
.prod_wrap .prod > li .in .tit_wrap .tit span:after{content:'\e93e'; display:block; font-size:.875em; color:#333; font-family:'xeicon'; position:absolute; right:-30px; top:50%; transform:translateY(-50%);}
.prod_wrap .prod > li .in:hover .tit_wrap .tit span:after{color:#7d1e70;}
.prod_wrap .prod > li .in:hover .tit_wrap{ /*background:linear-gradient(90deg, rgba(110,48,178,1) 0%, rgba(48,64,178,1) 100%); */color:#7d1e70;}

.fs_wrap{}
.fs_wrap .fs_in{width:225px; /*height:104px;*/ margin-right:10px; margin-bottom:10px; border:1px solid #ddd; transition:.3s; position:relative; cursor:pointer; padding:.5rem; box-sizing:border-box;}
.fs_wrap a:nth-of-type(5n) .fs_in{margin-right:0;}
.fs_wrap .fs_in:hover{border-color:#6e30b2;}
.fs_wrap .fs_in .fs_img{width:100%; height:104px; background-position:center; background-size:contain; background-repeat:no-repeat;}
.fs_wrap .fs_in .fs_title{/*position:absolute; left:0; bottom:0; */height:40px; background:rgba(0,0,0,.3); color:#fff; width:100%; display:flex; justify-content:center; align-items:center; transition:.3s;}
.fs_wrap .fs_in:hover .fs_title{background:rgba(0,0,0,.6);}

.txt_small{font-size:.75em; vertical-align:baseline;}
.txt_gray{color:#777; vertical-align:baseline;}

.popCon strong{font-weight:bold; vertical-align:baseline;}

.rnd-major-info:nth-of-type(2) .rnd-item{border-top:none;}

.rnd-major-info::after { content:''; display:block; clear:both; }
.rnd-major-info .rnd-item {margin-bottom:2em;padding:2em 3em;box-sizing:border-box;border:1px solid #fff;background:#fff;box-shadow:0.25em 0.25em 0 rgb(0 0 0 / 8%);border-top:2px solid #6e30b2;background: linear-gradient(-180deg, #fff 0%, #fff 50%, #fbfbfb 100%);}
.rnd-major-info .rnd-item .thumb{ height:215px; display:block;}
.rnd-major-info .rnd-item::after { content:''; display:block; clear:both; }
.rnd-major-info .rnd-item.pd { padding:79px 80px 75px; }
.rnd-major-info .major-title{ font-weight:600; font-size:1.375em; color:#111; border-bottom:1px dashed #ddd; padding-bottom:.5em}
.rnd-major-info .major-title2{ font-weight:600; font-size:1.075em; color:#111; border-bottom:1px dashed #ddd; padding-bottom:.5em; text-decoration:underline;}
.rnd-major-info .major-title-2{ margin:0 0 .5em 0; font-size:20px; color:#000; line-height:1.5; font-weight:500; }
.rnd-major-info .major-title .sub { font-size:inherit; color:#888; font-weight:400; }
/*.rnd-major-info .major-title-2 { margin:48px 0 6px; }*/
.rnd-major-info .col_left,
.rnd-major-info .col_right{ float:left; width:100%;}
.rnd-major-info .major-title-2.cmgt { margin-top:34px; }
.rnd-major-info .major-title-2.cmgt-2, .rnd-major-def.cmgt-2 { margin-top:60px; }
.rnd-major-info .caption { display:block; margin:16px 0 0; color:#888; line-height:1.57; text-align:center; }
.rnd-major-info .col { float:right; width:12em; }
.rnd-major-info .col.w-2 { width:100%; padding-right:0; float:left}
.rnd-major-info .col.w-3 { width:690px; padding-right:75px; }
.rnd-major-info .col.w-4 { width:285px; padding-right:0; }
.rnd-major-info .col.w-5 { width:50%; }
.rnd-major-info .col.w-5 + .col.w-5 { padding-right:0; }

.rnd-info{font-size:1.2em; margin-bottom:1.5em}
.rnd-info:last-of-type{margin-bottom:0;}
.rnd-info .rnd-lgt{min-width:160px;}
.rnd-info .rnd-rgt{vertical-align:baseline; /*margin-left:4em;*/ color:#6e30b2; font-weight:600;}

.grt_box .ac img{width:75%;}

.appii_wrap{}
.appli_wrap .flex.space{}
.appii_wrap2{margin-top:4em;}
.appii_wrap2 ul > li{margin-bottom:1.5em;}
.appii_wrap2 ul > li:last-child{margin-bottom:0;}


.appli_box.n2 .appii_wrap{}
.appli_box.n2 .appii_wrap ul{flex-wrap:wrap;}
.appli_box.n2 .appii_wrap ul > li{width:32%;}