@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/nanumgothic.css');

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; font-family:'Nanum Gothic', '나눔고딕', '맑은 고딕', 'Malgun Gothic', '돋움', 'Dotum', 'AppleGothic', sans-serif; letter-spacing:-0.45px}
/* body {line-height:1} */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes:none}
caption, legend {visibility:hidden; overflow:hidden; width:0; height:0; font-size:0; line-height:0}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content:none}
a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none}
ins {background-color:#ff9; color: #000; text-decoration:none}
mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold}
del {text-decoration:line-through}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help}
table {border-collapse:collapse; border-spacing:0}
hr {display:block; height:1px; border:0; border-top: 1px solid #cccccc; margin:1em 0; padding:0}
input, select {vertical-align:middle}

/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:14px; font-weight:bold; color:#fff; line-height:1; text-align:center; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {margin-top:0; height:auto; padding:10px 0px}

.auto {margin-right:auto; margin-left:auto}
.bg-emerald {background:#00b8a5}
.text-white {color:#fff}
.mt0 {margin-top:0px !important}
.mt10 {margin-top:10px !important}
.mt15 {margin-top:15px !important}
.mt20 {margin-top:20px !important}
.mt30 {margin-top:30px !important}
.mt35 {margin-top:35px !important}
.mt40 {margin-top:40px !important}
.mt50 {margin-top:50px !important}
.mb10 {margin-bottom:10px !important}
.mb30 {margin-bottom:30px !important}
.ml5 {margin-left:5px !important}
.ml10 {margin-left:10px !important}
.ml20 {margin-left:20px !important}
.mr5 {margin-right:5px !important}
.mr10 {margin-right:10px !important}
.mr20 {margin-right:20px !important}
.margin0-5 {margin:0 5px !important}
.width55 {display:inline-block; width:55px}
.width70 {display:inline-block; width:70px}
.width100 {width:100%}
.maxWidth60 {max-width:60px !important}
.maxWidth80 {max-width:80px !important}
.maxWidth90 {max-width:90px !important}
.maxWidth100 {max-width:100px !important}
.maxWidth170 {max-width:170px !important}
.maxWidth200 {max-width:200px !important}
.maxWidth340 {max-width:340px !important}
.maxWidth375 {max-width:375px !important}
.red {color:red !important}
.clear {clear:both}
.bList {}
.bList li {background:url('../image/iconBar.png') 0 10px no-repeat; padding-left:9px; margin-bottom:5px}
.bList li:last-child() {margin-bottom:0px}
.inline {display:inline}
.show-768 {display:none}
.radius0 {border-radius:0 !important}

#headerTop {background:#333}
#headerTop > section {max-width:1240px; margin:0 auto; overflow:hidden}
#headerTop > section ul.htRight {float:right}
#headerTop > section ul.htRight li {float:left}
#headerTop > section ul.htRight li a {display:block; font-size:12px; font-weight:700; padding:7px 15px; color:rgb(255 255 255 / 80%)}
#headerTop > section ul.htRight li:last-child a {padding-right:0}
#headerTop > section ul.htRight li a:hover {color:#fff}

header {background:#fff; border-bottom:1px solid #ccc}
header > section {max-width:1240px; margin:0 auto; overflow:hidden; padding:20px 0}
header > section .navbar-header {overflow:hidden}
header > section .navbar-brand {padding:0; height:auto}
header > section .navbar-nav>li {padding:0 30px}
header > section .navbar-nav>li:last-child {padding-right:0}
header > section .navbar-nav>li>a {color:#000; font-weight:700; font-size:16px; line-height:90px; display:inline; padding:0}
header > section .navbar-nav>li>a.on {color:#000; border-bottom:2px solid #23993b; padding-bottom:5px}
header > section .nav>li>a:focus, header > section .nav>li>a:hover {color:#23993b;background:none}
.navbar-toggle {border-color:#ddd; margin-right:0; margin-top:20px}
.navbar-toggle .icon-bar {background:#000}

#mainVisual {width:100vw; /*height:80vh;*/ display:table; background:#ebebeb}
#mainVisual > section {position:relative; vertical-align:middle; display:table-cell}
#mainVisual > section .mainContents {margin:0 0 0 0px; text-align:center; position:relative; z-index:99}
#mainVisual > section .mainVisual1 {animation:fadeIn 2s; -moz-animation:fadeIn 2s; -webkit-animation:fadeIn 2s; -o-animation:fadeIn 2s; animation-fill-mode:backwards}
#mainVisual > section .mainContents h2 {top:-50px; position:relative;}
#mainVisual > section .mainContents ul {overflow:hidden; margin-top:40px; animation:fadeIn 1s; -moz-animation:fadeIn 1s; -webkit-animation:fadeIn 1s; -o-animation:fadeIn 1s; animation-fill-mode:backwards; animation-delay:0.5s}
#mainVisual > section .mainContents ul li {display:inline-block; text-align:center; line-height:16px; font-size:16px; margin:10px 20px}
#mainVisual > section .mainContents ul li a {color:#fff}
#mainVisual > section .mainContents ul li a:hover {text-decoration:none}
#mainVisual > section .mainContents ul li.mIcon1 {animation:flipInY 1s; -moz-animation:flipInY 1s; -webkit-animation:flipInY 1s; -o-animation:flipInY 1s; animation-fill-mode:backwards; animation-delay:0.5s}
#mainVisual > section .mainContents ul li.mIcon2 {animation:flipInY 1s; -moz-animation:flipInY 1s; -webkit-animation:flipInY 1s; -o-animation:flipInY 1s; animation-fill-mode:backwards; animation-delay:0.8s}
#mainVisual > section .mainContents ul li.mIcon3 {animation:flipInY 1s; -moz-animation:flipInY 1s; -webkit-animation:flipInY 1s; -o-animation:flipInY 1s; animation-fill-mode:backwards; animation-delay:1.2s}
#mainVisual > section .mainContents ul li.mIcon4 {animation:flipInY 1s; -moz-animation:flipInY 1s; -webkit-animation:flipInY 1s; -o-animation:flipInY 1s; animation-fill-mode:backwards; animation-delay:1.5s}
#mainVisual > section .mainContents .main_slide_mouse{width:100%; height:100px; position:absolute; bottom:-200px; z-index:10; animation:fadeIn 1s; -moz-animation:fadeIn 1s; -webkit-animation:fadeIn 1s; -o-animation:fadeIn 1s; animation-fill-mode:backwards; animation-delay:2s}
#mainVisual > section .mainContents .main_visual_d_link{display:block; width:32px; margin:auto;}
#mainVisual > section .mainContents .main_mus{width:32px;height:52px;margin:auto;background:url('../image/main_mus.png') center center no-repeat;}
#mainVisual > section .mainContents .main_mus_d{width:14px;height:15px;margin:auto;background:url('../image/mus_d.png') center bottom no-repeat; padding-top:12px}
#mainVisual > section .mainImage {position:absolute; bottom:0; right:0}
#mainVisual > section .PaulBocuse a {display:block; border:1px solid #fff; color:#fff; padding:20px; margin-top:10px}

#subVisual {background:#0087f2; display:none}
#subVisual > section {max-width:1240px; height:170px; margin:0 auto; position:relative}
#subVisual > section > h2 {padding-top:25px; font-size:50px; font-weight:800; color:#fff}
#subVisual > section > h3 {margin-top:20px; font-size:24px; font-weight:400; color:#fff}
#subVisual > section > img {position: absolute; right: 0; right:35px; bottom:-87px; z-index: 999}

#fieldWrap {background:#fff; margin-top:80px}
#fieldWrap > section {max-width:1340px; margin:0 auto; overflow:hidden; padding:0 0 80px 0}
#fieldWrap > section .fieldWraptop {background:#333; height:240px;  padding:50px}
#fieldWrap > section h3 {font-size:38px; font-weight:700; color:#fff; text-align:center; }
#fieldWrap > section h6 {font-size:14px; font-weight:400; letter-spacing:5px; color:#fff; margin-top:15px; text-align:center}
#fieldWrap > section ul {position: relative; max-width:1240px; margin:-60px auto 0 auto}
#fieldWrap > section ul li {float:left; width:calc(33% - 40px); margin:0 20px 40px 20px; box-sizing:border-box; text-align:center; position:relative; box-shadow: 0 10px 20px rgba(0,0,0,0.2)}
#fieldWrap > section ul li.fieldList01 {}
#fieldWrap > section ul li.fieldList02 {}
#fieldWrap > section ul li.fieldList03 {}
#fieldWrap > section ul li.fieldList04 {}
#fieldWrap > section ul li h5 {padding:20px 0 15px 0px; font-size:24px; font-weight:600; color:#000}
#fieldWrap > section ul li p {padding:0 0 20px 0px; height:65px}
#fieldWrap > section ul li a.more {position:absolute; top:0; left:0; width:100%; height:100%}
#fieldWrap > section ul li a.more:hover {opacity:1;background: rgb(232 232 232 / 11%);}

#video {margin-bottom:80px}
#video > section {max-width:1240px; margin:0 auto; overflow:hidden}
#video > section ul {overflow:hidden; background:#fff; /*background:url('../image/videobg.png')*/ border-top:2px solid #2b2728; border-bottom:2px solid #2b2728;padding: 20px 0}
#video > section ul li {float:left; display:block; width:50%; text-align:center; color:#000; font-size:24px; font-weight:600; letter-spacing:5px; line-height:200%; vertical-align:middle}
#video > section ul li:first-child {padding:100px 0}
#video > section ul li:last-child {line-height:0}

#gallery {background:#ebebeb; padding:60px 0}
#gallery > section {max-width:1240px; margin:0 auto; overflow:hidden}
#gallery > section h3 {font-size:38px; font-weight:700; color:#000; text-align:center; }
#gallery > section h6 {font-size:14px; font-weight:400; letter-spacing:5px; color:#000; margin-top:15px; margin-bottom:50px;text-align:center}
.gallery-box {display:block; position:relative; margin:0 auto}
.gallery-box .gallery-box-caption {display:block; position:absolute; bottom:0; width:100%; height:100%; text-align:center; color:#fff; background:rgba(0,0,0,0.6); -webkit-transition:all .35s; -moz-transition:all .35s; transition:all .35s}
.gallery-box .gallery-box-caption .gallery-box-caption-content {position:absolute; top:50%; width:100%; text-align:center; transform:translateY(-50%)}
.gallery-box .gallery-box-caption .gallery-box-caption-content .project-category, .gallery-box .gallery-box-caption .gallery-box-caption-content .project-name {padding:0 15px}
.gallery-box .gallery-box-caption .gallery-box-caption-content .project-category {font-size:14px; font-weight:700}
.gallery-box .gallery-box-caption .gallery-box-caption-content .project-name {font-size:18px}
.gallery-box:hover .gallery-box-caption {opacity:1;background: rgb(35 153 59 / 72%);}

footer {background:#333; padding:50px 0; color:#7d7d7d}
footer address {font-size:18px; margin-bottom:10px}
.footTxt {font-size:14px}
.footTxt span {padding:0 10px}
footer .copy {font-size:14px; margin-top:10px}
.btn-foot {background:#4e4e4e; font-size:13px; font-weight:700; padding:5px 10px; border-radius:25px; color:#fff; margin:0 5px 20px 5px}
.btn-foot:hover {color:#fff}
.top_btn {display:block; position:fixed; bottom:30px; right:15px; z-index:200; width:45px; height:45px; background:url('http://work27.wsi.ac.kr/site/common/image/arr_top.png') rgba(0,0,0,0.5) 50% 50% no-repeat; color:#fff; font-size:11px; text-decoration:none; text-align:center}
.top_btn em {visibility:hidden}

/* loginModal */
#loginModal .modal-content {padding:30px 50px; max-width:530px}
#loginModal .modal-header {border:none}
#loginModal .modal-body {border:none; overflow:hidden}
#loginModal .modal-footer {border:none; margin-top:2%}
#loginModal .modal-footer p {text-align:center; font-size:16px; font-weight:700}
#loginModal .modal-footer p a {color:#747474}
.btnLogin {width:48%; float:left; margin-top:3%; font-size:16px; font-weight:700}
.btnJoin {width:48%; float:right; margin-top:3%; font-size:16px; font-weight:700}

/* content */
#content {padding:100px 0}
#content h3 {text-align:center; font-size:56px; font-weight:700}
#content h4 {font-size:18px; font-weight:700; margin:60px 0 20px 0; padding-bottom:10px; border-bottom:2px solid #898989}
#content h5 {font-size:16px; font-weight:700; margin:30px 0 10px 0}
#content p {font-size:14px; line-height:24px; color:#555555; margin-bottom:5px}
#content p.mTxt1 {font-size:14px; margin-bottom:10px; font-weight:bold}
#content dl {font-size:14px}
#content dl dt {font-weight:bold; margin-top:15px; margin-bottom:5px}
#content dl dd {background:url('../image/dot.gif') 4px 9px no-repeat; padding-left:15px; margin-bottom:5px}
#content ul {padding-left:0}
.nList li {list-style:decimal;margin-left:15px;margin-bottom:5px}
.nList li ul li {list-style:none;margin-left:-5px;}

#content .tabStyle {overflow:hidden; margin:0; padding:0}
#content .tabStyle li {list-style:none}
#content .tabStyle li.on a {background:#23993b; color:#fff}
#content .tabStyle li a:hover {background:#23993b; color:#fff}
#content .tabStyle li a {display:block; float:left; background:#dfdfdf; border:1px solid #fff; box-sizing:border-box; padding:15px 0; text-align:center; font-size:16px; color:#636363; font-weight:700; letter-spacing:-0.5px}
#content .tab2 li a {width:50%}
#content .tab3 li a {width:33.3%}
#content .tab4 li a {width:25%}
#content .tab5 li a {width:20%}
#content .tab6 li a {width:16.6%}
#content .tab7 li a {width:14.28%}

.tblStyle1 {position:relative; width:100%; border-top:2px solid #b7b7b7}
.tblStyle1 thead th {border-bottom:1px solid #b7b7b7; padding:17px 15px; background:#f3f3f3; font-size:15px; text-align:center}
.tblStyle1 tbody th {text-align:center; font-size:14px; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px; font-weight:normal}
.tblStyle1 tbody td {text-align:center; font-size:14px; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px}
.tblStyle1 .subject {text-align:left}

.tblStyle2 {position:relative; width:100%; border-top:2px solid #b7b7b7}
.tblStyle2 thead th {border-bottom:1px solid #b7b7b7; padding:17px 15px; background:#f3f3f3; font-size:15px; text-align:center}
.tblStyle2 tbody th {text-align:center; font-size:14px; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px; font-weight:normal}
.tblStyle2 tbody td {text-align:center; font-size:14px; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px}
.tblStyle2 .subject {text-align:left}
.tblStyle2 .nameA {color:#898989}
.tblStyle2 .hitDate {color:#898989}
.tblStyle2 .tl {text-align:left}
.tblStyle2 .mhit {font-size:12px; font-weight:normal}
.tblStyle2 .matt {font-size:13px}
.tblStyle2 .boardContent {padding:40px 15px}

.btn-con {background:#4e4e4e;font-size:12px; font-weight:700; padding:5px 10px; border-radius:5px;color:#fff; margin:0 5px 20px 5px;}
.btn-con:hover {background:#bd020d;color:#fff}

/* 회원가입 */
.join-formTbl {position:relative; width:100%; border-top:2px solid #b7b7b7}
.join-formTbl > tbody > tr > th {text-align:left; font-size:14px !important; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px; font-weight:700 !important; background:#f5f5f5}
.join-formTbl > tbody > tr > td {text-align:left; font-size:14px !important; border-bottom:1px solid #dddddd; padding:20px 15px; line-height:18px}
.join-form p {margin:0}
#phoneCheckButton {display:inline-block}
/*#cphone1 {height:26px; vertical-align:middle;}*/
.rulebox {overflow-y:scroll; overflow-x:hidden; width:100%; height:200px; border:1px solid #CCC; padding:20px;}
.rulebox h5 {font-size:16px !important; font-weight:700; margin:20px 0 10px 0}
.rulebox p {font-size:13px !important}
.agreeTxt {font-size:14px !important}
#agree1, #agree2 {vertical-align:middle; margin-top:0}
/*
#phoneCheckNUmber {float:left}
#phoneCheckNUmber span input {height:27px; width:80px}
*/

.tableStyle01 {border-top:1px solid #b7b7b7}
.tableStyle01 thead tr th {text-align:center; font-size:12px !important; border:1px solid #dddddd; padding:10px 10px !important; line-height:18px; font-weight:700 !important; background:#f5f5f5}
.tableStyle01 tbody tr th {text-align:center; font-size:12px !important; border:1px solid #dddddd; padding:10px 10px !important; line-height:18px; font-weight:700 !important; background:#f5f5f5}
.tableStyle01 tbody tr td {text-align:center; font-size:12px !important; border:1px solid #dddddd; padding:10px 10px !important; line-height:18px}
.ac {text-align:center}
.logBox {background:#fafafa; padding:30px 40px}
.logBox label {width:80px}

/* 참가신청 */
.application-form {}
#tcont.application-form table {border-top:none; width:100%;}
.application-form table {border-top:2px solid #b7b7b7; width:100%;}
.application-form thead th {background:#f5f5f5; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; text-align:left; font-size:15px !important; padding:20px 15px;}
.application-form tbody th {background:#f5f5f5; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; text-align:left; font-size:15px !important; padding:20px 15px;}
.application-form tbody td {solid #e2e2e2; border-bottom:1px solid #e2e2e2; padding:20px 15px; color:#252525;}
.application-form tbody .h28 td {height:28px; padding:0 0 0 6px;}
.application-form tbody td textarea { border:1px solid #dbdbdb; }
.application-form tbody td span.w60 {display:inline-block; width:60px}
.fc01 {color:red}
.fn {font-weight:normal}
.radioBtn {vertical-align:sub}
/*#part1, #part2 {padding:5px 10px; font-size:13px}*/
/*.application-form input {font-size:13px; padding:0 3px}*/

/*수상작 갤러리*/
.award {margin-bottom:20px; min-height:290px}
.award dl {}
.award dl dt {font-weight:bold; margin-top:10px !important; margin-bottom:5px !important; font-size:14px; color:#000}
.award dl dd {background:none !important; padding-left:0 !important; font-size:12px; color:#555}

/* FAQ */
.faq_list {border-top:2px solid #49494a;}
.faq_list ul {}
.faq_list ul li {position:relative; border-bottom:1px solid #cacaca; color:#636363}
.faq_list ul li a {color:#636363}
.faq_list ul li strong, .faq_list ul li p {display:block; padding:13px 20px 13px 44px}
.faq_list ul li strong {padding-right:10px; background:url(../image/q.png) no-repeat 11px 13px;}
.faq_list ul li p {overflow:hidden; position:relative; display:none; border-top:1px dashed #cacaca; background:#ecf1f4 url(../image/a.png) no-repeat 11px 13px;}
.faq_list ul li p .btn {position:absolute; right:10px; bottom:10px;}
.faq_list ul li strong a {text-decoration:none;}

/*이용약관*/
.service dl dt {margin:10px 0}
.service dl dd {background-image:none !important;padding-left:0 !important;}
.service dl dd ul li {padding-left:17px;}
.service dl dd ul li ul li {padding-left:17px;}

.tbl_skin1 {width:100%; background-color:#ffffff; text-align:center; border-collapse:collapse; font-size:14px !important; border-top:1px solid #898989; text-align:center}
.tbl_skin1 .end {border-right:none;}
.tbl_skin1 .tdLeft {text-align:left; padding-left:10px;}
.tbl_skin1 thead th {padding:13px 0; background-color:#f5f5f5; border-right:1px solid #ebebeb; border-bottom:1px solid #d7d7d7; color:#464646; text-align:center}
.tbl_skin1 tbody td {padding:13px 0; border-right:1px solid #ebebeb; border-bottom:1px solid #d7d7d7; text-align:center}

.tbl_skin2 {width:100%; background-color:#ffffff; text-align:center; border-collapse:collapse; font-size:14px !important; border-top:1px solid #898989;border-bottom: 1px solid #898989; text-align:center}
.tbl_skin2 .end {border-right:none;}
.tbl_skin2 .tdLeft {text-align:left; padding-left:10px;}
.tbl_skin2 thead th {padding:13px 0; background-color:#f5f5f5; border-right:1px solid #ebebeb; border-bottom:1px solid #d7d7d7; color:#464646; text-align:center; vertical-align:middle}
.tbl_skin2 tbody td {padding:13px 0; border-right:1px solid #ebebeb; border-bottom:1px solid #d7d7d7; text-align:center; vertical-align:middle}


/* 로그인,찾기 */
.loginPanel {padding:40px 80px !important}
.loginPanel #setid {width:320px}
.loginPanel #setpw {width:320px}
.mem-find {padding:30px 50px}
.mem-find #setname {width:235px; padding:0 10px}
.mem-find #setcphone1 {width:60px; padding:0 10px}
.mem-find #setcphone2 {width:75px; padding:0 10px}
.mem-find #setcphone3 {width:75px; padding:0 10px}
.mem-find #setid2 {width:235px; padding:0 10px}
.mem-find #setemail2 {width:235px; padding:0 10px}



.inputText {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.inputStyle {border:1px solid #ddd; border-radius:4px; color:#666; padding:0 10px; width:100%; height:40px; line-height:40px; box-sizing:border-box; font-size:14px; font-weight:500; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; appearance:none}
.inputStyle::placeholder {color:#ccc; font-size:14px; font-weight:500}
.selectStyle {border:1px solid #ddd; border-radius:4px; color:#666; padding:0 10px; width:100%; height:40px; line-height:40px; box-sizing:border-box; font-size:14px; font-weight:400; vertical-align:middle; background:url('../image/selectArw.png') #fff no-repeat right 10px center; -webkit-appearance:none; -moz-appearance:none; appearance:none; outline:none}
.selectStyle::-ms-expand {display:none}
.pcnInput {border:1px solid #c2c2c2; color:#ed1c24; padding:0 10px; height:40px; line-height:40px; box-sizing:border-box; font-size:14px; font-weight:500; vertical-align:middle; cursor:pointer}

.mainMenuStWrap {display:flex; justify-content:center}
.mainMenuSt {width:100px; height:100px; border-radius:100%; display:flex; justify-content:center; align-items:center; background:#333; color:#fff}
.subMenuStWrap {display:flex; justify-content:space-between; margin-top:15px}
.subMenuSt {padding:5px 10px; background:#888; color:#fff; margin:0 2px}



#_InnoDS_innorix {width:100% !important}
.innoDsFile {width:100% !important; margin-top:10px}

.highlight {color:red; animation-name:example; animation-duration:1s; animation-iteration-count:infinite}
@keyframes example {
    0% {color:#00baff}
    40% {color:#00baff}
    50% {color:red}
    90% {color:red}
	100% {color:#00baff}
}

/* fileupload */
.upFrameSt {width:100%; height:305px}

.manualPanel .panel-heading {padding:30px 15px}
.manualPanel .btn {font-size:16px}




/* input */
.kwcInputSt {width:100%; max-width:100%; color:#000; font-size:14px; padding:10px 10px; border:1px solid #d7d7d7; box-sizing:border-box; margin:1px 0}
.kwcInputSt:focus, .kwcInputSt:hover {background-color:rgba(0,0,0,0.05); box-shadow:none}
/* radio */
input[class="kwcRadioStyle"] {appearance:none; width:14px; height:14px; border-radius:100%; margin-top:-2px !important; margin-right:5px; margin-bottom:0; margin-left:0; vertical-align:middle; background:#fff; border:1px solid #B2B2B2; cursor:pointer; padding:0 !important}
input[class="kwcRadioStyle"]:checked, input[class="radioStyle"]:focus {appearance:none; width:14px; height:14px; border-radius:100%; margin-right:5px; background:#fff; border:5px solid #0e4e96; outline:none; outline-offset:0}
input[class="kwcRadioStyle"] + label {cursor:pointer; padding-left:0 !important}
.consolCheck {position:relative; display:inline-block}
/* check */
input[class="kwcCheckStyle"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0}
input[class="kwcCheckStyle"] + label {display:inline-block; vertical-align:top; position:relative; padding-left:23px; cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; font-size:16px; font-weight:300; color:#505050}
input[class="kwcCheckStyle"] + label:before {content:''; position:absolute; left:0; top:3px; width:18px; height:18px; text-align:center; background:#fff; border:1px solid #d7d7d7}
input[class="kwcCheckStyle"]:checked + label:before {border-color:#0d4e96; background:url('https://ent.wsu.ac.kr/site/ent/img/checkStyle.svg') #0d4e96 no-repeat}
.checkbox span {color:#707070; font-size:14px; vertical-align:top; margin-left:8px}
/* select */
.kwcSelectStyle {width:100%; max-width:100%; vertical-align:baseline; padding:10px 10px; border:1px solid #d7d7d7; font-size:14px; font-weight:400; box-sizing:border-box; color:#727272; background:url('https://ent.wsu.ac.kr/site/ent/img/selectArrow.png') #fff no-repeat right 10px center; -webkit-appearance:none; -moz-appearance:none; appearance:none}
.kwcSelectStyle::-ms-expand {display:none}


.colLayout1 {display:flex}
.colLayout1 > div {display:flex; align-items:center}
.colLayout1 > div:nth-child(1) {margin-right:30px}
.colLayout1 > div:nth-child(2) {margin-right:30px}
.colLayout1 > div h6 {width:75px; flex-shrink:0}

#t1 {font-size:14px; font-weight:300}

@media screen and (max-width:1215px) {
	#headerTop {padding:0 20px}
	header {padding:0 20px}
	#mainVisual > section .mainContents {margin:60px 0 0 0; max-width:100%; text-align:center; position:relative; z-index:9999}
	#mainVisual > section .mainImage {display:none}
	#video > section ul li {display:block; width:100%; font-size:20px}
	#video > section ul li:first-child {padding:20px 0}
}
@media screen and (max-width:1024px) {		
	header > section .navbar-nav>li {padding:0 10px}
	.btn-emerald {margin-top:10%}
	.mem-find {padding:10px 20px}
	.loginPanel {padding:10px 20px !important}
	.loginPanel #setid {width:100%}
	.loginPanel #setpw {width:100%}
	#content {padding: 70px 0}
	#subVisual > section {padding:0 20px; bottom right no-repeat; background-size: 45%}
	#subVisual > section img {bottom: -38px; width: 200px}
	#fieldWrap {padding: 0 10px}
	#fieldWrap > section ul li {width:calc(50% - 20px); margin:10px}
	.colLayout1 {flex-wrap:wrap}
	.colLayout1 > div {display:flex; align-items:center; width:100%; margin-right:0 !important; margin:2px 0 !important}
	.colLayout1 > div input {width:100% !important}
}
@media screen and (max-width:960px) {
	.manualPanel .btn {display:block; width:100%; margin:5px 0; font-size:14px}
}
@media screen and (max-width:768px) {
	#subVisual > section img {display:none}
	header > section .navbar-nav>li>a {line-height:40px; display:block; padding-left:10px}
	.btn-emerald {background:#00b8a5; font-size:14px; font-weight:700; padding:10px 30px; border-radius:25px; margin-top:10%}	
	#loginModal .modal-content {padding:10px 10px}
	#content {padding: 70px 0}
	#content .tab4 li a {width:50%}
	#content .tab5 li a {width:50%}
	#content .tab6 li a {width:50%}
	#content .tab7 li a {width:50%}
	.award {margin-bottom:20px; min-height:250px}
	.loginPanel {padding:10px 20px !important}
	.loginPanel #setid {width:100%}
	.loginPanel #setpw {width:100%}
	.mem-find {padding:10px 20px}
	.mem-find #setname {width:100%; padding:0 5px}
	.mem-find #setcphone1 {width:40px; padding:0 5px}
	.mem-find #setcphone2 {width:55px; padding:0 5px}
	.mem-find #setcphone3 {width:55px; padding:0 5px}
	.mem-find #setid2 {width:100%; padding:0 5px}
	.mem-find #setemail2 {width:100%; padding:0 5px}
	#mainNav {background:#fff}
	.enForm .ml20 {margin-left:0 !important}	
	#mainVisual > section {height:auto}
	header > section .navbar-header {height:auto}
	#mainVisual {padding:0}
	.show-768 {display:block}
	.m768_maxWidth100 {max-width:100% !important}
}
@media screen and (max-width:600px) {
	#fieldWrap > section ul li {width:calc(100% - 20px); margin:10px}
}
@media screen and (max-width:480px) {
	.lp_response {right:0 !important}
}
@media screen and (max-width:425px) {
	#headerTop > section ul.htLeft {display:none}
	#headerTop > section ul.htRight {float:none; text-align:center}
	#headerTop > section ul.htRight li {float:none; display:inline}
	#headerTop > section ul.htRight li a {display:inline}
	header > section .navbar-nav>li {padding:0}	
	header > section .navbar-nav>li>a.on {color:#fff; border-bottom:0; padding-bottom:0}
	.navbar-collapse {border-bottom:1px solid #ddd; margin-top:20px}
	#subVisual > section {background-size:60%; background-position:center bottom}
	#subVisual > section > h2 {font-size:38px; text-align:center}
	#subVisual > section > h3 {font-size:16px; text-align:center; margin-top:10px}
	#video > section ul li {font-size:20px}
	.footTxt {font-size:12px}
	.footTxt span {padding:0 5px}
	footer .copy {font-size:12px}
	.manualPanel .btn {font-size:13px}
}
@media screen and (max-width:375px) {
	#video > section ul li {font-size:18px}
	.manualPanel .btn {font-size:12px; letter-spacing:-1px}
}
@media screen and (max-width:320px) {
	#subVisual > section {background-size:80%; background-position:center bottom}
	#subVisual > section > h2 {font-size:28px; text-align:center}
	#subVisual > section > h3 {font-size:14px; text-align:center; margin-top:10px}
}