@charset "utf-8";

@import url('../fonts/font.css');

/* CSS Reset */
body,html,
header,footer,aside,nav,section,article,details,figure,figcaption,menu,command,
div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */
h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist,
img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */
a,label,output,dialog, /* Inline Element */
address,blockquote, /* Text Block Element */
p,pre,/* Text Inline Block Element */
span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */
acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */
map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;vertical-align: baseline;box-sizing:border-box;}
header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */
/* applet,basefont,center,dir,font,strike{display:none} XHTML4, HTML5 Element Not Used Remove */
q,blockquote{quotes:none;content:none}
li,menu{list-style:none;word-break:break-all}
table{width:100%;border-spacing:0;border-collapse: separate;}
caption{text-align:left}
th,td{text-align:center;vertical-align:middle}
address{font-style:normal}
label{display:inline-block;}
a{text-decoration:none;display:inline-block;}
a:hover, a:active {text-decoration: none;}
p{margin-block-start: 0; margin-block-end: 0;}

/* Common Setting */
html{}
html,body{min-width:1412px; width:100%;height:100%;background:#fff;}
body {color:#333333; font-family: 'Noto Sans KR', sans-serif; font-weight: normal; font-size:14px; line-height: 20px; letter-spacing: 0; word-spacing: 0;} 
div{outline:0} /* Script TabIndex Click Focusing Line Remove */

.windowPopupHtml,
.windowPopupHtml body {min-width: 100%;}

:not(:root):fullscreen::backdrop {background: #fff;}

img {vertical-align:middle;}
span {display: inline-block;}
table {}
em {font-style: normal;}

h1,h2,h3,h4,h5,h6 {font-weight: bold; margin-block-start: 0; margin-block-end: 0;}
strong, b {font-weight: bold;}

button {cursor: pointer; background-color: transparent;}
button[disabled], button[readonly] {opacity: .2; cursor: text; outline: 0 none;}

input[disabled], input[readonly]{color:#999; cursor: text; outline: 0 none;}

:focus, :active {outline: 0 none;}

input:focus::-webkit-input-placeholder {color: transparent;} 
input:focus::-moz-placeholder {color: transparent;} 
input:focus:-ms-input-placeholder {color: transparent;} 
input:focus::-ms-input-placeholder {color: transparent;}

::placeholder {color:#ccc; color: #737373; font-weight: 100;}
::-webkit-input-placeholder {color:#ccc; color: #737373; font-weight: 100;}
::-moz-placeholder {color:#ccc; color: #737373; font-weight: 100;}
:-ms-input-placeholder {color:#ccc; color: #737373; font-weight: 100;}
::-ms-input-placeholder {color:#ccc; color: #737373; font-weight: 100;}

.rtime-search-area .search-box .input::placeholder {color:#787878; font-weight: 400;}
.rtime-search-area .search-box .input::-webkit-input-placeholder {color:#787878; font-weight: 400;}
.rtime-search-area .search-box .input::-moz-placeholder {color:#787878; font-weight: 400;}
.rtime-search-area .search-box .input:-ms-input-placeholder {color:#787878; font-weight: 400;}
.rtime-search-area .search-box .input::-ms-input-placeholder {color:#787878; font-weight: 400;}

.color1 {color: #ec6608 !important;}
.color2 {color: #0276b2 !important;}
.color3 {color: #f36f20 !important;}
.color4 {color: #db2424 !important;}

.hidden {position: absolute; top: -9999px; left: -9999em;}
/*.blind {position: absolute; overflow: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; border: none; clip: rect(0, 0, 0, 0);}*/

.ff-NSKR {font-family: 'Noto Sans KR', sans-serif;}

.td-ul {text-decoration: underline !important;}

.tt-u {text-transform: uppercase !important;}
.tt-n {text-transform: none !important;}

.bold {font-weight: bold !important;}
.bold2 {font-weight: 400 !important; text-shadow: 0 0 0 #595959;}

.ta-l {text-align: left !important;}
.ta-c {text-align: center !important;}
.ta-r {text-align: right !important;}

.fl {width: auto; float: left !important;}
.fr {width: auto; float: right !important;}
.clear {clear: both !important;}
.flrbox::after {content: ''; display: block; clear: both;}

.va-t {vertical-align: top !important;}
.va-m {vertical-align: middle !important;}
.va-b {vertical-align: bottom !important;}

.w10p {width: 10% !important;}
.w20p {width: 20% !important;}
.w25p {width: 25% !important;}
.w26p {width: 26% !important;}
.w28p {width: 28% !important;}
.w30p {width: 30% !important;}
.w32p {width: 32% !important;}
.w33p {width: 33% !important;}
.w34p {width: 34% !important;}
.w40p {width: 40% !important;}
.w45p {width: 45% !important;}
.w50p {width: 50% !important;}
.w55p {width: 55% !important;}
.w60p {width: 60% !important;}
.w70p {width: 70% !important;}
.w72p {width: 72% !important;}
.w74p {width: 74% !important;}
.w75p {width: 75% !important;}
.w80p {width: 80% !important;}
.w90p {width: 90% !important;}
.full,
.w100p {width: 100% !important;}

.w58 {width: 58px;}
.w68 {width: 68px;}
.w100 {width: 100px;}
.w150 {width: 150px;}
.w565 {width: 565px;}
.w700 {width: 700px;}
.w770 {width: 770px;}
.w1000 {width: 1000px;}
.w1118 {width: 1118px;}

.h242{ height: 242px;}
.h266{ height: 266px;}

.pd0 {padding: 0px !important;}
.pd10 {padding: 10px !important;}

.mgt0 {margin-top: 0px !important;}
.mgt3 {margin-top: 3px !important;}
.mgt4 {margin-top: 4px !important;}
.mgt5 {margin-top: 5px !important;}
.mgt7 {margin-top: 7px !important;}
.mgt9 {margin-top: 9px !important;}
.mgt10 {margin-top: 10px !important;}
.mgt11 {margin-top: 11px !important;}
.mgt14 {margin-top: 14px !important;}
.mgt15 {margin-top: 15px !important;}
.mgt16 {margin-top: 16px !important;}
.mgt19 {margin-top: 19px !important;}
.mgt-8 {margin-top: -8px !important;}
.mgt-110 {margin-top: -110px !important;}

.mgb5 {margin-bottom: 5px !important;}
.mgb10 {margin-bottom: 10px !important;}

.mgl0 {margin-left: 0px !important;}
.mgl3 {margin-left: 3px !important;}
.mgl4 {margin-left: 4px !important;}
.mgl8 {margin-left: 8px !important;}
.mgl9 {margin-left: 9px !important;}
.mgl20 {margin-left: 20px !important;}

.mgr4 {margin-right: 4px !important;}
.mgr8 {margin-right: 8px !important;}
.mgr25 {margin-right: 25px !important;}

.mglr25 {margin-left: 25px !important; margin-right: 25px !important;}

.mgtb8 {margin-top: 8px !important; margin-bottom: 8px !important;}

.pdl0 {padding-left: 0px !important;}
.pdl15 {padding-left: 15px !important;}

.pdr0 {padding-right: 0px !important;}

.pdt0 {padding-top: 0px !important;}
.pdt12 {padding-top: 12px !important;}
.pdt16 {padding-top: 16px !important;}

.pdb0 {padding-bottom: 0px !important;}
.pdb14 {padding-bottom: 14px !important;}

.pdrl0 {padding-right: 0 !important; padding-left: 0 !important;}

.pdtype1 {padding: 29px 42px 26px !important;}
.pdtype2 {padding: 39px 42px 49px !important;}
.pdtype3 {padding: 29px 33px 28px !important;}

.position-r {position: relative !important;}
.position-a {position: absolute !important;}

.txtLine1, .ellipsis1 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%;}
.txtLine2, .ellipsis2 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%;
	white-space: normal; text-align: left; word-wrap: break-word; display: -webkit-inline-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

.dis-t {display: table !important;}
.dis-tc {display: table-cell !important; vertical-align: middle !important;}
.dis-ib {display: inline-block !important;}
.dis-flexCC {display: flex !important; justify-content: center; align-items: center;}
.dis-flexLR {display: flex !important; justify-content: space-between; align-items: center;}
.dis-cont{ display: contents !important;}

.flex1 {flex: 1 !important;}

.scroll-y{ padding-right: 6px; overflow-y: auto;}
.scroll-y::-webkit-scrollbar{width: 6px; height: 6px;}
.scroll-y::-webkit-scrollbar-track{background-color: #eeeded;}
.scroll-y::-webkit-scrollbar-thumb{background-color: #bfbebe; border-radius: 3px;}


/*************************************************layout*************************************************/
.inner{ width: 1440px; margin: 0 auto;}
#wrap{ width: 100%; height: 100%; display: flex; flex-direction: column;}

#top_layout .inner{ height: 80px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #ddd;}
#top_layout .logo{ width: 149px; height: 33px;}
#top_layout .logo h1{ width: 100%; height: 100%; background: url(../img/common/logo.png) no-repeat center center; text-indent: -9999px; display: inline-block;}
#top_layout .tit p{ font-weight: 500; font-size: 20px; color: #333; line-height: 22px; display: inline-block;}
#top_layout .util{ height: 100%;}
#top_layout .util ul{ height: 100%; display: flex; border-left: 1px solid #cfcfcf;}
#top_layout .util li{ border-right: 1px solid #cfcfcf;}
#top_layout .util .link{ height: 100%; font-size: 14px; color: #999; padding: 0 16px; display: flex; align-items: center; justify-content: center;}
#top_layout .util .link:hover{ background-color: #33333308;}
#top_layout .util .link .ico{ width: 34px; height: 34px; background: no-repeat center center #fff; border-radius: 50%;}
#top_layout .util .link.user .ico{ background-image: url(../img/ico/ico-user-type1.png); margin-right: 5px;}
#top_layout .util .link.user .name{ color: #333; margin-right: 20px;}
#top_layout .util .link.logout .ico{ background-image: url(../img/ico/ico-logout.png); background-position: 6px center; margin-left: 5px;}

#body_layout{ flex: 1;}

#foot_layout{ background-color: #ddd;}
#foot_layout .inner{ height: 60px; font-size: 11px; color: #8d8e8d; display: flex; align-items: center; justify-content: center;}
#foot_layout .util{ margin-right: 256px; display: flex;}
#foot_layout .util li{ height: 14px; display: flex; align-items: center;}
#foot_layout .util li + li{ padding-left: 7px; margin-left: 7px; border-left: 1px solid #ac939e;}
#foot_layout .util .link{ font-size: 12px; color: #888; line-height: 14px;}
#foot_layout .util .link:hover{ text-decoration: underline;}
#foot_layout .util .link1{ font-weight: 500;}

#lp_layout{ width: 100%; height: 100%; display: none; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; z-index: 999;}
#lp_layout::before{ width: 100%; height: 100%; background-color: #000; content: ''; opacity: 0.3; position: absolute; top: 0; left: 0; z-index: -1;}
#lp_layout .lp_wrap{ max-height: 85%; background-color: #fff; padding: 70px 40px 40px 40px; display: none; flex-direction: column; position: relative;}
#lp_layout .lp_wrap.on{ display: flex;}
#lp_layout .lp_head{ height: 70px; padding-right: 25px; display: flex; align-items: center; position: absolute; top: 0; left: 40px;}
#lp_layout .lp_head.ta-c {right: 40px; width: auto; padding-left: 30px; padding-right: 30px; justify-content: center;}
#lp_layout .lp_head h2{ font-weight: 600; font-size: 22px; color: #333; line-height: 1.2;}
#lp_layout .lp_head h2.type1 {font-size: 30px; font-weight: 400; line-height: 36px; color: #000; letter-spacing: -0.08em; word-spacing: -0.08em;}
#lp_layout .lp_body{ height: 100%; flex: 1; border: 1px solid #ccc; overflow-y: auto;}
#lp_layout .lp_body.type1 {border: 0 none;}
#lp_layout .lp_body::-webkit-scrollbar{width: 6px; height: 6px; padding-right: 6px;}
#lp_layout .lp_body::-webkit-scrollbar-track{background-color: #eeeded;}
#lp_layout .lp_body::-webkit-scrollbar-thumb{background-color: #bfbebe; border-radius: 3px;}
#lp_layout .lp_close{ width: 18px; height: 18px; background: url(../img/common/ico-close.png) no-repeat center center; text-indent: -9999px; display: inline-block; position: absolute; top: 26px; right: 40px;}

#lp_layout .lp_wrap.type-visitSecurity2 {padding: 108px 43px 40px 50px; max-height: 98%; padding-bottom: 0; max-height: 100%;}
#lp_layout .lp_wrap.type-visitSecurity2 .lp_head {height: 108px;}
#lp_layout .lp_wrap.type-visitSecurity2 .lp_close {top: 45px;}

.lpOpen #lp_layout{ display: flex;}

/*swiper*/
[class^=swiper-button-] {
    transition: all 0.3s ease;
  }
  
  .swiper-slide {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
  
  *,
  *:before,
  *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }
  
  .swiper-container {
    width: 80%;
    height: 100%;
    float: left;
    transition: opacity 0.6s ease, transform 0.3s ease;
  }
  .swiper-container.nav-slider {
    width: 20%;
    padding-left: 5px;
  }
  .swiper-container.nav-slider .swiper-slide {
    cursor: pointer;
    opacity: 0.4;
    transition: opacity 0.3s ease;
  }
  .swiper-container.nav-slider .swiper-slide.swiper-slide-active {
    opacity: 1;
  }
  .swiper-container.nav-slider .swiper-slide .content {
    width: 100%;
  }
  .swiper-container.nav-slider .swiper-slide .content .title {
    font-size: 20px;
  }
  .swiper-container:hover .swiper-button-prev,
  .swiper-container:hover .swiper-button-next {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
  }
  .swiper-container.loading {
    opacity: 0;
    visibility: hidden;
  }
  
  .swiper-slide {
    overflow: hidden;
  }
  .swiper-slide .slide-bgimg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
  }
  .swiper-slide .entity-img {
    display: none;
  }
  .swiper-slide .content {
    position: absolute;
    top: 40%;
    left: 0;
    width: 50%;
    padding-left: 5%;
    color: #fff;
  }
  .swiper-slide .content .title {
    font-size: 2.6em;
    font-weight: bold;
    margin-bottom: 30px;
  }
  .swiper-slide .content .caption {
    display: block;
    font-size: 13px;
    line-height: 1.4;
    transform: translateX(50px);
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.7s ease;
  }
  .swiper-slide .content .caption.show {
    transform: translateX(0);
    opacity: 1;
  }
  
  [class^=swiper-button-] {
    width: 44px;
    opacity: 0;
    visibility: hidden;
  }
  
  .swiper-button-prev {
    transform: translateX(50px);
  }
  
  .swiper-button-next {
    transform: translateX(-50px);
  }

.visitSecurity-box .dd.bg-safety-policy {
    background-image: url(../img/visitSecu/img-safety-policy.png);
    height: 550px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.visitSecurity-box .dd.bg-daejeon-safety {
    background-image: url(../img/visitSecu/img-visitor-safety.png);
    height: 600px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.visitSecurity-box .dd.bg-she-vision {
    background-image: url(../img/visitSecu/img-she-vision.png);
    height: 478px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}