@charset "utf-8";

@import url('base.css');

/************************************************
	skipLink
************************************************/
#skipLink{ width:100%; overflow:hidden; position:relative; z-index:1000;}
#skipLink a{ margin:0px -1px -1px 0px; width:1px; height:1px; text-align:center; line-height:0; overflow:hidden; font-size:0px; display:block;}
#skipLink a:focus{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}
#skipLink a:hover{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}
#skipLink a:active{ background:rgb(32, 38, 44); margin:0px; padding:8px 0px 8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700;}

*[tabindex] {
  outline:none;
}

/* --------------------------------------------
 * layout
/* ------------------------------------------ */
.mbg{ display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#000; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=50); opacity:.5; z-index:3;}
body.ovf_hdn, .ovf_hdn{ overflow:hidden; height:100%;}

#wrap{ position:relative; width:100%; min-width: 1200px; margin:0 auto; overflow:hidden; }

#header{ position: fixed; top: 0; left: 0; width:100%; z-index:5; border-bottom: rgba(255,255,255,.25)  1px solid; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
#header .head-top{ border-bottom: #e4e4e4 1px solid;  } 
#header .head-top .inner{ width: 1200px; margin: 0 auto; position: relative; height: 108px;}
#header h1.logo{ position: absolute; top:50%; left:60px; width: 83px; margin-top: -20px; }
#header h1.logo a{ display: block; height: 40px; background:url('../images/logo.png') 50% 50% no-repeat; text-indent: -9999px;}
#header .lang{ position: absolute; top: 50%; right: 50px; width: 145px; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;}
#header .lang .bt{ position: relative; display: block; height: 30px; line-height: 30px; padding: 0 10px; color: #fff; margin-top: -15px; z-index:10;}
#header .lang .bt::after{ content: ''; display: block; position: absolute; top: 50%; right: 0; width: 10px; height: 10px; margin-top: -5px; background: url(../images/blt_select.png) 50% 50% no-repeat; -webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-ms-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out; transition:all 0.4s ease-in-out;}
#header .lang.on .bt::after{ -webkit-transform:rotate(90deg);transform:rotate(90deg); }
#header .lang .bt::before{ content:""; position: absolute; bottom:0; left:10px; display:block; width:135px; height:2px; background-color:#fff; opacity:0;}
#header .lang.on .bt::before{ opacity:1;}
#header .lang ul{ position: absolute; top: -10px; right: 40px; width:100px; text-align:right; white-space:nowrap; opacity: 0; -webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-ms-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out; transition:all 0.4s ease-in-out;}
#header .lang.on ul{ width:100px; right: 60px; opacity:1; }
#header .lang ul::after{ content:""; display:block; clear:both;}
#header .lang ul li{ display: inline-block;}
#header .lang ul a{ display: inline-block; color: #fff; padding:  0 5px; }
#header .bt-mn{ position: absolute; width: 40px; height: 40px; top: 50%; right: 5vw; margin-top: -20px; display: none;}
#header .bt-mn span{ position: absolute; top: -9999px; left: -9999px;}
#header .bt-mn i{ position: absolute; right: 0; width: 22px; height: 2px; background-color: #000; display: block;}
#header .bt-mn i:nth-child(1){ top: 12px;}
#header .bt-mn i:nth-child(2){ top: 19px; width: 16px;}
#header .bt-mn i:nth-child(3){ top: 26px;}
#header .subBg{ position: fixed; top: 100px; left: 0; width: 100%; height: 190px; background: rgba(255, 255, 255, .97) !important; border-top:1px solid #eee; display: none;}
body.main #header{ border-bottom: none;}

#gnbWrap{ position: relative; width: 770px; margin: 0 auto; z-index: 2;}
#gnbWrap::after{ content: ''; display: block; clear: both;}
#gnbWrap #gnb::after{ content: ''; display: block; clear: both;}
#gnbWrap #gnb > li{ position: relative; float: left; padding: 0 40px;}
#gnbWrap #gnb > li > a{ position: relative; display: block; font-size: 20px; color: #fff; letter-spacing: 0; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; text-align: center; line-height: 100px; font-weight: 600;}
#gnbWrap #gnb > li > a::after{ content: ''; display: block; position: absolute; bottom: -1px; left: 50%; width: 0; height: 3px; background-color: #009cff; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
#gnbWrap #gnb > li:hover > a::after,
#gnbWrap #gnb > li.active > a::after{  left:-20px; width:calc(100% + 40px); }
#gnbWrap #gnb > li .subDepth{ position: absolute; top: 100px; padding-top:20px; white-space: nowrap; display: none;}
#gnbWrap #gnb > li .subDepth > li{ display: inline-block; display: flex; flex-direction: row;}
#gnbWrap #gnb > li .subDepth > li + li{}
#gnbWrap #gnb > li .subDepth > li > a{ display: block; line-height: 35px; font-size: 18px; color: #262626;}
#gnbWrap #gnb > li .subDepth > li > a:hover{ color: #009cff;}

.fixed #header,
#header.on,
body.main #header.on{ background-color: #fff; border-bottom: #f0f0f0 1px solid;}
.fixed #header h1.logo a,
#header.on h1.logo a{ background:url('../images/logo_on.png') 50% 50% no-repeat;}  
.fixed #header #gnbWrap #gnb > li > a,
#header.on #gnbWrap #gnb > li > a{ color: #000;}
.fixed #header .lang .bt,
#header.on .lang .bt{ color: #000;}
.fixed #header .lang ul a,
#header.on .lang ul a{ color: #000;}

/* siteFunctions */
#siteFunctions{ position:fixed; top:0; right:-100%; width:100%; bottom:0; height:100%; z-index:10; background-color: #fff; display: none;}
#siteFunctions .inner{ position:relative; overflow-y:auto; background-color:#fff; padding:0 0 50px; height: 100vh;}
#siteFunctions .hd{ position:relative; height:45px; overflow:hidden; border-bottom:#dcdcdc 1px solid; padding: 0 5vw;}
#siteFunctions .hd .lang a{ display: inline-block; line-height: 44px; height: 44px; font-size: 1.3rem; padding: 0; color: #999; text-transform: uppercase;}
#siteFunctions .hd .lang a.active{ color: #009cff;}
#siteFunctions .hd .lang a + a{ margin-left: 20px;}
#siteFunctions .bt-close{ position:absolute; right:5vw; top:14px; display:block; width:1.8rem; height:1.8rem; -webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
#siteFunctions .bt-close span{ position:absolute; top:-9999px; left:-9999px;}
#siteFunctions .bt-close::before{ content:""; position:absolute; top:50%; left:0; margin-top:-1px; width:100%; height:2px; background-color:#222; display:block;}
#siteFunctions .bt-close::after{ content:""; position:absolute; top:0; left:50%; margin-left:-1px; width:2px; height:100%; background-color:#222; display:block;}
#siteFunctions .hd_login_msg{		position: absolute;		width:100%;		font-size: 16px;		line-height: 0;		overflow: visible;		/*z-index: 999;*/		color: #ff6600;	top:24px; left:25%;	}
#siteFunctions .logout_btn{font-size: 16px;		color: #009cff;}


@media screen and (max-width:640px){
	#siteFunctions .hd_login_msg{		position: absolute;		width:100%;		font-size: 16px;		line-height: 0;		overflow: visible;		/*z-index: 999;*/		color: #ff6600;	top:0px; left:25%;	}
}




.mobMenu{ padding: 0 5vw; }
.mobMenu a,
.mobMenu span{ display:block; color:#222;}
.mobMenu > li{ border-bottom: #dcdcdc 1px solid;}
.mobMenu > li > a{ position:relative; font-size:1.8rem; padding: 18px 12px; color: #000; font-family: Montserrat;  display:block; font-weight: 500;}
.mobMenu > li > a::before{ content: ''; position: absolute; top: 50%; right: 12px; display: block; width: 13px; height: 1px; background-color: #000;}
.mobMenu > li > a::after{ content: ''; position: absolute; top: 50%; right: 18px; margin-top: -6px; display: block; width: 1px; height: 13px; background-color: #000;}
.mobMenu > li.active > a::before{ background-color: #009cff;}
.mobMenu > li.active > a::after{ display: none;}
.mobMenu > li > .subDepth{ padding: 0 12px 15px; }
.mobMenu > li > .subDepth > li > a{ color: #666; font-size: 1.5rem;}
.mobMenu > li > .subDepth > li + li{ margin-top: 15px;}
.mobMenu > li.active > a::before{ background-image:url('../images/aw_bot2.png');}

#container{ position: relative; z-index: 1;}

#contents{ position: relative; padding: 160px 0 220px; max-width: 1400px; margin: 0 auto;}
#contents::after{ content: ''; display: block; clear: both;}


#footer{ background-color: #242225;}
.foot-wrap{  border-bottom: #575557 1px solid;}
.foot-wrap .inner{ position: relative; max-width: 1400px; margin: 0 auto; padding: 84px 0; display: flex;}
.foot-wrap .inner a{ flex: 1; color: #fff; text-align: center; line-height: 1;}
.foot-wrap .inner a b{ font-size: 30px; color: #009cff; font-weight: 600; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; margin-right: 40px; display: inline-block; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
.foot-wrap .inner a span{ display: inline-block; font-size: 13px; vertical-align: 4px;}
.foot-wrap .inner a span::after{ content: ''; margin-left: 16px; vertical-align: -2px; display: inline-block; border-left: #585759 1px solid; width: 44px; height: 14px; background: url(../images/aw_next_w.png) 100% 50% no-repeat;}
.foot-wrap .inner a + a{ border-left: #575557 2px solid;}
.foot-wrap .inner a:hover b{ color: #fff;}
.foot-inf{ padding: 65px 0;}
.foot-inf .inner{ position: relative; max-width: 1200px; margin: 0 auto; padding: 0 0 0 290px; font-size: 14px; color: #828282; text-align: left;}
.foot-inf .inner .logo{ display: block; width: 206px; position: absolute; top:0; left: 0;}
.foot-inf .inner p + p{ margin-top: 3px;}
.foot-inf .inner p span{ position: relative; display: inline-block;}
.foot-inf .inner p span + span{  margin-left: 10px; padding-left: 10px;}
.foot-inf .inner p span + span::before{ content: ''; position: absolute; top: 50%; left: 0; display: block; width: 1px; height: 10px; margin-top: -5px; background-color: #434243;}
.foot-inf .inner p em{ display: inline-block; margin-right: 10px;}
.foot-inf .inner p b{ display: inline-block; margin-right: 10px; color: #d6d6d6; font-weight: 400;}
.foot-inf .inner address{ display: block; margin-top: 5px;}
.foot-inf .inner .copy{ margin-top: 15px;}
.foot-inf .inner .copy a{ position: relative; color:#999; display: inline-block; margin-right: 8px; padding-right: 10px;}
.foot-inf .inner .copy a.privacy{ color: #fff; }
.foot-inf .inner .copy a::before{ content: ''; position: absolute; top: 50%; right: 0; display: block; width: 1px; height: 10px; margin-top: -5px; background-color: #434243;}
.main .foot-wrap{ display: none;}

.subVis{ position: relative; height: 600px; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; padding-top: 100px; overflow:hidden; display: flex; flex-direction: column; justify-content: center;}
.subVis::before{ content:''; position: absolute; top:0; left:0; bottom:0; display:block; width:100%; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; }
body.sub0101 .subVis::before{ background-image: url(../images/sub_v0101.jpg);}
body.sub0102 .subVis::before{ background-image: url(../images/sub_v0102.jpg);}
body.sub0103 .subVis::before{ background-image: url(../images/sub_v0103.jpg);}
body.sub0104 .subVis::before{ background-image: url(../images/sub_v0104.jpg);}
body.sub0105 .subVis::before{ background-image: url(../images/sub_v0105.jpg);}
body.sub0201 .subVis::before{ background-image: url(../images/sub_v0201.jpg);}
body.sub0202 .subVis::before{ background-image: url(../images/sub_v0202.jpg);}
body.sub0203 .subVis::before{ background-image: url(../images/sub_v0203.jpg);}
body.sub0204 .subVis::before{ background-image: url(../images/sub_v0204.jpg);}
body.sub0205 .subVis::before{ background-image: url(../images/sub_v0205.jpg);}
body.sub0301 .subVis::before{ background-image: url(../images/sub_v03.jpg);}
body.sub0302 .subVis::before{ background-image: url(../images/sub_v0302.jpg);}
body.sub0303 .subVis::before{ background-image: url(../images/sub_v0303.jpg);}
body.sub0304 .subVis::before{ background-image: url(../images/sub_v0303.jpg);}
body.sub0401 .subVis::before{ background-image: url(../images/sub_v0401.jpg);}
body.sub0402 .subVis::before{ background-image: url(../images/sub_v0402.jpg);}
body.sub04 .subVis::before{ background-image: url(../images/sub_v04.jpg);}
body.sub05 .subVis::before{ background-image: url(../images/sub_v05.jpg);}
.subVis h2{ position: relative; color: #fff; text-align: center; font-size: 60px; font-weight: 600;}
.subVis .subLink{ position: absolute; max-width: 1200px; bottom: 36px; right: 50%; margin-right: -600px; text-align: right;}
.subVis .subLink a{ position: relative; display: inline-block; color: rgba(255,255,255,.5); font-weight: 600; font-size: 20px;}
.subVis .subLink a + a{ margin-left: 18px; padding-left: 30px;}
.subVis .subLink a + a::before{ content: ''; display: inline-block; width: 1px; height: 14px; margin-top: -7px; background-color: #fff; position: absolute; left: 0; top: 50%; transform: rotate(20deg);}
.subVis .subLink a:hover,
.subVis .subLink a.active{ color: rgba(255,255,255,1);}

.subVis::before{ opacity: 0;
	transform: scale(1.15, 1.15);
	-ms-transform: scale(1.15, 1.15);
	-webkit-transform: scale(1.15, 1.15);
	-moz-transform: scale(1.15, 1.15);
	-webkit-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
}
.subVis.active::before{
	opacity: 1;
	transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
}

@media screen and (min-width:1025px){
	.opacity{ opacity:0;}
}


	.moblogo{width:83px; margin:0 0 0 8px;}


@media screen and (min-width:1024px) and (max-width:1200px){
    #wrap{ min-width: 100%;}
    #header h1.logo{ left: 20px;}
    #gnbWrap{ text-align: center;}
    #gnbWrap #gnb{ float: none;}
    #gnbWrap #gnb > li{ float: none; display: inline-block;}
    #gnbWrap #gnb > li{ padding: 0 2vw;}
    
    #contents{ width: 100%; padding: 150px 20px;}
    
    .subVis .subLink{ width: 100%; right: auto; margin-right: 0; padding: 0 20px;}
}

@media screen and (min-width:641px) and (max-width:1023px){    
    #wrap{ padding-top: 90px; min-width: 100%;}
    #header{ background-color: #fff; height: 90px;}
    .fixed #header{ background-color: #fff;}
    #header h1.logo{ left: 50%; margin: -24px 0 0 -89px; width: 73px;}
    #header h1.logo a,
    .fixed #header h1.logo a,
    #header.on h1.logo a{ height: 47px; background-image: url(../images/logo_on.png); background-size: 100% auto;}
    #header .lang,
    #gnbWrap{ display: none;}    
    #header .bt-mn{ width: 40px; height: 40px; top: 50%; right: 5vw; margin-top: -20px; display: block;}
    #header .bt-mn i{ position: absolute; right: 0; width: 38px; height: 4px; background-color: #000; display: block;}
    #header .bt-mn i:nth-child(1){ top: 8px;}
    #header .bt-mn i:nth-child(2){ top: 19px; width: 30px;}
    #header .bt-mn i:nth-child(3){ top: 30px;}    
    
    body.main #wrap{ padding-top: 0;}
    body.main #header{ background-color: transparent;}
    body.main #header h1.logo{ margin-left: 0; left: 5.5vw; }
    body.main #header h1.logo a{ background-image: url(../images/logo.png); background-size: 100% auto; }
    body.main #header .bt-mn i{ background-color: #fff;}
    
    #contents{ width: 100%; padding: 55px 5vw;}
    
    .foot-wrap .inner{ padding: 38px 0;}
    .foot-wrap .inner a b{ margin-right: 0; display: block; margin-bottom: 5px;}
    .foot-inf{ border-top:none; padding: 15px;}
    .foot-inf .inner{ padding: 0 5vw 15px;}
    .foot-inf .inner p .addr{ display: block;}
    .foot-inf .inner p .tel{ margin-left: 0; padding-left: 0;}
    .foot-inf .inner p .tel::before{ display: none;}
    .foot-inf .inner address{ border-bottom: #363437 1px solid; padding-bottom: 15px; }
    .foot-inf .inner address p + p{ margin-top: 13px;}
    .foot-inf .inner .copy{ padding: 0; margin: 0 -5vw; padding: 15px 5vw; border-bottom: #363437 1px solid; margin-bottom: 15px;}
    .foot-inf .inner .copy a.privacy::before{ display: none;}
    .foot-inf .inner .logo{ position: relative; top: auto; left: auto; width: 210px; height: 58px; margin: 0 auto;}
    
    #siteFunctions{ display: block;}
    #siteFunctions .hd{ height:90px; padding-top: 24px; }
    #siteFunctions .bt-close{ top: 30px;}
    
    .subVis{ padding: 15rem 0; height: auto;}
    .subVis h2{ line-height: 1; font-size: 3rem;}
    .subVis .subLink{ display: none;}
}

@media screen and (max-width:640px){
    #wrap{ padding-top: 45px; min-width: 100%;}
    #header{ background-color: #fff; height: 45px;}
    .fixed #header{ background-color: #fff;}
    #header h1.logo{ left: 50%; margin: -12px 0 0 -45px; width: 53px;}
    #header h1.logo a,
    .fixed #header h1.logo a,
    #header.on h1.logo a{ height: 24px; background-image: url(../images/logo_on.png); background-size: 100% auto;}
    #header .lang,
    #gnbWrap{ display: none;}    
    #header .bt-mn{ display: block;}    
    
    body.main #wrap{ padding-top: 0;}
    body.main #header{ background-color: transparent;}
    body.main #header h1.logo{ margin-left: 0; left: 5.5vw; }
    body.main #header h1.logo a{ background-image: url(../images/logo.png); background-size: 100% auto; }
    body.main #header .bt-mn i{ background-color: #fff;}
    
    #contents{ width: 100%; padding: 55px 5vw;}
    
    .foot-wrap .inner{ padding: 38px 0;}
    .foot-wrap .inner a b{ font-size: 18px; margin-right: 0; margin-bottom: 5px; display:block;}
    .foot-wrap .inner a span::after{ display: none;}
    .foot-inf{ border-top:none; padding: 3rem 0 0 0;}
    .foot-inf .inner{ padding: 0 5vw 15px; font-size: 12px;}
    .foot-inf .inner p .addr{ display: block;}
    .foot-inf .inner p .tel{ margin-left: 0; padding-left: 0;}
    .foot-inf .inner p .tel::before{ display: none;}
    .foot-inf .inner address{ border-bottom: #363437 1px solid; padding-bottom: 15px; }
    .foot-inf .inner address p + p{ margin-top: 13px;}
    .foot-inf .inner .copy{ padding: 0; margin: 0 -5vw; padding: 15px 5vw; border-bottom: #363437 1px solid; margin-bottom: 15px;}
    .foot-inf .inner .copy a.privacy::before{ display: none;}
    .foot-inf .inner .logo{ position: relative; top: auto; left: auto; width: 105px; height: 29px; margin: 0 auto;}
    .main .foot-wrap{ display: block;} 
	
	

	.moblogo{width:53px; margin:8px 0 0 8px;}
    
    #siteFunctions{ display: block;}
    
    .subVis{ padding: 100px 0; height: auto;}
    .subVis h2{ line-height: 1; font-size: 3rem;}
    .subVis .subLink{ display: none;}
}

/* --------------------------------------------
 * common
/* ------------------------------------------ */

.tbl-sch{ position: relative;}
.tbl-sch::after{ content: ''; display: block; clear: both;}
.tbl-sch .kw{ height: 40px; line-height: 40px; }

.tit-area{ position: relative; margin: 0 0 40px 0;}
.tit-area .h3-tit{ font-size: 40px; color: #222; font-weight: 600;}
.tit-area .h3-tit.sm{ font-size: 32px;}
.tit-area .tbl-sch{  position: absolute; top: 0; right: 0; }
.tbl-sch{ width: 470px; border-bottom: #ededed 2px solid;}
.tbl-sch .select{ border: none; padding-left: 0; width: 98px; float: left;}
.tbl-sch .kw{ border: none; float: left; width: calc(100% - 158px);}
.tbl-sch.selN .kw{ width: calc(100% - 60px);}
.tbl-sch .sch{ float: left; width: 60px; line-height: 40px; height: 40px; text-indent: -9999px; background: url(../images/ic_sch.png) 50% 50% no-repeat;}

.tit-area2{ position: relative; margin: 150px 0 35px 0;}
.tit-area2 .tit{ font-size: 28px; color: #000; font-weight: 600; } 
.tit-area2 .tit.lg{ font-size: 40px;}
.tit-area2 .tit + p{ margin-top: 25px;}
.tit-area2 .right{ position: absolute; top: .6em; right: 0;}

.tbl-list{ border-top: #000 2px solid;}
.tbl-list table{ width: 100%; table-layout: fixed;}
.tbl-list table thead th{ padding: 30px 0; text-align: center; color: #000; font-size: 22px; border-bottom: #ececec 1px solid;}
.tbl-list .date{ width: 220px;}
.tbl-list .ir01{ width: 200px;}
.tbl-list .ir03{ width: 180px;}
.tbl-list .noti02{ width: 180px;}
.tbl-list table tbody td{ padding: 25px; text-align: center; border-bottom: #ececec 1px solid; font-size: 18px;}
.tbl-list table tbody td.date{ font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; }
.tbl-list table tbody td.subject{ text-align: left; padding: 25px 45px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.tbl-list table tbody td.subject .n{ color: #009cff; font-size: 14px; font-weight: 600; display: inline-block; margin-right: 40px; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;}
.n{ color: #009cff; font-size: 14px; font-weight: 600; display: inline-block; margin-left: 20px; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;}
.tbl-list table tbody tr:hover td{ background-color: #f9f9f9;}
.tbl-list table tbody .dw{ width: 45px; height: 45px; background: #4f4f4f url(../images/ic_dw2.png) 50% 50% no-repeat; text-indent:-9999px; display: inline-block; margin:  0 auto; border-radius: 50%;}
.tbl-list table tbody .dw:hover{ background-color: #009cff;}

.tbl-fin{ border-top: #000 2px solid;}
.tbl-fin table{ width: 100%; table-layout: fixed; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;}
.tbl-fin table thead th{ padding: 30px 0; text-align: center; color: #000; font-size: 18px; border-bottom: #ececec 1px solid;}
.tbl-fin table tbody th{ padding: 35px; text-align: center; color: #262626; font-size: 18px; border-bottom: #ececec 1px solid; }
.tbl-fin table tbody td{ padding: 35px; text-align: center; color: #4f4f4f; font-size: 18px; border-bottom: #ececec 1px solid; border-left: #ececec 1px solid;}
.tbl-fin table tbody td b{ color: #000;}
.tbl-fin table tbody td.fin02{ text-align: left; padding-left: 65px;}
.tbl-fin table .brdLn{ border-left: none;}

div.paging{ text-align:center; padding:0; margin:50px 0 0 0; position:relative; clear:both;}
div.paging a,
div.paging strong{ position: relative; display:inline-block; height:28px; line-height:28px; font-size: 18px; color:#000; text-align:center; vertical-align:middle; background-color: #fff; overflow: hidden; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; margin: 0 12px;}
div.paging .on{ font-weight:600; }
div.paging .on::after{ content: ''; position: absolute; display: block; bottom: 0; left: 0; width: 100%; background-color: #009cff; height: 2px;}
div.paging .direction{ position:relative; width: 20px; margin: 0 8px;}
div.paging .direction > span{ position:absolute; top:-9999px; left:-9999px;}
div.paging .direction.prev{ margin-right: 40px;}
div.paging .direction.next{ margin-left: 40px;}
div.paging .direction.first:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 0px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.first:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.prev:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(45deg);transform:rotate(45deg); }
div.paging .direction.next:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:before{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -8px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }
div.paging .direction.last:after{ content:""; position:absolute; top:50%; left:50%; margin:-4px 0 0 -4px; width:8px; height:8px; display:block;  border:1px solid #777; border-top:none;border-right:none;-webkit-transform:rotate(-135deg);transform:rotate(-135deg); }

.soci-slide{ position: relative; margin-bottom: 150px;}
.soci-slide .slide-bx{ overflow: hidden;}
.soci-slide .thumb img{ max-width: 100%; display: block;}
.soci-slide .desc{ margin-top: 35px; display: block;}
.soci-slide .desc strong{ font-size: 26px; color: #000; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.soci-slide .desc em{ display: block; margin-top: 20px;  height: 46px; overflow: hidden; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.soci-slide .ctl{ position: absolute; top: -74px; right: 0;}
.soci-slide .ctl a{ position: relative; display: block; width: 34px; height: 34px; text-indent: -9999px; float: left; background-repeat: no-repeat;}
.soci-slide .ctl a + a{ margin-left: 20px;}
.soci-slide .ctl a + a::before{ content: ''; display: block; width: 1px; height: 18px; background-color: #b6b6b6; position: absolute; top: 50%; left: -10px; transform: rotate(30deg); margin-top: -9px;}
.soci-slide .prev{ background-image: url(../images/aw_prev.png); background-position: 0 50%;}
.soci-slide .next{ background-image: url(../images/aw_next.png); background-position: 100% 50%;}
.soci-slide .prev:hover{ background-image: url(../images/aw_prev_on.png);}
.soci-slide .next:hover{ background-image: url(../images/aw_next_on.png);}

.viewBottomList{ margin:0; border-bottom: #000 1px solid;}
.viewBottomList ul{ width:100%; padding: 40px; display: table; table-layout: fixed; font-size: 18px; }
.viewBottomList ul li{ display: table-cell; padding:0 130px; position:relative;}
.viewBottomList .viewBottomNext::before{ content: ''; display: block; position: absolute; top: 50%; left: 0; margin-top: -7px; background-color: #dbdbdb; width: 1px; height: 14px;}
.viewBottomList .orderPrev{ vertical-align:middle; position:absolute; top:0; left:0; width:125px; color:#000;}
.viewBottomList .orderPrev::before{ content: ''; width: 8px; height: 8px; border-top: #009cff 2px solid; border-left: #009cff 2px solid; vertical-align: 2px; margin-right: 18px; display: inline-block; transform: rotate(-45deg);}
.viewBottomList .orderNext{ vertical-align:middle; position:absolute; top:0; right:0; width:125px; color:#000; text-align: right;}
.viewBottomList .orderNext::after{ content: ''; width: 8px; height: 8px; border-top: #009cff 2px solid; border-left: #009cff 2px solid; vertical-align: 2px; margin-left: 18px; display: inline-block; transform: rotate(135deg);}
.viewBottomList a{ color:#4f4f4f; text-overflow:ellipsis; overflow:hidden; display:block; white-space:nowrap;}
.viewBottomList .viewBottomPrev:hover a,
.viewBottomList .viewBottomNext:hover a{ text-decoration:underline;}

.tbl-view{ }
.tbl-view .hd{ padding: 40px 0 40px 40px; border-bottom: #dbdbdb 1px solid; display: table; width: 100%; table-layout: fixed;}
.tbl-view .hd .subject{ display: table-cell; vertical-align: middle; font-size: 26px; font-weight: 600; color: #000;}
.tbl-view .hd .subject .ic{ display: inline-block; vertical-align: 4px; margin-right: 50px; color: #009cff; font-size: 16px;}
.tbl-view .hd .date{ font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;  display: table-cell; text-align: center; width: 170px; color: #4f4f4f; font-size: 18px; vertical-align: middle;}
.tbl-view .td-vew{ border-bottom: #dbdbdb 1px solid; padding: 50px 40px; font-size: 18px; color: #262626; font-weight: 200; line-height: 1.5;}
.tbl-view .td-vew .MsoNormalTable th,
.tbl-view .td-vew .MsoNormalTable td{ border:#000 1px solid; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif !important; font-size:inherit !important;}
.tbl-view .td-vew .MsoNormalTable th p,
.tbl-view .td-vew .MsoNormalTable td p{ font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif !important; font-size:inherit !important;}
.tbl-view .fileBx{ padding: 12px 40px; display: table; width: 100%; table-layout: fixed; border-bottom: #dbdbdb 1px solid; }
.tbl-view .fileBx dt{ display: table-cell; font-size: 18px; color: #000; font-weight: 600; width: 110px; vertical-align: middle;}
.tbl-view .fileBx dd{ margin-left: -15px; display: table-cell; }
.tbl-view .fileBx dd a{ display: inline-block; float: left; margin: 2px 0 2px 15px; height: 58px; line-height: 58px; padding: 0 30px; border: #dbdbdb 1px solid; color: #262626;}
.tbl-view .fileBx dd a::before{ content: ''; display: inline-block; width: 15px; height: 15px; background: url(../images/ic_file.png); vertical-align: -2px; margin-right: 5px;}
.tbl-view .fileBx dd a:hover{ border: #009cff 1px solid; }

.letter-list .thumb{ display: block; position: relative; }
.letter-list .thumb img{ display: block;}
.letter-list .thumb i{ position: absolute; display: block; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif;  padding: 30px 35px; color: #fff; background-color: rgba(236,9,40,.85); font-size: 26px; font-weight: 500; z-index: 3;}
.letter-list .thumb::after{ content: ''; background-color: rgba(0,0,0,.58); position: absolute; top:0; left: 0; width: 100%; height: 100%; bottom: 0; opacity: 0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
.letter-list .thumb em{ position: absolute; top: 50%; left: 0; width: 100%; text-align: center; color: #fff; z-index: 2; font-size: 18px; opacity: 0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
.letter-list .thumb em::after{ content:''; display: block; width: 18px; height: 19px; background: url(../images/ic_dw.png) 50% 50% no-repeat; margin: 5px auto 0; display: none;}
.letter-list .desc{ display: block; padding: 20px 10px; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; }
.letter-list .desc strong{ display: block; font-size: 32px; color: #000; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; }
.letter-list .desc em{ display: block; color: #4f4f4f; font-size: 16px; margin-top: .6rem;  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.letter-list .bd{ margin-left: -45px; margin-top: -55px;}
.letter-list .bd::after{ content: ''; display: block; clear: both;}
.letter-list .item{ float: left; width: 370px; margin: 30px 0 0 10px; overflow: hidden;}
.letter-list .item .thumb i{ padding: 0 30px; line-height: 80px; font-weight: 600;}
.letter-list .item .desc strong{ font-size: 18px; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.letter-list a:hover .thumb::after,
.letter-list a:hover .thumb em{ opacity: 1;}
.letter-list.blog .bd{ margin-top: -55px;}
.letter-list.blog .item .thumb i{font-size: 16px;}
.letter-list.blog a:hover .thumb em{ display: none;}

.blog-tit{ max-width: 1200px; margin: 0 auto 100px; padding-left: 120px; position: relative; }
.blog-tit::before{ content: ''; display: block; position: absolute; width: 90px; height: 4px; background-color: #009cff; top: 30px; left: 0;}
.blog-tit .tit{ font-size: 60px; color: #000; font-weight: 700; font-family: Montserrat, 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; line-height: 1.2;}
.blog-tit .tit span{ font-weight: 400; display: block;}
.blog-tit .tit em{ font-weight: 400; }
.blog-tit.sm .tit{ font-size: 40px;}
.blog-tit.sm::before{ top: 20px;}
.blog-tit p{ font-size: 18px; color: #262626; margin-top: 25px;}

.blog-hd{ margin-bottom: 80px; margin-top:-50px;}
.blog-hd .thumb img{ display: block; margin-top:35px;}
.blog-hd .desc{ display: block;  padding:0 0 0 120px;}
.blog-hd .desc strong{ display: block; font-size: 26px; color: #000;}
.blog-hd .desc span{ display: block; margin-top: 30px; line-height: 1.8;}

.tbl-hd{ margin-bottom: 40px;}
.tbl-hd::after{ content: ''; display: block; clear: both;}
.tbl-hd .tbl-sch{ float: right;}

.div-tab{ margin-bottom: 130px; border-bottom: #dbdbdb 1px solid; padding-bottom: 20px;}
.div-tab ul::after{ content: ''; display: block; clear: both;}
.div-tab li{ float: left;}
.div-tab li + li{ margin-left: 40px;}
.div-tab a{ display: block; font-size: 22px; color: #bbb; font-weight: 500; font-family: 'Montserrat', 'Noto Sans KR';}
.div-tab li.active a{ color: #000;}

.privacy-bx{ border: #dbdbdb 1px solid; padding: 50px; overflow-y:auto; height: 300px;}

.dv-chk{ margin: 30px 0 0 0;}
.dv-chk a:hover{ text-decoration:underline;}

.tbl-write{ border-top: #222 2px solid;}
.tbl-write .rowsBx{ display: table; width: 100%; table-layout: fixed; border-bottom: #dbdbdb 1px solid; font-size: 18px;}
.tbl-write .rowsBx .hd{ display: table-cell; width: 260px; vertical-align: middle; padding: 18px 35px; font-weight: 600; color: #222;}
.tbl-write .rowsBx .bd{ display: table-cell; vertical-align: middle; padding: 18px 40px 18px 0;}
.tbl-write .rowsBx .bd .input{ min-width: 370px;}
.tbl-write .rowsBx .bd .textarea{ font-size: 18px;}
.tbl-write + .tbl-write{ margin-top: 140px;}
.tbl-write .tx-help{ display: inline-block; line-height: 40px; text-align: center; margin: 0 18px;}

.tbl-write .fileBx{ position: relative;  padding-right: 70px;}
.tbl-write .filebox + .filebox{ margin-top: 1rem;}
.tbl-write .fileBx > div{ position: relative;}
.tbl-write .fileBx > div + div{ margin-top: 1rem;}
.tbl-write .fileBx .btPlus{ position: absolute; top:0; right: 0; border: #999 1px solid; display: block; width: 60px; height: 60px; background: url(../images/ic_plus.png) 50% 50% no-repeat; text-indent: -9999px;}
.tbl-write .ul-list01{ margin-top: 20px;}

.writeBx > li{ display: block; float: left; width: calc(50% - 35px); display: table; table-layout: fixed;}
.writeBx > li:nth-child(even){ padding-left: 70px; width: calc(50% + 35px); }
.writeBx > li .titTx{ display: table-cell; vertical-align: middle; width: 100px;}
.writeBx > li .conTx{ display: table-cell; vertical-align: middle; padding: 6px 0; }
.tbl-write .rowsBx .bd .writeBx > li .conTx .input{ min-width: 100px;}

.filebox{ position: relative; padding-right: 170px; width: 100%;}
.filebox input[type="file"]{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.filebox label{ position: absolute; top: 0; right: 0; display: inline-block; padding: 0; width: 170px; color: #fff; text-align: center; vertical-align: middle; background-color: #009cff; cursor: pointer; border: 1px solid #009cff;border-radius: 0; height:60px; line-height:58px; margin:0;}
.filebox .upload-name{ display: inline-block; padding: 0 10px; width: 100%; line-height: 58px; height: 60px; vertical-align: middle; background-color: #fff; border: 1px solid #dbdbdb; border-radius:0; -webkit-appearance: none;  -moz-appearance: none; appearance: none; font-size: 18px; font-family: 'Noto Sans KR', '돋움', 'Dotum', Apple Gothic, Tahoma, Verdana, sans-serif; color: #999;}

.ul-list01 li{ text-indent: -10px; padding-left: 10px;}
.ul-list01 li + li{ margin-top: 5px;}

table.data{ border-top: #000 2px solid;}
table.data thead th{ padding: 35px 0; text-align: center; font-size: 18px; font-weight: 600; color: #000; border-bottom: #dbdbdb 1px solid;}
table.data tbody td{ padding: 30px 10px; text-align: center; font-size: 16px; color: #262626; border-bottom: #dbdbdb 1px solid; font-family: 'Montserrat', 'Noto Sans KR';}
table.data tbody td.l{ padding-left: 30px;}
table.data .rnd0302{ width: 200px;}
table.data .rnd0303,
table.data .rnd0304,
table.data .rnd0305{ width: 150px;}

/* About Us */
.ceo-bx{ display: table; width: 100%; table-layout: fixed;}
.ceo-bx .photo{ display: table-cell; vertical-align: top; width: 460px; box-shadow: 10px 10px 20px rgba(0,0,0,.1);}
.ceo-bx .desc{ display: table-cell; vertical-align: top; padding: 30px 0 0 140px;}
.ceo-bx .desc .tx01{ font-size: 40px; color: #000; margin-bottom: 50px; line-height: 1.3;}
.ceo-bx .desc .tx01 span{ display: block;}
.ceo-bx .desc p{ font-size: 18px; line-height: 1.7;}
.ceo-bx .desc p + p{ margin-top: 30px;}
.ceo-bx .desc p.sign{ margin-top: 50px; }
.ceo-bx .desc p.sign b{ color: #000;}

.vision-bx{ position: relative; padding-bottom: 80px;}
.vision-bx::before{ content: ''; position: absolute; top: 430px; bottom: 0; left: 50%; width: 100vw; transform:translateX(-50vw); background-color: #f8f8f8; }
.vision-bx .item{ position: relative;}
.vision-bx .item::after{ content: ''; display: block; clear: both;}
.vision-bx .item .thumb{ float: left; width: 750px;}
.vision-bx .item .desc{ float: left; padding: 200px 0 0 84px; width: calc(100% - 750px);}
.vision-bx .item .desc strong{ display: block; font-size: 40px; color: #000; font-family: 'Montserrat', 'Noto Sans KR';}
.vision-bx .item .desc span{ display: block; font-size: 18px; color: #000; margin-top: 20px;}
.vision-bx .item + .item{ margin-top: 120px;}
.vision-bx .item + .item .thumb{ float: right;}
.vision-bx .item + .item .desc{ float: left;}
.vision-bx2{ position: relative; border-top: #dbdbd9 1px solid; padding: 0 80px 220px; margin-bottom: -220px;}
.vision-bx2::after{ content: ''; display: block; clear: both;}
.vision-bx2::before{ content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; transform:translateX(-50vw); background-color: #f8f8f8; }
.vision-bx2 li{ width: 50%; float: left; margin: 80px 0 0 0; padding: 0 0 0 138px; position: relative;}
.vision-bx2 li i{ position: absolute; top:0; left: 0; display: inline-block;}
.vision-bx2 li .desc strong{ color: #262626; font-size: 26px; display: block; }
.vision-bx2 li .desc span{ display: block; margin-top: 20px; line-height: 1.8;}
.vision-bx2 li:nth-child(2n+1){ clear: both; }

.history-bx .tit-area2{ border-bottom: #000 1px solid; padding-bottom: 30px; margin-bottom: 100px;}
.history-bx .tit-area2 .right{ top: 1.6em; }
.history-bx .tit-area2 .right a{ position: relative; font-family: 'Montserrat', 'Noto Sans KR';}
.history-bx .tit-area2 .right a + a{ margin-left: 10px; padding-left: 10px;}
.history-bx .tit-area2 .right a + a::before{ content: ''; background-color: #dbdbdb; display: block; width: 1px; height: 10px; margin-top: -5px; position: absolute; top: 50%; left: 0;}
.history-bx .item{ position: relative; display: table; width: 100%; table-layout: fixed;}
.history-bx .item + .item{ margin-top: 180px;}
.history-bx .item .thumb{ display: table-cell; width:640px; vertical-align: top;}
.history-bx .item dl{ position: relative; display: table-cell; padding: 90px 0 0 195px; vertical-align: top;}
.history-bx .item dl::before{ content: ''; width: 1px; position: absolute; top: 0; bottom: -400px; left: 108px; background-color: #dbdbdb;}
.history-bx .item dl dt{ position: relative; font-size: 50px; font-weight: 600; color: #000; font-family: 'Montserrat', 'Noto Sans KR'; margin-bottom: 50px;}
.history-bx .item dl dt::before{ content: ''; position: absolute; top:24px; left: -95px; background-color: #fff; display: block; width: 17px; height: 17px; border: #ff2929 1px solid; border-radius: 50%; display: block;}
.history-bx .item dl dt::after{ content: ''; display: block; width: 7px; height: 7px; border-radius: 50%; background-color:#ff2929; position: absolute; top: 29px; left: -90px;}
.history-bx .item dl dd{ font-size: 18px;}
.history-bx .item dl dd + dd{ margin-top: 25px; }
.history-bx .item dl dd strong{ display: block; font-size: 18px; color: #000; font-family: 'Montserrat', 'Noto Sans KR';}
.history-bx .item:last-child dl::before{ bottom: 0; }
.history-bx .item:last-child dl::after{ content: ''; position: absolute; bottom: 0; left: 105px; width: 7px; height: 7px; background-color: #dbdbdb; display: block; border-radius: 50%;}

.history-bx2{ position: relative; margin-top: -90px; margin-bottom: -220px; padding-bottom: 220px;}
.history-bx2::before{ content: ''; display: block; position: absolute; top: 230px; bottom: 0; left: 50%; width: 100vw; transform:translateX(-50vw); background-color: #f8f8f8;}
.history-bx2::after{ content: ''; display: block; clear: both;}
.history-bx2 .item{ position: relative; float: left; width: 348px; margin: 90px 0 0 78px;}
.history-bx2 .item .desc{ margin-top: 25px; color: #262626;}
.history-bx2 .item .desc strong{ display: block; font-size: 20px;}
.history-bx2 .item .desc span{ display: block; margin-top: 5px;}
.history-bx2 .pag{ display: none; }

.loc-bx .map-bx{ border: #dbdbdb 1px solid;}
.loc-bx .map{ display: block; width: 100%; height: 480px;}
.loc-bx .tit-area2{ margin: 50px 0 30px;}
.loc-bx .desc{ width: 100%; display: table; table-layout: fixed; font-family: 'Montserrat', 'Noto Sans KR';}
.loc-bx .desc li{ position: relative; display: table-cell; vertical-align: top; font-size: 18px; color: #262626; letter-spacing: -.02em;}
.loc-bx .desc li.addr{ width: 44%; padding-left: 0;}
.loc-bx .desc li.traffic{ padding-left: 60px;  border-left: #dbdbdb 1px solid;}
.loc-bx .desc li p + p{ margin-top: 8px;}
.loc-bx .desc li b{ display: inline-block; margin-right: .5rem;}

/* Business */
.process-bx01{ position: relative; width: 100vw; left: 50%; transform:translateX(-50vw); background-color: #f8f8f8; padding: 130px 0; margin-bottom: -220px; }
.process-bx01.white{ background-color: transparent;}
.process-bx01 .tit{ max-width: 1200px; margin: 0 auto 30px; color: #262626; font-size: 26px; font-family: 'Montserrat', 'Noto Sans KR';}
.process-bx01 .sub-tx{ max-width: 1200px; margin: 0 auto;}
.process-bx01 .process-thum{ width: 1240px; margin:50px auto 0;}
.process-bx01 + .process-bx01{ margin-top: 220px;}

.rnd-bx01 .thum img{ max-width: 100%; display: block;}
.rnd-bx01 .thum ul::after{ content: ''; display: block; clear: both;}
.rnd-bx01 .thum li{ position: relative; float: left; width: 50%; overflow: hidden;}
.rnd-bx01 .thum li p::after{ content: ''; position: absolute; top: 0; left: 0; width: 100%; bottom: 0; opacity: 0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 96%, rgba(0,0,0,0.85) 99%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.85) 96%,rgba(0,0,0,0.85) 99%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.85) 96%,rgba(0,0,0,0.85) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.rnd-bx01 .thum li.on p::after{ opacity: 1;}
.rnd-bx01 .thum li .ov{ position: absolute; bottom: -100px; left: 0; width: 100%; height:440px; opacity: 0; padding-top: 190px; text-align: center; font-size: 18px; font-family: 'Montserrat', 'Noto Sans KR'; color: #fff; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
.rnd-bx01 .thum li .ov::before{ content: ''; position: absolute; top: 70px; left: 50%; width: 1px; height: 100px; background-color: #fff; display: block; }
.rnd-bx01 .thum li .ov i{ width: 86px; height: 86px; display: block; margin: 0 auto 10px;}
.rnd-bx01 .thum li.on .ov{ bottom: 0; opacity:1;}
.rnd-bx01 .desc{ position: relative; margin: -70px 100px 0 0; padding: 70px 100px 0 0; background-color: #fff; letter-spacing: -.05em;}
.rnd-bx01 .desc strong{ display: block; font-family: 'Montserrat', 'Noto Sans KR'; font-size: 26px; font-weight: 600; color: #000; letter-spacing: -.02em; line-height: 1.6;}
.rnd-bx01 .desc span{ display: block; margin-top: 30px; line-height: 1.6;}
.rnd-bx01 .desc span em{ display: block;}

.rnd02-bx01{ display: table; width: 1200px; margin: 0 auto;}
.rnd02-bx01 .tit-area2{ display: table-cell; width: 360px; vertical-align: top;}
.rnd02-bx01 .tit-area2 .tit,
.rnd02-bx02 .tit-area2 .tit{ font-size: 40px;}
.rnd02-bx01 .desc01{ display: table-cell; vertical-align: top;}
.rnd02-bx01 .desc01 .item + .item{ margin-top: 140px;}
.rnd02-bx01 .desc01 .tbx{ margin-top: 35px;}
.rnd02-bx01 .desc01 .tbx strong{ color: #262626; font-size: 26px; display: block; font-family: 'Montserrat', 'Noto Sans KR'; margin-bottom: 25px;}
.rnd02-bx01 .desc01 .tbx .ul-list01{ padding: 0;}
.rnd02-bx01 .desc01 .tbx .ul-list01::after{ content: ''; display: block; clear: both;}
.rnd02-bx01 .desc01 .tbx .ul-list01 li{ width: 50%; float: left; margin-bottom: 5px;}
.rnd02-bx01 .desc01 .tbx .ul-list01 li + li{ margin-top: 0;}
.rnd02-bx02{ display: table; width: 1200px; margin: 160px auto 0;}
.rnd02-bx02 .tit-area2{ display: table-cell; width: 360px; vertical-align: top;}
.rnd02-bx02 .desc01{ display: table-cell; vertical-align: top;}
.rnd02-bx02 .desc01::after{ content: ''; display: block; clear: both;}
.rnd02-bx02 .desc01 li{ width: 260px; margin: 0 0 50px 30px; float: left;}
.rnd02-bx02 .desc01 li:nth-child(3n+1){ clear: both; margin-left: 0;}
.rnd02-bx02 .desc01 li p{ height: 280px; background-color: #f8f8f8; text-align: center; padding-top: 70px;}
.rnd02-bx02 .desc01 li span{ display: block; font-size: 18px; margin-top: 20px;}

.rnd03-slide{ position: relative; max-width: 1200px; margin: 0 auto; padding: 0 78px; overflow: hidden;}
.rnd03-slide .slide-bx{ overflow: hidden;}
.rnd03-slide .prev{ position: absolute; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; top: 50%; left: 0; margin-top: -22px; background-color: #b1b1b1;}
.rnd03-slide .prev span{ position: absolute; top: -9999px; left: -9999px;}
.rnd03-slide .prev::after{ content: ''; display: block; width: 10px; height: 10px; position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -3px; border-top: #fff 2px solid; border-left: #fff 2px solid; transform: rotate(-45deg);}
.rnd03-slide .next{ position: absolute; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; top: 50%; right: 0; margin-top: -22px; background-color: #b1b1b1;}
.rnd03-slide .next span{ position: absolute; top: -9999px; left: -9999px;}
.rnd03-slide .next::after{ content: ''; display: block; width: 10px; height: 10px; position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -7px; border-top: #fff 2px solid; border-left: #fff 2px solid; transform: rotate(135deg);}
.rnd03-slide .prev:hover,
.rnd03-slide .next:hover{ background-color: #009cff;}
.rnd03-slide .pag{ display: none;}

.rnd03-bx01::after{ content: ''; display: block; clear: both;}
.rnd03-bx01 .item{ float: left; border: #eee 1px solid; padding: 50px 70px; width: 584px; margin: 0 0 40px 32px; min-height: 276px;}
.rnd03-bx01 .item:hover{ border-color: #000;}
.rnd03-bx01 .item:nth-child(odd){ margin-left: 0; clear: both;}
.rnd03-bx01 .item dt{ font-size: 18px; color: #000; font-weight: 600;}
.rnd03-bx01 .item dd{ margin-top: 25px; color: #4f4f4f;}
.rnd03-bx01 .item dd ul{ margin-top: 10px;}
.rnd03-bx01 .item dd ul li + li{ margin-top: 5px;}
.rnd03-bx01 .item dd ul li b{ display: inline-block; color: #009cff;}

.prod-bx01::after{ content: ''; display: block; clear: both;}
.prod-bx01 .item{ float: left; width: 580px;}
.prod-bx01 .item + .item{ float: right;}
.prod-bx01 .item b{ display: block; margin-top: 30px; font-size: 26px; font-weight: 600; color: #000;}
.prod-bx02{ margin-top: 75px; border-top: #000 2px solid;}
.prod-bx02 li{ display: table; width: 100%; padding: 50px 0; border-bottom: #dbdbdb 1px solid;}
.prod-bx02 li b{ display: table-cell; vertical-align: middle; text-align: center; font-size: 22px; color: #000; width: 240px;}
.prod-bx02 li div{ display: table-cell; padding: 0 70px; font-size: 18px; color: #262626;}

.prod-bx03::after{ content: ''; display: block; clear: both;}
.prod-bx03 .b-thum{ float: left; width: 860px; }
.prod-bx03 .s-thum{ width: 320px; height: 857px; float: right; overflow: hidden;}
.prod-bx03 .s-thum .swiper-slide img{ width: 100%; height: 200px; object-fit: cover; object-position: center;}
.prod-bx03 .s-thum .swiper-slide.on{ opacity: .5;}

.prod02-slide .ctl{ float: right; margin-bottom: 30px;}
.prod02-slide .ctl a{ position: relative; display: block; width: 34px; height: 34px; text-indent: -9999px; float: left; background-repeat: no-repeat;}
.prod02-slide .ctl a + a{ margin-left: 20px;}
.prod02-slide .ctl a + a::before{ content: ''; display: block; width: 1px; height: 18px; background-color: #b6b6b6; position: absolute; top: 50%; left: -10px; transform: rotate(30deg); margin-top: -9px;}
.prod02-slide .prev{ background-image: url(../images/aw_prev.png); background-position: 0 50%;}
.prod02-slide .next{ background-image: url(../images/aw_next.png); background-position: 100% 50%;}
.prod02-slide .prev:hover{ background-image: url(../images/aw_prev_on.png);}
.prod02-slide .next:hover{ background-image: url(../images/aw_next_on.png);}
.prod02-slide .swiper-slide{ width: 500px;}
.prod02-slide .swiper-slide .thumb{ position: relative; padding-top: 30px;}
.prod02-slide .swiper-slide .thumb b{ font-family: 'Montserrat', 'Noto Sans KR'; width: 130px; height: 100px; display: block; position: absolute; top:0; left: 30px; background-color: #009cff; color: #fff; text-align: center; line-height: 100px; font-size: 26px;}
.prod02-slide .swiper-slide .desc{ margin-top: 35px;}
.prod02-slide .swiper-slide .desc strong{ display: block; font-size: 26px; color: #000;}
.prod02-slide .swiper-slide .desc span{ display: block; color: #262626; font-size: 18px; margin-top: 20px; letter-spacing:-.05em; line-height: 1.6;}

.prod03-bx01::after{ content: ''; display: block; clear: both;}
.prod03-bx01 li{ float: left; width: 25%;}
.prod03-bx01 li .thum{ text-align: center;}
.prod03-bx01 li .desc{ margin-top: 30px; height: 96px; text-align: center;}
.prod03-bx01 li .desc i{ display: block; font-size: 18px; color: #000; font-weight: 600; font-family: 'Montserrat', 'Noto Sans KR';}
.prod03-bx01 li .desc span{ display: block; color: #262626; margin-top: 10px;}
.prod03-bx01 li + li .desc{ border-left: #dbdbd9 1px solid;}

.prod03-bx02{ position: relative; overflow: visible; padding-bottom: 250px;}
.prod03-bx02::before{ content: ''; display: block; background-color: #f8f8f8; position: absolute; width: 100vw; top: 140px; left: 50%; bottom: 0; transform:translateX(-50vw);}
.prod03-bx02 .desc{ margin-top: 30px;}
.prod03-bx02 .desc strong{ font-family: 'Montserrat', 'Noto Sans KR'; display: block; font-size: 16px; font-weight: 600; color: #000; margin-bottom: 10px;}
.prod03-bx02 .desc span{ display: block; font-size: 16px; }
.prod03-bx02 .pag{ display: none; }

.prod04-list::after{ content: ''; display: block; clear: both;}
.prod04-list .item{ width: 216px; float: left; margin: 0 0 60px 30px;}
.prod04-list .item:nth-child(5n+1){ margin-left: 0; clear: both;}
.prod04-list .item span{ display: block; text-align: center; margin-top: 15px; color: #222; font-weight: 500;}

/* Carrers */
.careers-wr{ padding: 150px 0 240px;}
.careers-wr .blog-tit{ margin-bottom: 140px;}
.careers-wr .tit-area2 .tit{ font-size: 40px;}
.careers-bx01{ width: 1200px; display: table; margin: 0 auto; table-layout: fixed;}
.careers-bx01 .tit-area2{ display: table-cell; vertical-align: top; width: 360px;}
.careers-bx01 .desc01{ display: table-cell;}
.careers-bx01 .desc01::after{ content: ''; display: block; clear: both;}
.careers-bx01 .desc01 li{ float: left; width: 280px;}
.careers-bx01 .desc01 li div{ margin-top: 35px;}
.careers-bx01 .desc01 li div b{ display: block; font-size: 26px; color: #000; font-weight: 600;}
.careers-bx01 .desc01 li div b i{ font-size: 18px; color: #009cff; display: inline-block; font-family: 'Montserrat', 'Noto Sans KR';}
.careers-bx01 .desc01 li div span{ display: block; margin-top: 25px;}
.careers-bx02 .tit-area2{ max-width: 1200px; margin: 150px auto 35px;}
.careers-bx02 .thum{ background: url(../images/careers_img02.jpg) 50% 50% no-repeat; height: 500px; background-size: cover;}
.careers-bx03{  width: 1200px; display: table; margin: 160px auto 0; table-layout: fixed;}
.careers-bx03 .tit-area2{ display: table-cell; vertical-align: top; width: 360px;}
.careers-bx03 .desc01{ display: table-cell;}
.careers-bx03 .desc01::after{ content: ''; display: block; clear: both;}
.careers-bx03 .desc01 .item{ position: relative; float: left; width: 50%; margin-bottom: 90px; padding-left: 140px; }
.careers-bx03 .desc01 .item::before{ content: ''; display: block; width: 100px; height: 100px; display: block; position: absolute; top:0; left: 0; background-position: 50% 50%; background-repeat: no-repeat;}
.careers-bx03 .desc01 .item.item01::before{ background-image: url(../images/careers_img0301.png);}
.careers-bx03 .desc01 .item.item02::before{ background-image: url(../images/careers_img0302.png);}
.careers-bx03 .desc01 .item.item03::before{ background-image: url(../images/careers_img0303.png);}
.careers-bx03 .desc01 .item.item04::before{ background-image: url(../images/careers_img0304.png);}
.careers-bx03 .desc01 .item.item05::before{ background-image: url(../images/careers_img0305.png);}
.careers-bx03 .desc01 .item.item06::before{ background-image: url(../images/careers_img0306.png);}
.careers-bx03 .desc01 .item.item07::before{ background-image: url(../images/careers_img0307.png);}
.careers-bx03 .desc01 .item.item08::before{ background-image: url(../images/careers_img0308.png);}
.careers-bx03 .desc01 .item dt{ font-size: 18px; color: #000; font-weight: 600;}
.careers-bx03 .desc01 .item dd{ margin-top: 25px;}
.careers-bx03 .desc01 .item:nth-child(odd){ clear: both;}

.btZoom{ display: none;}

.fin-grp-bx{ display: flex; width: 100%;}
.fin-grp-bx .item{ flex: 1;}
.fin-grp-bx .item + .item{ margin-left: 20px;}
.financial-graph-table { margin-bottom: 50px;}
.financial-graph-table th{ font-family: 'Montserrat', 'Noto Sans KR'; font-size: 13px; font-weight: 600; line-height: 1.87; text-align: right;	color: #4f4f4f;	width: 40px;}
.financial-graph-table td{ height: 28px !important;}
.financial-graph-table.table-2 td { height: 47px !important;}
.financial-graph-table td:nth-child(3){	width: 85px; vertical-align: top;}
.financial-graph-table td:nth-child(2){	box-sizing: border-box;	padding: 0 0 0 20px;}
.financial-graph-table td:nth-child(2):after{ content: "";	display: block;	width: 100%; border-top: solid 1px #dedede;}
.financial-graph-table tr:last-child td:nth-child(2):after{ height: 10px; border-left:solid 1px #dedede; border-right:solid 1px #dedede; margin-bottom: -5px; }
.financial-graph-wrap {
	position: relative;
	width: 100%;
}
.financial-graph-ul {
	width: 100%;
}
.financial-graph-ul:after {
	content: "";
	display: block;
	clear: both;
}
.financial-graph-ul li{	position: relative;	float: left; width: 100%; text-align: center;}
.financial-graph-ul li:nth-child(2) { margin-left: 33.3%; }
.financial-graph-ul li:nth-child(3) { margin-left: 66.6%; }
.financial-graph-title {
	font-size: 18px;
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: -1.38px;
	text-align: center;
	color: #000000;
	position: absolute;
	left: 0;
	bottom: -50px;
	width: 100%;
}
.financial-graph {
	position: absolute;
	left: 0;
	bottom: 0;
	display: inline-block;
	width: 15px;
	height: 0;
}
.financial-graph.item-1{ left: 80px; background-color: #a79995; display:none;}
.financial-graph.item-2{ left: 103px; background-color: #e96146;}
.financial-graph.item-3{ left: 157px; background-color: #b28080;}
.financial-graph.item-4{ left: 207px; background-color: #e90f2c;}
.financial-color-ul{ text-align: center; margin: 70px 0 60px; }
.financial-color-ul li{ display: inline-block; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 2.06; letter-spacing: normal; text-align: center; color: #666;}
.financial-color-ul li + li{ margin-left: 20px;}
.financial-color-ul li:before{ content: "";	display: inline-block; width: 18px; height: 18px; margin-right: 6px; vertical-align: -2px;}
.financial-color-ul li:nth-child(1):before { background-color: #e96146; }
.financial-color-ul li:nth-child(2):before { background-color: #b28080; }
.financial-color-ul li:nth-child(3):before { background-color: #e90f2c; }
.financial-color-ul li:nth-child(4):before { background-color: #e90f2c; }

.pop-lay{ display: none; width: 1000px; padding: 100px; background-color: #fff;}
.pop-lay .bt-close{ position:absolute; overflow: hidden; right:40px; top:40px; display:block; width:40px; height:40px; }
.pop-lay .bt-close span{ position:absolute; top:-9999px; left:-9999px;}
.pop-lay .bt-close::before{ content:""; position:absolute; top:50%; left:50%; margin:0 0 0 -20px; width:40px; height:2px; background-color:#666; display:block; -webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.pop-lay .bt-close::after{ content:""; position:absolute; top:50%; left:50%; margin:-20px 0 0 0; width:2px; height:40px; background-color:#666; display:block; -webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.pop-lay .pop-tit{ margin-bottom: 70px; font-size:40px; font-weight:600; color:#000; height:140px; line-height:140px; border-bottom:#000 2px solid;}
.pop-lay .pop-con{ height:400px; overflow-y:auto;}

@media screen and (min-width:1200px){    
    .prod03-bx02 .swiper-wrapper{ display: block; margin: -78px 0 0 -52px;}
    .prod03-bx02 .swiper-wrapper::after{ content: ''; display: block; clear: both;}
    .prod03-bx02 .swiper-slide{ float: left; width: 348px; margin: 78px 0 0 52px;}
    
    .history-bx2  .swiper-wrapper{ display: block; width: calc(1200px + 78px); margin: -90px 0 0 -78px;}
    .history-bx2  .swiper-wrapper::after{ content: ''; display: block; clear: both;}
    .history-bx2  .swiper-slide{ float: left; width: 348px; margin: 90px 0 0 78px;}
}

@media screen and (min-width:641px) and (max-width:1199px){    
    .prod03-bx02 .swiper-wrapper{ display: block; margin: -78px 0 0 -1%;}
    .prod03-bx02 .swiper-wrapper::after{ content: ''; display: block; clear: both;}
    .prod03-bx02 .swiper-slide{ float: left; width: 32.3%; margin: 78px 0 0 1%;}
    
    .history-bx2 .swiper-wrapper{ display: block; width: 100%; margin: -78px 0 0 -1%;}
    .history-bx2 .swiper-wrapper::after{ content: ''; display: block; clear: both;}
    .history-bx2 .swiper-slide{ float: left; width: 32.3%; margin: 78px 0 0 1%;}
}

@media screen and (min-width:1024px) and (max-width:1200px){
    .letter-list .bd{ margin-left: -3%;}
    .letter-list .item{ width: 100%; margin-left: 3%;}
    
    .careers-bx01{ width: 100%;}
    .careers-bx01 .desc01 li{ width: 33.3%;}
    .careers-bx03{ width: 100%;}
    
    .prod-bx01 .item{ width: 48%;}
    
    .prod-bx03 .b-thum{ width: 70%;}
    .prod-bx03 .b-thum img{ width: 100%; height: 480px; object-fit: cover; object-position: center;}
    .prod-bx03 .s-thum{ width: 28%; height: 480px;}
    .prod-bx03 .s-thum .swiper-slide img{ height: 105px;}
    
    .prod04-list .item{ width: 19%; margin: 0 0 50px 1%;}
    .prod04-list .item:nth-child(2n+1){  float: left; clear: none; margin-left: 1%;}
    .prod04-list .item:nth-child(3n+1){  float: left; clear: none; margin-left: 1%;}
    .prod04-list .item:nth-child(4n+1){  float: left; clear: none; margin-left: 1%;}
    .prod04-list .item:nth-child(5n+1){  margin-left: 0;}

	.pop-lay{ width:100%;}
}

@media screen and (min-width:641px) and (max-width:1023px){
    .tit-area .tbl-sch{ top: 6px; width: 420px;}
    
    .tbl-list table .ir01{ display: none;}
    .tbl-list table .ir03{ width: 100px; padding: 0;}
    .tbl-list table .date{ display: none;}    
    
    .tbl-fin table tbody td.fin02{ padding-left: 10px;}
    
    .viewBottomList ul li.viewBottomPrev{ padding-right: 10px; padding-left: 90px;}
    .viewBottomList ul li.viewBottomNext{ padding-left: 10px; padding-right: 90px;}    
    
    .letter-list .desc strong{ font-size: 1.8rem;}
    .letter-list .desc em{ font-size: 1.4rem;}
    .letter-list .desc{ padding-top: 10px; padding-bottom: 0;}
    .letter-list .bd{ margin-left: -6%;}
    .letter-list .item{ width: 100%; margin: 40px 0 0 6%;}
    .letter-list .item .thumb i{ padding: 0 15px;}
    .letter-list .item .thumb img{ height: auto; }
    .letter-list .item .desc strong{ font-size: 1.4rem;}
    .letter-list .item .desc em{ font-size: 1.2rem;}
    .letter-list .thumb em{ font-size: 1.2rem;}    
        
    .writeBx > li,
    .writeBx > li:nth-child(even){ width: 100%; float: none; padding-left: 0;}
    .writeBx > li .titTx{ width: 110px;}    
    
    .process-bx01{ padding: 3rem 5vw; margin-bottom: 0;}
    .process-bx01 .tit{ font-size: 1.6rem; margin-bottom: 1rem;}
    .process-bx01 .process-thum{ width: 100%; margin-top: 2rem;}
    .process-bx01 + .process-bx01{ margin-top: 0;}
    
    .rnd-bx01 .desc{ margin: -3rem 1rem 0 0; padding: 2rem 1rem 0 0;}
    .rnd-bx01 .desc strong{ font-size: 1.8rem;}
    .rnd-bx01 .desc span{ margin-top: 1rem;}
    .rnd-bx01 .desc span br{ display: none;}     
    .rnd-bx01 .desc strong{ font-size: 1.8rem;}
    .rnd-bx01 .desc span{ margin-top: 1rem;}
    .rnd-bx01 .thum li .ov{ height: auto; bottom: 0; top:0; padding: 4rem 0 0 0; font-size: 1.1rem; }
    .rnd-bx01 .thum li .ov::before{ display: none;}
    .rnd-bx01 .thum li .ov i{ width: 4rem; height: 4rem; margin-bottom: .5rem;}
    
    .rnd02-bx01{ display: block; width: 100%; }
    .rnd02-bx01 .tit-area2,
    .rnd02-bx02 .tit-area2{ width: 100%; display: block;}
    .rnd02-bx01 .tit-area2 .tit, 
    .rnd02-bx02 .tit-area2 .tit{ font-size: 2rem;}
    .rnd02-bx01 .tit-area2 .tit br,
    .rnd02-bx02 .tit-area2 .tit br{ display: none;}
    .rnd02-bx01 .desc01 .tbx{ margin-top: 1rem;}
    .rnd02-bx01 .desc01 .tbx strong{ font-size: 1.8rem; margin-bottom: 1rem;}
    .rnd02-bx01 .desc01 .tbx .ul-list01 li{ float: none; width: 100%;}
    .rnd02-bx01 .desc01 .item + .item{ margin-top: 3rem;}
    .rnd02-bx02{ margin-top: 5rem; display: block; width: 100%;}
    .rnd02-bx02 .desc01{ display: block;}
    .rnd02-bx02 .desc01 li{ width: 32.3%; margin-left: 1%; margin-bottom: 2rem;}
    .rnd02-bx02 .desc01 li p{ height: auto; padding: 1rem;}
    .rnd02-bx02 .desc01 li span{ font-size: 1.2rem; margin-top: 1rem;}
    
    .rnd03-slide{ padding: 0;}
    .rnd03-slide .prev,
    .rnd03-slide .next{ display: none;}
    .rnd03-slide .pag{ display: block; height: 3px; position: relative; margin-top: 2rem; background-color: #dbdbdb;}
    .rnd03-slide .pag .swiper-pagination-progressbar-fill{ background-color: #000;}
    
    .rnd03-bx01 .item{ width: 48%; margin-left: 4%; padding: 30px;}
    
    .careers-wr{ padding: 55px 5vw;}
    .careers-wr .blog-tit{ margin-bottom: 30px;}
    .careers-wr .tit-area2 .tit{ display: block; width: 100%; font-size: 2.2rem;}
    .careers-bx01{ width: 100%; display: block;}
    .careers-bx01 .tit-area2{ display: block;}
    .careers-bx01 .desc01{ display: block;}
    .careers-bx01 .desc01 li{ width: 33.3%;}
    .careers-bx01 .desc01 li p img{ width: 100%; display: block; max-width: 100%;}
    .careers-bx01 .desc01 li div{ margin-top: 1rem;}
    .careers-bx01 .desc01 li div b{ font-size: 1.8rem;}
    .careers-bx01 .desc01 li div b i{ font-size: 1.2rem;}
    .careers-bx01 .desc01 li div span{ margin-top: .5rem;}
    .careers-bx02 .tit-area2{ margin: 5rem 0 2rem;}
    .careers-bx02 .thum{ margin: 0 -5vw; width: calc(100vw); height: 54vw;}
    .careers-bx03{ margin-top: 5rem; width: 100%; display: block;}
    .careers-bx03 .tit-area2{ display: block;}
    .careers-bx03 .desc01 .item{ padding: 0 10px 0 80px; }
    .careers-bx03 .desc01 .item::before{ width: 60px; height: 60px; background-size: cover;}
    .careers-bx03 .desc01 .item dt{ font-size: 1.4rem;}
    .careers-bx03 .desc01 .item dd{ font-size: 1.3rem; margin-top: 1rem;}
    .careers-bx03 .desc01 .item dd br{ display: none;}
    
    .tbl-scroll{ width: 100%; overflow-x: auto;}
    table.data{ width: 84rem;}
    table.data .rnd0301{ width: 40rem;}
    table.data .rnd0302{ width: 14rem;}
    table.data .rnd0303,
    table.data .rnd0304,
    table.data .rnd0305{ width: 10rem;}
    
    .prod-bx01 .item{ width: 48%;}
    
    .prod-bx02{ margin-top: 5rem;}
    .prod-bx02 li{ padding: 1rem 0; display: block;}
    .prod-bx02 li b{ display: block; width: 100%; font-size: 1.4rem; text-align: left;}
    .prod-bx02 li div{ display: block; font-size: 1.3rem; padding: 0; margin-top: .6rem;}
    
    .prod-bx03 .b-thum{ width: 70%;}
    .prod-bx03 .b-thum img{ width: 100%; height: 480px; object-fit: cover; object-position: center;}
    .prod-bx03 .s-thum{ width: 28%; height: 480px;}
    .prod-bx03 .s-thum .swiper-slide img{ height: 105px;}
    
    .prod04-list .item{ width: 31.3%; margin: 0 0 2rem 3%;}
    .prod04-list .item:nth-child(5n+1){  float: left; clear: none; margin-left: 3%;}
    .prod04-list .item:nth-child(2n+1){  float: left; clear: none; margin-left: 3%;}
    .prod04-list .item:nth-child(3n+1){  margin-left: 0;}
    .prod04-list .item span{ margin-top: .5rem;}
    
    .ceo-bx .photo{ width: 200px;}
    .ceo-bx .desc{ padding: 0 0 0 30px;}
    
    .vision-bx .item .thumb{ width: 40%;}
    .vision-bx .item .desc{ padding: 0 0 0 30px; width: 60%;}
    
    .vision-bx2{ padding: 0 0 220px;}
    .vision-bx2 li{ padding-right: 10px;}
    .vision-bx2 li .desc span br{ display: none;}
    
    .history-bx .tit-area2{ margin-bottom: 2.5rem;}
    .history-bx .tit-area2 .right{ position: relative; margin-top: 1rem; font-size: 1.3rem;}
    .history-bx .tit-area2 .right a + a{ margin-left: 5px; padding-left: 5px;}
    .history-bx .item{ display: block; width: 100%;}
    .history-bx .item .thumb{ display: block; width: 100%;}
    .history-bx .item dl{ display: block; padding: 0 0 0 4.5rem; margin-top: 4rem;}
    .history-bx .item dl::after,
    .history-bx .item dl:last-child::after{ content: ''; display: block; background-color: #dbdbdb; width: 4px; height: 4px; border-radius: 50%; position: absolute; bottom: 0; left: .1rem;}
    .history-bx .item dl::before{ left: 3px; top: 1rem; bottom: 0;}
    .history-bx .item dl dt{ margin-bottom: 2.7rem;}
    .history-bx .item dl dt::before{ top: 1rem; left: -4.7rem; width: 10px; height: 10px;}
    .history-bx .item dl dt::after{ top: 1.3rem; left: -4.4rem; width: 4px; height: 4px;}
    .history-bx .item dl dd + dd{ margin-top: 1.7rem;}
    .history-bx .item + .item{ margin-top: 5rem;}
    
    .fin-grp-bx{ display: block;}
    .fin-grp-bx .item{ flex: none; width: 100%;}
    .fin-grp-bx .item + .item{ margin-left: 0;}
    .financial-graph.item-1{ left: 20%;}
    .financial-graph.item-2{ left: 30%;}
    .financial-graph.item-3{ left: 50%;}
    .financial-graph.item-4{ left: 70%;}
    
    .loc-bx .desc{ display: block;}
    .loc-bx .desc li{ display: block;}
    .loc-bx .desc li.addr{ width: 100%;}
    .loc-bx .desc li.traffic{ padding: 0; margin-top: 1rem; border-left: none;}	

	.pop-lay{ width:100%; padding:3rem;}
	.pop-lay .pop-tit{ font-size:2rem; line-height:1; height:auto; padding:1rem 0; margin-bottom:2rem;}
	.pop-lay .bt-close{ top:1rem; right:1rem;}
	.pop-lay .bt-close::before{ margin:0 0 0 -10px; width:22px; height:2px; }
	.pop-lay .bt-close::after{ margin:-11px 0 0 0; width:2px; height:22px; }
}

@media screen and (max-width:640px){    
    .tit-area{ margin-bottom: 16px;}
    .tit-area .h3-tit{ font-size: 2rem;}
    .tit-area .h3-tit.sm{ font-size: 1.8rem;}
    
    .tit-area2{ margin: 60px 0 10px;}
    .tit-area2 .tit{ font-size: 1.8rem;}
    .tit-area2 .tit.lg{ font-size: 2rem;}
    
    .soci-slide{ margin-bottom: 75px;}
    .soci-slide .ctl{ top: -48px;}
    .soci-slide .desc{ margin-top: 18px;}
    .soci-slide .desc strong{ font-size: 1.6rem;}
    .soci-slide .desc em{ margin-top: 13px; height: 40px;}
    
    .tit-area .tbl-sch{ margin-top: 10px; position: relative; top: auto; right: auto; width: 100%;}
    .tbl-hd .tbl-sch{ width: 100%;}
    
    .tbl-list table tbody td{ font-size: 1.3rem;}
    .tbl-list table thead{ display: none;}
    .tbl-list table .date{ display: none;}
    .tbl-list table tbody td.subject{ padding: 15px 0; font-size: 1.3rem;}
    .tbl-list table tbody td.subject .n{ margin-right: 15px;}    
    .tbl-list table .ir01{ display: none;}
    .tbl-list table .ir03{ width: 50px; padding: 0;}
    .tbl-list .noti02{ width: 90px; padding: 0;}
    .tbl-list table tbody .dw{ width: 24px; height: 24px; background-size: 12px;}
    
    .tbl-fin table{ }
    .tbl-fin table thead th{ font-size: 1.3rem; padding: 10px;}
    .tbl-fin table tbody th,
    .tbl-fin table tbody td{ font-size: 1.3rem; padding: 10px;}
    .tbl-fin table tbody td.fin02{ padding-left: 10px;}
    
    div.paging{ margin-top: 30px;}
    div.paging a, 
    div.paging strong{ font-size: 1.4rem; margin: 0 5px;}
    
    .tbl-view .hd{ padding: 18px 0; display: block;}
    .tbl-view .hd .subject{ display: block; font-size: 1.8rem;}
    .tbl-view .hd .subject .ic{ display: none;}
    .tbl-view .hd .date{ display: block; font-weight: 400; margin-top: 10px; font-size: 1.3rem; width: 100%; text-align: left;}
    .tbl-view .td-vew{ padding: 35px 0; font-size: 1.4rem;}
    .tbl-view .fileBx{ padding: 0;}
    .tbl-view .fileBx dt{ width: 85px; font-size: 1.5rem;}
    .tbl-view .fileBx dd{ margin-left: -5px; padding: 4px 0;}
    .tbl-view .fileBx dd a{ padding: 0 15px; height: 40px; line-height: 40px; font-size: 1.2rem; margin: 1px 0 1px 5px;}
    
    .viewBottomList ul{ display: block; padding: 0; font-size: 1.4rem;}
    .viewBottomList ul li{ display: table; table-layout: fixed; width: 100%; padding: 20px 0;}
    .viewBottomList ul li + li{ border-top: #dbdbdb 1px solid;}
    .viewBottomList ul li .orderPrev{ position: relative; top: auto; left: auto; width: 85px; display: table-cell;}
    .viewBottomList ul li .orderPrev::before{ display: none;}
    .viewBottomList ul li .orderNext{ position: relative; top: auto; right: auto; width: 85px; display: table-cell; text-align: left;}
    .viewBottomList ul li .orderNext::after{ display: none;}
    .viewBottomList ul li .title{ display: table-cell;}
    .viewBottomList .viewBottomNext::before{ display: none;}
    
    .letter-list .thumb i{ font-size: 1.3rem; padding: 15px 17px;}
    .letter-list .thumb img{ height: 240px; object-fit: cover; object-position: center;}
    .letter-list .desc strong{ font-size: 1.8rem;}
    .letter-list .desc em{ font-size: 1.4rem;}
    .letter-list .desc{ padding-top: 10px; padding-bottom: 0;}
    .letter-list .bd{ margin-left: -6%; margin-top: 0;}
    .letter-list .item{ width: 100%; margin: 16px 0 0 6%;}
    .letter-list .item .thumb i{ padding: 0 15px; line-height: 4rem;}
    .letter-list .item .thumb img{ width: 100%; height: 35vw !important; object-fit: cover; }
    .letter-list .item .desc strong{ font-size: 1.4rem;}
    .letter-list .item .desc em{ font-size: 1.2rem;}
    .letter-list .thumb em{ font-size: 1.2rem;}
    
    .blog-tit,
    .blog-tit.sm{ padding-left: 0; padding-top: 20px; margin-bottom: 30px;}
    .blog-tit::before,
    .blog-tit.sm::before{ top: 0; left: 0; height: 2px; width: 30px;}
    .blog-tit .tit{ font-size: 2rem;}
    .blog-tit p{ font-size: 1.3rem; margin-top: 5px;}
    .blog-tit.sm .tit{ font-size: 2rem;}
    
    .blog-hd{ margin-bottom: 30px; margin-top:0;}
	.blog-hd .thumb img{ margin-top:1rem;}
    .blog-hd .desc{ margin-top: 15px; padding:0;}
    .blog-hd .desc strong{ font-size: 1.8rem;}
    .blog-hd .desc span{ margin-top: 10px;}
    
    .letter-list.blog .bd{ margin-top: -20px;}
    .letter-list.blog .item .thumb i{ padding: 10px; font-size: 1.3rem;}
    .letter-list .desc{ padding: 10px 0 0;}
    
    .tbl-hd{ margin-bottom: 20px;}
    
    .div-tab{ padding-bottom: 10px; margin-bottom: 30px;}
    .div-tab li + li{ margin-left: 1rem;}
    .div-tab li a{ font-size: 1.4rem;}
    
    .privacy-bx{ padding: 15px; height: 150px;}
    .dv-chk{ margin-top: 10px;}
    
    .tbl-write .rowsBx{ font-size: 1.3rem;}
    .tbl-write .rowsBx .hd{ width: 120px; padding: 10px;}
    .tbl-write .rowsBx .bd{ padding: 5px 0;}
    .tbl-write .rowsBx .bd .input{ min-width: 100px; width: 100%;}
    .tbl-write .rowsBx .bd label{ height: 40px; line-height: 40px; margin: 0; min-width: 60px; width: auto; display: inline-block;}
    .tbl-write .rowsBx .bd label + input{ margin-left: 0;}
    .tbl-write .rowsBx .bd .textarea{ font-size: 1.3rem;}
    .tbl-write + .tbl-write{ margin-top: 50px;}
    
    .writeBx > li,
    .writeBx > li:nth-child(even){ width: 100%; float: none; padding-left: 0;}
    .writeBx > li .titTx{ width: 70px;}
    
    .tbl-write .fileBx{ padding: 45px 0 0 0;}
    .tbl-write .fileBx .btPlus{ top: 0; right: 0; width: 40px; height: 40px;}
    .filebox{ padding-right: 60px;}
    .filebox .upload-name{ height: 40px; line-height: 40px; padding: 0 10px; font-size: 1.3rem;}
    
    .process-bx01{ padding: 3rem 5vw; margin-bottom: 0;}
    .process-bx01 .tit{ font-size: 1.6rem; margin-bottom: 1rem;}
    .process-bx01 .process-thum{ width: 100%; margin-top: 2rem;}
    .process-bx01 + .process-bx01{ margin-top: 0;}
    
    .rnd-bx01 .desc{ margin: -3rem 1rem 0 0; padding: 2rem 1rem 0 0;}
    .rnd-bx01 .desc strong{ font-size: 1.8rem;}
    .rnd-bx01 .desc span{ margin-top: 1rem;}
    .rnd-bx01 .thum li .ov{ height: auto; bottom: 0; top:0; padding: 2rem 0 0 0; font-size: 1.1rem; }
    .rnd-bx01 .thum li .ov::before{ display: none;}
    .rnd-bx01 .thum li .ov i{ width: 4rem; height: 4rem; margin-bottom: .5rem;}
    
    .rnd02-bx01{ display: block; width: 100%; }
    .rnd02-bx01 .tit-area2,
    .rnd02-bx02 .tit-area2{ width: 100%; display: block;}
    .rnd02-bx01 .tit-area2 .tit, 
    .rnd02-bx02 .tit-area2 .tit{ font-size: 2rem;}
    .rnd02-bx01 .tit-area2 .tit br,
    .rnd02-bx02 .tit-area2 .tit br{ display: none;}
    .rnd02-bx01 .desc01 .tbx{ margin-top: 1rem;}
    .rnd02-bx01 .desc01 .tbx strong{ font-size: 1.8rem; margin-bottom: 1rem;}
    .rnd02-bx01 .desc01 .tbx .ul-list01 li{ float: none; width: 100%;}
    .rnd02-bx01 .desc01 .item + .item{ margin-top: 3rem;}
    
    .rnd02-bx02{ margin-top: 5rem; display: block; width: 100%;}
    .rnd02-bx02 .desc01{ display: block;}
    .rnd02-bx02 .desc01 li{ width: 32.3%; margin-left: 1%; margin-bottom: 2rem;}
    .rnd02-bx02 .desc01 li p{ height: auto; padding: 1rem;}
    .rnd02-bx02 .desc01 li span{ font-size: 1.2rem; margin-top: 1rem;}
    
    .rnd03-slide{ padding: 0;}
    .rnd03-slide .prev,
    .rnd03-slide .next{ display: none;}
    .rnd03-slide .pag{ display: block; height: 3px; position: relative; margin-top: 2rem; background-color: #dbdbdb;}
    .rnd03-slide .pag .swiper-pagination-progressbar-fill{ background-color: #000;}
    
    .rnd03-bx01 .item{ float: none; width: 100%; padding: 2.5rem; min-height: auto; margin-left: 0; margin-bottom: 2rem;}
    .rnd03-bx01 .item dt{ font-size: 1.4rem;}
    .rnd03-bx01 .item dd{ font-size: 1.3rem; margin-top: 1rem;}
    
    .prod-bx01 .item{ float: none; width: 100%;}
    .prod-bx01 .item b{ margin-top: 1rem; font-size: 1.5rem;}
    .prod-bx01 .item + .item{ float: none; margin-top: 3rem;}
    
    .prod-bx02{ margin-top: 5rem;}
    .prod-bx02 li{ padding: 1rem 0; display: block;}
    .prod-bx02 li b{ display: block; width: 100%; font-size: 1.4rem; text-align: left;}
    .prod-bx02 li div{ display: block; font-size: 1.3rem; padding: 0; margin-top: .6rem;}
    
    .prod-bx03 .b-thum{ width: 100%; float: none;}
    .prod-bx03 .s-thum{ width: 100%; height: auto; float: none; margin-top: 1rem;}
    .prod-bx03 .s-thum .swiper-slide img{ height: 60px;}
    
    .prod02-slide .ctl{ margin: 1.5rem;}
    .prod02-slide .swiper-slide{ width: 25rem;}
    .prod02-slide .swiper-slide .thumb{ padding-top: 1.5rem;}
    .prod02-slide .swiper-slide .thumb b{ left: 1.5rem; height: 5rem; width: 6.5rem; line-height: 5rem; font-size: 1.3rem;}
    .prod02-slide .swiper-slide .desc{ margin-top: 1.5rem;}
    .prod02-slide .swiper-slide .desc strong{ font-size: 1.7rem;}
    .prod02-slide .swiper-slide .desc span{ font-size: 1.3rem; margin-top: 1rem;}
    
    .prod03-bx02{ padding-bottom: 3rem;}
    .prod03-bx02::before{ top: 3rem;}
    .prod03-bx02 .desc{ margin-top: 2rem;}
    .prod03-bx02 .desc strong{ font-size: 1.3rem; margin-bottom: .5rem;}
    .prod03-bx02 .desc span{ font-size: 1.2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
    .prod03-bx02 .pag{ display: block; height: 3px; position: relative; margin-top: 2rem; background-color: #dbdbdb;}
    .prod03-bx02 .pag .swiper-pagination-progressbar-fill{ background-color: #000;}
    
    .prod03-bx01 li{ width: 50%;}
    .prod03-bx01 li .thum img{ width: 8rem; }
    .prod03-bx01 li .desc{ margin-top: 1rem;}
    .prod03-bx01 li .desc i{ font-size: 1.3rem;}
    .prod03-bx01 li .desc span{ font-size: 1.3rem; padding: 0 2rem;}
    .prod03-bx01 li .desc span br{ display: none;}
    .prod03-bx01 li + li .desc{ border-left: none;}
    .prod03-bx01 li:nth-child(even) .desc{ border-left: #dbdbdb 1px solid;}
    
    .prod04-list .item{ width: 48%; margin: 0 0 2rem 4%;}
    .prod04-list .item:nth-child(5n+1){  float: left; clear: none; margin-left: 4%;}
    .prod04-list .item:nth-child(2n+1){  margin-left: 0;}
    .prod04-list .item span{ font-size: 1.3rem; margin-top: .5rem;}
    
    .careers-wr{ padding: 55px 5vw;}
    .careers-wr .blog-tit{ margin-bottom: 30px;}
    .careers-wr .tit-area2 .tit{ display: block; width: 100%; font-size: 2.2rem;}
    .careers-bx01{ width: 100%; display: block;}
    .careers-bx01 .tit-area2{ display: block;}
    .careers-bx01 .desc01{ display: block;}
    .careers-bx01 .desc01 li{ float: none; width: 100%;}
    .careers-bx01 .desc01 li + li{ margin-top: 3rem;}
    .careers-bx01 .desc01 li p img{ width: 100%; display: block; max-width: 100%;}
    .careers-bx01 .desc01 li div{ margin-top: 1rem;}
    .careers-bx01 .desc01 li div b{ font-size: 1.8rem;}
    .careers-bx01 .desc01 li div b i{ font-size: 1.2rem;}
    .careers-bx01 .desc01 li div span{ margin-top: .5rem;}
    .careers-bx02 .tit-area2{ margin: 5rem 0 2rem;}
    .careers-bx02 .thum{ margin: 0 -5vw; width: calc(100vw); height: 54vw;}
    .careers-bx03{ margin-top: 5rem; width: 100%; display: block;}
    .careers-bx03 .tit-area2{ display: block;}
    .careers-bx03 .desc01 .item{ padding: 50px 1rem 0; margin-bottom: 2rem; text-align: center;}
    .careers-bx03 .desc01 .item::before{ width: 40px; height: 40px; left: 50%; margin-left: -20px; background-size: cover;}
    .careers-bx03 .desc01 .item dt{ font-size: 1.4rem;}
    .careers-bx03 .desc01 .item dd{ font-size: 1.3rem; margin-top: 1rem;}
    .careers-bx03 .desc01 .item dd br{ display: none;}
    
    .tbl-scroll{ width: 100%; overflow-x: auto;}
    table.data{ width: 84rem;}
    table.data thead th{ font-size: 1.4rem; padding: 1.5rem 0;}
    table.data tbody td{ font-size: 1.3rem; padding: 1.2rem 0;}
    table.data tbody td.l{ padding-left: 2rem;}
    table.data .rnd0301{ width: 40rem;}
    table.data .rnd0302{ width: 14rem;}
    table.data .rnd0303,
    table.data .rnd0304,
    table.data .rnd0305{ width: 10rem;}
    
    .btZoom{ display: block; text-align: center; margin-top: 3rem; color: #000; font-weight: 600; font-size: 1.5rem;}
    .btZoom::after{ content: ''; display: block; width: 22px; height: 10px; background: url(../images/ic_zoom.png) 50% 50% no-repeat; background-size: 100% auto; margin: 1rem auto 0;}
    
    .ceo-bx{ display: block; }
    .ceo-bx .photo{ width: 100%; display: block; text-align: center;}
    .ceo-bx .desc{ display: block; width: 100%; padding: 0; margin-top: 3rem;}
    .ceo-bx .desc .tx01{ font-size: 2rem; margin-bottom: 2rem;}
    .ceo-bx .desc p{  font-size: 1.4rem;}
    .ceo-bx .desc p + p{ margin-top: 2rem;}
    .ceo-bx .desc p .br{ display: none;}
    
    .vision-bx{ padding-bottom: 4rem;}
    .vision-bx::before{ top: 10rem;}
    .vision-bx .item{ width: 100%; }
    .vision-bx .item .thumb{ width: 100vw;  margin: 0 -5vw; float: none;}
    .vision-bx .item .desc{ width: 100%; padding: 2rem 0 0 0;}
    .vision-bx .item .desc strong{ font-size: 2rem;}
    .vision-bx .item .desc span{ font-size: 1.3rem;}
    .vision-bx .item + .item{ margin-top: 3rem;}
    
    .vision-bx2{ padding: 0 0 55px 0; margin-bottom: -55px;}
    .vision-bx2 li{ margin: 3rem 0 0 0 ; float: none; width: 100%;  padding: 0 0 0 7.5rem;}
    .vision-bx2 li i{  width:4.5rem; display: block;}
    .vision-bx2 li .desc strong{ font-size: 1.8rem;}
    .vision-bx2 li .desc span{ margin-top: .5rem; font-size: 1.4rem;}
    .vision-bx2 li .desc span br{ display: none;}
    
    .history-bx .tit-area2{ margin-bottom: 2.5rem;}
    .history-bx .tit-area2 .right{ position: relative; margin-top: 1rem; font-size: 1.3rem;}
    .history-bx .tit-area2 .right a + a{ margin-left: 5px; padding-left: 5px;}
    .history-bx .item{ display: block; width: 100%;}
    .history-bx .item .thumb{ display: block; width: 100%;}
    .history-bx .item dl{ display: block; padding: 0 0 0 4.5rem; margin-top: 4rem;}
    .history-bx .item dl::after,
    .history-bx .item dl:last-child::after{ content: ''; display: block; background-color: #dbdbdb; width: 4px; height: 4px; border-radius: 50%; position: absolute; bottom: 0; left: .1rem;}
    .history-bx .item dl::before{ left: 3px; top: 1rem; bottom: 0;}
    .history-bx .item dl dt{ font-size: 2.5rem; margin-bottom: 2.7rem;}
    .history-bx .item dl dt::before{ top: 1rem; left: -4.7rem; width: 10px; height: 10px;}
    .history-bx .item dl dt::after{ top: 1.3rem; left: -4.4rem; width: 4px; height: 4px;}
    .history-bx .item dl dd{ font-size: 1.5rem;}
    .history-bx .item dl dd + dd{ margin-top: 1.7rem;}
    .history-bx .item + .item{ margin-top: 5rem;}
    
    .history-bx2{ margin: 0; padding-bottom: 0;}
    .history-bx2::before{ display: none;}
    .history-bx2 .item{ padding: 0; float: none; margin: 0;}
    .history-bx2 .item .desc{ margin-top: 1.5rem;}
    .history-bx2 .item .desc strong{ font-size: 1.3rem;}
    .history-bx2 .item .desc span{ font-size: 1.2rem;}
    .history-bx2 .pag{ display: block; height: 3px; position: relative; margin-top: 2rem; background-color: #dbdbdb;}
    .history-bx2 .pag .swiper-pagination-progressbar-fill{ background-color: #000;}
    
    .loc-bx .map{ height: 30rem;}
    .loc-bx .tit-area2{ margin: 3rem 0 1rem;}
    .loc-bx .desc{ display: block; }
    .loc-bx .desc li{ display: block; width: 100%;  font-size: 1.4rem;}
    .loc-bx .desc li.addr{ width: 100%;}
    .loc-bx .desc li.traffic{ padding: 0; margin-top: 1rem; border-left: none;}
    
    .fin-grp-bx{ display: block;}
    .fin-grp-bx .item{ flex: none; width: 100%;}
    .fin-grp-bx .item + .item{ margin-left: 0;}
    .financial-graph.item-1{ left: 20%;}
    .financial-graph.item-2{ left: 30%;}
    .financial-graph.item-3{ left: 50%;}
    .financial-graph.item-4{ left: 70%;}

	.pop-lay{ width:100%; padding:3rem;}
	.pop-lay .pop-tit{ font-size:2rem; line-height:1; height:auto; padding:1rem 0; margin-bottom:2rem;}
	.pop-lay .bt-close{ top:1rem; right:1rem;}
	.pop-lay .bt-close::before{ margin:0 0 0 -10px; width:22px; height:2px; }
	.pop-lay .bt-close::after{ margin:-11px 0 0 0; width:2px; height:22px; }
}

/* main */
.section{ height: 100vh; background-color: #000;}
.section .tit{ font-size: 70px; font-family: 'Montserrat', 'Noto Sans KR'; letter-spacing: -.05em; color: #fff;}
.daeho{font-size:54px;}

.index-slide{ overflow: hidden;}
.index-slide .swiper-slide{ position: relative;  height: 100vh; overflow: hidden;}
.index-slide .swiper-slide .bg{ height: 100vh; background-color: #000; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}
.index-slide .swiper-slide.slide01 .bg{ background-image: url(../images/main_visual01.jpg);}
.index-slide .swiper-slide.slide02 .bg{ background-image: url(../images/main_visual02.jpg);}
.index-slide .swiper-slide.slide03 .bg{ background-image: url(../images/main_visual03.jpg);}
.index-slide .swiper-slide.slide04 .bg{ background-image: url(../images/main_visual04.jpg);}
.index-slide .swiper-slide .bg{ position:absolute; top:0; right:0; left:0; bottom:0;  background-position:50% 50%; background-repeat:no-repeat; background-size:cover; 	
	opacity: 0;
	transform: scale(1.15, 1.15);
	-ms-transform: scale(1.15, 1.15);
	-webkit-transform: scale(1.15, 1.15);
	-moz-transform: scale(1.15, 1.15);
	-webkit-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: opacity 2s cubic-bezier(0.4, 0, 0.2, 1), transform 5s cubic-bezier(0.4, 0, 0.2, 1);
}
.index-slide .swiper-slide.swiper-slide-active .bg{
	opacity: 1;
	transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
}

.main-copy{ position: absolute; top: 50%; left: 0; width: 100%; margin-top: -140px; color: #fff; z-index: 3;}
.main-copy .mv-mn{ text-align: center; }
.main-copy .mv-mn a{ position: relative; font-size: 84px; font-weight: 700; margin: 0 10px; display: inline-block; color: rgba(255,255,255,.5); line-height: 1; letter-spacing: 0; font-family: 'Montserrat', 'Noto Sans KR';}
.main-copy .mv-mn a::before{ content: ''; height: 28px; width: 0; display: block ;position: absolute; bottom: -10px; left: 0; background-color: #009cff; z-index: -1;  -webkit-transition: all 0.6s ease-in-out;-moz-transition: all 0.6s ease-in-out;-ms-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out; transition:all 0.6s ease-in-out;}
.main-copy .mv-mn a.mv-mn01::before{ background-color: #dbdbd9;}
.main-copy .mv-mn a.mv-mn02::before{ background-color: #009cff;}
.main-copy .mv-mn a.mv-mn03::before{ background-color: #ff6600;}
.main-copy .mv-mn a.on,
.main-copy .mv-mn a.n4{ color: rgba(255,255,255,1);}
.main-copy .mv-mn a.on::before{ width: 100%;}
.main-copy .mv-tx{ margin-top: 30px; text-align: center; color: #fff; font-size: 21px;}
.main-copy .mv-tx b{ color: #009cff;}
.main-copy .mv-num{ position: relative; margin: 50px auto 0; width: 68px;}
.main-copy .mv-num span{ width: 68px; height: 68px; line-height: 68px; font-family: 'Montserrat', 'Noto Sans KR'; font-weight: 700; display: block; position: absolute; top: 0; left: 0; text-align: center;}

.section .cotl{ bottom: 40px; right: 8vw; position: absolute; white-space: nowrap; z-index: 9;}
.section .cotl a{ display: inline-block; width: 22px; height: 22px; background-repeat: no-repeat; background-position: 50% 50%; margin: 0 4px;}
.section .cotl a span{ position: absolute; top: -9999px; left: -9999px;}
.section .cotl a.prev{ background-image: url(../images/main_prev.png);}
.section .cotl a.next{ background-image: url(../images/main_next.png);}
.section .cotl a.stop{ background-image: url(../images/main_stop.png); display: none;}
.section .cotl a.play{ background-image: url(../images/main_play.png); display: none;}
.section .cotl a.stop.on,
.section .cotl a.play.on{ display: inline-block;}
.section .cotl .pag{ vertical-align: 5px; font-family: 'Montserrat', 'Noto Sans KR'; width: 50px; text-align: center; display: inline-block; color: #fff; line-height: 22px; margin-left: 10px;}
.section .cotl .pag .swiper-pagination-current{ font-weight: 600;}

.bar{ position: fixed; right: 60px; top: 50%; margin-top: -125px; z-index: 8;}
.bar i{ position: relative; width: 1px; height: 220px; display: block; background-color: #fff;}
.bar .btNext{ position: absolute; bottom: -30px; height: 10px; left: 50%; margin-left: -5px; width: 10px; display: none;}
.bar .btNext::after{ content: ''; position: absolute; top: 0; left: 0; border-top: #fff 5px solid; border-left: transparent 5px solid; border-right: transparent 5px solid; }
.bar .btPrev{ position: absolute; top: -20px; height: 10px; left: 50%; margin-left: -5px; width: 10px; display: none;}
.bar .btPrev::after{ content: ''; position: absolute; top: 0; left: 0; border-bottom: #fff 5px solid; border-left: transparent 5px solid; border-right: transparent 5px solid; }
.bar .btNext span,
.bar .btPrev span{ position: absolute; top: -9999px; left: -9999px;}
.bar .btNext.on,
.bar .btPrev.on{ display:block;}
.bar i::after{ content: ''; display: block; width: 1px; position: absolute; top: 0; left: 0;  background-color: #009cff; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
.fp-viewing-main01 .bar i::after{ height: 35%;}
.fp-viewing-main02 .bar i::after{ height: 65%;}
.fp-viewing-main03 .bar i::after{ height: 100%;}
.fp-viewing-main04 .bar i::after{ height: 100%;}
/*.fp-viewing-main05 .bar i::after{ height: 100%;}*/

.main-quick{ position: fixed; bottom: 0; left: 50%; z-index: 8; margin-left: -600px; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
.fp-viewing-main04 .main-quick{ bottom: -100px; }
.main-quick::after{ content: ''; display: block; clear: both;}
.main-quick a{ position: absolute; bottom: 0; left: 0; display: block; width: 190px; height: 100px; background: #fff; float: left; padding: 25px 40px 0; font-family: 'Montserrat', 'Noto Sans KR'; font-size: 13px; vertical-align: bottom;}
.main-quick a strong{ display: block; color: #009cff; font-size:18px; font-weight: 600;}
.main-quick a.letter{ left: 190px; width: 250px; background-color: #009cff; color: #fff;}
.main-quick a.letter strong{ color: #fff;}
.main-quick a::after{ content: ''; display: block; width: 29px; height: 14px; position: absolute; right: 80px; bottom: 40px; background: url(../images/ic_aw.png); opacity: 0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
.main-quick a.letter::after{ background: url(../images/ic_aw1.png);}
.main-quick a:hover{ height: 150px;}
.main-quick a:hover::after{ opacity: 1; right: 40px; }
.main-quick a.inq::after{ right:auto; left:80px; transform: rotate(-180deg);}
.main-quick a.inq:hover::after{ opacity: 1; right: auto; left:40px;}

.section.section02{ background: url(../images/main_section02.jpg) 50% 50% no-repeat; background-size: cover; }
.section.section02 ul{ text-align: center; width: 1140px; margin: 0 auto;}
.section.section02 ul li{ position: relative; float: left; width: 33.3%; text-align: center; color: #fff; font-family: 'Montserrat', 'Noto Sans KR';}
.section.section02 ul li + li::before{ content: ''; position: absolute; top: 35px; left: 0; display: block; width: 1px; height: 100px; background: #fff; opacity: .32;}
.section.section02 ul li .num b{ font-size: 100px; font-weight: 500; display: block; line-height: 1; letter-spacing: -.05em;}
.section.section02 ul li .num span{ font-size: 20px; display: block;}
.section.section02 ul li .desc{ margin-top: 40px;}
.section.section02 ul li .desc b{ display: block; font-size: 26px; font-weight: 600;}
.section.section02 ul li .desc span{ display: block; font-size: 16px; margin-top: 10px; font-weight: 200;}

.section.section03{ background: url(../images/main_section03.jpg) 50% 50% no-repeat; background-size: cover;}
.section.section03 .conBx{ padding-left: 18vw; display: inline-flex; width: 100%;}
.section.section03 .conBx .titArea{ flex: none; width: 680px;}
.section.section03 .conBx .titArea .tit{ text-shadow: 0 0 10px rgba(0,0,0,.3); letter-spacing: 0; line-height: 1.2;}
.section.section03 .titArea p{ color: #fff; font-size: 20px; margin-top: 30px; font-weight: 200;}
.section.section03 .slide-bx{ width: calc(100% - 680px); overflow: hidden;}
.section.section03 .slide-bx .swiper-slide{ width: 440px;}
.section.section03 .slide-bx .thumb{ box-shadow: 10px 10px 10px rgba(0,0,0,.1);}
.section.section03 .slide-bx .thumb img{ display: block;}
.section.section03 .slide-bx .desc{ padding: 40px 0; color: #fff; border-bottom: #fff 3px solid;}
.section.section03 .slide-bx .desc strong{ font-size: 30px; display: block;}
.section.section03 .slide-bx .desc span{ display: block; margin-top: 20px; font-size: 18px; line-height: 1.7;}
/*
.section.section04{ background: url(../images/main_section04.jpg) 50% 50% no-repeat; background-size: cover;}
.section.section04 .conBx{ color: #fff; padding: 30vh 0 0 51vw;}
.section.section04 .conBx .slide-bx{ overflow: hidden;}
.section.section04 .conBx .slide-bx .swiper-slide *{ opacity: 0;}
.section.section04 .conBx .slide-bx .swiper-slide .tit{ letter-spacing: 0;}
.section.section04 .conBx .slide-bx .swiper-slide:nth-child(3) .tit{ letter-spacing: -.05em;}
.section.section04 .conBx .slide-bx .swiper-slide-active *{ opacity: 1;}
.section.section04 .conBx p{ margin-top: 30px; font-size: 20px;}
.section.section04 .conBx ul{ margin-top: 120px;}
.section.section04 .conBx ul::after{ content: ''; display: block; clear: both;}
.section.section04 .conBx ul li{ position: relative; float: left; width: 200px; float: left; font-family: 'Montserrat', 'Noto Sans KR'; padding: 0 0 20px 0; letter-spacing: -.05em;}
.section.section04 .conBx ul li + li{ margin-left: 40px;}
.section.section04 .conBx ul li.item02{ width: 150px;}
.section.section04 .conBx ul li.item03{ width: 210px;}
.section.section04 .conBx ul li a{ position: relative; display: block; color: #fff; padding: 0 0 0 40px; font-size: 16px; line-height: 1; white-space: nowrap;}
.section.section04 .conBx ul li.item02 a{ font-weight: 600;}
.section.section04 .conBx ul li::before{ content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background-color: #fff; opacity: .25; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
.section.section04 .conBx ul li a::before{ content: ''; display: block; width: 20px; height: 20px; position: absolute; top: 50%; margin-top: -10px; left: 0;}
.section.section04 .conBx ul li.item01 a::before{ background-image: url(../images/main04_ic01.png);}
.section.section04 .conBx ul li.item02 a::before{ background-image: url(../images/main04_ic02.png);}
.section.section04 .conBx ul li.item03 a::before{ background-image: url(../images/main04_ic03.png);}
.section.section04 .conBx ul li a::after{ content: ''; display: inline-block; width: 20px; height: 16px; background: url(../images/aw_next_w.png) 50% 50% no-repeat; margin-left: 0; opacity: 0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
.section.section04 .conBx ul li:hover::before,
.section.section04 .conBx ul li.on::before{ opacity: 1; }
.section.section04 .conBx ul li:hover a::after,
.section.section04 .conBx ul li.on a::after{ opacity: 1; margin-left: 25px;}
*/
.section.footer{ background-color: #242225;}


.ir-ifm{ width:750px; height:720px; margin:0 auto; display:block;}

@media screen and (min-width:640px) and (max-width:1200px){

    .section.section02 ul{ width: 100%; padding: 0 5.5vw;}
    .section.section02 ul li{ width: 100%;  display: table; table-layout: fixed; float: none; padding: 3rem 0;}
    .section.section02 ul li + li{ border-top: #fff 1px solid;}
    .section.section02 ul li + li::before{ display: none; }
    .section.section02 ul li .num{ width: 15rem; display: table-cell; vertical-align: middle;}
    .section.section02 ul li .num b{ font-size: 4.8rem;}
    .section.section02 ul li .num span{ font-size: 1.4rem;}
    .section.section02 ul li .desc{ margin: 0; display: table-cell; vertical-align: middle; text-align: left;}
    .section.section02 ul li .desc b{ font-size: 1.4rem;}
    .section.section02 ul li .desc span{ font-size: 1.1rem; margin-top: .5rem;	}
}

@media screen and (min-width:641px) and (max-width:1023px){   
    .bar{ top: auto; margin: 0; width: 3.2rem; height: 3.2rem; right: 5.5vw; bottom: 3.5rem;}
    .bar i{ display: none;}
    .bar .btNext{ position: relative; bottom: auto; left: auto; display: block; margin: 0; width: 3.2rem; height: 3.2rem; background-color: #009cff; border-radius: 50%;}
    .bar .btNext::after{ border:none; border-top: #fff 2px solid; border-left: #fff 2px solid; display: block; position: absolute; top: 50%; left: 50%; margin: -.5rem 0 0 -.4rem; width: .8rem; height: .8rem; transform: rotate(-135deg);}
    
    .main-quick{ display: none;}
    
    .section .cotl{ left: 5.5vw; right: auto; bottom: 3.5rem;}
    .section .cotl .pag{ float: left; margin-left: 0; margin-right: .5rem;}
	.main-copy .mv-mn a{font-size:68px;}

	

	
    .section.section03 .conBx{ display: block; padding: 0;}
    .section.section03 .conBx .titArea{ width: 100%;}
    .section.section03 .conBx .titArea .tit{ font-size: 2.9rem; text-align: center; line-height: 1.2; font-weight: 500;}
	.daeho{font-size:3.2rem;}
    .section.section03 .titArea p{ font-size: 1.1rem; text-align: center; margin-top: .5rem;}
    .section.section03 .slide-bx{ width: 61vw; margin: 2rem auto 0; overflow: visible;}
    .section.section03 .slide-bx .swiper-slide{ width: 100%; text-align:center;}
    .section.section03 .slide-bx .desc{ padding: 1.3rem 0 0 0; border-bottom: none;}
    .section.section03 .slide-bx .desc strong{ font-size: 1.8rem;}
    .section.section03 .slide-bx .desc span{ font-size: 1.2rem; margin-top: 1rem;}
    .section.section03 .slide-bx .desc span br{ display: none;}
	.section.section03 .slide-bx .thumb img{display:inline-block;}
}

@media screen and (max-width:640px){      
    .bar{ top: auto; margin: 0; width: 3.2rem; height: 3.2rem; right: 5.5vw; bottom: 3.5rem; display: none;}
    .bar i{ display: none;}
    .bar .btNext{ position: relative; bottom: auto; left: auto; display: block; margin: 0; width: 3.2rem; height: 3.2rem; background-color: #009cff; border-radius: 50%;}
    .bar .btNext::after{ border:none; border-top: #fff 2px solid; border-left: #fff 2px solid; display: block; position: absolute; top: 50%; left: 50%; margin: -.5rem 0 0 -.4rem; width: .8rem; height: .8rem; transform: rotate(-135deg);}
    
    .mv-num{ display: none;}
    .main-quick{ right: 0; bottom: 0; left: auto; margin-left: 0; width: 300px; height: 50px;}
    .main-quick a{ height: 50px; padding: .6rem 1.2rem 0; width: 13rem; font-size: 1.2rem; left: auto; right: 13rem;}
    .main-quick a:hover{ height:  80px;}
    .main-quick a::after { bottom: 8px;}
    .main-quick a.letter{ width: 13rem; right: 0; left: auto;}
    .main-quick a strong{ font-size: 1.5rem;}
    
    /*.index-slide .swiper-slide.slide01 .bg{ background-image: url(../images/main_visual01_m.jpg);}
    .index-slide .swiper-slide.slide03 .bg{ background-image: url(../images/main_visual03_m.jpg);}
    .index-slide .swiper-slide.slide04 .bg{ background-image: url(../images/main_visual04_m.jpg);}*/
    
    .main-copy{ padding-top: 0rem; top:calc(50% + 10rem); width:50%;}
    .main-copy .mv-mn{ width: 18.5rem; padding: 0; margin-left: 5.5vw;}
    .main-copy .mv-mn a{ font-size: 4.2rem; display: block; text-align: left; margin: 0; padding: 0;}
    .main-copy .mv-mn a::before{ height: 1.5rem;}
    .main-copy .mv-mn a + a{ margin-top: 1.5rem;}
    .main-copy .mv-tx{ font-size: 1.4rem; width: calc(100% - 10vw); padding: 0; margin-left: 5.5vw; text-align: left; white-space:nowrap;}
    
    .section .cotl{ left: 5.5vw; right: auto; bottom: 8.5rem;}
    .section .cotl .pag{ float: left; margin-left: 0; margin-right: .5rem;}
    
    /*.section.section02{ background-image: url(../images/main_section02_m.jpg);}*/
    .section.section02 ul{ width: 100%; padding: 0 5.5vw;}
    .section.section02 ul li{ width: 100%;  display: table; table-layout: fixed; float: none; padding: 3rem 0;}
    .section.section02 ul li + li{ border-top: #fff 1px solid;}
    .section.section02 ul li + li::before{ display: none; }
    .section.section02 ul li .num{ width: 15rem; display: table-cell; vertical-align: middle;}
    .section.section02 ul li .num b{ font-size: 4.3rem;}
    .section.section02 ul li .num span{ font-size: 1.4rem;}
    .section.section02 ul li .desc{ margin: 0; display: table-cell; vertical-align: middle; text-align: left;}
    .section.section02 ul li .desc b{ font-size: 2.0rem;}
    .section.section02 ul li .desc span{ font-size: 1.3rem; margin-top: .5rem;}
    
    /*.section.section03{ background-image: url(../images/main_section03_m.jpg);}*/
    .section.section03 .conBx{ display: block; padding: 0;}
    .section.section03 .conBx .titArea{ width: 100%;}
    .section.section03 .conBx .titArea .tit{ font-size: 3.5rem; text-align: center; line-height: 1.2; font-weight: 500;}
	.daeho{font-size:3.5rem;}
    .section.section03 .titArea p{ font-size: 1.2rem; text-align: center; margin-top: .5rem;}
    .section.section03 .slide-bx{ width: 61vw; margin: 2rem auto 0; overflow: visible;}
    .section.section03 .slide-bx .swiper-slide{ width: 100%; }
    .section.section03 .slide-bx .desc{ padding: 1.3rem 0 0 0; border-bottom: none;}
    .section.section03 .slide-bx .desc strong{ font-size: 2.2rem;}
    .section.section03 .slide-bx .desc span{ font-size: 1.4rem; margin-top: 1rem;}
    .section.section03 .slide-bx .desc span br{ display: none;}
    
    /*.section.section04{ background-image: url(../images/main_section04_m.jpg);}*/
    .section.section04 .conBx{ padding: 0 5.5vw;}
    .section .tit{ font-size: 3.3rem;}
    .section.section04 .conBx p{ font-size: 1.3rem; margin-top: 1rem; width: 50%;}
    .section.section04 .conBx ul{ margin-top: 8rem; padding: 0 0 0 50%;}
    .section.section04 .conBx ul li{ width: 12rem; padding-bottom: 1rem;}
    .section.section04 .conBx ul li.item02{ width: 8rem;}
    .section.section04 .conBx ul li.item03{ width: 13rem;}
    .section.section04 .conBx ul li::before{ height: 2px;}
    .section.section04 .conBx ul li a{ font-size: 1.6rem; padding-left: 2rem;}
    .section.section04 .conBx ul li + li{ margin: 1.4rem 0 0 0;}
    .section.section04 .conBx ul li a::before{ width: 1rem; height: 1rem; margin-top: -.5rem; background-size: 100%;}
    .section.section04 .conBx ul li a::after{ display: none;}
        
	.ir-ifm{ width:100%;}
}


.circular-chart {
  display: block;
  margin: 0 auto;
  width: 68px;
  height: 68px;
}

.circle {
  stroke: #fff;
  fill: none;
  stroke-width: 1;
  stroke-linecap: round;
  stroke-dasharray:100 100;  
}
.circle.on{ 
	animation: progress 5s ease-out;
	animation-delay: 0; animation-fill-mode: forwards;
	-webkit-animation: progress 5s ease-out;
	-webkit-animation-delay: 0; -webkit-animation-fill-mode: forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
  100% {
    stroke-dasharray: 100 100;
  }
}
@-webkit-keyframes progress {
  0% {
    -webkit-stroke-dasharray: 0 100;
  }
  100% {
    -webkit-stroke-dasharray: 100 100;
  }
}



/*		 2021.02.17 tail 아이콘 4개 추가		 */


.copy_icon{position:relative; max-width:1200px; margin:0 auto;}
.tail_img{float:right; margin:15px 25px 0 0;}
.tail_img a{float:left; width:24px; height:24px; margin-right:6px;}
.tail_img a img{clear:both; width:24px; height:24px;}

@media screen and (max-width: 1024px) {
	.tail_img{display:none;}
}

/*		 2021.02.17 tail 아이콘 4개 추가		 */

/* 페이징 */
.pg_wrap {clear:both;display:inline-block}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {text-align:center}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;background:#eee;border:1px solid #eee}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {color:#959595;font-size:1.2em;height:50px;line-height:50px;padding:0 5px;min-width:50px;text-decoration:none;border-radius:5px}
.pg_page:hover {background-color:#fafafa}
.pg_start {text-indent:-999px;overflow:hidden;background:url('../img/btn_first.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('../img/btn_prev.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_end {text-indent:-999px;overflow:hidden;background:url('../img/btn_end.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_next {text-indent:-999px;overflow:hidden;background:url('../img/btn_next.gif') no-repeat 50% 50% #eee;padding:0;border:1px solid #eee}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover {background-color:#fafafa}

.pg_current {display:inline-block;background:#3a8afd;border:1px solid #3a8afd;color:#fff;font-weight:bold;height:50px;font-size:1.2em;line-height:50px;padding:0 10px;min-width:50px;border-radius:5px}



@media screen and (max-width:463px){
	#bo_w #wr_password, #bo_w #wr_homepage{ margin-left:0px !important;}
}



@media screen and (max-width: 840px) {
	.btn {min-width: 0px;}
	.bo_fx{display:block;}	
	.pg_wrap {clear:both;float:left;display:inline-block}
	.pg_page {color:#959595;font-size:1.083em;height:30px;line-height:28px;padding:0 5px;min-width:30px;text-decoration:none;border-radius:3px}
	.pg_current {display:inline-block;font-size:1.083em;background:#3a8afd;border:1px solid #3a8afd;color:#fff;font-weight:bold;height:30px;line-height:30px;padding:0 10px;min-width:30px;border-radius:3px}
}



@media screen and (max-width: 1140px) {
	td.list_num1{display:none;}
	td.list_num2{width:90%; padding:15px;}
	td.list_num3{display:none;}
	td.list_num4{display:none;}
	td.list_num5{display:none;}
	td.list_num6{width:10%; padding:15px;}

	th.list_num1{display:none;}
	th.list_num2{width:90%; padding:15px;}
	th.list_num3{display:none;}
	th.list_num4{display:none;}
	th.list_num5{display:none;}
	th.list_num6{width:10%; padding:15px;}
}



.td_num2 .notice_icon{color:#009cff;}

.write_div .rowsBx {height:100px; line-height:100px;}


/* 캡챠 자동등록(입력)방지 기본 -pc */
#captcha {display:inline-block;position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
#captcha #captcha_img {height:40px;border:1px solid #898989;vertical-align:top;padding:0;margin:0}
#captcha #captcha_mp3 {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat;text-indent:-999px;border-radius:3px}
#captcha #captcha_reload {margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat  0 -40px;text-indent:-999px;border-radius:3px}
#captcha #captcha_key {margin:0 0 0 3px;padding:0 5px;width:90px;height:40px;border:1px solid #ccc;background:#fff;font-size:1.333em;font-weight:bold;text-align:center;border-radius:3px;vertical-align:top}
#captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}

/* 캡챠 자동등록(입력)방지 기본 - mobile */
#captcha.m_captcha audio {display:block;margin:0 0 5px;width:187px}
#captcha.m_captcha #captcha_img {width:160px;height:60px;border:1px solid #e9e9e9;margin-bottom:3px;margin-top:5px;display:block;}
#captcha.m_captcha #captcha_reload {position:static;margin:0;padding:0;width:40px;height:40px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;background:url('../../../img/captcha2.png') no-repeat  0 -40px;text-indent:-999px}
#captcha.m_captcha #captcha_reload span{display:none;}
#captcha.m_captcha #captcha_key {margin:0;padding:0 5px;width:115px;height:29px;border:1px solid #b8c9c2;background:#f7f7f7;font-size:1.333em;font-weight:bold;text-align:center;line-height:29px;margin-left:3px}
#captcha.m_captcha #captcha_info {display:block;margin:5px 0 0;font-size:0.95em;letter-spacing:-0.1em}
#captcha.m_captcha #captcha_mp3 {width:31px;height:31px;background:url('../../../img/captcha2.png') no-repeat 0 0 ;  vertical-align:top;overflow:hidden;cursor:pointer;text-indent:-9999px;border:none}

/* 기본박스 */
.mbskin{position: relative;margin:100px auto 0;border:1px solid #ddd;width:400px;background:#fff;text-align:center;
}
.mbskin:before,.mbskin:after{
content:"";
position:absolute;z-index:-1;top:2%;bottom:0;left:10px;right:10px;
-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
  -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
       box-shadow:0 0 20px rgba(0,0,0,0.8);
-moz-border-radius:100px / 10px;
     border-radius:100px / 10px;}
.mbskin:after{right:10px;left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);}
.mbskin .frm_input{width:100%}
.mbskin .btn_submit{width:100%;margin:10px 0 0;height:45px;font-weight:bold;font-size:1.25em}
.mbskin  h1{margin: 60px 0 30px;font-size: 2em;}



.btn_submit {border:0;background:#253dbe;color:#fff;cursor:pointer;border:0}
.btn_submit:hover {background:#0025eb}


/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

/* 아이디/비밀번호 찾기 */
#find_info #mb_hp_label {display:inline-block;margin-left:10px}
#find_info p {line-height:1.5em}
#find_info #mb_email{margin:10px 0;}

/* 로그인 */
#mb_login {}
#login_fs{padding:0 50px}
#mb_login #login_fs .frm_input{margin:0 0 10px}
#mb_login #login_fs .btn_submit {margin:0 0 20px}
#mb_login #login_info{background:#f6f6f6;padding:25px 10px;border-top:1px solid #e8e8e8;margin:40px 0 0 }
#mb_login #login_info:after {display:block;visibility:hidden;clear:both;content:""}
#mb_login #login_info h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#mb_login #login_info a{display:inline-block;width:49.8%;float:left}
#login_password_lost{border-right:1px solid #ddd}

#mb_login_notmb{margin:30px auto;padding:20px 30px }
#mb_login_notmb h2{font-size:1.25em;margin:20px 0 10px}
#guest_privacy{border:1px solid #ccc;text-align:left;line-height:1.6em;color:#666;background:#fafafa;padding:10px;height:150px;margin:10px 0;overflow-y:auto}
#mb_login_notmb .btn_submit{display:block;text-align:center;line-height:45px}

#mb_login_od_wr{margin:30px auto;padding:20px 30px }
#mb_login_od_wr h2{font-size:1.25em;margin:20px 0 10px}
#mb_login_od_wr .frm_input{margin:10px 0 0 }
#mb_login_od_wr p{background:#f3f3f3;margin:20px 0 0 ;padding:15px 20px;line-height:1.5em}