@charset "utf-8";
/* 공통 메인 컨텐츠 */

.float { float: left; }

@media(max-width:640px){
 .float { float: none; }
}

#mcontainer { position: relative; }

#mcontainer .layout { max-width: 1200px; }

#visual { width: 100%; height: 540px; /*background:url('/images/ustian_eng/main/main_visual.jpg') no-repeat center top; background-size: cover; */}

#visual .visual-wrap { position: relative; width: 100%; height: 100%; }

#visual .obj_wrap { position: relative; width: 100%; height: 100%; text-align: center; }

#visual .obj_wrap li { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }

#visual .obj_wrap .item1 { background: url('/images/ustian_eng/main/main_visual.jpg') no-repeat center top; background-size: cover; }

#visual .obj_wrap .item2 { background: url('/images/ustian_eng/main/main_visual.jpg') no-repeat center top; background-size: cover; }

#visual .obj_wrap .item3 { background: url('/images/ustian_eng/main/main_visual.jpg') no-repeat center top; background-size: cover; }

#visual .obj_wrap li a { display: block; padding: 95px 0 0 0; float: left; background: url('/images/ustian_eng/main/main_vi_text_icon.png') no-repeat center top; position: absolute; top: 120px; left: 0px; color: #fff; width: 100%; }

#visual .obj_wrap li .vi_text1 { line-height: 1}

#visual .obj_wrap li .vi_text1 em { width: 100%; display: inline-block; font-family: 'Malgun Gothic'; color: #fff; font-size: 46px; letter-spacing: 0.05em}

#visual .obj_wrap li .vi_text1 strong { width: 100%; display: inline-block; font-family: "Malgun Gothic"; font-size: 48px; color: #fff; font-weight: bold; }

#visual .obj_wrap li .vi_text2 { display: block; max-width: 600px; width: 100%; color: #fff; margin: 10px auto; display: inline-block; font-size: 34px; line-height:1.3}

#visual .control { position: absolute; top: 480px; left: 0; width: 100%; text-align: center; z-index: 100}

#visual .control button { background: none; background-image: url('/images/ustian_eng/main/main_visual_icon.png'); background-repeat: no-repeat; font-size: 0; position: static; display: inline-block; width: 19px; height: 19px; vertical-align: middle; }

#visual .control .count button.ov { background-position: left bottom; }

#visual .control .count button { background-position: left top; margin: 0 0 0 2px}

#visual .control .count { display: inline-block}

#visual .control .state { display: inline-block; margin: 0 0 0 5px}

#visual .control .state button.stop { background-position: right top; }

#visual .control .state button.play { background-position: right bottom; }


/*

#visual .obj_wrap { width:100%; max-width:1790px; margin:120px auto 0; display:inline-block; text-align:center; }
#visual .obj_wrap li { padding:95px 0 0 0; float:left; background:url('/images/ustian_eng/main/main_vi_text_icon.png') no-repeat center top; position:absolute; top:120px; left:0px }
#visual .obj_wrap li .vi_text1 { line-height:40px }
#visual .obj_wrap li .vi_text1 em { width:100%; display:inline-block; font-family:'Malgun Gothic'; color:#fff; font-size:76px; letter-spacing:0.05em }
#visual .obj_wrap li .vi_text1 strong { width:100%; display:inline-block; font-family:"Malgun Gothic"; font-size:78px; color:#fff; font-weight:bold; }

#visual .obj_wrap li .vi_text2 { color:#fff; margin:30px 0 0 0; display:inline-block }
#visual .control { position:absolute; top:480px; width:100%; max-width:1790px; margin:0 auto; text-align:center; z-index:100 }
#visual .control button { background:none; background-image:url('/images/ustian_eng/main/main_visual_icon.png'); background-repeat:no-repeat; font-size: 0; position: static; display: inline-block; width:19px; height:19px; vertical-align: middle; }
#visual .control .count button.ov { background-position:left bottom; }
#visual .control .count button { background-position:left top; margin:0 0 0 2px }
#visual .control .count { display:inline-block }
#visual .control .state { display:inline-block; margin:0 0 0 5px }
#visual .control .state button.stop { background-position:right top; }
#visual .control .state button.play { background-position:right bottom; }
*/

#visual #vi_btn { width: 100%; position: absolute; top: 565px; left: 0; }

#visual #vi_btn ul { position: relative; width: 100%; max-width: 1200px; margin: 0 auto; }

#visual #vi_btn ul li { width: 33.33%; float: left; }

#visual #vi_btn ul li a { display: block; position: relative; padding: 24px 30px; }

#visual #vi_btn ul li.btn1 { background: url('/images/ustian_eng/main/main_btn_bg1.jpg') no-repeat center top}

#visual #vi_btn ul li.btn2 { background: url('/images/ustian_eng/main/main_btn_bg2.jpg') no-repeat center top}

#visual #vi_btn ul li.btn3 { background: url('/images/ustian_eng/main/main_btn_bg3.jpg') no-repeat center top}

#visual #vi_btn ul li span { display: inline-block; width: 100%; font-family: 'ntk'; color: #fff; }

#visual #vi_btn ul li span.title { font-size: 16px; vertical-align: top; float: left; font-weight: bold; }

#visual #vi_btn ul li span.text { font-size: 11px; }

#visual #vi_btn ul li span.plus { position: absolute; top: 30px; right: 35px; width: 41px; height: 41px; display: inline-block; background: url('/images/ustian_eng/main/visual_more.gif') no-repeat left top; width:}

#vi_btn { width: 100%; margin: 0 auto; }

@media(max-width:1024px){
 #visual .obj_wrap li .vi_text1 em { font-size: 60px}
 #visual .obj_wrap li .vi_text1 strong { font-size: 64px}
}

@media(max-width:1000px){
 #visual #vi_btn { width: 90%; margin: 0 auto; left: 5%}
 #visual #vi_btn ul li { height: 200px}
 #visual #vi_btn ul li .text { diheight: 50px; padding: 0; }
 #visual #vi_btn ul li span.plus { position: relative; right: auto; top: auto; margin: 10px 0 0 0}
 #visual .obj_wrap li .vi_text2 { font-size: 14px}
 #visual .control { top: 400px}
 #visual #vi_btn { top: 480px}
}

@media(max-width:600px){
 #visual .obj_wrap li .vi_text1 em { font-size: 40px}
 #visual .obj_wrap li .vi_text1 strong { font-size: 42px}
 #visual .obj_wrap li .vi_text2 { padding: 0 30px; font-size: 13px; word-break: keep-all}
}

@media(max-width:500px){
 #visual { height: 600px}
 #visual #vi_btn ul li span.title { padding: 12px 10px; line-height: 1.3em; }
 #visual #vi_btn ul li span.title em { width: 100%; display: inline-block; }
 #visual #vi_btn ul li span.text,
 #visual #vi_btn ul li span.plus { display: none}
 #visual #vi_btn ul li { height: 110px}
 #visual #vi_btn ul li a { padding: 15px; height:100%; }
 #visual #vi_btn ul li a .title { display:block; text-align:center }
 #visual #vi_btn { top: 470px; }
}

@media(max-width:440px){
 #visual { height: 500px}
 #visual .obj_wrap li .vi_text1 { line-height: 1.2em}
 #visual .obj_wrap li .vi_text1 em { font-size: 30px}
 #visual .obj_wrap li .vi_text1 strong { font-size: 32px}
 #visual .obj_wrap li .vi_text2 { display: none}
 #visual #vi_btn { top: 390px}
 #visual .control { top: 267px}
 #visual .obj_wrap { margin: 0 auto; top: auto}
 #visual .obj_wrap li { background: url('/images/ustian_eng/main/main_vi_text_icon.png') no-repeat center 20px; background-size: 60px}
 #visual .obj_wrap li { top: 0px}
}

#mcontainer .board { height: 455px; margin: 65px 0 80px}

#mcontainer .board_box { position: relative; height: 495px; background: url('/images/ustian_eng/main/board_line.jpg') no-repeat center 80px; margin: 60px 0 120px 0}

#mcontainer .board_box h2 { padding: 0 0 40px 0; text-align: center; color: #000; font-size: 22px; font-family: 'ntk'; font-weight: bold}

#mcontainer .board_box .board_wrap { overflow: hidden; position: relative; margin: 0 auto; width: 1160px; height: 360px; background: url("/images/ustian_eng/main/bg_board2.png") no-repeat 0 0; }

#mcontainer .board_box .board_list { overflow: hidden; position: relative; width: 100%; }

#mcontainer .board_box .board_list ul { }

#mcontainer .board_box .board_list ul li { float: left; display: inline-block; width: 580px; box-sizing: border-box; padding: 0 55px; height: 195px; position: relative; }

#mcontainer .board_box .board_list ul li a { display: block; width: 480px; padding: 0 0 0 100px; font-size: 14px; color: #000; background: url("/images/ustian_eng/main/bu2.png") no-repeat 14px 25px; font-family: 'ntk'; }

#mcontainer .board_box .board_list ul li a .date { position: absolute; top: 0px; left: 60px; width: 75px; text-align: center; }

#mcontainer .board_box .board_list ul li a .date em { font-size: 70px; width: 100%; display: inline-block; line-height: 1em; }

#mcontainer .board_box .board_list ul li a .date span { width: 100%; font-size: 17px; }

#mcontainer .board_box .board_list ul li a b { color: #444444; font-size: 20px; width: 100%; display: inline-block; line-height: 1.35em; font-family: 'ntk'; margin: 0 0 10px 0}

#mcontainer .board_box .board_list ul li a em.text { color: #444444; height: 70px; overflow: hidden; width: 100%; display: inline-block; line-height: 1.35em; font-family: 'ntk'; }

#mcontainer .board_box .board_list ul li a em.who::before { content: ''; vertical-align: middle; display: inline-block; background: url('/images/ustian_eng/main/board_icon_2.gif') no-repeat left top; width: 24px; height: 19px; }

#mcontainer .board_box .board_list ul li a em.view::before { content: ''; vertical-align: middle; display: inline-block; background: url('/images/ustian_eng/main/board_icon_2.gif') no-repeat right top; width: 24px; height: 19px; }

#mcontainer .board_box .board_list ul li a em { color: #767676; margin: 0 15px 0 0}

#mcontainer .board_box .board_control button { display: inline-block; width: 19px; height: 33px; padding: 0; border: none; background: url("/images/ustian_eng/main/board_arrow.gif") no-repeat; font-size: 0; line-height: 0; }

#mcontainer .board_box .board_control button:first-child { margin-right: 2px; }

#mcontainer .board_box .board_control .btn_prev { background-position: 0 0; position: absolute; top: 245px; left: 0px; z-index: 999}

#mcontainer .board_box .board_control .btn_next { background-position: 0 -35px; position: absolute; top: 245px; right: 0px; z-index: 999}

#mcontainer .board_box .more a { width: 45px; height: 45px; display: inline-block; background: url('/images/ustian_eng/main/board_more.png') no-repeat left top; }

#mcontainer .board_box .more { width: 45px; height: 45px; margin: 10px auto}

@media(max-width:1140px){
 #mcontainer .board_box .board_wrap { width: 100%; height: 370px}
 #mcontainer .board_box .board_list ul li a b { font-size: 16px}
 #mcontainer .board_box .board_list ul li a { padding: 0 0 0 80px; width: 100%}
 #mcontainer .board_box .board_list ul li { width: 50%; padding: 0 40px}
 #mcontainer .board_box .board_list ul li a .date { width: 60px; left: 40px}
 #mcontainer .board_box .board_list ul li a .date em { font-size: 55px}
 #mcontainer .board_box .board_list ul li a .date span { width: 100%; font-size: 15px; }
 #mcontainer .board_box .board_list ul li a em.text { height: 75px; }
}

@media(max-width:640px){
 #mcontainer .board_box .board_list ul li { width: 100%; padding: 0 30px; height: 170px}
 #mcontainer .board_box .board_wrap { height: 340px; }
 #mcontainer .board_box { background: none; margin: 60px 0 60px 0; }
 #mcontainer .board_control { display: none; position: absolute; top: 195px; text-align: center; width: 100%; }
 #mcontainer .board_box .board_control .btn_prev { position: relative; margin: 0 10px}
 #mcontainer .board_box .board_control .btn_next { position: relative; margin: 0 10px}
 #mcontainer .board_box .more { width: 100%; text-align: center; }
 #mcontainer .board_box .more a { margin: 10px 0 0 140px}
}

#mcontainer .bot_link_box { width: 100%; max-width: 1890px; margin: 0 auto; }

#mcontainer .bot_link_box .layout { width: 100%; max-width: 1890px; margin: 0 auto; }

#mcontainer .bot_link_box .left_link_box {width: 70%;float: left;display: inline-block;}

#mcontainer .bot_link_box .left_link_box li { width: 33.3%; height: 540px; float: left; text-align: center; background-size: cover; }

#mcontainer .bot_link_box .left_link_box li span { width: 100%; display: inline-block}

#mcontainer .bot_link_box .left_link_box li span.img { margin: 95px 0 0 0; width: 110px; height: 84px; display: inline-block; background-image: url(/images/ustian_eng/main/main_left_icon.png); background-repeat: no-repeat}

#mcontainer .bot_link_box .left_link_box li span.title { font-size: 24px; color: #fff; }

#mcontainer .bot_link_box .left_link_box li span.text { font-size: 15px; color: #fff; }

#mcontainer .bot_link_box .left_link_box li.li_1 .img { background-position: 10px top; }

#mcontainer .bot_link_box .left_link_box li.li_2 .img { background-position: -138px top; }

#mcontainer .bot_link_box .left_link_box li.li_3 .img { background-position: -290px top; }

#mcontainer .bot_link_box .left_link_box li.li_4 .img { background-position: -440px top; }

#mcontainer .bot_link_box .left_link_box li.li_1 { background: url('/images/ustian_eng/main/main_link_bg1.jpg') no-repeat center top; background-size: cover; }

#mcontainer .bot_link_box .left_link_box li.li_2 { background: url('/images/ustian_eng/main/main_link_bg2.jpg') no-repeat center top; background-size: cover; }

#mcontainer .bot_link_box .left_link_box li.li_3 { background: url('/images/ustian_eng/main/main_link_bg3.jpg') no-repeat center top; background-size: cover; }

#mcontainer .bot_link_box .left_link_box li.li_4 { background: url('/images/ustian_eng/main/main_link_bg4.jpg') no-repeat center top; background-size: cover; }

#mcontainer .face_box {width: 30%;height: 540px;display: inline-block;float: left;background: url('/images/ustian_eng/main/face_bg.jpg') no-repeat left top;}

#mcontainer .face_box h2 { text-align: center; color: #dae2ee; font-size: 24px; font-weight: bold; margin: 80px 0 0 0}

#mcontainer .face_box .text { text-align: center; width: 100%; font-size: 18px; color: #dae2ee; display: inline-block; margin: 0 0 40px 0}

/* #mcontainer .face_box .face_list {overflow:auto; overflow-x:hidden; width: 74%; height: 395px; margin: 0 auto; }  */
#mcontainer .face_box .face_list{display: flex;justify-content: center;align-items: center;    height: 300px;}
#mcontainer .face_box .face_list li{margin: 0 5px;width: 63px;height: 63px;}
#mcontainer .face_box .face_list li a{    display: block;width: 100%;height: 100%;font-size: 0;background: url(/images/kor/main/mcont1_ir.png);}
#mcontainer .face_box .face_list .lnk1 a{background-position: -234px -71px;}
#mcontainer .face_box .face_list .lnk6 a{background-position: -584px -71px;}
#mcontainer .face_box .face_list .face_list_box { position: relative; padding: 0 0 28px 0; margin: 0 0 28px 0; border-bottom: 1px solid #6984b4; display: inline-block; width: 100%; min-height:120px; }


#mcontainer .face_box .face_list .face_list_box .img { position: absolute; top: 0px; left: 0px; width: 120px; text-align: center}

#mcontainer .face_box .face_list .face_list_box .text { color: #d5d6d7; padding: 0 0 0 130px; text-align: left; font-size: 14px; margin: 0px}

#mcontainer .face_box .face_list .face_list_box .info { color: #d5d6d7; padding: 0 0 0 130px; text-align: left; font-size: 12px; float: left; width: 100%; box-sizing: Border-box; }

#mcontainer .face_box .face_list .face_list_box .info .time { float: left; }

#mcontainer .face_box .face_list .face_list_box .info .feed { float: right}

#mcontainer .face_box .face_list .face_list_box .info .feed .bl_1::before { width: 24px; height: 19px; content: ''; vertical-align: top; display: inline-block; background: url('/images/ustian_eng/main/face_icon.png') no-repeat left top}

#mcontainer .face_box .face_list .face_list_box .info .feed .bl_2::before { width: 29px; height: 19px; content: ''; vertical-align: top; display: inline-block; background: url('/images/ustian_eng/main/face_icon.png') no-repeat -50px top}

@media(max-width:1140px){
 #mcontainer .bot_link_box .layout { padding: 0 50px}
 #mcontainer .bot_link_box .left_link_box { width: 100%}
 #mcontainer .face_box { width: 100%; background-size: cover; }
}

@media(max-width:640px){
 #mcontainer .bot_link_box .layout { padding: 0 20px}
 #mcontainer .bot_link_box .left_link_box li { height: 270px; }
 #mcontainer .bot_link_box .left_link_box li span.img { margin: 65px 0 0 0; }
}

@media(max-width:480px){
 #mcontainer .bot_link_box .left_link_box li { height: 220px; }
 #mcontainer .bot_link_box .left_link_box li span.img { margin: 45px 0 0 0; background-size: 400px}
 #mcontainer .bot_link_box .left_link_box li.li_1 .img { background-position: 23px 20px; }
 #mcontainer .bot_link_box .left_link_box li.li_2 .img { background-position: -84px 20px; }
 #mcontainer .bot_link_box .left_link_box li.li_3 .img { background-position: -194px 20px; }
 #mcontainer .bot_link_box .left_link_box li.li_4 .img { background-position: -305px 20px; }
 #mcontainer .bot_link_box .left_link_box li span.title { font-size: 17px; line-height: 1.2em}
 #mcontainer .bot_link_box .left_link_box li span.title em { width: 100%; display: inline-block; }
 #mcontainer .bot_link_box .left_link_box li span.text { display: none}
 #mcontainer .face_box .face_list { width: 85%}
 #mcontainer .face_box { margin: 0 0 40px 0}
 #mcontainer .face_box h2 { font-size: 20px}
 #mcontainer .face_box .text { font-size: 16px}
}

@media(max-width:400px){
 #mcontainer .face_box .face_list .face_list_box .img { position: relative; }
 #mcontainer .face_box .face_list .face_list_box .text { padding: 10px 0 0 0}
 #mcontainer .face_box .face_list .face_list_box .info { padding: 10px 0 0 0}
}
