@charset "utf-8";
/* CSS Document */
body{ font-size:16px}
.box0{ margin:0 4%}
.box1{ width:1200px; margin:0 auto; max-width:96%;}
.box2{ width:1100px; margin:0 auto; max-width:96%;}
.box3{ width:1500px; margin:0 auto; max-width:96%;}
.box4{ width:1400px; margin:0 auto; max-width:96%;}

#header{ position:absolute; left:0; top:0; width:100%; z-index:1000; border-bottom:1px solid rgba(255,255,255,.2)}
#header .top_wrap{ height:5em; transition:.3s;}
#header .logo{ position:relative; height:100%; box-sizing:border-box}
#header .logo > a{ display:block; position:absolute; background-image:url(../images/inc/logoT.png); background-repeat:no-repeat; background-position:left center; background-size:contain; top:0; height:100%; width:13em;}
#header .logo > a img{ max-height:100%}

#header .gnb_wrap{ position:absolute; width:100%; left:0; top:0; box-sizing:border-box; padding:0 20em; 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:.5s; z-index:-1; box-sizing:border-box; box-shadow:0 1px 4px rgba(0,0,0,.2)}
#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:#fff; 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:#1b4951; 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:#0a333b; font-weight:600}
#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; color:#5c5e5e}
#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:#0a333b; font-weight:600}
#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 .gnb > li:hover .dp1 .va{ color:#0a333b; font-weight:600}
#header .gnb_wrap .gnb > li:hover .dp2 {background:#fff}

#header .etc_wrap {z-index:999}
#header .etc_wrap .mem_wrap {}
#header .etc_wrap .mem_wrap .etc {}
#header .etc_wrap .mem_wrap .etc > li {}
#header .etc_wrap .mem_wrap .etc > li .in {color:#fff; display:block; padding:0 .75em;}
#header .etc_wrap .mem_wrap .etc > li .in .xi {vertical-align:middle; display:inline-block; padding-right:3px; font-size:1.4em;}
#header .etc_wrap .mem_wrap .etc > li .in .tt.c_log{padding:.3em 1.2em; border-radius:20px; background:#852431;}
#header .etc_wrap .mem_wrap .etc > li .in .tt.c_log:hover{color:#fff;}
#header:hover .etc_wrap .mem_wrap .etc > li .in .tt.c_log{color:#fff;}
#header .etc_wrap .mem_wrap .etc > li .in .tt {font-size:.938em; vertical-align:middle}
#header .etc_wrap .mem_wrap .etc > li .in .tt.st1 {border-radius:3em; border:1px solid #fff; padding:.2em 1.3em; font-size:.875em !important}
#header .etc_wrap .mem_wrap .etc > li:hover .in .tt {color:#1b4951; transition:.3s;}

#header .etc_wrap .all_wrap{}
#header .etc_wrap .all_wrap .all_btn{ display:block; color:#242424; line-height:5em; width:5em; text-align:center; position:relative}
#header .etc_wrap .all_wrap .all_btn:before{ content:""; position:absolute; left:0; top:0; width:100%; height:0; transition:.3s}
#header .etc_wrap .all_wrap .all_btn .xi{ font-size:3em; position:relative; color:#fff;}
#header .etc_wrap .all_wrap:hover .all_btn,
#header .etc_wrap .all_wrap.on .all_btn{ color:#fff !important; }
#header .etc_wrap .all_wrap:hover .all_btn:before,
#header .etc_wrap .all_wrap.on .all_btn:before{ height:100%}
#header .etc_wrap .all_wrap.on .all_btn {line-height:4em;}
.scroll #header .etc_wrap .all_wrap .all_btn {line-height:4em;}

#header .etc_wrap .all_wrap .all{ position:fixed; left:0; top:0; width:100%; height:100%; background:#fff; visibility:hidden; opacity:0; overflow-y:auto; transition:.3s; transform:scale(.5); z-index:10000}
#header .etc_wrap .all_wrap.on .all{ visibility:visible; opacity:1; transform:scale(1)}
#header .etc_wrap .all_wrap .all .close_btn{ position:absolute; top:1em; right:2em; width:3em; line-height:3em; text-align:center; opacity:.5; transition:.3s}
#header .etc_wrap .all_wrap .all .close_btn .xi{ font-size:3em}
#header .etc_wrap .all_wrap .all .close_btn:hover{ transform:rotate(90deg); opacity:1}
#header .etc_wrap .all_wrap .all .all_logo{ text-align:center; padding:3em 0}
#header .etc_wrap .all_wrap .all .all_logo img {width:15em;}
#header .etc_wrap .all_wrap .all .gnb a{ height:auto}
#header .etc_wrap .all_wrap .all .gnb{ justify-content:space-between; padding-bottom:5em}
#header .etc_wrap .all_wrap .all .gnb > li{ flex:0 1 24%}
#header .etc_wrap .all_wrap .all .gnb > li.m_mypage,
#header .etc_wrap .all_wrap .all .gnb > li.m_guide {display:none;}
#header .etc_wrap .all_wrap .all .gnb > li .dp2,
#header .etc_wrap .all_wrap .all .gnb > li .dp3{ display:block}
#header .etc_wrap .all_wrap .all .gnb > li .dp1{ border-top:5px solid #ddd; border-bottom:1px solid #aaa; height:5em; position:relative}
#header .etc_wrap .all_wrap .all .gnb > li .dp1:after{ content:""; position:absolute; left:0; top:-5px; width:0; height:5px; background:#1b4951; transition:.3s}
#header .etc_wrap .all_wrap .all .gnb > li .dp1 .va{ font-size:1.25em; font-weight:700}
#header .etc_wrap .all_wrap .all .gnb > li:hover .dp1{ color:#1b4951}
#header .etc_wrap .all_wrap .all .gnb > li:hover .dp1:after{ width:100%}
#header .etc_wrap .all_wrap .all .gnb > li .dp2{}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li > a{ padding:1em; border-bottom:1px solid #ddd; text-align:left; position:relative; padding-left:2em; font-size:.938em;}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li > a:after{ content:"\e913"; font-family:xeicon!important; position:absolute; left:0; top:1em; width:2em; text-align:center; color:#aaa}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > a{ background:#f5f5f5; color:#1b4951}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > a:after{ color:#1b4951}
#header .etc_wrap .all_wrap .all .gnb > li .dp2 > li:hover > .dp3{ background:#f9f9f9}
#header .etc_wrap .all_wrap .all .gnb > li .dp3{ padding:.5em 0; border-bottom:1px solid #ddd}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a{ padding:.25em .75em; text-align:left}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a .va{ font-size:.875em; color:#666}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li > a .va:before{ content:"- "; display:inline-block; padding-right:1em}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li:hover > a .va{ text-decoration:underline; color:#333}
#header .etc_wrap .all_wrap .all .gnb > li .dp3 > li:hover > a .va:before{ text-decoration:none}

#header:hover {background:#fff;}
#header.hide{ transform:translateY(-6em)}
.headerH,
#header .va_wrap{ height:5em}
.headerT{ padding-top:5em}

.scroll #header{ box-shadow:0 0 1em rgba(0,0,0,.3)}
.scroll #header .top_wrap{ height:4em}
.scroll #header .va_wrap {height:4em;}
.scroll #header .gnb_wrap .gnb:before {top:4em; height:calc(100% - 4em);}

#header:hover:before {opacity:1; transition:.3s;}
#header:hover .gnb_wrap .gnb > li .dp1 .va {color:#0a333b; font-weight:400;}
#header:hover .etc_wrap .mem_wrap .etc > li .in {color:#0a333b; font-weight:400;}
#header:hover .etc_wrap .all_wrap .all_btn .xi {transition:.3s; color:#5c5e5e}
#header:hover .etc_wrap .mem_wrap .etc > li .in .tt.st1 {border:1px solid #5c5e5e;}
#header .etc_wrap .all_wrap .all_btn:hover {background:#1b4951; transition:.3s;}
#header .etc_wrap .all_wrap .all_btn:hover .xi {color:#fff !important;}
#header:hover .logo > a{ background-image:url(../images/inc/logoT_col.png); z-index:111 !important; }

/**/
#scrollAni{ position: absolute; left:50%; width:6em; margin-left:-3em; text-align:center; bottom:2em; opacity:1; z-index:100; text-decoration:none; animation-name: downAni; animation-duration: 3s; animation-iteration-count: infinite}
#scrollAni .xi{ vertical-align:middle}
#scrollAni .xi-mouse{font-size:3em; color:#fff; margin-right:-7px}
#scrollAni .xi-scroll{font-size:2em; color:#fff; margin-left:-7px}
#scrollAni .tt{ display:block; color:#fff; font-size:.75em; text-transform:uppercase; font-family:Arial, Helvetica, sans-serif; letter-spacing:0}
#scrollAni.hide{ opacity:0; z-index:-1}

@keyframes downAni{
60% {margin-bottom:0}
80% {margin-bottom:-1em}
100% {margin-bottom:0}
}

.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 0}
#mainNav > li > a .line,
#mainNav > li > a .tt{ display:inline-block; *display:inline; zoom:1; vertical-align:middle}
#mainNav > li > a .line{ width:1em; height:2px; background:#fff; margin-left:.5em; margin-right:2em; opacity:.5}
#mainNav > li > a .tt{ font-family:Arial, Helvetica, sans-serif; color:#fff; font-size:.75em; opacity:0; visibility:hidden; letter-spacing:0}
#mainNav > li:hover> a .line,
#mainNav > li.on > a .line{ width:3em; margin-right:0; opacity:1}
#mainNav > li:hover > a .tt,
#mainNav > li.on > a .tt{ opacity:1; visibility:visible}
#mainNav > li:hover:not(.on) > a .tt{ opacity:1}

.color #mainNav > li > a .line{ background:#333}
.color #mainNav > li > a .tt{ color:#333}

/**/
.mainSlider{ position:relative}
.mainSlider .el{ height:100vh; position:relative; overflow:hidden}
.mainSlider .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.3,1.3); transition-delay:1s; background-repeat:no-repeat; background-size:cover}
.mainSlider .el .box1{ position:relative}
.mainSlider .el.swiper-slide-active .bg,
.mainSlider .el.swiper-slide-duplicate-active .bg{transform:scale(1,1); transition:3s; transition-delay:0; transition-timing-function:ease-in-out}

.mainSlider .slogan{ position:relative; top:25vh; color:#fff; text-align:center; text-shadow:1px 1px 3px rgb(0 0 0 / 50%)}
.mainSlider .slogan .icon{ font-size:4em; transform:translateY(1em); opacity:0}
.mainSlider .slogan .t0{ font-size:1.188em; font-family:'Spoqa Han Sans Neo', 'sans-serif'; font-weight:400; transform:translateY(1em); opacity:0; letter-spacing:2px;}
.mainSlider .slogan .t1{ font-size:2.9em; line-height:1.4; transform:translateY(1em); opacity:0}
.mainSlider .slogan .t2{ font-size:1.313em; transform:translateY(1em); opacity:0; margin-top:1em; line-height:1.6}
.mainSlider .slogan .line{ position:relative; margin:1.5em 0 3em 0}
.mainSlider .slogan .line:before,
.mainSlider .slogan .line:after{ content:""; position:absolute; height:2px; background:#fff; width:0; opacity:0}
.mainSlider .slogan .line:before{ left:50%;}
.mainSlider .slogan .line:after{ right:50%;}
.mainSlider .el.swiper-slide-active .bg,
.mainSlider .el.swiper-slide-duplicate-active .bg{transform:scale(1,1); transition:3s; transition-delay:0; transition-timing-function:ease-in-out}
.mainSlider .el.swiper-slide-active .slogan .icon{ transform:translateY(0); opacity:1; transition:1s}
.mainSlider .el.swiper-slide-active .slogan .t0{ transform:translateY(0); opacity:1; transition:1s}
.mainSlider .el.swiper-slide-active .slogan .t1{ transform:translateY(0); opacity:1; transition:1s; transition-delay:.5s}
.mainSlider .el.swiper-slide-active .slogan .t2{ transform:translateY(0); opacity:1; transition:1s; transition-delay:1s}
.mainSlider .el.swiper-slide-active .slogan .line:before,
.mainSlider .el.swiper-slide-active .slogan .line:after{ width:2em; opacity:1; transition:2s; transition-delay:.5s}

.mainControl{ position:absolute; left:0; bottom:2em; width:100%; z-index:100}
.mainControl .box0{ position:relative}
.mainControl .mainSlider-btn{ width:3.125em; cursor:pointer; line-height:2.5em; color:#fff; outline:none; text-align:center}
.mainControl .mainSlider-btn .xi{ font-size:1.5em; text-align:center;}
.mainControl .mainSlider-btn:hover{ color:#fff; opacity:1}
.mainControl .mainProgress{ text-align:center; margin-right:1em}
.mainControl .mainPauseWrap{ position:absolute; left:0; width:75px; text-align:center; display:flex; align-items:center; justify-content:center;}
.mainControl .mainPauseWrap .mainSlider-btn{ line-height:50px}
.mainControl .mainPauseWrap .mainSlider-btn .xi{ font-size:1.5em;}
.mainControl .mainPauseWrap .mainSlider-play{ display:none}
.mainControl .mainPauseWrap.pause .mainSlider-pause{ display:none}
.mainControl .mainPauseWrap.pause .mainSlider-play{ display:block; opacity:1; color:#fff}
.mainControl .mainSlider-pagination{ margin-left:2em;}
.mainControl .mainSlider-pagination span{ width:1em; height:1em; background:#fff; border-radius:0; font-size:.625em; opacity:.7; margin:0 .25em; transition:.3s;}
.mainControl .mainSlider-pagination span.swiper-pagination-bullet-active{ width:7em; opacity:1;}

.main_con1 {position:relative}
.main_con1 .con1{flex:1; min-width:0; text-align:left;}
.main_con1 .con2{position:absolute; right:0; top:0}

.main_con2 {position:relative; overflow:hidden; z-index:-1; height:50em; }
.main_con2 .main_con2bg {background:url(../images/sian/con2_bg.jpg) no-repeat center center; background-attachment:fixed; width:100%; height:100%; background-size:cover}
.main_con2 .con2_tit {position:absolute; left:50%; width: 2000px; margin-left: -1000px; text-align: center;}

.main_service{}
.main_service > li{ width:33.33%; height:100vh; border-left:1px solid rgba(255,255,255,.2); box-sizing:border-box; position:relative;}
.main_service > li > a{text-align:center; box-sizing:border-box; padding:0 1.2em; height:100%; position:relative; margin-top:3em;}

.main_con3 {position:relative}
.main_con3 .con1{}
.main_con3 .con2{position:absolute; right:0; top:10%}

.main_con4 {position:relative; background:url(../images/sian/con4_bg.jpg) no-repeat; background-size:cover; background-position:center center; background-attachment:fixed;}

.newCon2 {margin-top:2em}

/**/
#footer{background:#161a1a; position:relative;}
#footer .gotop.top_st{ position:absolute; z-index:1; width:5.2em; line-height:5.2em; height:5.2em; right:9em; bottom:11em; text-align:center; background:#00464f; color:#fff; box-shadow:0 0 1em .125em rgba(0,0,0,.3); z-index:100;}
#footer .gotop.top_st .xi{ font-size:2.3em}
#footer .gotop.top_st:hover{ background:#1b4951; color:#fff; transition:.3s; border-radius:25px; transform:rotate(180deg);}
#footer .gotop.top_st:hover .xi {transform:rotate(180deg)!important}
#footer .gotop.top_st,
#footer .gotop.top_st:before{ transition: all .5s ease-out !important}

#footer .in {padding:1.5em 0;}
#footer .in .con {}
#footer .in .con .logo {width:12em; padding-bottom:1em;}
#footer .in .con .infoList {}
#footer .in .con .infoList > li {color:#fff;}
#footer .in .con .infoList > li > .list {padding-top:.5em; display:inline-block; padding-right:1.250em;}
#footer .in .con .infoList > li.copy {font-weight:200; font-size:.688em; opacity:.4; letter-spacing:1px; padding-top:1em;}
#footer .in .con .infoList > li * {vertical-align:baseline !important;}
#footer .in .con .infoList > li .ti {opacity:.6; font-weight:300; font-size:.875em; display:inline-block; padding-right:.6em;}
#footer .in .con .infoList > li .tx {font-weight:300; font-size:.875em;}

#footer .in .con .snsList {text-align:right}
#footer .in .con .snsList > li .snst { display:block;}
#footer .in .con .snsList > li .snst .xi {color:#fff; font-size:1.5em; width:1.8em; line-height:1.8em; border-radius:50%; background:transparent; margin-bottom:.3em; text-align:center;}
#footer .in .con .snsList > li:hover .snst .xi {transition:.3s; text-align:center; color:#fff; background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%)}

#footer .family_wrap{ position:relative;}
#footer .family_wrap .family_btn{ height:3.125em; padding:0 1em; border:1px solid rgba(255,255,255,.3); color:#fff;}
#footer .family_wrap .family_btn .tt{ font-size:.875em; letter-spacing:1px; font-weight:300;}
#footer .family_wrap .family_btn .icon{ font-size:.938em; margin-left:5em;}
#footer .family_wrap .family_btn .icon:before{ content:"\e944";}
#footer .family_wrap .list_wrap{ position:absolute; bottom:100%; left:0; right:0; padding:1em 1em; max-height:20em; background:#303234; border:1px solid #151617; box-shadow:2px 2px 3px rgba(0,0,0,.15); display:none;}
#footer .family_wrap .family > li .in{ display:block; padding:.25em 0; color:#fff;}
#footer .family_wrap .family > li .in .tt{ font-size:.813em;}
#footer .family_wrap .family > li .in:hover .tt{ text-decoration:underline;}
#footer .family_wrap.on .family_btn .icon:before{ content:"\e941";}
#footer .family_wrap.on .list_wrap{ display:block;}

/**/
#contents{}
#contents .doc{ padding:9em 0;}
.dp2_product #contents .doc{ padding:6em 0;}


#contents .subtop_wrap {position:relative; background:#000}
#contents .subtop_wrap .sub_visual{ height:20em; position:relative; overflow:hidden}
#contents .subtop_wrap .sub_visual .bg{ position:absolute; left:0; top:0; width:100%; height:100%}
#contents .subtop_wrap .sub_visual .wrap_in{ position:relative; height:100%}
#contents .subtop_wrap .sub_visual .wrap_in .sub_slogan{ flex:1 1 auto;}
#contents .subtop_wrap .sub_visual .wrap_in .sub_menu{ flex:0 0 auto}

#contents .sub_slogan{ color:#fff; transform:translateY(2em); opacity:0}
#contents .sub_slogan .in{ width:100%; text-align:center}
#contents .sub_slogan .t1{ font-size:2em;}
#contents .sub_slogan .line {display:block; width:0; height:.1em; margin:1.25em auto; background:#fff; transition:1s; transition-delay:.5s}
#contents .sub_slogan .t2 {font-size:.938em; letter-spacing:7px;}

.load #contents .sub_slogan .line{ width:2.5em}
.load #contents .sub_slogan{ transform:translateY(0); opacity:1; transition:1s}

#contents .sub_menu{ padding-bottom:0}
#contents .sub_menu .gnb{ flex-wrap: wrap}
#contents .sub_menu .gnb > li{ width:100%}
#contents .sub_menu .gnb > li .dp2{justify-content:center;overflow:hidden;}
#contents .sub_menu .gnb > li .dp2 > li{ flex:1 1 50%; max-width:50%}
#contents .sub_menu .gnb > li .dp2 > li > a{ display:block; height:4.25em; background:#fff; color:#666; transition:.3s; position:relative; border-bottom:1px solid #ddd; margin-top:.5em;}
#contents .sub_menu .gnb > li .dp2 > li > a:after{ content:""; position:absolute; left:-1px; top:25%; height:50%; width:1px; background:#ddd}
#contents .sub_menu .gnb > li .dp2 > li > a .va{ font-weight:500; font-size:1.063em}
#contents .sub_menu .gnb > li .dp2 > li:hover > a{ color:#003876}
#contents .sub_menu .gnb > li .dp2 > li.on{ z-index:1; box-shadow:0 0 1em .25em rgba(0,0,0,.3)}
#contents .sub_menu .gnb > li .dp2 > li.on > a{color: #fff;border-bottom: 1px solid #0A333A;margin-top:.5em;background: #0A333A;}
#contents .sub_menu .gnb > li .dp2 > li.on > a:after{ background:#fff; width:100%; height:0; top:-3px; left:0}

.dp1on .gnb .dp2{ display:none!important}
.dp2on .gnb > li,
.dp2on .gnb > li .dp1,
.dp2on .gnb > li .dp3{ display:none!important}
.dp2on .gnb > li.on{ display:block!important}
.dp3on .gnb > li,
.dp3on .gnb > li .dp1,
.dp3on .gnb > li .dp2 > li,
.dp3on .gnb > li .dp2 > li > a{ display:none!important}
.dp3on .gnb > li.on,
.dp3on .gnb > li .dp2 > li.on{ display:block!important}


/**/
.page_sec { margin-top:3.5em !important;}
.page_sec0{ margin-top:.375em !important;}
.page_sec1{ margin-top:1em !important;}
.page_sec2{ margin-top:2em !important;}
.page_sec3{ margin-top:3em !important;}
.page_sec4{ margin-top:4em !important;}
.page_sec5{ margin-top:5em !important;}
.page_sec6{ margin-top:6em !important;}

.page_tit{}
.page_tit .logoT {padding-bottom:1em;}
.page_tit{ margin-bottom:1.75em; box-sizing:border-box;}
.page_tit.icon:after{ content:""; display:inline-block; width:1px; height:3em; margin:1.5em .375em 0 .375em; background:#333;}
.page_tit > .tt{ color:#111;}
.page_tit > .tt > *{ vertical-align:baseline;}
.page_tit > .t1{ font-size:2.500em; letter-spacing:-1px; line-height:1.3;}
.page_tit > .t2{ font-size:1.250em; line-height:1.6;}
.page_tit > .t3{ font-size:1.375em; color:#333; line-height:1.5;}
.page_tit > .t4{ font-size:4.500em; letter-spacing:-1px;}
.page_tit > .t5{ font-size:1.8em; letter-spacing:-1px;}
.page_tit > .t6{ font-size:2.250em; letter-spacing:-1px; padding-top:.5em;}
.page_tit > .tt + .tt{ margin-top:.75em;}
.page_tit > .tt + .t1{ margin-top:.5em;}
.page_tit > .tt + .t2{ margin-top:1em;}
.page_tit > .tt + .t4{ margin-top:.125em;}
.page_tit > .space { letter-spacing:.75em !important; text-indent:.75em;}
.page_tit > .space2{ letter-spacing:.375em !important; text-indent:.375em;}

/*회사소개
.greeting_Wrap {margin-top:0em;}
.greeting_Wrap .top_tw {margin-bottom:3em;}
.greeting_Wrap .top_tw .hi { line-height:1.35; font-size:1.8em; color:#333; font-weight:500;}
.greeting_Wrap .col {color:#1b4951; font-weight:700; vertical-align:baseline; font-size:1.8em;}
.greeting_Wrap .inner .emp {color:#0A333A; font-size:1.25em; font-weight:600;}
.greeting_Wrap .con2 {flex:1 1 0%; min-width:0;}
.greeting_Wrap .con2 > p { font-size:1.063em; color:#555; line-height:1.6; padding-bottom:1em;}
.greeting_Wrap .con2 .t2{ font-size:1.125em; margin-top:3em; text-align:right}
.greeting_Wrap .con2 .t2 .name{ font-size:1.188em; margin-left:1em; color:#222;}
.greeting_Wrap .imgw {margin-left:5em; flex:0 0 auto; position:relative;}
.greeting_Wrap .imgw:before{ content:""; position:absolute; right:0; top:0; width:10em; height:10em; transform:translate(40%,-40%); border-radius:50%; background:#1b4951}
.greeting_Wrap .imgw:after{ content:""; position:absolute; right:0; top:0; width:3em; height:3em; transform:translate(200%,-200%); border-radius:50%; background:#618186}
.greeting_Wrap .imgw img{ position:relative; width:28em;}

.greeting_Wrap.st2 .imgw:before{ width:0; }
.greeting_Wrap.st2 .imgw:after{ width:0;}
.greeting_Wrap.st2 .con2 {margin-top:2em;}
.greeting_Wrap.st2 .con2 > p {font-size:1.125em;}
.greeting_Wrap.st2 .imgw img {width:inherit;}
*/


/*오시는길*/
.map_view {border-top: 3px solid #ddd; box-shadow: 0 0.25em 0.5em rgb(0 0 0 / 20%); transition: .3s; padding: 1em; border-radius: 0 0 1em 1em;}
.map_view:hover{border-top: 3px solid #1b4951; box-shadow: 0 0.25em 0.5em rgb(0 0 0 / 20%); transition: .3s; padding: 1em; border-radius: 0 0 1em 1em;}

.map_info1 { overflow:hidden; margin-bottom:20px; box-shadow:2px 3px 8px -1px #a4a4a4; padding:1.5em; margin-top:1em; font-weight:400; box-sizing:border-box; text-align:center;}
.map_info1 .t1 span { color:#666; display:inline-block; margin-right:55px; margin-bottom:5px; margin-top:5px; line-height:1.5;}
.map_info1 .t1 span:last-child { margin-right:0;}
.map_info1 .t1 .xi {font-size:1em;color:#fff;margin-right:10px;border-radius:50%;width:1.8em;height:1.8em;line-height:1.8em;text-align:center;background:#1b4951;}

/*ci*/
.page_titW{margin-top:5em !important;}
.page_bg_wrap {padding:3em 0 5em 0; background:#f5f5f5; margin-top:3em;}
.page_tab .tab,
.page_tab {text-align:center;} 
.page_tab .tab{margin-bottom:5em;}
.page_tab .tab > li {width:20%;}
.page_tab .tab > li > a{padding:.5em; border:1px solid #ddd; margin:.5em 0 0 .5em; color:#666; transition:.3s; display:block; }
.page_tab .tab > li > a > .tt {font-size:1em; letter-spacing:.1px;}
.page_tab .tab > li > a > *{ display:inline-block; *display:inline; zoom:1;}
.page_tab .tab > li .icon{ margin-left:.5em; color:#1b4951;}
.page_tab .tab > li .icon:before{ content:"\e937";}
.page_tab .tab > li:hover > a,
.page_tab .tab > li.on > a{box-shadow:0 0 1em 0.125em rgba(0,0,0,.1); color:#1b4951; border-color:#1b4951;}
.page_tab .tab > li:hover .icon,
.page_tab .tab > li.on .icon{ color:#fff;}
.page_tab.performance_st .tab {margin:-.5em 0 0 -.5em; margin-bottom:2em;}
.page_tab.performance_st .tab > li {width:10%;}
.page_tab.performance_st .tab > li > a {padding:1em;}
.page_tab .tab.sEC1 > li {width:100%;}
.page_tab .tab.sEC4 > li {width:16.66%;}
.page_tab .tab.sEC7 > li {width:14.28%;}
.page_titW {text-align:center}
.page_titW .ti {padding-bottom:.5em; font-size:2.8em; font-weight:700; color:#222;}
.page_titW .tx {font-size:2em; color:#333; font-weight:500; line-height:1.55;}
.page_titW .tx > * {vertical-align:baseline !important;}
.page_titW .tx .col {color:#00464f; font-weight:700;}
.ci_col_Wrap{ margin:0 0 0 -2em}
.ci_col_Wrap > li{ width:50%}
.ci_col_Wrap.ci_col_Wrap01 > li{ width:33.333%}
.ci_col_Wrap .wrap_in{ margin:0 0 0 2em; border:1px solid #ddd; background:#fff}
.ci_col_Wrap .wrap_in .img_wrap{box-shadow:5px 7px 13px rgba(0,0,0,.2)}
.ci_txt_Wrap{margin-top:3em;}
.ci_txt_Wrap .con{flex:1}
.ci_txt_Wrap .con .in {margin:0 3em;}
.ci_txt_Wrap .con .big_tit{font-size:4em; position:relative; color:#e4e4e4; line-height:.6; font-weight:700}
.ci_txt_Wrap .con .big_tit .tit{position:absolute; top:20px; left:0; color:#00464f; font-size:.750em}
.ci_txt_Wrap .con .list {margin-top:3em}
.ci_txt_Wrap .con .list .tx{ font-size:1em; line-height:1.5; padding-right:1em; color:#282828}
.ci_txt_Wrap .con .list .big {display:block; font-size:1.3em; font-weight:500; color:#222;}
.ci_col_list{text-align:center; }
.ci_col_list > li .color_wrap .color_bg{ width:6em; height:6em; border:3px solid #fff; box-shadow:5px 1px 8px rgba(0,0,0,.3); border-radius:50%; margin-bottom:1.5em;}
.ci_col_list > li .color_wrap .color_tx{display:inline-block; text-align:left}
.ci_col_list > li .color_wrap .color_tx > li{ margin-bottom:10px; font-size:.813em; color:#444;}
.ci_col_list > li .color_wrap .color_tx > li.cod{ font-size:1.5em; font-weight:700; padding-bottom:.3em; text-align:center; margin-top:1em}
.ci_col_list > li .color_wrap .color_tx > li .c_tw{ vertical-align:bottom; display:inline-block; width:80px; color:#000;}
.ci_col_list > li.st_c1 .color_wrap .color_bg{background:#00464f; margin:0 auto;}
.ci_downW{ margin-top:8em; text-align:center}
.ci_downW .sym_btn{width:100%; max-width:300px; border:1px solid #ccc; padding:1.3em 1em; font-weight:700; position:relative; overflow:hidden; background:#fff; transition:.3s; display:block; margin:0 auto; text-align:center }
.ci_downW .sym_btn .tt {font-size:1em; color:#333; padding-right:6px; display:inline-block}
.ci_downW .sym_btn:hover {background:#1b4951; transition:.3s;}
.ci_downW .sym_btn:hover .tt,
.ci_downW .sym_btn:hover .xi {color:#fff;}
.page_titW.page_tit01{margin-top:0 !important}
/*MIAN_sm*/
.main_tit_wrap{margin:3rem 0 2rem;}
.main_tit_wrap.c2{color:#fff;}
.main_tit_wrap .tt{font-size:2.5em; font-weight:bold;}
.main_tit_wrap .t1{font-size:1.375em;}

.main_more_btn{display:flex; justify-content:center; align-items:center; cursor:pointer;}
.main_more_btn i{font-size:1.125em; margin-bottom:-2px; margin-left:4px; transition:.3s;}
.main_more_btn:hover i{margin-left:12px; margin-right:-8px; transform:rotate(90deg);}
.main_more_btn.st1{width:140px; height:45px; border-width:1px; border-radius:22.5px; box-sizing:border-box; font-size:.875em;}
.main_more_btn.st2{width:200px; height:60px; border-width:1px; box-sizing:border-box; font-size:.875em; font-weight:600;}
.main_more_btn.c1{border-color:#002c5e; color:#002c5e; transition:.3s; border-style:solid;}
.main_more_btn.c1:hover{background:#002c5e; color:#fff;}
.main_more_btn.c1.cHalf:hover{background:#002c5e; border-color:#002c5e;}

.mainSec1{padding:3rem 0;}
.mainSec1 .con1{width:48%;}
.mainSec1 .con1 .main_sec1_bg_wrap{width:100%; height:600px; background-repeat:no-repeat; background-position:center; background-size:cover;}
.mainSec1 .con2{width:52%; height:600px;}
.mainSec1 .con2 .main_sec1_text_wrap{width:100%; height:100%; padding:1rem 6rem; padding-right:0; box-sizing:border-box;}
.mainSec1 .con2 .main_sec1_text_wrap .main_sec1_com{font-size:1.1875em; color:#002c5e;}
.mainSec1 .con2 .main_sec1_text_wrap .main_sec1_line{width:190px; height:1px; background:#002c5e; margin:1.75rem 0 2.25rem; margin-left:-124px;}
.mainSec1 .con2 .main_sec1_text_wrap .main_sec1_tit2{color:#9b9797; margin-bottom:.75rem;}
.mainSec1 .con2 .main_sec1_text_wrap .main_sec1_tit{font-size:2.5em; color:#2f2f2f; margin-bottom:4.125rem;}
.mainSec1 .con2 .main_sec1_text_wrap .main_sec1_ctt{color:#393636; line-height:1.6; margin-bottom:5.625rem;}

.mainSec2{margin-bottom:9rem;}
.mainSec2 .main_prd_wrap{}
.mainSec2 .main_prd_wrap .main_prd_in{width:24%; height:240px; margin-bottom:15px; display:flex; align-items:flex-end; padding-left:22px; padding-bottom:22px; box-sizing:border-box; position:relative; background-position:center; background-size:cover; background-repeat:no-repeat;}
.mainSec2 .main_prd_wrap .main_prd_in:nth-last-of-type(-n+4){margin-bottom:0;}
.mainSec2 .main_prd_wrap .main_prd_in:after{content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0); position:absolute; left:0; top:0; transition:.3s;}
<!--.mainSec2 .main_prd_wrap .main_prd_in:hover:after{background:rgba(0,0,0,0);}-->
.mainSec2 .main_prd_wrap .main_prd_in .t1{color:#fff; font-size:1.25em; position:relative; z-index:5;}
.mainSec2 .more_btn_wrap{margin-top:2.5rem;}

.mainSec3{}
.mainSec3 .main_con4{padding:4.125rem 0 5.625rem;}
.mainSec3 .main_con4 .main_partner_wrap{margin-top:5rem;}
.mainSec3 .main_con4 .main_partner_wrap .main_partner_in{width:25%; background:#fff; box-sizing:border-box;}
.mainSec3 .main_con4 .main_partner_wrap .main_partner_in:nth-of-type(4n){border-right:0;}
.mainSec3 .main_con4 .main_partner_wrap .main_partner_in:nth-last-of-type(-n+4){border-bottom:0;}

.mainSec4{padding-top:6.875rem; margin-bottom:2.5rem;}
.mainSec4 .main_notice_wrap{}
.mainSec4 .main_notice_wrap .main_notice_list{width:100%; margin:0 auto;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in{border-top:1px solid #ddd; padding:20px 0; box-sizing:border-box; cursor:pointer; transition:.3s;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in:hover{border-color:#002c5e;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in:last-of-type{border-bottom:1px solid #ddd;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_date_wrap{width:130px; color:#c5c6c8; transition:.3s;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in:hover .mn_date_wrap{color:#002c5e;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_date_wrap .mn_date{font-size:2.875em;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_date_wrap .mn_year{margin-top:-.5rem;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_text_wrap{width:calc(100% - 130px - 170px); padding-left:1rem; padding-right:3rem; box-sizing:border-box;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_text_wrap .mn_title{font-size:1.125em; font-weight:bold; margin-bottom:.5rem; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_text_wrap .mn_content{color:#666; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_img_wrap{width:170px; height:120px; overflow:hidden;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in .mn_img_wrap .mn_img{width:100%; height:100%; background-size:cover; background-repeat:no-repeat; background-position:center; transition:.3s;}
.mainSec4 .main_notice_wrap .main_notice_list .main_notice_in:hover .mn_img_wrap .mn_img{transform:scale(1.1);}
.mainSec4 .more_btn_wrap{margin-top:2.5rem;}

/*인사말*/
.about_content2{ background:url(../images/sub1/ceo_bg.jpg?v=1.02) no-repeat center; background-size:cover; box-sizing:border-box; padding:6em 0 8em; background-color:#aaa;}
.about_content2 .in_tx_box{color:#333; line-height:1.5; padding:7em 7em 6em; box-sizing:border-box; background:rgba(255,255,255,.9); text-align:center; box-shadow:0 0 25px rgb(0 0 0 / 10%)}
.about_content2 .in_tx_box .tw_en{ color:#999; letter-spacing:6px; font-size:1.068em;}
.about_content2 .in_tx_box .tw_tit{ font-size:2em; line-height:1.4; margin-bottom:20px; font-weight:500;}
.about_content2 .in_tx_box .tw_tit .c_st{ font-size:1.2em; font-weight:800; letter-spacing:-2px;}
.about_content2 .in_tx_box .tw{ margin-bottom:15px; font-size:1.068em;}
.about_content2 .in_tx_box .bar{ width:40px; height:2px; background:#ddd; display:block; margin:40px auto;}
.about_content2 .in_tx_box .ceo{ text-align:center; margin-top:4em; font-size:1.3em; letter-spacing:.5px;}
.about_content2 .emp {color:#0A333A; font-size:1.25em; font-weight:600;}
.about_content2 .col {color:#1b4951; font-weight:700; vertical-align:baseline; font-size:1.8em;}
.about_content2 .small {color:#888; font-size:.9em;}

.about2_wrap{margin-top:5rem;}
.about2_wrap .abt_tt_wrap{}
.about2_wrap .abt_tt_wrap .abt_tt{font-size:2em; color:#35585c; font-weight:600; margin-bottom:1rem;}
.about2_wrap .abt_tt_wrap .brd_bar{width:50px; height:3px; background:#1b4951; margin-bottom:1rem;}
.about2_wrap .brand_wrap{margin-bottom:5rem;}
.about2_wrap .brand_wrap > .brand_ceopt{flex:1 1 48%; margin-left:1rem;}
.about2_wrap .brand_wrap > .brand_ceopt:first-child{margin-left:0;}
.about2_wrap .brand_wrap .brand_ceopt .brd_tt1{font-size: 2em; font-weight:600; color:#35585c; margin-bottom:1rem;}
.about2_wrap .brand_wrap .brand_ceopt .brd_bar{width:50px; height:3px; background:#1b4951; margin-bottom:1rem;}
.about2_wrap .brand_wrap .brand_ceopt .brd_tt2{font-size:1.2em; color:#1b4951; font-weight:600;}
.about2_wrap .about2_box{margin-top:2rem;}
.about2_wrap .about2_box > li{flex:1 1 30%; margin-left:1rem;}
.about2_wrap .about2_box > li:first-child{margin-left:0;}
.about2_wrap .about2_box .txt_wrap{}
.about2_wrap .about2_box .txt_wrap .top_tt{font-size:1.2em; color:#99b4da; font-weight:600;}
.about2_wrap .about2_box .txt_wrap .sec_tt{font-size:2em; color:#35585c; font-weight:600; border:3px solid #35585c; border-radius:100%; width:270px; height:270px; line-height:270px;}
.about2_wrap .about2_box .txt_wrap .thr_tt{font-size:1.2em;}
.about2_wrap .about2_box .txt_wrap .bot_tt{font-size:1.2em; color:#1b4951; font-weight:600;}



.history_bgw {overflow:hidden; position:relative; margin-bottom:3em;}
.history_bgw .bg_w {position:absolute; left:0; top:0; width:100%; height:100%; background-position:center top; background-attachment:fixed; background-repeat:no-repeat; background-size:cover;}
.history_bgw .txt_wrap {text-align:center; }
.history_bgw .txt_wrap .en {font-weight: 700;  padding-bottom:.5em; color:#fff; letter-spacing:-1px; font-size:2.5em;}
.history_bgw .txt_wrap .kr {font-size:1.7em; color:#fff; font-weight:500;}
.history_bgw .line_wrap{ position:relative; height:15em;}
.history_bgw .line_wrap .line{ position:absolute; background:#fff; width:1px; height:1px; transition:1s; opacity:.5; display:none;}
.history_bgw .line_wrap .line.hor{ transition-delay:1s}
.history_bgw .line_wrap .line.top{ top:0}
.history_bgw .line_wrap .line.bot{ bottom:0}
.history_bgw .line_wrap .line.left{ left:0}
.history_bgw .line_wrap .line.right{ right:0}
.load .history_bgw .line_wrap {margin:2em 1.5em;}
.load .history_bgw .line_wrap .line.ver{ height:100%}
.load .history_bgw .line_wrap .line.hor{width:40%;}
.load .history_bgw .line_wrap .line{ display:block}

.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:#1b4951; 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 #1b4951; border-radius:100%; box-sizing:border-box}
.history_wrap:after{ top:auto; bottom:0}
.history_wrap .history > li{ margin-top:4em}
.history_wrap .history > li:first-child{ margin-top:0}
.history_wrap .history > li .year{ width:50%; overflow:hidden; justify-content:flex-end}
.history_wrap .history > li .year .wrap_in{ position:relative; overflow:hidden; width:15em}
.history_wrap .history > li .year .tt{ display:inline-block; position:relative; padding:0 .5em; font-size:2.5em; letter-spacing:-3px; color:#1b4951; font-family: Georgia, "Times New Roman", Times, serif}
.history_wrap .history > li .year .tt:before{ content:""; position:absolute; left:100%; top:50%; margin-top:-1px; width:100%; border-top:2px dotted #aaa}
.history_wrap .history > li .year .tt:after{ content:"'"; 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 .img_wrap .resize {padding-bottom:35% !important;}
.history_wrap .history > li .list .wrap_in .img_wrap .resize .img_r {text-align:right !important;}
.history_wrap .history > li .list .wrap_in .img_wrap .resize .img_l {text-align:left !important;}
.history_wrap .history > li .list .month{ flex:0 0 3em}
.history_wrap .history > li .list .month .tt{ color:#999; font-size:1.125em; font-family:Georgia, "Times New Roman", Times, serif; letter-spacing:-1px}
.history_wrap .history > li .list .month .tt:after{ content:""; font-size:.813em; font-weight:500}
.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:#333; font-size:.938em; line-height:1.7; font-weight:400;}
.history_wrap .history > li .list .detail .tt:before{ content:""; position:absolute; left:0; top:.8em; width:.75em; border-top:2px solid #ddd}
.history_wrap .history > li:nth-child(2n) .year{ justify-content:flex-start; text-align:right}
.history_wrap .history > li:nth-child(2n) .year .tt:before{ left:auto; right: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 .month{ text-align:right}
.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}

.page_history_wrap{}
.page_history_wrap > li{ margin-top:5em;}
.page_history_wrap > li:first-child{ margin-top:0;}
.page_history_wrap > li .history_img{ margin-bottom:3em;}
.page_history_wrap > li .history_img .inner{ position:relative; height:7em;}
.page_history_wrap > li .history_img .inner .bg{ position:absolute; top:0; height:100%; width:95%;}
.page_history_wrap > li:nth-child(2n) .history_img .inner .bg{ right:0;}
.page_history_wrap > li:nth-child(2n+1) .history_img .inner .bg{ left:0;}
.page_history_wrap > li .history_img .inner .page_tit{ position:relative; margin-bottom:0;}
.page_history_wrap > li .history_img .inner .page_tit .his_tt1{font-size:4em;}
.page_history_wrap > li .history_con .history_list{ width:50em; max-width:100%; margin:0 auto;}

.slick-prev.slick-arrow{border:1px solid #ddd; background:none; width:40px; height:40px; text-align:center; border-radius:100%; position:absolute; top:50%; left:-15%; transform:translateY(-50%);}
.slick-prev.slick-arrow:hover{background:#00a672; color:#fff;}
.slick-next.slick-arrow{border:1px solid #ddd; background:none; width:40px; height:40px; text-align:center; border-radius:100%; position:absolute; top:50%; right:-15%; transform:translateY(-50%);}
.slick-next.slick-arrow:hover{background:#00a672; color:#fff;}

.history_list{ position:relative; overflow:hidden; padding:3em 0 3em 0;}
.history_list:before,
.history_list .lineAni{ content:""; position:absolute; left:12em; top:0; width:2px; height:100%; background:#ddd}
.history_list .lineAni{ height:0; background:#0A333A; transition:.3s}
.history_list .lineAni:before,
.history_list:after{ content:""; position:absolute; width:1.25em; height:1.25em; background:#fff; border:.25em solid #0A333A; border-radius:50%; box-sizing:border-box; margin-left:1px; transform:translateX(-50%);}
.history_list:after{ top:auto; bottom:0; left:12em}
.history_list .history > li{ margin-top:4em}
.history_list .history > li:first-child{ margin-top:0}
.history_list .history > li .year{ width:10em; text-align:right;}
.history_list .history > li .year .tt{ position:relative; font-size:2.500em; color:#888; font-weight:700; transition:.3s;}
.history_list .history > li .year .tt:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:40%; background:#0A333A; opacity:0; transition:.3s;}
.history_list .history > li .year .tt > *{ position:relative;}
.history_list .history > li .year.on .tt{ color:#111;}
.history_list .history > li .year.on .tt:before{ opacity:.2;}
.history_list .history > li .list{ margin:1em 0 2em 12em;}
.history_list .history > li .list > li{ margin-top:1.5em}
.history_list .history > li .list > li:first-child{ margin-top:0}
.history_list .history > li .list .tt{ position:relative; padding:0 2em; margin-top:.125em; font-size:1.3em; color:#333; line-height:1.5;}
.history_list .history > li .list .tt .dot{ position:absolute; left:0; top:-.125em; width:1.875em; height:1.875em; background:transparent; border-radius:50%; box-sizing:border-box; margin-left:1px; transform:translateX(-50%);}
.history_list .history > li .list .tt .dot:before{ content:""; position:absolute; top:.625em; bottom:.625em; left:.625em; right:.625em; background:#ddd; border-radius:50%;}
.history_list .history > li .list .tt .dot.on{ background:#fff;}
.history_list .history > li .list .tt .dot.on:before{ background:#0A333A;}
.cw .page_tit.icon:after{ background:#fff;}
.cw .page_tit > .tt{ color:#fff;}
.cw .page_txt > .tt{ color:#fff;}

.sub_page_tit3 .tit_wrap .t1{ font-size:2.375em;}
.culture_con {}
.culture_con ul {margin-left:-10px;}
.culture_con ul li .inn {margin-left:10px; border:1px solid #ddd; height:320px; }
.culture_con ul li .inn.bg01 {background:url(../images/sub/culture_bg05.jpg) ; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.culture_con ul li .inn.bg02 {background:url(../images/sub/culture_bg04.jpg) ; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.culture_con ul li .inn.bg03 {background:url(../images/sub/culture_bg06.jpg) ; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.culture_con ul li .inn.bg04 {background:url(../images/sub/culture_bg04.jpg) ; background-size:cover; background-position:center center; background-repeat:no-repeat;}

.culture_con ul li .inn .tt {background:#fff; font-weight:400; font-size:1em; display:block; padding:2em 1em; margin:45px 10px 0 10px; height:160px; text-align:center; box-shadow:3px 3px 10px rgba(0,0,0,.2); border:1px solid #0A333A;}
.culture_con ul li .inn .tt .txt{ text-align:left; line-height:1.5; display:block; padding:0 1em; word-break:break-all; color:#555;}
.culture_con ul li .inn .tt .col {font-size:1.375em; display:block; font-weight:700; padding-bottom:.8em}


.dp2_product .page_tab .tab,
.dp2_product .page_tab .tab > li,
.dp2_product .page_tab .tab > li > a{ }
.dp2_product .page_tab {text-align:center;} 
.dp2_product .page_tab .tab{margin-bottom:5em;}
.dp2_product .page_tab .tab > li {width:25%;}
.dp2_product .page_tab .tab > li > a{padding:1.3em 0em; border:1px solid #ddd; margin:.5em 0 0 .5em; color:#666; transition:.3s; display:block; }
.dp2_product .page_tab .tab > li > a > .tt {font-size:1em; letter-spacing:.1px;}
.dp2_product .page_tab .tab > li > a > *{ display:inline-block; *display:inline; zoom:1;}
.dp2_product .page_tab .tab > li .icon{ margin-left:.5em; color:#CC0000;}
.dp2_product .page_tab .tab > li .icon:before{ content:"\e937";}
.dp2_product .page_tab .tab > li:hover > a,
.dp2_product .page_tab .tab > li.on > a{box-shadow:0 0 1em 0.125em rgba(0,0,0,.1); background:#0A333A; color:#fff; border-color:#0A333A;}
.dp2_product .page_tab .tab > li:hover .icon,
.dp2_product .page_tab .tab > li.on .icon{ color:#fff;}

.prd_wrap{}
.prd_wrap .prd_main{width:100%; height:100%;}
.prd_wrap .prd_main .lft_img_box{width:30%; height:360px; border:1px solid #ddd; padding:3em; border-radius:1em; box-sizing:border-box; box-shadow:1px 1px 5px -1px #a4a4a4;}
.prd_wrap .prd_main .rgt_txt_box{width:68%; height:360px; margin-left:2%; border:1px solid #ddd; padding:0em 4em; border-radius:1em; box-sizing:border-box; box-shadow:1px 1px 5px -1px #a4a4a4; display:flex; flex-direction:column; justify-content:center;}

.prd_wrap .prd_main .rgt_txt_box .prd_tt{font-size:1.5em;}
.prd_wrap .prd_main .rgt_txt_box .prd_tt1{font-size:1.3em; line-height:1.5; margin-bottom:1rem; position:relative;}
.prd_wrap .prd_main .rgt_txt_box .prd_tt1:after{content:""; position:absolute; width:20px; height:2px; background:#1b4951; left:0;}

.prd_wrap .prd_main .rgt_txt_box .prd_tt2{font-size:1.025em; line-height:1.5; position:relative; padding-left:1.1em;}
.prd_wrap .prd_main .rgt_txt_box .prd_tt2:before{content:""; position:absolute; left:0; top:50%; margin-top:-1px; width:4px; height:2px; background:#777;}
.prd_wrap .prd_main .rgt_txt_box .rgt_img{margin-left:1rem; flex:1; text-align:center;}
.prd_wrap .prd_main .rgt_txt_box .rgt_img:first-child{margin-left:0;}

.prod_detail_wrap .inner .slide_wrap{width:100%; position:relative;}
.prod_detail_wrap .inner .slide_wrap .vm_tt{ max-width:100%;}
.prod_detail_wrap .inner .slide_wrap img{ display:inline-block; *display:inline; zoom:1; width:100%; height:100%;}
.prod_detail_wrap .inner .slide_wrap .item .img{ background:#fff; border:1px solid #ddd;}
.prod_detail_wrap .inner .slide_wrap .prod_slide .item .img{box-sizing:border-box; text-align:center;}
.prod_detail_wrap .inner .slide_wrap .prod_thumb{ margin:0 auto; margin-top:5px; width:70%; position:relative;}
.prod_detail_wrap .inner .slide_wrap .prod_thumb .item .img{ margin:0 4px; cursor:pointer; text-align:center;}
.prod_detail_wrap .inner .slide_wrap .prod_thumb .slick-current .img{ border-color:#00a67e;}
.prod_detail_wrap .inner .slide_wrap .control_box{ position:absolute; top:50%; left:0; right:0; display:none}
.prod_detail_wrap .inner .slide_wrap .control_arrow > li{ position:absolute; top:0; margin-top:-80px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow > li .xi{ width:40px; height:40px; line-height:40px; text-align:center; background:#fff; border:1px solid #ccc; border-radius:100%; color:#777; cursor:pointer;}
.prod_detail_wrap .inner .slide_wrap .control_arrow .prev{ left:-50px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow .next{ right:-50px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow > li:hover .xi{ background:#00a67e; border-color:#00a67e; color:#fff; transition:.3s;}

.prod_detail_wrap .inner .slide_wrap .control_arrow2 > li{ position:absolute; top:0; margin-top:-80px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow2 > li .xi{ width:40px; height:40px; line-height:40px; text-align:center; background:#fff; border:1px solid #ccc; border-radius:100%; color:#777; cursor:pointer;}
.prod_detail_wrap .inner .slide_wrap .control_arrow2 .prev{ left:-50px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow2 .next{ right:-50px;}
.prod_detail_wrap .inner .slide_wrap .control_arrow2 > li:hover .xi{ background:#00a67e; border-color:#00a67e; color:#fff; transition:.3s;}


.prd_wrap2{width: 100%; border: 1px solid #ddd; padding: 1em; border-radius: 1em; box-sizing: border-box; box-shadow: 1px 1px 5px -1px #a4a4a4;}
.prd_wrap2 .prd_main{align-items: stretch;}
.prd_wrap2 .prd_main .lft_img_box{width:28%;}
.prd_wrap2 .prd_main .lft_img_box.va_wrap:before{height:0;}
.prd_wrap2 .prd_main .lft_img_box .va img{border:1px solid #ddd; box-sizing:border-box; padding:.5px;}
.prd_wrap2 .prd_main .rgt_txt_box{}
.prd_wrap2 .prd_main .rgt_txt_box .prd_tt{font-size: 2.5em; font-weight: 600;}
.prd_wrap2 .prd_main .rgt_txt_box .prd_tt1{font-size: 1.5em; color: #ff0000; margin-bottom: 1em;}
.prd_wrap2 .prd_main .rgt_txt_box .prd_tt2{position:relative; padding-left:1.1em; font-size:1.05em;}
.prd_wrap2 .prd_main .rgt_txt_box .prd_tt2:after{display:block; content:''; position:absolute; left:0; top:50%; margin-top:-1px; width:4px; height:2px; background:#777;}
.prd_wrap2 .prd_main .rgt_txt_box .prd_tt2:last-child{margin-bottom:1rem;}
.prd_wrap2 .prd_main .rgt_txt_box{width: 65%; margin-left: 2.5em; height: auto; display:flex; flex-direction:column;}
.prd_wrap2 .prd_main .rgt_txt_box .flex.vc{margin-top:auto; justify-content:space-between;}
.prd_wrap2 .prd_main .rgt_txt_box .flex.vc .rgt_img{width:24%; border:1px solid #ddd; height: 70px; display:flex; justify-content: center; align-items: center; padding:1px; box-sizing:border-box; overflow: hidden;}
.prd_wrap2 .prd_main .rgt_txt_box .flex.vc .rgt_img img{}

.page_Wrap {}
.page_Wrap .page_Wrap_in{*zoom:1; position:relative; margin-top:4em;}
.page_Wrap .page_Wrap_in:after{ content:""; display:block; clear:both;}
.page_Wrap .page_Wrap_in:first-child{ margin-top:0;}
.page_Wrap .page_Wrap_in .left { float:left; width:35%;}
.page_Wrap .page_Wrap_in .right{ float:right; width:60%;}
.page_Wrap .page_Wrap_in .right .inner{ /*margin-left:80px;*/}
.page_Wrap .page_Wrap_in .left .inner { padding:3em 0;}
.page_Wrap .page_Wrap_in:nth-child(2n) .left { float:right;}
.page_Wrap .page_Wrap_in:nth-child(2n) .right{ float:left;}
.page_Wrap .page_Wrap_in:nth-child(2n) .right .inner{ /*margin-left:0; margin-right:80px;*/}

.page_Wrap .page_Wrap_in .inner .t_w{ margin-top:1.5em; margin-left:2em;}
.page_Wrap .page_Wrap_in .inner .t_w:first-child{ margin-top:0;}
.page_Wrap .page_Wrap_in .inner .t_w .t1{font-weight:500; font-size:2.1em; letter-spacing:-1px;}
.page_Wrap .page_Wrap_in .inner .t_w .line {display:inline-block; background:#333; width:2em; height:2px; margin:2em 0;}
.page_Wrap .page_Wrap_in .inner .t_w .t2{  font-family:'Ms'; color:#777; padding-bottom:.2em;}
.page_Wrap .page_Wrap_in .inner .t_w .t3{color:#0A333A; font-size:1.250em; padding:0 0 .2em 0; }
.page_Wrap .page_Wrap_in .inner .t_w .t4{color:#555; padding-bottom:.2em; font-size:1.125em; font-weight:400;}