﻿/**
 * 수정내역 : 
 * 16.10.16 #exchage_output 추가.
 */
@charset "utf-8";

/******************   메인 비주얼   ******************/
*{box-sizing:border-box}
#main{width:100%; margin-bottom:160px}
.main_bg{position:relative; background:url(../images/main/visual.jpg) no-repeat center top; overflow:hidden;margin-bottom:160px}
.slogan{width:1200px; height:300px; text-indent:-9999px; overflow:hidden; background:url(../images/main/main_slogan.png) no-repeat 30px 123px; margin:70px auto 0 }
.slogan.eng{width:1200px; height:300px; text-indent:-9999px; overflow:hidden; background:url(../images/main/main_slogan_en.png) no-repeat 30px 150px; margin:70px auto 0 }
.slogan.chn{width:1200px; height:300px; text-indent:-9999px; overflow:hidden; background:url(../images/main/main_slogan_ch.png) no-repeat 30px 123px; margin:70px auto 0 }
.slogan.jpn{width:1200px; height:300px; text-indent:-9999px; overflow:hidden; background:url(../images/main/main_slogan_jp.png) no-repeat 30px 123px; margin:70px auto 0 }



@media screen and (max-width:1200px){
.slogan, .slogan.eng, .slogan.chn, .slogan.jpn{width:960px;}
.main_bg{position:relative; background:url(../images/main/visual_960.jpg) no-repeat center top; overflow:hidden; margin-bottom:160px}
}

@media screen and (max-width:960px){
#main{ margin-bottom:0px}
.main_bg{background:none; margin-bottom:30px}
.slogan{width:100%;height:300px;  background:url(../images/main/m_visual.jpg) no-repeat left bottom;margin:0; background-size: cover}
.slogan.eng{width:100%;height:300px;  background:url(../images/main/m_visual_en.jpg) no-repeat left bottom;margin:0; background-size: cover}
.slogan.chn{width:100%;height:300px;  background:url(../images/main/m_visual_ch.jpg) no-repeat left bottom;margin:0; background-size: cover}
.slogan.jpn{width:100%;height:300px;  background:url(../images/main/m_visual_jp.jpg) no-repeat left bottom;margin:0; background-size: cover}
}

/******************   열   ******************/
#line1,#line2,#line3,#line4,#line5{overflow:hidden; position:relative}
#line1{width:1200px; height:300px; margin:0 auto}
#line2{width:1200px; height:300px; margin:0 auto}
#line3{width:1200px; height:300px; margin:0 auto}
#line4{width:100%; height:400px; margin-top:-100px}
#line5{width:1200px; height:300px; margin:0 auto}


@media screen and (max-width:1200px){
#line1{width:960px; height:240px;}
#line2{width:960px; height:240px;}
#line3{width:960px; height:240px;}
#line4{width:100%; height:340px;}
#line5{width:960px; height:240px;}
}


@media screen and (max-width:960px){
#line1{width:100%; height:auto;}
#line2{width:100%; height:100%; overflow:hidden}
#line3{width:100%; height:auto;}
#line4{width:100%; height:50vw; margin:0}
#line5{width:100%; height:auto; overflow:hidden}
}



/******************   컨텐츠1   ******************/

.con1{width:600px; height:300px;float:left; position:relative; overflow:hidden}
.con1 strong{ width:100%; text-align:leftr; font-size:25px; color:#fff; font-weight:500; margin:70px 0 0 0; float:left;}
.con1 a{ color:#fff;}

.con1 .textbox {position:relative;  display:inline-block; vertical-align:middle; height:40px;border:1px solid #000; background:#fff; box-sizing:border-box; margin-top:20px}
.con1 .textbox label {position: absolute;top: 1px;left: 1px;color: #999;cursor: text; font-size:16px; line-height:36px; text-indent:12px;}
@media screen and (max-width:960px){
.con1 .textbox label { font-size:13px}
}

.con1 .textbox input[type="text"],.textbox input[type="password"] {
  width: 460px;
  height: 38px;
  border: 0 none;
  float:left;
  box-sizing:border-box;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  text-indent:12px;
}

.con1 .tag{ margin-top:15px; overflow:hidden}
.con1 .tag span{ color:#fff; text-transform:uppercase; letter-spacing:1px; display:block; border-right:1px solid rgba(255,255,255,0.20); width:40px; float:left; font-weight:600}
.con1 .link{ float:left; width:500px; margin:-4px 0 0 0; padding-left:10px}
.con1 .link a{ margin:0 10px 0 0; line-height:25px; letter-spacing:-0.5px}
.con1 .link a:hover{ text-decoration:underline}

.con1 .link.en a{ font-size:13px; line-height:20px}


@media screen and (max-width:1200px){
.con1 strong{ width:100%; text-align:leftr; font-size:20px; color:#fff; font-weight:500; margin:40px 0 0 0; float:left;}
.con1 .textbox input[type="text"],.textbox input[type="password"] {  width: 350px;  }
.con1 .link{ float:left; width:370px;}

.con1 .link.en a{ font-size:12px; line-height:18px}
}

@media screen and (max-width:960px){
.con1{width:100%; height:100%;float:left; position:relative; overflow:hidden; background-color:#056939; padding:8%; box-sizing:border-box;}
.con1 .tag span{ width:10%; overflow:hidden; border:0 none}
.con1 .btnSearch{ float:right}
.con1 strong{margin:0px 0 0 0;}
.con1 .textbox {width:100%;margin:20px auto 0 auto}
.con1 .textbox input[type="text"],.textbox input[type="password"] {width: 70%;}
.con1 .link{  width:90%; margin:-1px 0 0 0; padding-left:10px}
.con1 .link a{ font-size:12px;line-height:20px; letter-spacing:0}
}


/******************   컨텐츠2   ******************/

.con2{width:300px; height:100%;float:left; background:url(../images/main/con2_bg.jpg) no-repeat 0 bottom; position:relative}
.con2 strong{ position:absolute; width:100%; text-align:center; font-size:25px; top:105px; color:#fff; font-weight:500}
.con2 a{ position:absolute; width:120px; height:35px; line-height:32px; text-indent:20px;font-size:14px; top:160px; color:#fff; font-weight:500; left:50%; margin-left:-60px; border:1px solid #fff; background:url(../images/main/btn_arrow_white.png) no-repeat 95px center; display:block}
.con2.en a{width:180px; height:35px;margin-left:-90px;background:url(../images/main/btn_arrow_white.png) no-repeat 160px center;}
.con2.ch a{width:110px; height:35px;margin-left:-55px;background:url(../images/main/btn_arrow_white.png) no-repeat 90px center;}
.con2.jp a{width:120px; height:35px;margin-left:-60px;background:url(../images/main/btn_arrow_white.png) no-repeat 100px center;}
.con2 a:hover{ background-color:rgba(0,0,0,0.20)}
@media screen and (max-width:1200px){
.con2{width:240px;}
.con2 strong{top:80px; color:#fff; font-weight:500}
.con2 a{top:120px}
}

@media screen and (max-width:960px){
.con2{width:100%;height:50vw;background:url(../images/main/con2_bg.jpg) no-repeat center bottom; background-size:cover}
.con2 strong{top:50%; margin-top:-35px}
.con2 a{top:50%; margin-top:5px}

}


/******************   컨텐츠3   ******************/

.con3{width:600px; height:100%; background:#000;float:left; position:relative}
.con3.en{ background:url(../images/main/con3.png)}
.con3.en strong{ position:absolute; width:100%; text-align:center; font-size:25px; top:105px; color:#fff; font-weight:500}
.con3.en a{ position:absolute; width:120px; height:35px; line-height:32px; text-indent:20px;font-size:14px; top:160px; color:#fff; font-weight:500; left:50%; margin-left:-60px; border:1px solid #fff; background:url(../images/main/btn_arrow_white.png) no-repeat 95px center; display:block}
.con3.en a{width:180px; height:35px;margin-left:-90px;background:url(../images/main/btn_arrow_white.png) no-repeat 160px center;}


.con3.ch{ background:url(../images/main/con3.png)}
.con3.ch strong{ position:absolute; width:100%; text-align:center; font-size:25px; top:105px; color:#fff; font-weight:500}
.con3.ch a{ position:absolute; width:120px; height:35px; line-height:32px; text-indent:20px;font-size:14px; top:160px; color:#fff; font-weight:500; left:50%; margin-left:-60px; border:1px solid #fff; background:url(../images/main/btn_arrow_white.png) no-repeat 95px center; display:block}
.con3.ch a{width:110px; height:35px;margin-left:-55px;background:url(../images/main/btn_arrow_white.png) no-repeat 90px center;}



.con3.jp{ background:url(../images/main/con3.png)}
.con3.jp strong{ position:absolute; width:100%; text-align:center; font-size:25px; top:105px; color:#fff; font-weight:500}
.con3.jp a{ position:absolute; width:120px; height:35px; line-height:32px; text-indent:20px;font-size:14px; top:160px; color:#fff; font-weight:500; left:50%; margin-left:-60px; border:1px solid #fff; background:url(../images/main/btn_arrow_white.png) no-repeat 95px center; display:block}
.con3.jp a{width:120px; height:35px;margin-left:-60px;background:url(../images/main/btn_arrow_white.png) no-repeat 95px center;}


.con3 a:hover{ background-color:rgba(0,0,0,0.20)}

.con3 h4{color:#fff; font-size:16px; font-weight:400; top:120px; left:50px; display:block; z-index:9999;WIDTH:80%}
.con3 h5{top:185px; left:50px; font-size:24px; font-weight:500}
.con3 span{top:230px; left:50px; font-family:'lato'; font-size:15px;}
.con3 h4:after{content:""; background:#333333; width:20px; height:1px; display:block;margin-right:20px; margin-top:20px;}


.con3 .rsABlock.txt1 {display: block; top:200px; left:50px;}
.con3 .rsABlock.txt1 h5{color:#fff; font-size:24px !important; font-weight:400 !important}
.con3 .rsABlock.txt2 {display: block; top:240px; left:50px}
.con3 .rsABlock.txt2 span{color:#fff; font-size:15px !important; letter-spacing:0.5px}



@media screen and (max-width:1200px){	
.con3{width:480px; float:left}
.con3 h4{color:#fff; font-size:16px !important; font-weight:400; top:90px; left:30px; display:block; z-index:9999;WIDTH:80%}
.con3 h5{top:150px; left:30px; font-size:24px !important; font-weight:500}
.con3 span{top:190px; left:30px; font-family:'lato'; font-size:15px !important;}
.con3 h4:after{content:""; background:#333333; width:20px; height:1px; display:block;margin-right:20px; margin-top:20px;}

.con3.en strong{top:80px; color:#fff; font-weight:500}
.con3.en a{top:120px}

.con3.ch strong{top:80px; color:#fff; font-weight:500}
.con3.ch a{top:120px}

.con3.jp strong{top:80px; color:#fff; font-weight:500}
.con3.jp a{top:120px}
}


@media screen and (max-width:960px){
.con3{width:100%; height:auto}
.con3 h4{color:#fff; font-size:1.5em; font-weight:400; top:25%; left:8%; display:block; z-index:9999}
.con3 h5{top:47%;  left:8%; font-size:2.2em; font-weight:500}
.con3 span{top:65%;  left:8%; font-family:'lato'; font-size:1.5em;}
.con3 h4:after{content:""; background:#333333; width:5%; height:1px; display:block;margin-right:0; margin-top:4%;}

}

/******************   컨텐츠4   ******************/

.con4{width:1260px; height:100%; position:absolute; top:0; left:50%; margin-left:-960px}
.con4 img{ margin-top:-100px}
.con4 h4{ position:absolute; display:block; top:190px; z-index:9999; overflow:hidden; width:300px; text-align:center; right:0; color:#7e7e7e;}
.con4 .more{display:block !important; text-align:left; border:1px solid #d5d5d5; text-indent:20px; width:120px; height:35px; box-sizing:border-box; line-height:32px; color:#000; background:url(../images/main/btn_arrow_black.png) no-repeat 92px center; font-size:14px; font-weight:500;position: absolute;
z-index: 1;
top: 180px;
left: 90px;}

.con4 .more.eng{width:180px; background:url(../images/main/btn_arrow_black.png) no-repeat 160px center; z-index: 1;top: 180px; left: 60px;}
.con4 .more.chn{width:110px; background:url(../images/main/btn_arrow_black.png) no-repeat 90px center; z-index: 1;top: 180px; left: 50%; margin-left:-55px}


#slider-with-blocks-2 {width:100%;}

.con4 .rsContent {color: #FFF;font-size: 24px;line-height: 32px;float: left;}
.con4 .bContainer {position: relative; width:300px; height:300px; float:right; background:#fff}
.con4 .rsABlock {display: block;}
.con4 .blockHeadline {font-size: 26px;line-height: 50px; color:#000; font-weight:500; top:115px !important}
.con4 .blockHeadline.en {font-size: 24px;line-height: 50px; color:#000; font-weight:500; top:115px !important}
.con4 .txtCent {text-align: center; width: 100%; }
.con4 .bContainer {top:100px}

@media screen and (max-width:1200px){	
.con4 h4{width:240px; top:160px}
.con4 .blockHeadline {top:80px !important}
.con4 .blockHeadline.en {font-size: 20px;line-height: 50px; color:#000; font-weight:500; top:100px !important}
.con4 .more{top: 140px;left: 60px;}
.con4 .more.eng{top: 120px;left: 50%; font-size:12px}
.con4 .more.chn{top: 140px; margin-left:-55px}
.con4 .more.jp{top: 140px; margin-left:-55px}
}


.photoCopy {position: absolute;line-height: 24px;font-size: 12px;background: black;color: white;background-color: rgba(0, 0, 0, 0.75);padding: 0px 10px;position: absolute;left: 12px;bottom: 12px;top: auto;border-radius: 2px;z-index: 25;}
.photoCopy a {color: #FFF;}
.palmImg {left: 0;top: auto;bottom: -60px;position: absolute;}


@media screen and (max-width:1200px){	
.con4 h4{width:240px; top:180px}
.con4{width:1200px; height:100%; position:absolute; top:0; left:50%; margin-left:-960px}
.con4 .bContainer {width:240px; height:240px}
.con4 .blockHeadline { font-size:16px; top:50% !important; margin:-25px 0 0 0}
.con4 .blockHeadline.en { font-size:16px; top:50% !important; margin:-30px 0 0 0}
.con4 .more{top: 145px;}
.con4 .more.eng{top: 140px;left: 50%; font-size:12px; margin:0 0 0 -80px; width:160px; background:url(../images/main/btn_arrow_black.png) no-repeat 140px center}
.con4 .more.chn{top: 140px; margin-left:-55px}
.con4 .more.jp{top: 140px; margin-left:-55px}
}

@media screen and (max-width:960px){
.con4 h4{width:48vw; top:50%; left:50%; font-size:14px; margin:-50px 0 0 0}
.con4{width:100%; height:50vw; margin:0; position: absolute; left:00}	
.con4 .bContainer {width:50%; height:100%; margin:0; top:0}
.con4 .blockHeadline { font-size:16px; top:50% !important; margin:-35px 0 0 0}
.con4 .blockHeadline.en { font-size:16px; top:50% !important; margin:-35px 0 0 0}
.con4 .more{ font-size:13px;top:50%;left:50%; margin:20px 0 0 -60px}
.con4 .more.eng{top: 50%;left: 50%; font-size:12px; margin:0 0 0 -80px; width:160px; background:url(../images/main/btn_arrow_black.png) no-repeat 140px center; margin-top:15px}
.con4 .more.chn{top: 50%; margin-left:-55px; margin-top:15px}
.con4 .more.jp{top: 50%; margin-left:-55px; margin-top:15px}

.con4 .slide1{ background-position:-150px bottom !important; background-size:100% !important; background-color:#5f564b !important}
.con4 .slide2{ background-position:-350px bottom !important; background-size:170% !important; background-color:#5f564b !important}
}





/******************   컨텐츠8   ******************/
.con8 {width:600px; height:100%; float:left; background:url(../images/main/icon3.png) no-repeat center bottom #fff500;}
.con8 a{width:100%; height:100%; line-height:34px; font-size:26px; color:#fff; display:block; text-align:center; font-weight:500; padding:98px 50px 50px}


@media screen and (max-width:1200px){	
.con8 {width:480px; background-size:100%}	
.con8 a{line-height:170px; font-size:20px}
}


@media screen and (max-width:960px){
.con8{width:100%;height: 50vw; background-size: 100%;background-color: #fff500;}
.con8.en{background: url(../images/main/m_icon3_en.jpg) no-repeat 0 top;background-size: 100%;}
.con8.ch{background: url(../images/main/m_icon3_cn.jpg) no-repeat 0 top;background-size: 100%;}
.con8.jp{background: url(../images/main/m_icon3_jp.jpg) no-repeat 0 top;background-size: 100%;}
.con8 a{text-indent: -9999px; overflow: hidden;}

}


/******************   컨텐츠5   ******************/

.con5{width:600px; height:100%;  float:left; border-left:1px solid #d5d5d5; box-sizing:border-box; padding:0 50px 0 50px}
.con5 h3{ font-size:26px; font-weight:500; color:#000; margin:60px 0 30px 0; border-bottom:1px  solid #d5d5d5; padding:0 0 20px 0px; display:block; position:relative; text-indent:20px}
.con5 h3 hr{width:135px; height:1px; backface-visibility:#000; position:absolute; bottom:-1px; margin:0; padding:0}
.con5 a.more{ display:block; border:1px solid #d5d5d5; text-indent:38px; width:135px; height:35px; box-sizing:border-box; line-height:32px; color:#000; background:url(../images/main/btn_arrow_black.png) no-repeat 87px center; font-size:14px; font-weight:500; float:left}

.con5 ul{ float:left; margin-left:50px; overflow:hidden}
.con5 ul li{ line-height:32px}
.con5 ul li a{ font-size:16px}
.con5 ul li a:hover{ text-decoration:underline; color:#056939}


@media screen and (max-width:1200px){
.con5{width:480px;  padding:0 50px; position:relative}	
.con5 h3{ margin:50px 0 20px 0; }
.con5 a.more{ position:absolute; top:40px; right:50px}
.con5 ul{margin-left:20px}
.con5 ul li{line-height:30px}
}


@media screen and (max-width:960px){
.con5{width:100%; padding:8%;}
.con5 h3{ font-size:20px;text-indent:0;margin: 0px 0 20px 0;}
.con5 h3 hr{width:73px; height:1px; backface-visibility:#000; position:absolute; bottom:-1px; margin:0; padding:0}
.con5 ul{margin-left:0px}
.con5 ul li a{ font-size:15px}
.con5 a.more{right:8%;top:9%; width:80px;  background:url(../images/main/btn_arrow_black.png) no-repeat 58px center; text-indent:15px; font-size:13px;}
}


/******************   컨텐츠6   ******************/

.con6{width:300px; height:100%; float:left; background:url(../images/main/icon1.png) no-repeat center bottom #fff500;}
.con6 a{width:100%; height:100%; line-height:230px; font-size:26px; color:#000; display:block; text-align:center; font-weight:500}


@media screen and (max-width:1200px){	
.con6{width:240px; background-size:100%}	
.con6 a{line-height:170px; font-size:20px}
}


@media screen and (max-width:960px){
.con6{width: 50%;height: 47vw;background: url(../images/main/m_icon1.jpg) no-repeat 0 top;background-size: 100%;background-color: #fff500;}
.con6.en{background: url(../images/main/m_icon1_en.jpg) no-repeat 0 top;background-size: 100%;}
.con6.ch{background: url(../images/main/m_icon1_cn.jpg) no-repeat 0 top;background-size: 100%;}
.con6.jp{background: url(../images/main/m_icon1_jp.jpg) no-repeat 0 top;background-size: 100%;}
.con6 a{text-indent: -9999px; overflow: hidden;}
/*.con6 a{ text-indent:-9999px; overflow:hidden}*/
}


/******************   컨텐츠7   ******************/

.con7{width:300px; height:100%; float:left; background:url(../images/main/icon2.png) no-repeat 0 bottom #06693a;}
.con7 a{width:100%; height:100%; line-height:230px; font-size:26px; color:#fff; display:block; text-align:center; font-weight:500}

@media screen and (max-width:1200px){	
.con7{width:240px; background-size:100%}	
.con7 a{line-height:170px; font-size:20px}
}


@media screen and (max-width:960px){
.con7{width: 50%;height: 47vw;background: url(../images/main/m_icon2.jpg) no-repeat 0 top;background-size: 100%;background-color: #fff500;}
.con7.en{background: url(../images/main/m_icon2_en.jpg) no-repeat 0 top;background-size: 100%;}
.con7.ch{background: url(../images/main/m_icon2_cn.jpg) no-repeat 0 top;background-size: 100%;}
.con7.jp{background: url(../images/main/m_icon2_jp.jpg) no-repeat 0 top;background-size: 100%;}
.con7 a{text-indent: -9999px; overflow: hidden;}
/*.con7 a{text-indent:-9999px; overflow:hidden}*/
}



.text_area{width:100%; height:100%; background:url(../images/main/main_text.png) no-repeat 50px center; text-indent:-999px; overflow:hidden; border-left:1px solid #d5d5d5; margin-left:300px;}

.text_area p{display:block; height:100%}
.bg_img{ display:none}
.text_area.en{width:100%; height:100%; background:url(../images/main/main_text_eng) no-repeat 50px center; text-indent:-999px; overflow:hidden; border-left:1px solid #d5d5d5; margin-left:300px;}
.text_area.en.bg_img{ display:none} 

.text_area.ch{width:100%; height:100%; background:url(../images/main/main_text_chn) no-repeat 50px center; text-indent:-999px; overflow:hidden; border-left:1px solid #d5d5d5; margin-left:300px;}
.text_area.ch.bg_img{ display:none} 

.text_area.jp{width:100%; height:100%; background:url(../images/main/main_text_jpn) no-repeat 50px center; text-indent:-999px; overflow:hidden; border-left:1px solid #d5d5d5; margin-left:300px;}
.text_area.jp.bg_img{ display:none} 


@media screen and (max-width:1200px){
.text_area{margin-left:240px;}
}


@media screen and (max-width:960px){
.text_area{height:auto;margin-left:0 !important; background:url(../images/main/line3_bg.png) no-repeat; background-size:100%}
.text_area p{ display:none !important}
.bg_img{ display:block}
}



/******************   스티키   ******************/
#swap1600{}
#swap960{display:none}
.sticky{position:absolute; width:1200px;height:200px;bottom:200px; left:50%; margin-left:-600px; z-index:999999}
.fix{position:fixed; width:1200px; height:70px; bottom:0; left:50%; margin:0 0 0 -600px;z-index:9999;}

@media screen and (max-width:1200px){
.sticky{width:960px; margin-left:-480px; }
}

.weather{float:right; background:#fff; width:300px; height:150px; margin-top:50px; box-sizing:border-box; border-top:1px solid #e4e4e4; border-right:1px solid #e4e4e4; position:relative;text-align:center;}
.weather .wrap{ overflow:hidden; display:inline-block; margin-top:45px;}
.weather .wt_icon{ float:left}
.weather em{font-size:52px; color:#000; font-family:'lato'; font-weight:600; font-style:inherit; float:left; padding-left:20px; display:block; line-height:52px}
.weather em:before{ content:""; background:#e4e4e4; width:1px; height:28px; display:block;float:left; margin-right:20px; margin-top:15px}
.weather span{display:block; float:left; overflow:hidden; width:20px; height:25px; text-indent:-99px; background:url(../images/main/Celsius.png) no-repeat;}

@media screen and (max-width:1200px){
.weather{width:240px;}
.weather em{font-size:40px;}
}

.weather2{background:#fff; width:263px;  height:70px;  position: absolute;text-align:center; top:0; right:0}
.weather2 .wrap{ overflow:hidden; display:inline-block; }
.weather2 .wt_icon{ float:left; margin-top:16px}
.weather2 em{font-size:34px; color:#000; font-family:'lato'; font-weight:600; font-style:inherit; float:left; padding-left:20px; display:block; line-height:70px}
.weather2 em:before{ content:""; background:#c0c0c0; width:1px; height:20px; display:block;float:left; margin-right:20px; margin-top:25px}
.weather2 span{display:block; float:left; overflow:hidden; width:20px; height:25px; text-indent:-99px; background:url(../images/main/Celsius.png) no-repeat;margin-top:15px}
/*.weather em:after{ content:""; background: url(../images/main/Celsius.png) no-repeat; width:20px; height:25px; display:block; position:absolute; top:10px; left:80px}*/

.exchange2{ position:absolute; height:70px; left:145px; top:0}
.ex_block{ display:none}
.ex_block2 ul{}
.ex_block2 ul li{ float:left; margin:0 0 0 30px;display:flex; line-height:70px; color:#4f4f4f; font-size:14px; height:70px}
.ex_block2 ul li span{ color:#000; font-weight:500; font-size:14px; height:100%; line-height:70px}
.ex_block2 ul li span:before{content:""; background:#c0c0c0; width:10px; height:1px; display:block;float:left; margin:35px 7px 0 }
.ex_block2  img{ margin-top:27px; margin-right:5px;}

@media screen and (max-width:1200px){
.ex_block{ display:block}
.ex_block2{display:none}
}

.tabs {position:relative}
.tabs::after {clear:both;}
.tab {float:left;}
.tab-switch {display:none;}
.tab-label{display:block;line-height:47px;width:300px;height:50px;background:#fff;color:#000;cursor:pointer;top:0;text-align:center; border:1px solid #e4e4e4;border-bottom:0 none; box-sizing:border-box; font-size:18px; font-weight:400}
.tab-content{width:900px;height:150px;position:absolute;z-index:1;top:50px;left:0;background:#fff;color:#2c3e50;border:1px solid #e4e4e4; border-bottom:0 none; text-align:center}
.tab-switch:checked + .tab-label {background:#000;color: #fff;z-index: 1;font-weight:500}
.tab-switch:checked + label + .tab-content {z-index: 2;}
@media screen and (max-width:1200px){
.tab-content{width:720px;}
.tab-label{width:240px;}
}

.way_textbox {position:relative;  display:inline-block; vertical-align:middle; height:50px;border:1px solid #e4e4e4; background:#fff; box-sizing:border-box; margin-top:50px}
.way_textbox label {position: absolute;top: 0px;left: 0px;color: #000;cursor: text; font-size:16px; line-height:46px; text-indent:50px; background:url(../images/main/way_search_icon.png) no-repeat 20px 14px}
.way_textbox input[type="text"],.textbox input[type="password"] {
  width: 650px;
  height: 48px;
  border: 0 none;
  float:left;
  box-sizing:border-box;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  text-indent:12px;
}
@media screen and (max-width:1200px){
.way_textbox input[type="text"],.textbox input[type="password"] {width: 500px;}
}

.sticky_default{ position:relative; overflow:hidden}
.sticky_default{ position:relative; overflow:hidden}
.sticky_default h3{ display:block; width:145PX; height:70PX; text-indent:-999PX; overflow:hidden; background:url(../images/main/sticky_title.png) no-repeat center; position:absolute; top:0; left:0}
.sticky_default.en h3{ display:block; width:145PX; height:70PX; text-indent:-999PX; overflow:hidden; background:url(../images/main/sticky_title_en.png) no-repeat center; position:absolute; top:0; left:0}
.sticky_default.ch h3{ display:block; width:145PX; height:70PX; text-indent:-999PX; overflow:hidden; background:url(../images/main/sticky_title_ch.png) no-repeat center; position:absolute; top:0; left:0}
.sticky_default.jp h3{ display:block; width:145PX; height:70PX; text-indent:-999PX; overflow:hidden; background:url(../images/main/sticky_title_jp.png) no-repeat center; position:absolute; top:0; left:0}
.way_textbox2 {position: absolute; top:16px; right:263px;  height:37px;border:1px solid #e4e4e4; background:#fff; box-sizing:border-box; overflow:hidden}
.way_textbox2 label {position: absolute;top: 0px;left: 0px;color: #000;cursor: text; font-size:14px; line-height:33px; text-indent:35px; background:url(../images/main/way_search_icon.png) no-repeat 10px 7px}
.way_textbox2.en label { font-size:11px; text-indent:30px;}
.way_textbox2 input[type="text"],.textbox input[type="password"] {
  width: 196px;
  height: 37px;
  border: 0 none;
  float:left;
  box-sizing:border-box;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  text-indent:12px;
}


@media screen and (max-width:1200px){
.way_textbox2 input[type="text"],.textbox input[type="password"] {width: 210px;}
}
#exchange_input{
  width: 167px;
  height: 50px;
  box-sizing:border-box;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  border:1px solid #e4e4e4;
  text-align:right;
  padding-right:15PX;
  float:left;
  font-size:18px;
  border-left:0 none
}
#exchange_output{
  width: 167px;
  height: 50px;
  box-sizing:border-box;
  border-radius: 0;  /* iSO 둥근모서리 제거 */
  outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */
  -webkit-appearance: none;  /* 브라우저별 기본 스타일링 제거 */
  -moz-appearance: none;
  appearance: none;
  border:1px solid #e4e4e4;
  text-align:right;
  padding-right:15PX;
  float:left;
  font-size:18px;
  border-left:0 none
}
@media screen and (max-width:1200px){
#exchange_input{width: 120px;  font-size:15px;}
#exchange_output{width: 120px;  font-size:15px;}
}
.ex_arrow{ float:left; margin:15px 15px}
.ex_wrap{position:relative;  display:inline-block; vertical-align:middle; height:50px; background:#fff; box-sizing:border-box; margin-top:50px}
.btnEx{ margin-left:20px; background:url(../images/main/exchange_btn.png) no-repeat center; width:150px; height:50px ; text-indent:-999px; overflow:hidden}
.btnEx.en{ margin-left:20px; background:url(../images/main/exchange_en_btn.png) no-repeat center; width:150px; height:50px ; text-indent:-999px; overflow:hidden}
.btnEx.ch{ margin-left:20px; background:url(../images/main/exchange_cn_btn.png) no-repeat center; width:150px; height:50px ; text-indent:-999px; overflow:hidden}
.btnEx.jp{ margin-left:20px; background:url(../images/main/exchange_jp_btn.png) no-repeat center; width:150px; height:50px ; text-indent:-999px; overflow:hidden}
@media screen and (max-width:1200px){
.btnEx{ margin-left:10px; width:100px; height:50px }
.btnEx.en{ margin-left:10px; width:100px; height:50px }
.btnEx.ch{ margin-left:10px; width:100px; height:50px }
.btnEx.jp{ margin-left:10px; width:100px; height:50px }
}


#select{position: relative;width: 125px;height: 50px; background:url(../images/main/exchange_select_arrow.png) 90px center no-repeat; background-color:#FFF;border: 1px solid #e4e4e4;display:inline-block;vertical-align:middle;}
#select label {position: absolute;font-size: 16px;color: #454545;top: 16px;left: 12px;}
#select select#search {width: 100%;height: 50px;min-height: 50px;line-height: 50px;opacity:0;filter: alpha(opacity=0); /* IE 8 */; box-sizing:border-box}
#select.focus{border-color: #000;}

.sticky_default{ overflow:hidden; background:#fff; width:100%; height:100%}


/***********************************
 * 환율 SELECT
 ***********************************/
 
html, body{ margin:0; padding:0}
*{ box-sizing:border-box}
.wSelect-el {width: 0px;height: 0px;padding: 0px;margin: 0px;border: none;overflow: hidden; visibility:hidden; display:none}
.wSelect {position: relative;display: inline-block;*display: inline; zoom: 1; vertical-align: middle;cursor: pointer;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}
.wSelect-arrow {position: absolute;width: 30px;right: 0px;top: 0px;height: 100%;background-repeat: no-repeat;background-position: 0px center;}
.wSelect.wSelect-multiple {overflow: hidden;}
.wSelect-selected {margin: 0px 35px 0px 20px;padding:  0;overflow: hidden;white-space: nowrap;background-repeat: no-repeat;background-position: 0 center; height:100%; line-height:47px}
.wSelect-options-holder {position: absolute;display: none;left: -1px;z-index: 200;overflow: hidden;}
.wSelect-multiple .wSelect-options-holder {position: relative !important;display: block !important;top: auto !important;z-index: auto !important;border: none !important;}
.wSelect-options { overflow:hidden; height:auto !important}
.wSelect-option {background-repeat: no-repeat;background-position: 5px center;margin-bottom: 1px;cursor: pointer;}
.wSelect-option-last {margin-bottom: 0px;}
.wSelect-option-value {margin: 0 5px;padding: 5px 0;background-repeat: no-repeat;background-position: 0 center;white-space: nowrap;overflow: hidden;}
.wSelect-option-disabled .wSelect-option-value {filter: alpha(opacity=20);opacity: 0.2;}
.wSelect-option-icon {padding-left:25px;}

/***********************************
 * 환율 SELECT
 ***********************************/
.wSelect-theme-classic.wSelect {border:solid #e4e4e4 1px; color:#555; background-color:#fff; font-size:16px; line-height:28px; min-width:125px; max-width: 125px; box-sizing:border-box; float:left; height:50px}
.wSelect-arrow {background-image: url('../images/main/arrow-down.png');}
.wSelect-theme-classic.wSelect-hover,
.wSelect-theme-classic.wSelect-active {border-color:#000; color:#000}
.wSelect-theme-classic .wSelect-options-holder {background-color: #fff;border:solid #CACACA 1px; border-top:1px #000 solid !important; width:125px; box-sizing:border-box;}
.wSelect-theme-classic .wSelect-options {border: solid #FAFAFA 1px;}
.wSelect-theme-classic .wSelect-option {background-color: #FFF;color: #333;}
.wSelect-theme-classic .wSelect-option-disabled {background-color: #FFF !important;color: #333 !important;}
.wSelect-theme-classic .wSelect-option-selected,.wSelect-theme-classic .wSelect-option:hover {background-color:#f1f1f1;color:#000;}


.m_sticky{display:none}
@media screen and (max-width:960px){
.sticky{display:none}
.m_sticky{display:block; margin-top:30px}
}
div.tab-frame input[type="radio"]{ display:none;}
div.tab-frame label{ display:block; float:left; cursor:pointer; width:33.3333%; border:1px solid #e4e4e4; border-right:0 none; box-sizing:border-box; padding:15px 0; text-align:center; background:#fff; font-size:15px; font-weight:500}
div.tab-frame input:checked + label{ background:black; color:white; cursor:default}
div.tab-frame div.tab{ display:none; padding:5px 10px;clear:left; width:100%; background-color:#fff}
div.tab-frame .end{border-right:1px solid #e4e4e4;}

div.tab-frame input:nth-of-type(1):checked ~ .tab:nth-of-type(1),
div.tab-frame input:nth-of-type(2):checked ~ .tab:nth-of-type(2),
div.tab-frame input:nth-of-type(3):checked ~ .tab:nth-of-type(3){ display:block;}



@media screen and (max-width:960px){
div.tab-frame div.tab{ box-sizing:border-box; padding:8% 4%}	
.ex_wrap2{ width:31%; float:left;}
#exchange_input{width: 100%;  font-size:15px; border-top:0; border-left:1px solid #e4e4e4; clear:both}
#exchange_output{width: 100%;  font-size:15px; border-top:0; border-left:1px solid #e4e4e4; clear:both}
.wSelect-theme-classic .wSelect-options-holder {    border: solid #CACACA 1px;    border-top: 1px #e4e4e4 solid !important;    width:100%;}
.dt{ float:left;margin:0 2%; width:3%;height:100px;}
.ex_arrow{ text-align:center;display:table; vertical-align:middle; margin:0; height:100%; float:none; line-height:99px}
.ex_arrow img{ width:100%}

.btnEx{ margin-left:2%; width:28%; height:100px;background: url(../images/main/m_exchange_btn.png) no-repeat center; background-size:100%; background-color:#000; overflow:hidden; text-indent:-999px; display:block; float:right}
.btnEx.eng{ margin-left:2%; width:28%; height:100px;background: url(../images/main/m_exchange_en_btn.png) no-repeat center; background-size:100%; background-color:#000; overflow:hidden; text-indent:-999px; display:block; float:right}
.btnEx.chn{ margin-left:2%; width:28%; height:100px;background: url(../images/main/m_exchange_ch_btn.png) no-repeat center; background-size:100%; background-color:#000; overflow:hidden; text-indent:-999px; display:block; float:right}
.btnEx.jpn{ margin-left:2%; width:28%; height:100px;background: url(../images/main/m_exchange_jp_btn.png) no-repeat center; background-size:100%; background-color:#000; overflow:hidden; text-indent:-999px; display:block; float:right}

.wSelect-theme-classic.wSelect {max-width:100%; width:100% !important; box-sizing:border-box; border-right:1px solid #e4e4e4;min-width: 100%}
.weather {float: right;background: #fff;width: 100%; height:58px; margin-top:0px; box-sizing: border-box; border:0; position: relative; text-align: center;overflow:hidden;}
.weather .wrap { margin:0}

.wSelect-theme-classic.wSelect-hover,
.wSelect-theme-classic.wSelect-active {border-color:#e4e4e4; color:#000}

}


.ex_block {padding:0 5px; height:37px; overflow:hidden; background:#fff; width:215px; font-family:Gulim; font-size:12px;float:left; margin-top:16px; position:relative}
.ex_block ul{ margin:0 0 0 20px; float:left}
.ex_block ul li {margin:0; padding:0; list-style:none; line-height:37px; height:37px;color:#4f4f4f; font-size:14px; overflow:hidden;float:left; display:flex}
				

.ex_block ul li span{ color:#000; font-weight:500; font-size:14px; height:100%;; line-height:37px; overflow:hidden;}
.ex_block ul li span:before{content:""; background:#c0c0c0; width:10px; height:1px; display:block; float:left; margin:19px 7px 0 }
.ex_block  img{ margin-right:10px; margin-top:12px; float:left}

#ticker{float:left;width:150px; height:37px;}

.navi { float:right; position:relative; height:37px; width:31px}
.navi button{ width:31px; height:16px; text-indent:-999px; overflow:hidden; border:0; position:absolute}
.navi .prev{ background:url(../images/main/ex_sc_btn.jpg) no-repeat center 0; left:0; top:0}
.navi .next{ background:url(../images/main/ex_sc_btn.jpg) no-repeat center -21px; left:0; bottom:0}
