/* common */ body { } #wrap { width: 100%; position: relative; padding-top: 100px; } .container { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; position: relative; } .container:after { content: ""; display: table; clear: both; } @media (max-width:1220px) { #wrap { padding-top: 61px; } .container { padding-left: 15px; padding-right: 15px; } } .wht500 { font-weight: 500; } .txtLeft { text-align: left !important; } .mt0 { margin-top: 0; } .mb0 { margin-bottom: 0 !important; } .mt5 { margin-top: 5px; } .mt10 { margin-top: 10px; } .mt20 { margin-top: 20px; } .mt30 { margin-top: 30px; } .mt60 { margin-top: 60px !important; } .pt0 { padding-top: 0 !important; } .mt0 { margin-top: 0 !important; } .red { color: red; } .blu { color: #0047a7; } /* GNB */ @media (min-width:1221px) { #gnb { position: fixed; z-index: 100; top: 0; left: 0; right: 0; height: 100px; background: #fff; } .gngLogo { height: 100px; position: absolute; top: 0; left: 0; z-index: 1; } .gngLogo a { display: block; height: 100%; width: 200px; text-indent: -9999px; background: url('../../img/common/intranet_logo_b.png')no-repeat center center; } .gnbWrap:after { content: ''; display: table; clear: both; } .gnbRht { float: right; } .gnbRht:after { content: ''; display: table; clear: both; } .gnbRht li { float: left; padding: 40px 0; margin-right: 20px; } .gnbRht li:last-child { margin-right: 0; } .gnbRht li a { display: block; height: 20px; line-height: 20px; font-size: 11pt; color: #888; } .gnbMo { display: none; } .gnbMpg { display: none; } .gnbMenu { position: relative; /* padding-left:75px; */ color: #666; float: right; margin-right: 10px; } .gnbMenu:after { content: ""; display: table; clear: both; } .gnbMenu > li { float: left; position: relative; padding: 35px 20px; } .gnbMenu > li > a { display: block; text-align: center; height: 30px; line-height: 30px; font-size: 15pt; font-weight: 500; color: #000; } .gnbMenu > .gnbMenunone > a { display: none; } .gnbMenu1 { position: relative; padding-left: 75px; float: right; } .gnbMenu1:after { content: ""; display: table; clear: both; } .gnbMenu1 > li { float: left; position: relative; padding: 35px 21px; } .gnbMenu1 > li > a { display: block; text-align: center; height: 30px; line-height: 30px; font-size: 15pt; font-weight: 500; } .gnbMenu > li > a.mlink { display: none; } .gnbMenu > li > a > span { display: none; } .gnbMenu > li > ul { position: absolute; left: 0; right: 0; top: 100%; height: 0px; overflow: hidden; z-index: 1; -webkit-transition: all 0.3s; transition: all 0.3s; } .gnbMenu > li > ul > li { padding: 8px 0; text-align: center; } .gnbMenu > li > ul > li:first-child { padding-top: 20px; } .gnbMenu > li > ul > li > a { display: inline-block; text-align: center; font-size: 11pt; letter-spacing: -0.075em; color: #666; line-height: 1.4em; -webkit-transition: all 0.3s; transition: all 0.3s; word-break: keep-all; } .gnbMenu > li > ul > li > a:hover { color: #387de6; } .gnbBg { position: absolute; top: 100%; left: -800px; right: -500px; height: 0px; background: #fff; overflow: hidden; -webkit-transition: all 0.3s; transition: all 0.3s; } .gnbBg:before, .gnbBg:after { content: ""; position: absolute; display: block; height: 1px; left: 0; right: 0; background: #dadada; } .gnbBg:before { top: 0; } .gnbBg:after { bottom: 0; } .gnbMenu:hover > li > ul, .gnbMenu:hover > .gnbBg { height: 260px; } } @media (max-width:1220px) { #gnb { z-index: 100; position: fixed; left: 0; right: 0; top: 0; border: solid 1px #ddd; height: 61px; background: #fff; } #gnbTop { height: 61px; border-bottom: solid 1px #e0e0e0; background: #fff; z-index: 103; position: relative; } .gngLogo { z-index: 105; left: 60px; right: 60px; position: absolute; } .gngLogo a { display: block; height: 60px; text-indent: -9999px; background: url('../../img/common/intranet_logo_b.png')no-repeat center center; -webkit-transition: all 0.3s; transition: all 0.3s; } .gnbMo { display: block; width: 60px; height: 60px; position: fixed; z-index: 105; padding: 23px 25px 23px 15px; left: 0; top: 0; cursor: pointer; } .gnbMo span { display: block; height: 1px; background: #000; margin-bottom: 5px; position: relative; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; } .gnbMo span:last-child { margin-bottom: 0; } .gnbMo.on span:nth-child(1) { opacity: 0; } .gnbMo.on span:nth-child(2) { margin-bottom: 6px; margin-left: -4px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); } .gnbMo.on span:nth-child(3) { margin-top: -7px; margin-left: -4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); } .gnbMpg { position: absolute; right: 0; top: 0; width: 60px; height: 60px; padding: 15px; z-index: 105; } .gnbMpg a { display: block; width: 30px; height: 30px; text-indent: -9999px; background: #387de6 url("../../img/common/gnb_mypage.png")no-repeat center center; background-size: 14px auto; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .gnbWrap { position: fixed; z-index: 102; top: 0; left: 0; right: 0; width: 100%; height: 0px; padding-top: 61px; overflow: hidden; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; } .gnbWrap.on { height: 100%; } .gnbWrap .container { padding-left: 0; padding-right: 0; height: 100%; } html.on, body.on { display: block; height: 100%; overflow: hidden; } .gnbRht { background: #387de6; } .gnbRht:after { content: ''; display: table; clear: both; } .gnbRht li { padding: 0; width: 50%; margin-right: 0; float: left; width: 50%; } .gnbRht li:first-child { border-right: solid 1px rgba(255,255,255,0.2); } .gnbRht li a { display: block; height: 50px; line-height: 50px; text-align: center; color: #fff; font-size: 12pt; } .gnbMenu { height: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; background: #fff; } .gnbMenu > li { position: relative; text-align: left; z-index: 1; border-bottom: solid 1px #ddd; } .gnbMenu > li > a { display: block; height: 60px; line-height: 60px; font-size: 13pt; padding: 0 15px; font-weight: 500; } .gnbMenu > li > a:after { content: ''; display: table; clear: both; } .gnbMenu > li > a.mlink:after { content: ''; display: block; width: 8px; height: 14px; position: absolute; right: 15px; top: 50%; margin-top: -7px; background: url('../../img/common/mobile_link.png')no-repeat center bottom; background-size: 100% auto; } .gnbMenu > li > span { display: block; position: absolute; left: 0; right: 0; top: 0; height: 60px; cursor: pointer; } .gnbMenu > li > span:after { content: ""; display: block; width: 14px; height: 8px; position: absolute; right: 15px; top: 50%; margin-top: -4px; background: url('../../img/common/mobile_updown.png')no-repeat center bottom; background-size: 100% auto; } .gnbMenu > li > span.on:after { background-position: center top !important; } .gnbMenu > li > ul { display: none; background: #fafafa; border-top: solid 1px #ddd; padding: 15px; } .gnbMenu > li > ul > li { padding-left: 20px; } .gnbMenu > li > ul > li > a { display: block; height: 40px; line-height: 40px; font-size: 11pt; position: relative; padding-left: 15px; background: url('../../img/common/mobile_arrow.png')no-repeat right center; background-size: 7px auto; } .gnbMenu > li > ul > li > a br { display: none; } .gnbMenu > li > ul > li > a:before { content: ''; display: block; width: 7px; height: 9px; position: absolute; left: 0; top: 50%; margin-top: -4px; background: url('../../img/common/gnb_mobile_dot.png')no-repeat right center; background-size: 100% auto; } .gnbMenu > li.gbbBg { display: none; } } /* Footer */ #footer { background: #232323; padding-top: 35px; padding-bottom: 45px; margin-top: 120px; } #footer.main { margin-top: 0; } .ftMenu { } .ftMenu:after { content: ''; display: table; clear: both; } .ftMenu li { float: left; position: relative; padding-right: 20px; margin-right: 20px; } .ftMenu li:last-child { padding-right: 0; margin-right: 0; } .ftMenu li:after { content: ''; display: block; width: 2px; height: 2px; background: #5e5e5e; position: absolute; right: -1px; top: 50%; margin-top: -1px; } .ftMenu li:last-child:after { display: none; } .ftMenu li a { color: #fff; font-size: 12pt; } .ftAddr { margin-top: 15px; } .ftAddr:after { content: ''; display: table; clear: both; } .ftAddr dl { float: left; font-size: 10pt; margin-right: 20px; } .ftAddr dl:last-child { margin-right: 0; } .ftAddr dl:after { content: ''; display: table; clear: both; } .ftAddr dl dt { float: left; color: #5f5f5f; margin-right: 10px; } .ftAddr dl dd { float: left; color: #767676; } .ftAddr dl dd span { margin-left: 5px; } .ftCopy { color: #414141; font-size: 9pt; font-weight: 500; } @media (max-width:750px) { #footer { padding-top: 30px; padding-bottom: 30px; text-align: center; margin-top: 60px; } .ftMenu li { float: none; display: inline-block; padding-right: 15px; margin-right: 15px; } .ftMenu li a { font-size: 11pt; } .ftAddr { margin-top: 20px; } .ftAddr dl { float: none; margin-right: 0; margin-bottom: 15px; } .ftAddr dl:last-child { margin-bottom: 0; } .ftAddr dl dt { float: none; margin-right: 0; font-size: 12pt; } .ftAddr dl dd { float: none; } .ftAddr dl dd span { margin-left: 0; display: block; } .ftCopy { margin-top: 15px; } .ftCopy span { display: block; } } /* Main */ #main { max-height: 880px; padding-top: 170px; padding-bottom: 300px; background: url('../../img/main/main_bg.jpg')no-repeat center center; background-size: cover; } .mainTop { text-align: center; color: #fff; } .mainTop h2 { line-height: 1.0em; font-size: 52pt; font-weight: 400; } .mainTop h2 span { font-weight: 700; } .mainTop p { font-size: 14pt; font-weight: 300; margin-top: 20px; } .mainTab { margin-top: 100px; } .mainTab:after { content: ''; display: table; clear: both; } .mainTab li { float: left; position: relative; padding-right: 16px; margin-right: 15px; } .mainTab li:last-child { margin-right: 0; padding-right: 0; } .mainTab li:after { content: ''; display: block; width: 1px; height: 14px; background: #fff; position: absolute; right: 0; top: 50%; margin-top: -7px; } .mainTab li:last-child:after { display: none; } .mainTab li a { display: block; font-size: 14pt; color: rgba(255,255,255,0.5); } .mainTab li.current a { color: #fff; } .mainSch { margin-top: 15px; } .mainSch:after { content: ''; display: table; clear: both; } .mainSch > li { background: #fff; float: left; width: 16.6666%; border-right: solid 1px #e8e8e8; height: 130px; } .mainSch > li:first-child { border-radius: 5px 0px 0px 5px; -moz-border-radius: 5px 0px 0px 5px; -webkit-border-radius: 5px 0px 0px 5px; } .mainSch > li:last-child { border-right: none; background: #387de6; border-radius: 0px 5px 5px 0px; -moz-border-radius: 0px 5px 5px 0px; -webkit-border-radius: 0px 5px 5px 0px; } .msCont { } .msCont em { display: block; color: #aaa; font-size: 11pt; height: 50px; padding: 30px 20px 0; font-style: normal; } .msCont select { height: 80px; width: 100%; border: none; padding: 0 30px; } a.msBtn { display: block; line-height: 30px; text-align: center; font-size: 16pt; color: #fff; margin-top: 20px; } a.msBtn span { display: inline-block; width: 100%; } .msBtn:after { content: ''; display: inline-block; width: 32px; height: 17px; margin-left: 20px; background: url('../../img/main/main_search_btn.png')no-repeat center center; background-size: cover; } .msSel { position: relative; } .msSel span { display: block; height: 80px; line-height: 80px; padding-left: 20px; padding-right: 40px; font-size: 15pt; font-weight: 500; color: #222; cursor: pointer; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .msSel.disable span { color: #ccc; } .msSel span:after { content: ''; display: block; width: 11px; height: 6px; position: absolute; right: 20px; top: 50%; margin-top: -3px; background: url('../../img/main/select_arrow.png')no-repeat center bottom; background-size: 100% auto; } .msSel span.on:after { background-position: center top !important; } .msSel.disable span:after { opacity: 0.4; } .msSel > div { position: absolute; left: 0; right: 0; top: 100%; z-index: 10; display: none; } .msSel > div:before { content: ''; display: block; box-sizing: border-box; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid; border-bottom-color: #fff; margin-left: 30px; transition: margin-left .3s ease-out; } .msSel > div > div { overflow: hidden; background: #fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .msSel ul { padding: 5px 10px; overflow-y: auto; max-height: 15em; } .msSel ul li { border-bottom: solid 1px #e5e5e5; } .msSel ul li:last-child { border-bottom: none; } .msSel ul li a { font-size: 11pt; display: block; padding: 10px; } @media (max-width:1000px) { #main { max-height: auto; padding-top: 60px; padding-bottom: 60px; background-size: cover; } .mainTop h2 { font-size: 22pt; } .mainTop p { font-size: 12pt; margin-top: 10px; } .mainSch { margin-top: 30px; padding: 0 30px; } .mainSch > li { float: none; width: 100% !important; height: auto; border-right: none; margin-bottom: 10px; border-radius: 5px !important; -moz-border-radius: 5px !important; -webkit-border-radius: 5px !important; } .mainSch > li:last-child { margin-bottom: 0; margin-top: 30px; } .msCont em { display: none; } a.msBtn { height: 50px; line-height: 50px; font-size: 14pt; } a.msBtn span { display: inline; } .msBtn:after { width: 22px; height: 12px; margin-left: 10px; } .msSel span { height: 50px; line-height: 50px; padding-left: 10px; padding-right: 30px; font-size: 12pt; font-weight: 500; } .msSel span:after { right: 10px; } .msSel > div { left: -10px; right: -10px; padding: 0 10px 10px; } .msSel > div > div { overflow: visible; -webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.4); box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.4); } .msSel ul { overflow-y: visible; max-height: 100%; } .msSel ul li { border-bottom: solid 1px #e5e5e5; } .msSel ul li:last-child { border-bottom: none; } .msSel ul li a { font-size: 11pt; display: block; padding: 10px; } } @media (max-width:320px) { } /* pageCommon */ #subTitle { height: 200px; padding-bottom: 60px; background: url('../../img/common/subTitle_bg.jpg')no-repeat center center; background-size: cover; } #subTitle > div { display: table; width: 100%; height: 100%; } #subTitle > div > div { display: table-cell; width: 100%; vertical-align: middle; } #subTitle h2 { line-height: 1.2em; font-weight: 400; color: #fff; font-size: 26pt; text-align: center; line-height: 1.0em; } #subTitle h2 span { display: block; font-size: 14pt; font-weight: 300; } #subTitle h2 b { font-weight: 700; } #breadcrumb { background: rgba(0,0,0,0.7); margin-top: -60px; } #breadcrumb dl { } #breadcrumb dl:after { content: ""; display: table; clear: both; } #breadcrumb dl > dd { float: left; position: relative; border-right: solid 1px rgba(255,255,255,0.2); margin-left: -1px; } #breadcrumb dl > dd:first-child { border-right: none; } #breadcrumb dl > dd > a, #breadcrumb dl > dd > span { display: block; height: 60px; line-height: 60px; position: relative; color: #fff; } #breadcrumb dl > dd > span:after { content: ""; display: block; width: 16px; height: 10px; position: absolute; right: 20px; top: 50%; margin-top: -5px; background: url("../../img/common/breadcrumb_arrow.png")no-repeat center bottom; background-size: 100% auto !important; } #breadcrumb dl > dd > span.on:after { background-position: center top !important; } #breadcrumb dl > dd > a { width: 60px; text-indent: -9999px; background: #0047a7 url("../../img/common/breadcrumb_home.png")no-repeat center center; background-size: 14px auto; } #breadcrumb dl > dd > span { width: 260px; padding-left: 20px; cursor: pointer; } #breadcrumb dl > dd:last-child > span { width: 350px; } #breadcrumb dl > dd > ul { position: absolute; left: 0; right: -1px; top: 100%; background: #fff; padding: 10px 0; border: solid 1px #e5e7ea; display: none; z-index: 10; } #breadcrumb dl > dd > ul > li { padding: 5px 20px; } #breadcrumb dl > dd > ul > li > a { display: block; } #breadcrumb dl > dd > ul > li.current > a { color: #238dfa; font-weight: 500; } #subPage { padding-bottom: 260px; } #pageTitle { margin: 60px 0; } #pageTitle.lgn { padding-top: 120px; background: url("../../img/common/gnb_logo.png")no-repeat center top; } #pageTitle > h3 { text-align: center; font-size: 30pt; color: #333; letter-spacing: -0.025em; font-weight: 700; line-height: 1.0em; letter-spacing: -0.075em; position: relative; } #pageTitle > p { text-align: center; font-size: 12pt; color: #6b6b6b; letter-spacing: 0em; font-weight: 300; margin-top: 40px; line-height: 1.8em; } .subTab { } .subTab:after { content: ''; display: table; clear: both; } .subTab li { float: left; color: #949494; font-size: 14pt; border: solid 1px #d3d3d3; border-left: solid 1px #fff; background: #f9f9f9; } .subTab li:first-child { border-left: solid 1px #d3d3d3; } .subTab.col2 li { width: 50%; } .subTab.col3 li { width: 33.3333%; } .subTab.col4 li { width: 25%; } .subTab.col5 li { width: 20%; } .subTab li a { display: block; height: 58px; line-height: 58px; text-align: center; } .subTab li.current { border-color: #1e52bd !important; color: #1e52bd; border-bottom: solid 1px #fff !important; background: #fff; } @media (max-width:800px) { #subTitle { height: 160px; background-size: cover !important; padding-bottom: 40px; } #subTitle h2 { font-size: 18pt; line-height: 1.0em; } #subTitle h2 span { font-size: 10pt; } #breadcrumb { margin-top: -40px; } #breadcrumb .container { padding-left: 0; padding-right: 0; } #breadcrumb dl { position: relative; padding-left: 40px; } #breadcrumb dl > dd { float: left; width: 50%; margin-left: 0; border-right: none; } #breadcrumb dl > dd:first-child { position: absolute; left: 0; top: 0; bottom: 0; width: 40px; border-right: none; border-left: none; } #breadcrumb dl > dd > a, #breadcrumb dl > dd > span { height: 40px; line-height: 40px; } #breadcrumb dl > dd > a { width: 40px; background-size: 15px auto !important; } #breadcrumb dl > dd > span { width: 100% !important; padding-left: 10px; font-size: 10pt; padding-right: 25px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #breadcrumb dl > dd > span:after { right: 10px; width: 8px; height: 5px; background-size: cover !important; margin-top: -3px; } #breadcrumb dl > dd > ul > li { padding: 5px 10px; } #breadcrumb dl > dd > ul > li > a { font-size: 10pt; } #subPage { padding-bottom: 70px; } #pageTitle { margin: 40px 0; } #pageTitle.lgn { padding-top: 0; background: none; } #pageTitle > h3 { font-size: 18pt; } #pageTitle > h3:before { width: 24px; height: 2px; margin-left: -12px; } .subTab li { font-size: 10pt; } .subTab li a { height: 42px; line-height: 42px; } } /* --------------------------------------- */ /* Offline */ /* --------------------------------------- */ @media (min-width:801px) { .offTab { padding-top: 50px; } .offtName { display: none; } .offtList { display: block !important; } .offtList:after { content: ""; display: table; clear: both; } .offtList li { float: left; width: 33.3333%; border: solid 1px #dfdfdf; border-right: none; position: relative; } .offtList li:last-child { border-right: solid 1px #dfdfdf; } .offtList li a { display: block; text-align: center; height: 38px; line-height: 38px; color: #898989; background: #f9f9f9; } .offtList li.current { border-color: #0047a7; } .offtList li.current:after { content: ""; display: block; width: 1px; background: #0047a7; position: absolute; top: -1px; bottom: -1px; right: -1px; z-index: 1; } .offtList li:last-child.current:after { display: none; } .offtList li.current a { background: #fff; color: #0047a7; } .offMonth { margin: 0 -5px; padding-top: 30px; } .offMonth ul { transform: translateZ(0px) translateX(0px) !important; width: auto !important; } .offMonth ul li { width: 8.3333%; padding: 0 5px; } .offMonth ul li a { height: 40px; line-height: 40px; } } @media (max-width:800px) { .offTab { padding-top: 15px; position: relative; } .offtName { display: block; background: #f8f8f8; border: solid 1px #e1e1e1; height: 40px; line-height: 40px; position: relative; padding: 0 15px; color: #0047a7; cursor: pointer; } .offtName:after { content: ""; display: block; width: 17px; height: 10px; position: absolute; right: 15px; top: 50%; margin-top: -5px; background: url("../../img/offline/tab_arrow.png")no-repeat center bottom; background-size: 100% auto !important; } .offtName.on:after { background-position: center top !important; } .offtList { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-left: solid 1px #e1e1e1; border-right: solid 1px #e1e1e1; z-index: 1; } .offtList li { border-bottom: solid 1px #e1e1e1; } .offtList li a { display: block; padding: 0 15px; height: 38px; line-height: 38px; color: #898989; } .offtList li.current a { color: #0047a7; } .offMonth { margin: 0 -3px; padding-top: 15px; } .offMonth ul li { width: 60px; padding: 0 3px; } .offMonth ul li a { height: 34px; line-height: 34px; font-size: 10pt; } } .offMonth ul:after { content: ""; display: table; clear: both; } .offMonth ul li { float: left; } .offMonth ul li a { display: block; text-align: center; background: #f0f2f8; color: #0047a7; } .offMonth ul li.active a { background: #0047a7; color: #fff; } .offDesc { padding-top: 50px; padding-bottom: 10px; } .offDesc:after { content: ""; display: table; clear: both; } .offDesc p { float: left; white-space: nowrap; height: 50px; line-height: 50px; } .offDesc > a { float: right; display: block; width: 150px; height: 50px; line-height: 50px; text-align: center; background: #0047a7; color: #fff; } .offDesc ul { float: left; padding-top: 15px; } .offDesc ul:after { content: ''; display: table; clear: both; } .offDesc ul li { float: left; position: relative; padding-right: 15px; margin-right: 15px; } .offDesc ul li:last-child { padding-right: 0; margin-right: 0; } .offDesc ul li:after { content: ''; display: block; width: 1px; height: 14px; background: #e0e0e0; position: absolute; right: 0; top: 50%; margin-top: -7px; } .offDesc ul li:last-child:after { display: none; } .offDesc ul li a { display: block; font-size: 12pt; height: 20px; line-height: 20px; } .offDesc ul li.current a { color: #0047a7; } /* .offList {margin-bottom:50px;} */ .offList > h5 { display: block; height: 50px; line-height: 50px; text-align: center; font-weight: 400; font-size: 14pt; background: #f4f4f4; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; } .offList.current > h5 { background: #dadde7; } .offList tr th, .offList tr td { padding: 20px; border-bottom: solid 1px #eaeaea; } .offList tr th { width: 100px; text-align: center; font-weight: 400; } .offList tr td { text-align: left; } .offList tr th, .offList tr td p, .offList tr td span { font-size: 12pt; } .offList tr td span { color: #0047a7; } .offList tr.disable th, .offList tr.disable td p, .offList tr.disable td span { color: #888; } @media (max-width:800px) { .offDesc { padding-top: 30px; padding-bottom: 15px; } .offDesc p { float: none; white-space: normal; height: auto; line-height: 1.6em; } .offDesc ul { float: none; padding-top: 0; text-align: center; } .offDesc ul li { float: none; display: inline-block; padding-right: 10px; margin-right: 10px; } .offDesc ul li:after { height: 10px; margin-top: -5px; } .offDesc ul li a { font-size: 11pt; } .offDesc > a { float: none; margin: 0 auto; width: 120px; height: 40px; line-height: 40px; margin-top: 15px; } .offList { margin-bottom: 30px; } .offList h5 { height: 40px; line-height: 40px; font-size: 12pt; } .offList tr th, .offList tr td { padding: 15px 0; } .offList tr th { width: 80px; } .offList tr th, .offList tr td p, .offList tr td span { font-size: 11pt; } } /* --------------------------------------- */ /* Online */ /* --------------------------------------- */ .brdSch { padding: 10px 20px; background: #f3f3f3; } .brdSch div { position: relative; padding-right: 50px; } .brdSch input[type="text"] { display: block; width: 100%; height: 50px; border: none; padding: 0 15px; font-size: 14pt; font-weight: 300; } .brdSch input[type="submit"] { display: block; width: 50px; height: 50px; position: absolute; right: 0; top: 0; border: none; text-indent: -9999px; background: #3a3a3a url("../../img/online/search_ico.png")no-repeat center center; background-size: 50px auto; } .brdSch.slct div { padding-left: 250px; } .brdSch.slct select { display: block; position: absolute; left: 0; top: 0; width: 240px; height: 50px; border: none; } .fairList { padding-top: 50px; } .fairList > li { border: solid 1px #d6d6d6; margin-bottom: 30px; } .fairList > li:last-child { margin-bottom: 0; } .fairLec { } .fairLec th { padding: 20px; width: 270px; vertical-align: middle; } .fairLec th img { display: block; max-width: 100%; } .fairLec td { vertical-align: middle; } .fairList.off .fairLec td { padding: 30px 20px; } .fairLec td h5 { font-size: 14pt; font-weight: 400; line-height: 20px; } .fairLec td h5 span { display: inline-block; vertical-align: middle; width: 40px; height: 20px; line-height: 20px; text-align: center; font-size: 10pt; color: #fff; background: #ff6600; margin-right: 5px; } .fairLec td h5 span.grn { color: #259e41; } .fairLec td dl { margin-top: 20px; } .fairLec td dl:after { content: ""; display: table; clear: both; } .fairLec td dt { float: left; width: 100%; font-size: 12pt; margin-bottom: 5px; } .fairLec td dd { float: left; position: relative; padding-right: 15px; margin-right: 15px; font-size: 11pt; color: #888; white-space: nowrap; } .fairLec td dd:after { content: ""; display: block; width: 1px; height: 14px; background: #d6d6d6; position: absolute; right: 0; top: 50%; margin-top: -7px; } .fairLec td dd:last-child:after { display: none; } .fairLec td dd span { font-size: 11pt; color: #238dfa; } .fairBook { border-top: solid 1px #d6d6d6; padding: 20px 30px; } .fairBook p { font-size: 12pt; margin-bottom: 10px; } .fairBook input[type="checkbox"] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; } .fairBook label { display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 12pt; color: #888; } .fairBook label b { font-size: 12pt; color: #ff0000; } .fairBook label span { font-size: 12pt; color: #000; } .fairCost { background: #f9f9f9; padding: 10px 20px 10px 30px; } .fairCost:after { content: ""; display: table; clear: both; } .fairCost p { font-size: 12pt; color: #888; float: left; line-height: 40px; } .fairCost p b { font-size: 12pt; color: #ff0000; } .fairCost p span { font-size: 12pt; color: #000; } .fairCost dl { float: right; } .fairCost dl:after { content: ""; display: table; clear: both; } .fairCost dl dt { float: left; margin-right: 10px; } .fairCost dl dd { float: left; } .fairCost a { display: block; width: 100px; height: 40px; line-height: 38px; border: solid 1px #2e2d76; font-size: 12pt; text-align: center; } .fairCost dl dt a { color: #2e2d76; background: #fff; } .fairCost dl dd a { color: #fff; background: #2e2d76; } .fairInfo { border: solid 1px #d6d6d6; margin-top: 50px; } .fairInfo h5 { background: #f1f8ff; font-size: 16pt; font-weight: 400; line-height: 20px; padding: 30px 20px; } .fairInfo h5:after { content: ""; display: table; clear: both; } .fairInfo h5 span { display: block; float: left; width: 40px; height: 20px; line-height: 20px; text-align: center; font-size: 10pt; color: #fff; background: #ff6600; margin-right: 10px; } .fairInfo table { } .fairInfo table th { padding: 20px; width: 270px; vertical-align: top; } .fairInfo table th img { display: block; max-width: 100%; } .fairInfo table td { vertical-align: top; padding: 20px; padding-left: 0; } .fairInfo.thumbNo table td { padding-left: 20px; } .fairInfo table td ul li { padding-left: 8px; position: relative; margin-bottom: 10px; font-size: 12pt; } .fairInfo table td ul li:last-child { margin-bottom: 0; } .fairInfo table td ul li:before { content: ""; display: block; width: 2px; height: 2px; background: #000; position: absolute; left: 0; top: 12px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .fairInfo table td ul li dl { } .fairInfo table td ul li dl:after { content: ""; display: table; clear: both; } .fairInfo table td ul li dl dd { float: left; font-size: 12pt; white-space: nowrap; margin-right: 30px; padding-left: 8px; position: relative; } .fairInfo table td ul li dl dd:before { content: ""; display: block; width: 2px; height: 2px; background: #000; position: absolute; left: 0; top: 12px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .fairInfo table td ul li dl dd:first-child { padding-left: 0; } .fairInfo table td ul li dl dd:first-child:before { display: none; } .fairInfo table td ul li dl dd span { font-size: 12pt; color: #238dfa; } .fairInfo table td ul li > span { font-size: 12pt; color: #ff6600; } .fairRadio { padding: 5px 0; } .fairRadio div { margin: 2px 0; } .fairRadio div input[type="radio"] { display: inline; vertical-align: middle; margin-right: 5px; } .fairRadio label { font-size: 12pt; display: inline; vertical-align: middle; } .fairCover { } .fairCover h4 { padding-left: 25px; font-size: 16pt; color: #0047a7; font-weight: 400; margin-bottom: 5px; margin-top: 60px; background: url("../../img/online/title_ico.png")no-repeat left center; background-size: 16px auto; } .fairCover > div { border: solid 1px #d6d6d6; } .fairCover th { width: 160px; padding: 20px; } .fairCover th em { display: block; padding-bottom: 125%; border: solid 1px #e8e8e8; background-size: cover !important; } .fairCover td { padding: 20px; padding-left: 0; } .fairCover td h5 { font-size: 14pt; font-weight: 400; line-height: 20px; } .fairCover td h5:after { content: ""; display: table; clear: both; } .fairCover td h5 span { display: block; float: left; width: 40px; height: 20px; line-height: 20px; text-align: center; font-size: 10pt; color: #fff; background: #00aeea; margin-right: 5px; } .fairCover td dl { margin-top: 10px; } .fairCover td dl:after { content: ""; display: table; clear: both; } .fairCover td dd { float: left; position: relative; padding-right: 15px; margin-right: 15px; font-size: 11pt; color: #888; white-space: nowrap; } .fairCover td dd:after { content: ""; display: block; width: 1px; height: 14px; background: #d6d6d6; position: absolute; right: 0; top: 50%; margin-top: -7px; } .fairCover td dd:last-child:after { display: none; } .fairCover td dd span { font-size: 11pt; color: #000; } .fairCover td p { padding-top: 10px; } .fairCover td p:after { content: ""; display: table; clear: both; } .fairCover td p span { display: block; float: left; height: 20px; line-height: 18px; border: solid 1px #000; text-align: center; font-size: 10pt; margin-right: 10px; padding: 0 15px; } .fairCover td p b { font-size: 12pt; color: #ff0011; line-height: 20px; } .fairCover td p em { font-style: normal; font-size: 12pt; color: #000; line-height: 20px; } .fairCover td > div { padding-top: 25px; } .fairCover td > div input[type="checkbox"] { display: inline-block; vertical-align: middle; width: 20px; height: 20px; } .fairCover td > div label { display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 12pt; color: #888; } .fairTab { margin-top: 60px; } .fairTab:after { content: ""; display: table; clear: both; } .fairTab li { float: left; width: 33.3333%; background: #f9f9f9; border: solid 1px #dfdfdf; border-right: none; } .fairTab.col2 li { width: 50%; } .fairTab li:last-child { border-right: solid 1px #dfdfdf; } .fairTab li a { display: block; height: 48px; line-height: 48px; text-align: center; font-size: 12pt; color: #898989; } .fairTab li.current { background: #fff; border-color: #0047a7; border-bottom-color: #fff; position: relative; } .fairTab li.current:after { content: ""; display: block; width: 1px; background: #0047a7; position: absolute; right: -1px; top: -1px; bottom: -1px; } .fairTab li.current a { color: #0047a7; } .fairIntro { padding: 30px 20px; } .fairIntro dt { position: relative; padding-left: 22px; font-size: 13pt; } .fairIntro dt:before { content: ""; display: block; width: 16px; height: 16px; border: solid 4px #000; box-sizing: border-box; position: absolute; left: 0; top: 50%; margin-top: -8px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .fairIntro dd { padding: 0 20px; margin-top: 15px; } .fairIntro dd ul { } .fairIntro dd ul li { margin-bottom: 10px; font-size: 12pt; } .fairIntro dd ul li:last-child { margin-bottom: 0; } .fairTch th { width: 120px; vertical-align: middle; } .fairTch th em { display: block; padding-bottom: 116%; border: solid 1px #e8e8e8; background-size: cover !important; } .fairTch td { padding-left: 20px; vertical-align: middle; } .fairTch td h5 { font-size: 13pt; } .fairTch td p { font-size: 11pt; color: #888; margin-top: 15px; } .fairStand { border-left: solid 2px #fff; border-right: solid 2px #fff; } .fairStand th, .fairStand td { text-align: center; border: solid 1px #d6d6d6; } .fairStand th { background: #f9f9f9; font-size: 11pt; padding: 10px; font-weight: 300; } .fairStand td { font-size: 12pt; padding: 15px 10px; } .fairMock { border-left: solid 2px #fff; border-right: solid 2px #fff; margin-top: 30px; } .fairMock th, .fairMock td { padding: 20px; border: solid 1px #d6d6d6; font-size: 12pt; } .fairMock th { background: #f9f9f9; width: 90px; font-weight: 400; } .fairMock td p { line-height: 20px; } .fairMock td p:after { content: ""; display: table; clear: both; } .fairMock td p span { display: block; float: left; height: 20px; line-height: 20px; background: #0047a7; color: #fff; text-align: center; font-size: 10pt; margin-right: 10px; padding: 0 10px; } .fairRcmd { padding: 30px 20px; } .fairRcmd > h5 { position: relative; padding-left: 22px; font-size: 13pt; } .fairRcmd > h5:before { content: ""; display: block; width: 16px; height: 16px; border: solid 4px #000; box-sizing: border-box; position: absolute; left: 0; top: 50%; margin-top: -8px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .fairRcmd .fairList { padding-top: 15px; } .clsTitle { padding-left: 25px; font-size: 16pt; color: #000; font-weight: 700; margin-bottom: 15px; margin-top: 60px; background: url("../../img/online/title_ico.png")no-repeat left center; background-size: 20px auto; position: relative; } .clsTitle span { font-weight: 300; } .clsList { border-top: solid 1px #d6d6d6; } .clsList li { padding: 30px 20px; border: solid 1px #d6d6d6; border-top: none; } .clsList li h5 { line-height: 20px; font-size: 13pt; } .clsList li h5:after { content: ""; display: table; clear: both; } .clsList li h5 span { display: block; float: left; height: 20px; line-height: 20px; background: #383838; color: #fff; text-align: center; font-size: 9pt; margin-right: 5px; padding: 0 5px; } .clsList li h5 span.ppl { background: #a404b2 } .clsList li h5 em { font-style: normal; color: #238dfa; font-size: 13pt; } .clsList p { font-size: 11pt; color: #888; margin-top: 5px; font-weight: 300; } .clsChk th, .clsChk td { border-bottom: solid 1px #d6d6d6; padding: 20px; } .clsChk th { width: 150px; background: #f9f9f9; text-align: center; font-weight: 400; font-size: 12pt; } .clsChk ul:after { content: ""; display: table; clear: both; } .clsChk ul li { float: left; margin-right: 20px; } .clsChk ul li:last-child { margin-right: 0; } .clsChk ul li input[type="radio"] { display: inline-block; vertical-align: middle; } .clsChk ul li label { display: inline-block; vertical-align: middle; font-size: 12pt; } .clsTable { border-top: solid 2px #d6d6d6; border-left: solid 2px #fff; border-right: solid 2px #fff; } .clsTable th, .clsTable td { padding: 10px 20px; font-size: 12pt; font-weight: 300; border-top: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; } .clsTable th { width: 190px; background: #fafafa; } .clsTable th span { font-size: 12pt; color: #ff0000; } .clsTable th em { font-style: normal; font-size: 12pt; font-weight: 300; } .clsTable td { } .clsTable td select { } .clsTable td input[type="text"], .clsTable td input[type="tel"] { } .clsTable td ul { } .clsTable td ul:after { content: ""; display: table; clear: both; } .clsTable td ul li { float: left; } .clsTable td ul li select, .clsTable td ul li input[type="text"], .clsTable td ul li input[type="tel"] { display: block; width: 100%; min-width: 100%; } .clsTable td p { line-height: 40px; } .clsMail li:nth-child(1) { width: 200px; } .clsMail li:nth-child(2) { width: 40px; height: 40px; line-height: 40px; text-align: center; } .clsMail li:nth-child(3) { width: 200px; margin-right: 10px; } .clsMail li:nth-child(4) { width: 200px; } .clsPhone li:nth-child(1) { width: 130px; } .clsPhone li:nth-child(2), .clsPhone li:nth-child(4) { width: 20px; height: 40px; line-height: 40px; text-align: center; } .clsPhone li:nth-child(3) { width: 160px; margin-right: 10px; } .clsPhone li:nth-child(5) { width: 160px; } .clsDate:after { content: ""; display: table; clear: both; } .clsDate li { float: left; } .clsDate li:nth-child(even) { width: 15px; text-align: center; line-height: 40px; } .clsDate li:nth-child(odd) { width: 80px; } .clsDate li:first-child { width: 120px; } .clsCpny { } .clsCpny span { vertical-align: middle; } .clsCpny a { display: inline-block; vertical-align: middle; width: 90px; height: 40px; line-height: 38px; text-align: center; border: solid 1px #000; margin-left: 30px; } .clsFile { position: relative; padding-right: 170px; } .clsFile a { display: block; width: 150px; height: 40px; line-height: 40px; text-align: center; font-size: 11pt; color: #fff; position: absolute; right: 0; top: 50%; margin-top: -20px; background: #0047a7; } .clsPrivacy { padding: 20px; font-size: 11pt; font-weight: 300; background: #fafafa; line-height: 1.8em; } .clsAgree { margin-top: 10px; } .clsAgree:after { content: ""; display: table; clear: both; } .clsAgree input[type="checkbox"] { width: 20px; height: 20px; float: left; margin-right: 5px; display: inline-block; vertical-align: top; } .clsAgree label { font-size: 12pt; font-weight: 500; line-height: 20px; display: inline; vertical-align: top; } .clsBtn { text-align: center; margin-top: 30px; } .clsBtn li { display: inline-block; padding: 0 5px; } .clsBtn li a { display: block; width: 220px; height: 60px; font-size: 13pt; } .clsBtn li:nth-child(1) a { line-height: 60px; background: #0047a7; color: #fff; } .clsBtn li:nth-child(2) a { border: solid 1px #0047a7; color: #0047a7; line-height: 58px; } .clsBtn li:nth-child(2) a span { font-size: 13pt; line-height: 58px; } .clsBtn li:nth-child(3) a { line-height: 60px; background: #0047a7; color: #fff; } .clsBtn.society li:nth-child(2) a { } .clsBtn.solo li a { width: 140px; background: #0047a7; } .clsPop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.7); z-index: 100; } .clsPop > div { display: table; width: 100%; height: 100%; } .clsPop > div > div { display: table-cell; width: 100%; vertical-align: middle; } .clsPopWrap { width: 100%; max-width: 620px; max-height: 100%; margin: 0 auto; background: #fff; position: relative; } .clsPopTitle { background: #0047a7; position: relative; padding: 0 20px; } .clsPopTitle h5 { height: 50px; line-height: 50px; color: #fff; font-size: 16pt; } .clsPopTitle a { display: block; height: 50px; width: 50px; position: absolute; right: 0; top: 0; text-indent: -9999px; z-index: 1; cursor: pointer; background: url("../../img/common/gnb_close.png")no-repeat center center; background-size: 24px auto; } .clsPopCont { max-height: 90vh; padding: 30px; overflow-y: auto; background: #fff; } .clsPop.clsPopFull > div { display: block; width: 100%; } .clsPop.clsPopFull > div > div { display: block; height: 100%; vertical-align: middle; overflow: hidden; } .clsPop.clsPopFull > div { display: block; height: 100%; padding-top: 30px; padding-bottom: 30px; } .clsPop.clsPopFull .clsPopWrap { position: relative; padding-top: 50px; height: 100%; -webkit-overflow-scrolling: touch; } .clsPop.clsPopFull .clsPopTitle { position: absolute; left: 0; right: 0; top: 0; } .clsPop.clsPopFull .clsPopCont { height: 100%; max-height: 90vh; overflow-y: auto; -webkit-overflow-scrolling: touch; } .clsPopScroll { position: absolute; left: 0; right: 0; top: 50px; bottom: 0; } .clspSch { padding: 20px; background: #fafafa; padding-right: 100px; position: relative; } .clspSch.slct { padding-left: 170px; } .clspSch.slct select { display: block; position: absolute; left: 20px; top: 20px; width: 140px; } .clspSch input[type="text"] { display: block; width: 100%; } .clspSch input[type="submit"] { display: block; position: absolute; right: 20px; top: 20px; width: 70px; height: 40px; background: #666; color: #fff; font-size: 11pt; border-radius: 0px 0px 0px 0px; -moz-border-radius: 0px 0px 0px 0px; -webkit-border-radius: 0px 0px 0px 0px; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .clspCpny { margin-top: 20px; } .clspCpny th, .clspCpny td { padding: 10px 0; border-top: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; } .clspCpny th { text-align: left; } .clspCpny th p { position: relative; padding-left: 8px; font-size: 12pt; font-weight: 400; color: #0047a7; } .clspCpny th p:before { content: ""; display: block; width: 2px; height: 2px; background: #000; position: absolute; left: 0; top: 50%; margin-top: -1px; } .clspCpny td { width: 70px; } .clspCpny td a { display: block; width: 100%; height: 30px; line-height: 28px; text-align: center; border: solid 1px #000; font-size: 11pt; } .clspNon { text-align: center; padding: 60px 0; font-size: 12pt; line-height: 1.8em; } .clspInput { padding-bottom: 50px; text-align: center; } .clspInput input[type="text"] { display: inline-block; vertical-align: middle; width: 70%; margin-right: 10px; } .clspInput input[type="submit"] { vertical-align: middle; display: inline-block; width: 70px; height: 40px; background: #353535; color: #fff; font-size: 12pt; border-radius: 0px 0px 0px 0px; -moz-border-radius: 0px 0px 0px 0px; -webkit-border-radius: 0px 0px 0px 0px; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .paging { text-align: center; padding-top: 30px; } .paging a { display: inline-block; vertical-align: middle; width: 40px; height: 40px; line-height: 38px; border: solid 1px #d6d6d6; } .paging > a { text-indent: -9999px; background-size: auto 10px !important; } .paging a.first { background: url("../../img/common/paging_first.png")no-repeat center center; } .paging a.prev { background: url("../../img/common/paging_prev.png")no-repeat center center; } .paging a.next { background: url("../../img/common/paging_next.png")no-repeat center center; } .paging a.last { background: url("../../img/common/paging_last.png")no-repeat center center; } .paging ul { display: inline-block; vertical-align: middle; margin: 0 10px; } .paging ul li { display: inline-block; vertical-align: middle; } .paging ul li.on a { border: solid 1px #353535; background: #353535; color: #fff; } .trstDesc { background: #fafafa; padding: 20px; margin-bottom: 30px; } .trstDesc p { position: relative; padding-left: 8px; font-size: 11pt; } .trstDesc p:before { content: ""; display: block; width: 2px; height: 2px; background: #000; position: absolute; left: 0; top: 50%; margin-top: -1px; } .trstList:after { content: ""; display: table; clear: both; } .trstList li { float: left; margin-right: 30px; } .trstList li input[type="radio"] { display: inline-block; vertical-align: middle; } .trstList li label { display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 11pt; } .trstBtn { padding-top: 30px; text-align: center; } .trstBtn a { display: inline-block; width: 220px; height: 60px; font-size: 13pt; line-height: 60px; background: #0047a7; color: #fff; } .clsAdd { display: block; width: 150px; height: 40px; line-height: 39px; text-align: center; background: #0047a7; color: #fff; font-size: 11pt; position: absolute; right: 0; bottom: 5px; } .clsSociety { border-top: solid 1px #d6d6d6; } .clsSociety li { padding: 25px 0; border-bottom: solid 1px #d6d6d6; } .clsSociety li h5 { } .clsSociety li h5:after { content: ""; display: table; clear: both; } .clsSociety li h5 span { float: left; display: block; height: 30px; line-height: 30px; margin-right: 15px; white-space: nowrap; font-size: 12pt; font-weight: 500; } .clsSociety li h5 a { float: left; display: block; width: 60px; height: 30px; line-height: 28px; border: solid 1px #0047a7; text-align: center; color: #0047a7; } .clsSociety dl { margin-top: 15px; } .clsSociety dl dd { margin-bottom: 5px; position: relative; padding-left: 8px; font-size: 12pt; } .clsSociety dl dd:last-child { margin-bottom: 0; } .clsSociety dl dd:before { content: ""; display: block; width: 2px; height: 2px; background: #333; position: absolute; left: 0; top: 50%; margin-top: -1px; } .sctyTable { } .clsTable.sctyTable th { width: 170px; } .sctyTable .clsMail li:nth-child(1) { width: 45%; } .sctyTable .clsMail li:nth-child(2) { width: 10%; } .sctyTable .clsMail li:nth-child(3) { width: 45%; margin-right: 0; } .sctyTable .clsMail li:nth-child(4) { width: 100%; margin-top: 10px; } .sctyTable .clsPhone li:nth-child(1) { width: 30%; } .sctyTable .clsPhone li:nth-child(2), .sctyTable .clsPhone li:nth-child(4) { width: 5%; } .sctyTable .clsPhone li:nth-child(3) { width: 30%; margin-right: 0; } .sctyTable .clsPhone li:nth-child(5) { width: 30%; } .sctyRadio { } .sctyRadio:after { content: ""; display: table; clear: both; } .sctyRadio li { float: left; margin-right: 20px; } .sctyRadio li:last-child { margin-right: 0; } .sctyRadio li input[type="radio"] { display: inline-block; vertical-align: middle; } .sctyRadio li label { display: inline-block; vertical-align: middle; font-size: 12pt; } .sctyChk { } .sctyChk:after { content: ""; display: table; clear: both; } .sctyChk li { float: left; width: 50%; } .sctyChk li input[type="checkbox"] { display: inline-block; vertical-align: middle; } .sctyChk li label { display: inline-block; vertical-align: middle; font-size: 12pt; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sctyBtn { padding: 30px 0; text-align: center; } .sctyBtn a { display: inline-block; width: 160px; height: 60px; line-height: 60px; background: #0047a7; color: #fff; font-size: 13pt; } .sctyNone { text-align: center; padding: 60px 0; font-size: 13pt; } .sctyNone span { color: #0047a7; font-size: 13pt; } html.lock, body.lock { width: 100%; height: 100%; overflow: hidden; } @media (max-width:940px) { .clsMail li:nth-child(1) { width: 45%; } .clsMail li:nth-child(2) { width: 10%; } .clsMail li:nth-child(3) { width: 45%; margin-right: 0; } .clsMail li:nth-child(4) { width: 100%; margin-top: 10px; } } @media (max-width:800px) { .brdSch { padding: 5px 10px; } .brdSch div { padding-right: 40px; } .brdSch input[type="text"] { height: 40px; padding: 0 10px; font-size: 11pt; } .brdSch input[type="submit"] { width: 40px; height: 40px; background-size: 40px auto; } .brdSch.slct div { padding-left: 105px; } .brdSch.slct select { width: 100px; min-width: 100px; height: 40px; border: none; font-size: 10pt; } .fairList { padding-top: 20px; } .fairList > li { margin-bottom: 15px; } .fairLec th { padding: 10px; width: 150px; vertical-align: top; } .fairLec td { padding: 10px 10px 10px 0; vertical-align: top; } .fairList.off .fairLec td { padding: 15px 10px; } .fairLec td h5 { font-size: 12pt; } .fairLec td h5 span { width: 30px; font-size: 9pt; margin-right: 5px; float: left; } .fairLec td dl { margin-top: 5px; } .fairLec td dt { float: none; font-size: 10pt; margin-top: 10px; margin-bottom: 5px; } .fairLec td dd { float: none; padding-right: 0; margin-right: 0; font-size: 10pt; white-space: normal; } .fairLec td dd:after { display: none; } .fairLec td dd span { font-size: 10pt; } .fairBook { padding: 10px; } .fairBook p { margin-bottom: 5px; } .fairBook label b { font-weight: 400; } .fairCost { padding: 5px 10px; } .fairCost p { font-size: 11pt; line-height: 34px; } .fairCost p b { font-size: 11pt; font-weight: 400; } .fairCost p span { font-size: 11pt; } .fairCost dl dt { margin-right: 5px; } .fairCost a { width: 80px; height: 34px; line-height: 32px; border: solid 1px #2e2d76; font-size: 11pt; text-align: center; } .fairInfo { margin-top: 20px; } .fairInfo h5 { font-size: 12pt; padding: 15px 10px; } .fairInfo table, .fairInfo table tbody, .fairInfo table tr, .fairInfo table th, .fairInfo table td { display: block; width: 100%; } .fairInfo table th { padding: 10px; width: 100%; vertical-align: middle; } .fairInfo table th img { width: 100%; } .fairInfo table td { padding: 10px; vertical-align: middle; } .fairInfo.thumbNo table td { padding-left: 10px; } .fairInfo table td ul li { padding-left: 6px; margin-bottom: 5px; font-size: 11pt; } .fairInfo table td ul li:before { top: 10px; } .fairInfo table td ul li dl dd { float: none; font-size: 11pt; white-space: normal; margin-right: 0; padding-left: 0; } .fairInfo table td ul li dl dd:before { top: 10px; left: -6px; } .fairInfo table td ul li dl dd span { font-size: 11pt; } .fairInfo table td ul li > span { font-size: 11pt; } .fairRadio div { position: relative; padding-left: 20px; } .fairRadio div input[type="radio"] { position: absolute; left: 0; top: 7px; } .fairRadio label { font-size: 11pt; margin-left: 0; } .fairCover h4 { padding-left: 15px; font-size: 13pt; margin-top: 30px; background-size: 11px auto; } .fairCover th { width: 110px; padding: 10px; } .fairCover td { padding: 20px 10px; } .fairCover td h5 { font-size: 12pt; line-height: 18px; } .fairCover td h5 span { width: 30px; height: 18px; line-height: 18px; font-size: 9pt; } .fairCover td dl { margin-top: 10px; } .fairCover td dd { float: none; padding-right: 0; margin-right: 0; font-size: 10pt; white-space: normal; } .fairCover td dd:after { display: none; } .fairCover td dd span { font-size: 10pt; } .fairCover td p span { font-size: 9pt; padding: 0 10px; } .fairCover td > div { padding-top: 10px; } .fairCover td > div label { font-size: 11pt; } .fairTab { margin-top: 30px; } .fairTab li a { height: 38px; line-height: 38px; font-size: 11pt; } .fairIntro { padding: 20px 0; } .fairIntro dt { padding-left: 16px; font-size: 12pt; } .fairIntro dt:before { width: 10px; height: 10px; border: solid 3px #000; margin-top: -5px; } .fairIntro dd { padding: 0; margin-top: 10px; } .fairIntro dd ul li { margin-bottom: 5px; font-size: 11pt; } .fairTch th { width: 80px; } .fairTch td { padding-left: 10px; vertical-align: middle; } .fairTch td h5 { font-size: 12pt; } .fairTch td p { font-size: 10pt; margin-top: 5px; } .fairStand th { font-size: 10pt; padding: 5px; } .fairStand td { font-size: 10pt; padding: 5px; } .fairMock th, .fairMock td { padding: 10px; font-size: 11pt; } .fairMock th { width: 60px; } .fairMock td p span { font-size: 9pt; margin-right: 5px; } .fairRcmd { padding: 20px 0; } .fairRcmd > h5 { padding-left: 16px; font-size: 12pt; } .fairRcmd > h5:before { width: 10px; height: 10px; border: solid 3px #000; margin-top: -5px; } .fairRcmd .fairList { padding-top: 5px; } .clsTitle { padding-left: 15px; font-size: 13pt; margin-top: 30px; background-size: 11px auto; margin-bottom: 5px; } .clsList li { padding: 15px 10px; } .clsList li h5 { font-size: 12pt; } .clsList li h5 em { font-size: 12pt; } .clsList p { font-size: 10pt; } .clsChk th, .clsChk td { padding: 10px; } .clsChk th { padding: 10px 0; } .clsChk th { width: 100px; font-size: 10pt; } .clsChk ul li { float: left; margin-right: 10px; } .clsChk ul li label { font-size: 11pt; } .clsTable th, .clsTable td { padding: 10px; font-size: 11pt; } .clsTable th { width: 90px; font-size: 10pt; font-weight: 400; } .clsTable th span { font-size: 10pt; } .clsTable th em { font-size: 10pt; display: block; } .clsTable td select { width: 100%; } .clsPhone li:nth-child(1) { width: 30%; } .clsPhone li:nth-child(2), .clsPhone li:nth-child(4) { width: 5%; } .clsPhone li:nth-child(3) { width: 30%; margin-right: 0; } .clsPhone li:nth-child(5) { width: 30%; } .clsDate li { width: 100%; } .clsDate li:nth-child(even) { width: 5%; } .clsDate li:nth-child(odd) { width: 30%; } .clsDate li:first-child { width: 30%; } .clsCpny a { margin-left: 20px; } .clsFile { padding-right: 0; } .clsFile a { width: 120px; height: 34px; line-height: 34px; font-size: 11pt; position: static; margin-top: 5px; } .clsPrivacy { padding: 10px; font-size: 10pt; } .clsAgree label { font-size: 11pt; } .clsBtn { margin-left: -5px; margin-right: -5px; } .clsBtn:after { content: ""; display: table; clear: both; } .clsBtn li { display: block; float: left; width: 33.3333%; } .clsBtn li a { width: 100%; height: 50px; font-size: 12pt; } .clsBtn li:nth-child(1) a { line-height: 50px; } .clsBtn li:nth-child(2) a { line-height: 1.2em; font-size: 11pt; letter-spacing: -0.075em; padding-top: 5px; } .clsBtn li:nth-child(2) a span { font-size: 11pt; display: block; line-height: 1.2em; letter-spacing: -0.075em; } .clsBtn li:nth-child(3) a { line-height: 50px; } .clsBtn.solo li a { width: 100%; } .clsBtn.society { text-align: center; } .clsBtn.society li { display: inline-block; float: none; vertical-align: middle; } .clsBtn.society li:nth-child(2) a { line-height: 50px; padding-top: 0; } .clsBtn.solo { text-align: center; } .clsBtn.solo li { display: inline-block; float: none; vertical-align: middle; } .clsPop { } .clsPop > div { display: block; } .clsPop > div > div { display: block; height: 100%; padding-left: 15px; padding-right: 15px; padding-top: 15px; padding-bottom: 15px; } .clsPopWrap { height: 100%; position: relative; padding-top: 50px; } .clsPopTitle { padding: 0 15px; position: absolute; left: 0; right: 0; top: 0; } .clsPopTitle h5 { height: 50px; line-height: 50px; font-size: 14pt; } .clsPopTitle a { height: 50px; width: 50px; background-size: 20px auto; } .clsPopCont { padding: 20px; height: 100%; max-height: 90vh; overflow-y: auto; } .clspSch { padding: 10px; padding-right: 80px; position: relative; } .clspSch input[type="submit"] { right: 10px; top: 10px; width: 60px; font-size: 11pt; } .clspSch.slct { padding-left: 130px; } .clspSch.slct select { left: 10px; top: 10px; min-width: 110px; width: 110px; } .clspCpny th p { font-size: 11pt; } .clspNon { padding: 40px 0; font-size: 11pt; line-height: 1.5em; } .clspInput { padding-bottom: 30px; } .clspInput input[type="text"] { width: 60%; } .clspInput input[type="submit"] { width: 60px; height: 40px; font-size: 11pt; } .paging { padding-top: 20px; } .paging a { width: 28px; height: 28px; line-height: 26px; } .paging ul { margin: 0 2px; } .trstDesc { padding: 10px; margin-bottom: 30px; } .trstList li { margin-right: 20px; } .trstBtn a { width: 160px; height: 50px; font-size: 12pt; line-height: 50px; } .clsTable.sctyTable th { width: 100px; } .sctyChk li { float: left; width: 100%; } .sctyNone { padding: 30px 0; } } @media (max-width:320px) { .clsBtn li a { font-size: 10pt; letter-spacing: -0.1em; white-space: nowrap; } } /* --------------------------------------- */ /* License */ /* --------------------------------------- */ .lcnSccss { padding: 40px; text-align: center; background: #fafafa; } .lcnSccss h5 { margin-bottom: 20px; } .lcnSccss h5 span { font-size: 22pt; color: #ff0000; } .lcnSccss p span { display: block; font-size: 13pt; line-height: 1.8em; font-weight: 300; } .lcnDate { margin-top: 20px; } .lcnDate li { font-size: 12pt; color: #888; font-weight: 300; } .lcnDate li b { font-size: 12pt; font-weight: 500; color: #ff0000; } .lcnFile { padding: 20px 20px 20px 30px; } .lcnFile:after { content: ""; display: table; clear: both; } .lcnFile span { display: block; float: left; margin-right: 10px; font-size: 12pt; color: #888; } .lcnFile ul { float: left; } .lcnFile ul:after { content: ""; display: table; clear: both; } .lcnFile ul li { float: left; padding-right: 10px; margin-right: 10px; position: relative; } .lcnFile ul li:after { content: ""; display: block; width: 1px; height: 10px; background: #aaa; position: absolute; right: 0; top: 50%; margin-top: -5px; } .lcnFile ul li:last-child:after { display: none; } .lcnFile ul li a { display: block; white-space: nowrap; font-size: 12pt; color: #888; } @media (max-width:800px) { .lcnSccss { padding: 30px 15px; } .lcnSccss h5 { margin-bottom: 20px; } .lcnSccss h5 span { font-size: 18pt; display: block; line-height: 1.3em; } .lcnSccss p span { display: inline; font-size: 11pt; line-height: 1.6em } .lcnDate { margin-top: 10px; } .lcnDate li { font-size: 11pt; } .lcnDate li b { font-size: 11pt; } .lcnFile { padding: 10px; } .lcnFile:after { content: ""; display: table; clear: both; } .lcnFile span { float: none; margin-right: 0; font-size: 11pt; font-weight: 500; } .lcnFile ul { float: none; margin-top: 5px; } .lcnFile ul li { float: none; padding-right: 0; margin-right: 0; } .lcnFile ul li:after { display: none; } .lcnFile ul li a { white-space: normal; font-size: 11pt; } } /* --------------------------------------- */ /* Book */ /* --------------------------------------- */ .bookList { } .bookList > li { border: solid 1px #d6d6d6; margin-bottom: 30px; } .bookList > li:last-child { margin-bottom: 0; } .bookList th { width: 160px; padding: 20px; } .bookList th em { display: block; padding-bottom: 125%; border: solid 1px #e8e8e8; background-size: cover !important; } .bookList td { padding: 20px; padding-left: 0; } .bookList td h5 { font-size: 14pt; font-weight: 400; line-height: 20px; } .bookList td h5:after { content: ""; display: table; clear: both; } .bookList td h5 span { display: block; float: left; width: 40px; height: 20px; line-height: 20px; text-align: center; font-size: 10pt; color: #fff; background: #00aeea; margin-right: 5px; } .bookList td dl { margin-top: 20px; } .bookList td dl:after { content: ""; display: table; clear: both; } .bookList td dd { float: left; position: relative; padding-right: 20px; margin-right: 20px; font-size: 12pt; color: #888; white-space: nowrap; } .bookList td dd:after { content: ""; display: block; width: 1px; height: 14px; background: #d6d6d6; position: absolute; right: 0; top: 50%; margin-top: -7px; } .bookList td dd:last-child:after { display: none; } .bookList td dd span { font-size: 12pt; color: #000; } .bookList td p { padding-top: 15px; } .bookList td p:after { content: ""; display: table; clear: both; } .bookList td p span { display: block; float: left; height: 20px; line-height: 20px; font-size: 12pt; margin-right: 10px; } .bookList td p b { font-size: 12pt; color: #ff0011; line-height: 20px; } .bookList td p em { font-style: normal; font-size: 12pt; color: #000; line-height: 20px; } .bookList td:last-child { width: 150px; padding: 20px; } .bookList td ul li { padding: 5px 0; } .bookList td ul li a { display: block; text-align: center; padding: 10px 0; } .bookList td ul li:nth-child(1) a { background: #383838; } .bookList td ul li:nth-child(2) a { background: #0047a7; } .bookList td ul li a span { display: inline-block; height: 20px; line-height: 20px; background-size: 20px auto !important; color: #fff; padding-left: 25px; } .bookList td ul li:nth-child(1) a span { background: url("../../img/book/book_list_btn01.png")no-repeat left center; } .bookList td ul li:nth-child(2) a span { background: url("../../img/book/book_list_btn02.png")no-repeat left center; } .bookInfo { border: solid 1px #d6d6d6; margin-top: 50px; } .bookInfo > h5 { background: #2e2d76; color: #fff; font-size: 16pt; font-weight: 400; line-height: 20px; padding: 30px 20px; } .bookTable th { padding: 20px; width: 220px; vertical-align: top; } .bookTable td { vertical-align: top; padding: 20px; padding-left: 0; } .bookTable td p:after { content: ""; display: table; clear: both; } .bookTable td p span { display: block; float: left; height: 20px; line-height: 18px; border: solid 1px #000; text-align: center; font-size: 10pt; margin-right: 10px; padding: 0 15px; font-weight: 300; } .bookTable td p b { font-size: 14pt; color: #ff0011; line-height: 20px; } .bookTable td p em { font-style: normal; font-size: 12pt; color: #000; line-height: 20px; margin-left: 3px; } .bookTable td ul { margin-top: 15px; } .bookTable td ul li { padding-left: 8px; position: relative; margin-bottom: 6px; font-size: 12pt; } .bookTable td ul li:before { content: ""; display: block; width: 2px; height: 2px; background: #000; position: absolute; left: 0; top: 12px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .bookCost { background: #f9f9f9; padding: 10px 20px 10px 30px; } .bookCost:after { content: ""; display: table; clear: both; } .bookCost h5 { font-size: 12pt; float: left; line-height: 40px; white-space: nowrap; } .bookCost ul { float: left; margin: 0 20px; } .bookCost ul:after { content: ""; display: table; clear: both; } .bookCost ul li { float: left; } .bookCost ul li a { display: block; display: block; width: 40px; height: 40px; line-height: 38px; text-align: center; background: #dfdfdf; font-size: 16pt; } .bookCost ul li input[type="text"] { display: block; width: 70px; height: 40px; border: solid 1px #cbcbcb; background: #fff; padding: 0 10px; text-align: right; margin: 0 10px; } .bookCost p { font-size: 14pt; color: #888; float: left; line-height: 40px; } .bookCost p b { font-size: 14pt; color: #ff0000; } .bookCost p span { font-size: 14pt; color: #000; } .bookCost dl { float: right; } .bookCost dl:after { content: ""; display: table; clear: both; } .bookCost dl dt { float: left; margin-right: 10px; } .bookCost dl dd { float: left; } .bookCost dl a { display: block; text-align: center; padding: 10px 0; width: 110px; } .bookCost dl dt a { background: #383838; } .bookCost dl dd a { background: #0047a7; } .bookCost dl a span { display: inline-block; height: 20px; line-height: 20px; background-size: 20px auto !important; color: #fff; padding-left: 25px; } .bookCost dl dt a span { background: url("../../img/book/book_list_btn01.png")no-repeat left center; } .bookCost dl dd a span { background: url("../../img/book/book_list_btn02.png")no-repeat left center; } .bkSlider { padding: 0 30px; } .bkSlider .slick-arrow { display: block; width: 16px; height: 30px; position: absolute; top: 50%; margin-top: -15px; text-indent: -9999px; } .bkSlider .slick-prev { left: 0; background: url("../../img/book/thumb_arrow_prev.png")no-repeat left center; } .bkSlider .slick-next { right: 0; background: url("../../img/book/thumb_arrow_next.png")no-repeat left center; } .bkThumb { height: 150px !important; border: solid 1px #e8e8e8; background-size: cover !important; } @media (max-width:800px) { .bookList { padding-top: 20px; } .bookList > li { margin-bottom: 15px; } .bookList table, .bookList tbody, .bookList tr, .bookList th, .bookList td { display: block; width: 100%; } .bookList tr { padding: 15px; position: relative; } .bookList tr:after { content: ""; display: table; clear: both; } .bookList th { width: 90px; position: absolute; left: 15px; top: 15px; padding: 0; } .bookList td:nth-child(2) { padding: 10px 0; padding-left: 105px; } .bookList td h5 { font-size: 12pt; line-height: 18px; } .bookList td h5 span { width: 30px; height: 18px; line-height: 18px; font-size: 9pt; } .bookList td dl { margin-top: 10px; } .bookList td dd { float: none; padding-right: 0; margin-right: 0; font-size: 10pt; white-space: normal; } .bookList td dd:after { display: none; } .bookList td dd span { font-size: 10pt; } .bookList td p { padding-top: 5px; } .bookList td p span { font-size: 11pt; padding: 0; } .bookList td p em, .bookList td p b { font-size: 11pt; } .bookList td:last-child { width: 100%; padding: 0 20px; margin-top: 20px; text-align: center; } .bookList td ul li { padding: 0 5px; display: inline-block; } .bookList td ul li a { padding: 7px 20px; } .bookList td ul li a span { display: inline-block; height: 20px; line-height: 20px; font-size: 11pt; background-size: 15px auto !important; padding-left: 20px; } .bookList td ul li:nth-child(1) a span { background: url("../../img/book/book_list_btn01.png")no-repeat left center; } .bookList td ul li:nth-child(2) a span { background: url("../../img/book/book_list_btn02.png")no-repeat left center; } .bookInfo { margin-top: 20px; } .bookInfo > h5 { font-size: 12pt; padding: 15px 10px; } .bookTable th { padding: 10px; width: 140px; vertical-align: middle; } .bookTable td { padding: 10px; vertical-align: middle; } .bookTable td ul li { padding-left: 6px; margin-bottom: 5px; font-size: 11pt; } .bookTable td ul li:before { top: 10px; } .bookTable td ul li dl dd { float: none; font-size: 11pt; white-space: normal; margin-right: 0; padding-left: 0; } .bookTable td ul li dl dd:before { top: 10px; left: -6px; } .bookTable td ul li dl dd span { font-size: 11pt; } .bookTable td ul li > span { font-size: 11pt; } .bookCost { padding: 20px; } .bookCost p { display: none; } .bookCost dl { float: left; width: 100%; text-align: center; padding-top: 20px; } .bookCost dl dt { float: none; display: inline-block; margin-right: 0; padding: 0 5px; } .bookCost dl dd { float: none; display: inline-block; padding: 0 5px; } .bookCost dl a { padding: 7px 20px; } .bookCost dl a span { display: inline-block; height: 20px; line-height: 20px; font-size: 11pt; background-size: 15px auto !important; padding-left: 20px; white-space: nowrap; } .bkSlider { padding: 0 20px; } .bkSlider .slick-arrow { width: 12px; height: 22px; margin-top: -11px; background-size: cover !important; } .bkThumb { height: 110px !important; } } /* --------------------------------------- */ /* Customer */ /* --------------------------------------- */ .csTable th, .csTable td { border-top: solid 10px #fff; border-bottom: solid 10px #fff; font-size: 12pt; } .csTable th { background: #f4f4f4; width: 210px; font-weight: 500; padding: 20px; } .csTable td { font-weight: 300; padding: 0 20px; } .faqTab:after { content: ""; display: table; clear: both; } .faqTab li { float: left; width: 12.5%; background: #f9f9f9; border: solid 1px #dfdfdf; border-right: none; } .faqTab li:last-child { border-right: solid 1px #dfdfdf; } .faqTab li a { display: block; height: 48px; line-height: 48px; text-align: center; font-size: 12pt; color: #898989; } .faqTab li.current { background: #fff; border-color: #0047a7; border-bottom-color: #fff; position: relative; } .faqTab li.current:after { content: ""; display: block; width: 1px; background: #0047a7; position: absolute; right: -1px; top: -1px; bottom: -1px; } .faqTab li.current a { color: #0047a7; } .faqList { border-top: solid 1px #d6d6d6; margin-top: 30px; } .faqList dt { border-bottom: solid 1px #d6d6d6; cursor: pointer; position: relative; padding-right: 140px; } .faqList dt:after { content: ""; display: block; width: 100px; height: 40px; border: solid 1px #2e2d76; position: absolute; right: 20px; top: 50%; margin-top: -20px; background: url("../../img/customer/faq_btn01.png")no-repeat center center; } .faqList dt.on:after { background: url("../../img/customer/faq_btn02.png")no-repeat center center; } .faqList dd { border-bottom: solid 1px #d6d6d6; } .faqList dd { display: none; } .faqList dt.on { background: #f9f9f9; } .faqList p { font-size: 12pt; } .faqList th { padding: 20px 0; } .faqList td { padding: 20px; } .faqList th { width: 60px; font-weight: 500; } .faqList dt th { background: #f9f9f9; } .faqList dd th { color: #f36f21; } .notiList th, .notiList td { border-top: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; padding: 30px 20px; } .notiList th { text-align: left; } .notiList th a { display: block; } .notiList th h5 { font-size: 14pt; font-weight: 500; } .notiList th h5 span { font-size: 14pt; color: #238dfa; } .notiList th h5 em { font-size: 14pt; font-style: normal; color: #f36f21; } .notiList th h5 img { display: inline-block; vertical-align: middle; margin-top: -4px; margin-left: 5px; } .notiList th p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12pt; margin-top: 15px; font-weight: 300; } .notiList td { width: 220px; text-align: right; } .notiList td dl { display: inline-block; } .notiList td dl:after { content: ""; display: table; clear: both; } .notiList td dl dd { float: left; color: #8f8f8f; font-weight: 300; font-size: 11pt; margin-right: 10px; padding-right: 10px; position: relative; } .notiList td dl dd:after { content: ""; display: block; width: 1px; height: 10px; background: #8f8f8f; position: absolute; right: 0; top: 50%; margin-top: -5px; } .notiList td dl dd:last-child { margin-right: 0; padding-right: 0; } .notiList td dl dd:last-child:after { display: none; } .notiList tr.reply th a { padding-left: 30px; background: url("../../img/customer/notice_reply.png")no-repeat left top; } .notiList tr.visit { background: #f7f7f7; } .notiBtn.top { text-align: right; padding-top: 30px; padding-bottom: 10px; } .notiBtn.bot { text-align: center; padding: 30px 0; } .notiBtn a { display: inline-block; width: 220px; height: 60px; line-height: 60px; text-align: center; color: #fff; background: #0047a7; font-size: 13pt; } .notiView { border-top: solid 2px #d6d6d6; } .notiView td { padding: 20px; border-top: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; } .ntvTitle { } .ntvTitle h5 { font-size: 14pt; } .ntvTitle h5 span { font-size: 14pt; color: #238dfa; } .ntvTitle dl:after { content: ""; display: table; clear: both; } .ntvTitle dl dd { float: left; color: #8f8f8f; font-weight: 300; font-size: 11pt; margin-right: 10px; padding-right: 10px; position: relative; } .ntvTitle dl dd:after { content: ""; display: block; width: 1px; height: 10px; background: #8f8f8f; position: absolute; right: 0; top: 50%; margin-top: -5px; } .ntvTitle dl dd:last-child { margin-right: 0; padding-right: 0; } .ntvTitle dl dd:last-child:after { display: none; } .ntvFile { } .ntvFile ul { } .ntvFile ul:after { content: ""; display: table; clear: both; } .ntvFile ul li { float: left; margin-right: 50px; } .ntvFile ul li:last-child { margin-right: 0; } .ntvFile ul li a { display: block; font-size: 12pt; color: #8f8f8f; padding-right: 30px; background: url("../../img/customer/notice_file.png")no-repeat 99% center; } .ntvBtn { text-align: center; padding-top: 30px; padding-bottom: 100px; } .ntvBtn li { display: inline-block; padding: 0 5px; } .ntvBtn li a { display: block; width: 140px; height: 60px; line-height: 58px; color: #0047a7; border: solid 1px #0047a7; font-size: 13pt; } .ntvBtn li:first-child a { background: #0047a7; border: solid 1px #0047a7; color: #fff; } .ntvReply { } .ntvReply h5 { font-size: 14pt; padding-bottom: 5px; font-weight: 400; } .ntvReply div { position: relative; background: #fafafa; padding: 30px; padding-right: 160px; } .ntvReply input[type="text"] { display: block; width: 100%; height: 40px; border: none; padding: 0 15px; border: solid 1px #cbcbcb; } .ntvReply input[type="submit"] { display: block; width: 120px; height: 40px; position: absolute; right: 30px; top: 30px; border: none; color: #fff; background: #3a3a3a; } .ntvrList { margin-top: 50px; border-top: solid 1px #d6d6d6; } .ntvrList li { border-bottom: solid 1px #d6d6d6; padding: 25px 0; } .ntvrList li h5 { } .ntvrList li h5:after { content: ""; display: table; clear: both; } .ntvrList li h5 span { display: inline-block; vertical-align: middle; font-size: 12pt; color: #8f8f8f; font-weight: 300; padding-right: 10px; margin-right: 10px; position: relative; } .ntvrList li h5 span:after { content: ""; display: block; width: 1px; height: 10px; background: #aaa; position: absolute; right: 0; top: 50%; margin-top: -5px; } .ntvrList li h5 em { display: inline-block; vertical-align: middle; font-size: 12pt; color: #8f8f8f; font-weight: 300; font-style: normal; } .ntvrList li h5 a { display: inline-block; vertical-align: middle; width: 70px; height: 30px; line-height: 27px; font-size: 11pt; color: #383838; border: solid 1px #383838; margin-left: 15px; text-align: center; font-weight: 400; } .ntvrList li p { margin-top: 10px; } .ntvrWrite { position: relative; padding-right: 160px; margin-top: 10px; } .ntvrWrite input[type="text"] { display: block; width: 100%; height: 40px; border: none; padding: 0 15px; border: solid 1px #cbcbcb; } .ntvrWrite dl { position: absolute; right: 0; top: 0; } .ntvrWrite dl:after { content: ""; display: table; clear: both; } .ntvrWrite dl dd { float: left; } .ntvrWrite dl dd a { display: block; width: 70px; height: 40px; text-align: center; line-height: 37px; font-size: 11pt; border: solid 1px #383838; } .ntvrWrite dl dd:first-child { margin-right: 10px; } .ntvrWrite dl dd:first-child a { background: #383838; color: #fff; } .ntvrWrite dl dd:last-child a { color: #383838; } .qnaWrite { border-top: solid 2px #d6d6d6; } .qnaWrite th, .qnaWrite td { padding: 10px 20px; border-top: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; } .qnaWrite th { width: 190px; background: #fafafa; font-size: 12pt; font-weight: 300; } .qnaWrite td { } .qnaWrite td textarea { display: block; width: 100%; height: 220px; resize: none; border: solid 1px #cbcbcb } .qnaWrite input[type="file"], .qnaWrite input[type="file"] + label { display: inline-block; vertical-align: middle; white-space: nowrap; } .qnawTitle { position: relative; padding-right: 80px; } .qnawTitle > div { position: absolute; right: 0; top: 50%; margin-top: -12px; } .qnawTitle input[type="text"] { border: solid 1px #cbcbcb; width: 100%; } .qnawTitle input[type="checkbox"] { display: inline-block; vertical-align: middle; } .qnawTitle label { display: inline-block; vertical-align: middle; } .qnawBtn { text-align: center; padding: 40px 0; } .qnawBtn li { display: inline-block; padding: 0 5px; } .qnawBtn li a { display: block; width: 140px; height: 60px; line-height: 58px; border: solid 1px #0047a7; font-size: 13pt; } .qnawBtn li:first-child a { background: #0047a7; color: #fff; } .qnawBtn li:last-child a { color: #0047a7; } .rfndTxt { padding-top: 10px; } .rfndTxt p { font-size: 12pt; line-height: 1.6em; font-weight: 300; } .rfndTxt ul { margin-top: 10px; } .rfndTxt li { font-size: 12pt; line-height: 1.6em; font-weight: 300; } .rfndTxt span { font-size: 12pt; line-height: 1.6em; font-weight: 300; color: #ff0000; } .rfndTxt img { max-width: 100%; margin: 0 auto; } .rfndTxt img.imgPc { display: block; } .rfndTxt img.imgMo { display: none; } .lcaMap { width: 100% !important; } .locaTable { margin-top: 30px; } .locaTable th, .locaTable td { padding: 5px 0; vertical-align: top; } .locaTable th { width: 140px; text-align: center; } .locaTable th div { background: #343483; padding: 10px 0; } .locaTable th span { display: inline-block; height: 20px; line-height: 20px; background-size: 20px auto !important; color: #fff; padding-left: 25px; } .locaTable td { padding-left: 20px; } .locaTable td h5 { margin-top: 30px; } .locaTable td h5 span { display: block; padding-left: 40px; height: 40px; line-height: 40px; position: relative; background-size: auto 30px !important; font-size: 12pt; font-weight: 500; } .locaTable td ul li { padding-left: 8px; position: relative; font-size: 12pt; font-weight: 300; line-height: 1.8em; } .locaTable td ul li:before { content: ""; display: block; width: 2px; height: 2px; background: #888; position: absolute; left: 0; top: 50%; margin-top: -1px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .locaTable td dl dt { margin-top: 20px; font-size: 12pt; font-weight: 500; margin-bottom: 5px; } .locaTable td dl dt:first-child { margin-top: 10px; } .locaTable td dl dd { line-height: 1.8em; font-size: 12pt; font-weight: 300; padding-left: 18px; position: relative; } .locaTable td dl dd:before { content: ""; display: block; width: 10px; height: 10px; position: absolute; left: 0; top: 10px; } .locaTable td dl dd.locaDot01:before { background: #0060ff; } .locaTable td dl dd.locaDot02:before { background: #037b44; } .locaTable td dl dd.locaDot03:before { background: #e60012; } @media (max-width:800px) { .csTable, .csTable tbody, .csTable tr, .csTable th, .csTable td { display: block; width: 100%; } .csTable th, .csTable td { border-top: none; border-bottom: none; font-size: 11pt; } .csTable th { width: 100%; padding: 10px; } .csTable td { padding: 10px 0 20px 0; } .faqTab { border-bottom: solid 1px #dfdfdf; } .faqTab li { border-bottom: none; width: 25%; } .faqTab li:nth-child(4n) { border-right: solid 1px #dfdfdf; } .faqTab li.current:before { content: ""; display: block; height: 1px; background: #0047a7; position: absolute; right: -1px; left: -1px; bottom: -1px; } .faqTab li a { height: 38px; line-height: 38px; font-size: 10pt; } .faqList { margin-top: 20px; } .faqList dt { padding-right: 100px; } .faqList dt:after { width: 60px; height: 30px; right: 10px; margin-top: -15px; background-size: auto 100% !important; } .faqList p { font-size: 11pt; } .faqList th { padding: 10px 0; } .faqList td { padding: 10px; } .faqList th { width: 40px; } .notiList tbody, .notiList tr, .notiList th, .notiList td { display: block; width: 100%; } .notiList { border-top: solid 1px #d6d6d6; } .notiList tr { border-bottom: solid 1px #d6d6d6; } .notiList th, .notiList td { padding: 20px 10px; border-top: none; border-bottom: none; } .notiList th { padding-bottom: 10px; } .notiList th h5 { font-size: 12pt; } .notiList th h5 span { font-size: 12pt; } .notiList th h5 em { font-size: 12pt; } .notiList th h5 img { width: 12px; } .notiList th p { font-size: 11pt; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.4; height: 2.8em; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .notiList td { width: 100%; text-align: left; padding-top: 0; } .notiList td dl { display: block; } .notiList td dl dd { font-size: 10pt; } .notiList tr.reply td { padding-left: 40px; } .notiBtn.top { padding-top: 20px; padding-bottom: 10px; } .notiBtn.bot { padding: 20px 0; } .notiBtn a { width: 140px; height: 44px; line-height: 44px; font-size: 12pt; } .notiView td { padding: 10px 0; } .ntvTitle h5 { font-size: 13pt; } .ntvTitle h5 span { font-size: 13pt; } .ntvTitle dl dd { font-size: 10pt; margin-top: 5px; } .ntvFile ul li { margin-right: 20px; } .ntvFile ul li a { display: block; font-size: 11pt; padding-right: 26px; background-size: 18px auto !important; } .ntvBtn { padding-top: 20px; padding-bottom: 60px; margin: 0 -5px; } .ntvBtn:after { content: ""; display: table; clear: both; } .ntvBtn li { display: block; float: left; width: 25%; } .ntvBtn li a { width: 100%; height: 40px; line-height: 38px; font-size: 11pt; } .ntvReply h5 { font-size: 12pt; } .ntvReply div { padding: 10px; padding-right: 100px; } .ntvReply input[type="text"] { height: 36px; border: none; padding: 0 15px; border: solid 1px #cbcbcb; } .ntvReply input[type="submit"] { width: 80px; height: 36px; right: 10px; top: 10px; ; } .ntvrList { margin-top: 30px; } .ntvrList li { padding: 15px 0; } .ntvrList li h5:after { content: ""; display: table; clear: both; } .ntvrList li h5 span { font-size: 11pt; } .ntvrList li h5 em { font-size: 11pt; } .ntvrList li h5 a { display: block; width: 50px; height: 22px; line-height: 19px; font-size: 9pt; margin-left: 0; float: right; } .ntvrWrite { padding-right: 130px; margin-top: 10px; } .ntvrWrite input[type="text"] { height: 36px; } .ntvrWrite dl dd a { width: 60px; height: 36px; line-height: 33px; } .ntvrWrite dl dd:first-child { margin-right: 5px; } .qnaWrite th, .qnaWrite td { padding: 5px; } .qnaWrite th { width: 100px; font-size: 11pt; } .qnaWrite td textarea { height: 160px; } .qnaWrite input[type="file"], .qnaWrite input[type="file"] + label { display: block; font-size: 10pt; } .qnaWrite input[type="file"] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .qnaWrite input[type="file"] + label { white-space: normal; line-height: 1.2em; margin-top: 5px; } .qnawTitle input[type="text"] { height: 34px; } .qnawBtn { padding: 20px 0; } .qnawBtn li a { width: 100px; height: 44px; line-height: 42px; font-size: 12pt; } .rfndTxt { padding-top: 0; } .rfndTxt p { font-size: 11pt; } .rfndTxt ul { margin-top: 10px; } .rfndTxt li { font-size: 11pt; } .rfndTxt span { font-size: 11pt; } .rfndTxt img.imgPc { display: none; } .rfndTxt img.imgMo { display: block; } .lcaMap { height: 300px !important; } .locaTable { margin-top: 20px; } .locaTable th { width: 80px; } .locaTable th div { padding: 5px 0; } .locaTable th span { background-size: 15px auto !important; padding-left: 20px; font-size: 11pt; } .locaTable td { padding-left: 10px; font-weight: 300; } .locaTable td h5 { margin-top: 20px; } .locaTable td h5 span { padding-left: 30px; height: 30px; line-height: 30px; background-size: auto 20px !important; font-size: 12pt; } .locaTable td ul li { font-size: 11pt; } .locaTable td ul li:before { top: 13px; } .locaTable td dl dd { font-size: 11pt; } .locaTable td dl dd:before { top: 8px; } } /* --------------------------------------- */ /* Membership */ /* --------------------------------------- */ .joinForm { width: 100%; max-width: 500px; margin: 0 auto; padding-top: 60px; } .joinForm > ul > li { margin-bottom: 20px; } .joinForm > ul > li input[type="text"], .joinForm > ul > li input[type="password"], .joinForm > ul > li input[type="tel"] { display: block; width: 100%; height: 50px; border: solid 1px #cbcbcb; padding: 0 20px; } .joinForm > ul > li span.red { color: #f36f21; display: block; margin-top: 5px; } .joinId { position: relative; padding-right: 130px; } .joinId a { display: block; width: 120px; height: 50px; line-height: 47px; text-align: center; border: solid 1px #000; color: #000; font-size: 11pt; position: absolute; right: 0; top: 0; } .joinCpny { position: relative; padding-right: 100px; } .joinCpny a { display: block; width: 90px; height: 50px; line-height: 50px; text-align: center; color: #fff; background: #666; font-size: 11pt; position: absolute; right: 0; top: 0; } .joinAgree { margin-bottom: 50px; padding-left: 23px; position: relative; } .joinAgree input[type="checkbox"] { width: 20px; height: 20px; position: absolute; left: 0; top: 2px; } .joinAgree label { display: block; font-size: 11pt; color: #000; } .joinAgree label a { color: #f36f21; font-size: 11pt; } .jnType { } .jnType:after { content: ''; display: table; clear: both; } .jnType li { float: left; margin-right: 30px; } .jnType li:last-child { margin-right: 0; } .jnType li input[type="radio"] { float: left; } .jnType li label { display: block; float: left; height: 18px; line-height: 18px; } .joinBtn { display: block; height: 60px; line-height: 60px; text-align: center; background: #0047a7; color: #fff !important; font-size: 14pt; font-weight: 500; } .jnNum:after { content: ''; display: table; clear: both; } .jnNum li { float: left; width: 47%; } .jnNum li:nth-child(2) { width: 6%; text-align: center; height: 50px; line-height: 50px; } .jnAddr { position: relative; } .jnAddr:after { content: ''; display: table; clear: both; } .jnAddr li { float: left; } .jnAddr li:nth-child(1) { width: 70%; } .jnAddr li:nth-child(2) { width: 30%; padding-left: 10px; } .jnAddr li:nth-child(3) { width: 100%; padding-top: 10px; } .jnAddr li:nth-child(2) a { display: block; height: 50px; line-height: 50px; text-align: center; background: #666; color: #fff; } .popWrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.8); padding: 30px 15px; z-index: 100; display: none; } .popWrap > div { width: 100%; max-width: 1200px; margin: 0 auto; height: 100%; position: relative; padding-top: 80px; } .popWrap.popSmall > div { display: table; width: 100%; height: 100%; padding-top: 0; } .popWrap.popSmall > div > div { display: table-cell; width: 100%; vertical-align: middle; } .popWrap.popSmall > div > div > div { width: 400px; margin: 0 auto; position: relative; padding-top: 80px; background: #fff; } .popWrap.popMiddle > div > div > div { width: 800px; margin: 0 auto; position: relative; padding-top: 80px; background: #fff; } .popTitle { background: #0047a7; padding: 0 30px; position: absolute; left: 0; right: 0; top: 0; } .popTitle h5 { font-size: 22pt; color: #fff; font-weight: 400; height: 80px; line-height: 80px; } .popTitle span { display: block; width: 80px; height: 80px; position: absolute; right: 0; top: 0; text-indent: -9999px; cursor: pointer; background: url("../../img/common/pop_close.png")no-repeat center center; } .popCont { background: #fff; overflow-y: auto; height: 100%; padding: 0 30px; padding-bottom: 40px; -webkit-overflow-scrolling: touch; } .popCont h3 { font-size: 15pt; padding-top: 40px; font-weight: 500; } .popCont h4 { font-size: 13pt; padding-top: 30px; font-weight: 500; padding-bottom: 5px; } .popCont h5 { font-size: 11pt; padding-top: 40px; font-weight: 500; } .popCont p { font-size: 11pt; } html.lock, body.lock { display: block; width: 100%; height: 100%; overflow: hidden; } .joinScss { text-align: center; padding-top: 120px; } .joinScss h5 { font-size: 20pt; font-weight: 500; } .joinScss p { margin-top: 10px; font-size: 13pt; margin-bottom: 60px; } .joinScss p span { font-size: 13pt; font-weight: 300; } .joinScss a { display: block; width: 500px; max-width: 100%; margin: 0 auto; margin-bottom: 20px; height: 60px; line-height: 56px; text-align: center; border: solid 2px #0047a7; color: #0047a7; font-size: 14pt; font-weight: 500; } .joinScss a.blu { background: #0047a7; color: #fff; } .lgnWrap { width: 100%; max-width: 500px; margin: 0 auto; } .lgnForm { } .lgnForm li { margin-bottom: 20px; } .lgnForm li:last-child { margin-bottom: 0; } .lgnForm li input { height: 60px; border: solid 1px #cbcbcb; display: block; width: 100%; } .lgnChk { margin-bottom: 30px; margin-top: 10px; } .lgnChk input[type="checkbox"] { display: inline-block; vertical-align: middle; } .lgnChk label { display: inline-block; vertical-align: middle; } .lgnBtn { display: block; text-align: center; height: 60px; line-height: 60px; background: #0047a7; color: #fff !important; font-size: 14pt; } .lgnMenu { margin-top: 50px; } .lgnMenu dl:first-child { margin-bottom: 10px; } .lgnMenu dl:after { content: ""; display: table; clear: both; } .lgnMenu dt { float: left; white-space: nowrap; height: 50px; line-height: 50px; font-size: 12pt; font-weight: 300; } .lgnMenu dd { float: right; } .lgnMenu dd a { display: block; height: 50px; line-height: 48px; text-align: center; width: 190px; border: solid 1px #ccc; color: #515151; font-size: 12pt; } .lgnMenu dl:first-child dd a { color: #0047a7; border-color: #0047a7; } .idpw { padding-top: 30px; text-align: center; } .idpw p { font-size: 12pt; color: #000; padding-bottom: 15px; } .idpw p span { font-size: 14pt; color: #0047a7; } .idpwBtn { margin-top: 60px; padding: 0 25px; } .idpwBtn:after { content: ""; display: table; clear: both; } .idpwBtn li { float: left; width: 50%; padding: 0 5px; } .idpwBtn li a { display: block; height: 60px; line-height: 58px; font-size: 13pt; color: #0047a7; border: solid 1px #0047a7; text-align: center; } .idpwBtn li:first-child a { background: #0047a7; color: #fff; } .lgnFind { text-align: center; margin-top: 30px; } .lgnFind li { display: inline; padding: 0 15px; position: relative; } .lgnFind li:after { content: ''; display: block; width: 1px; height: 14px; background: #e0e0e0; position: absolute; right: 0; top: 50%; margin-top: -7px; } .lgnFind li:last-child:after { display: none; } .lgnFind li a { font-size: 12pt; } .lgnSns { border: solid 1px #d6d6d6; margin-top: 90px; } .lgnSns li { border-bottom: solid 1px #d6d6d6; } .lgnSns li:last-child { border-bottom: none; } .lgnSns li a { display: block; height: 80px; line-height: 80px; padding: 0 20px; font-size: 13pt; } .lgnSns li a:before { content: ''; display: inline-block; width: 38px; height: 38px; vertical-align: middle; margin-right: 20px; } .lgnSns li:nth-child(1) a:before { background: url('../../img/common/login_sns01.png')no-repeat center center; } .lgnSns li:nth-child(2) a:before { background: url('../../img/common/login_sns02.png')no-repeat center center; } .lgnSns li:nth-child(3) a:before { background: url('../../img/common/login_sns03.png')no-repeat center center; } .fndScs { text-align: center; } .fndScs p { } .fndScs h6 { color: #0047a7; background: #eee; padding: 20px 0; margin-top: 10px; font-size: 13pt; font-weight: 400; } .jnSns { } .jnSns h5 { text-align: center; font-size: 14pt; } .jnSns > a { display: block; width: 500px; margin: 0 auto; text-align: center; margin-bottom: -80px; border: solid 1px #d6d6d6; border-bottom: none; line-height: 80px; font-size: 13pt; color: #0047a7; } .jnSns ul { width: 100%; max-width: 500px; margin: 0 auto; margin-top: 80px; } .jnSns > em { display: block; margin: 0 auto; width: 140px; height: 140px; background: #fafafa; background-size: cover !important; font-style: normal; margin-bottom: 20px; border-radius: 100px 100px 100px 100px; -moz-border-radius: 100px 100px 100px 100px; -webkit-border-radius: 100px 100px 100px 100px; } .jnSns > em > span { display: table; width: 100%; height: 100%; } .jnSns > em > span > span { display: table-cell; width: 100%; vertical-align: middle; text-align: center; font-size: 16pt; color: 000px; font-weight: 500; } @media (max-width:800px) { .joinForm { padding-top: 30px; } .joinForm > ul > li { margin-bottom: 10px; } .joinForm > ul > li input[type="text"], .joinForm > ul > li input[type="password"], .joinForm > ul > li input[type="tel"] { height: 36px; padding: 0 10px; } .joinId { padding-right: 100px; } .joinId a { width: 90px; height: 36px; line-height: 34px; font-size: 10pt; } .joinCpny { padding-right: 80px; } .joinCpny a { width: 70px; height: 36px; line-height: 33px; } .joinAgree { margin-bottom: 20px; } .joinBtn { height: 50px; line-height: 50px; font-size: 12pt; } .jnType li { margin-right: 15px; } .popWrap > div { padding-top: 50px; } .popWrap.popSmall > div > div { } .popWrap.popSmall > div > div > div { width: 100%; padding-top: 50px; } .popTitle { padding: 0 15px } .popTitle h5 { font-size: 16pt; height: 50px; line-height: 50px; } .popTitle span { width: 50px; height: 50px; background-size: 25px auto; } .popCont { padding: 0 15px; padding-bottom: 30px; } .popCont h3 { font-size: 13pt; padding-top: 30px; } .popCont h4 { font-size: 12pt; padding-top: 20px } .popCont h4 { font-size: 10pt; padding-top: 30px } .popCont p { font-size: 10pt; } .joinScss { padding-top: 60px; } .joinScss h5 span { font-size: 16pt; display: block; line-height: 1.3em; } .joinScss p { margin-top: 10px; } .joinScss p span { font-size: 11pt; display: block; } .joinScss a { margin-bottom: 10px; height: 50px; line-height: 46px; font-size: 12pt; } .lgnForm li { margin-bottom: 10px; } .lgnForm li input { height: 40px; } .lgnChk { margin-bottom: 40px; } .lgnBtn { height: 50px; line-height: 50px; font-size: 12pt; } .lgnMenu { margin-top: 30px; } .lgnMenu dl:first-child { margin-bottom: 20px; } .lgnMenu dt { float: none; text-align: center; height: auto; line-height: 1.5em; ; font-size: 11pt; } .lgnMenu dd { float: none; padding-top: 10px; } .lgnMenu dd a { margin: 0 auto; height: 40px; line-height: 38px; width: 160px; font-size: 11pt; } .idpw { padding-top: 0; } .idpw p { font-size: 10pt; ; } .idpwBtn { margin: 0 -5px; margin-top: 20px; padding: 0; } .idpwBtn li a { height: 50px; line-height: 48px; font-size: 11pt; } .lgnFind { margin-top: 20px; } .lgnFind li { padding: 0 10px; } .lgnFind li:after { height: 10px; margin-top: -5px; } .lgnFind li a { font-size: 11pt; } .lgnSns { margin-top: 30px; } .lgnSns li a { height: 60px; line-height: 60px; font-size: 11pt; } .lgnSns li a:before { margin-right: 10px; } .jnSns { } .jnSns > a { margin-bottom: -30px; width: 100%; line-height: 60px; font-size: 11pt; } .jnSns h5 { text-align: center; font-size: 12pt; } .jnSns ul { margin-top: 30px; } } /* 위탁교육 */ .csgTitle { text-align: center; padding-bottom: 30px; } .csgTitle h4 { font-weight: 400; color: #0047a7; font-size: 28pt; line-height: 1.0em; } .csgTitle p { font-size: 18pt; margin-top: 20px; } .csgPoint { margin: 0 -30px; } .csgPoint:after { content: ""; display: table; clear: both; } .csgPoint dd { float: left; width: 50%; padding: 0 30px; } .csgPoint dd > div { background: #e4f6ff; text-align: center; padding: 25px 0; position: relative; border-radius: 100px 100px 100px 100px; -moz-border-radius: 100px 100px 100px 100px; -webkit-border-radius: 100px 100px 100px 100px; } .csgPoint ul { display: inline-block; text-align: left; padding-left: 100px; min-height: 105px; background-size: 80px auto !important; position: relative; } .csgPoint dd:first-child ul { background: url("../../img/offline/consign_list_ico01.png")no-repeat left center; } .csgPoint dd:last-child ul { background: url("../../img/offline/consign_list_ico02.png")no-repeat left center; } .csgPoint dd:last-child div:before { content: ""; display: block; width: 130px; height: 105px; position: absolute; bottom: 100%; right: 50%; background: url("../../img/offline/consign_list_man.png")no-repeat left center; background-size: cover; } .csgPoint ul li { white-space: nowrap; margin-bottom: 15px; font-size: 12pt; line-height: 25px; position: relative; padding-left: 22px; } .csgPoint ul li:before { content: ""; display: block; width: 14px; height: 11px; position: absolute; left: 0; top: 6px; background: url("../../img/offline/consign_list_dot.png")no-repeat center center; } .csgPoint ul li:last-child { margin-bottom: 0; } .csgTxt { padding: 50px 0; text-align: center; font-size: 13pt; } .csgList { margin: 0 -30px; } .csgList:after { content: ""; display: table; clear: both; } .csgList dd { width: 50%; float: left; padding: 25px 30px; } .csgList dd:last-child { margin-left: 25%; } .csgList dd h5 { width: 60%; margin: 0 auto; height: 160px; line-height: 60px; background: #0047a7; color: #fff; font-size: 14pt; text-align: center; position: relative; border-radius: 100% 100% 0 0; -moz-border-radius: 100% 100% 0 0; -webkit-border-radius: 100% 100% 0 0; } .csgList dd h5:after { content: ""; display: block; position: absolute; left: 0; right: 0; bottom: 0; height: 100px; background: #fff; } .csgList ul { background: #f9f9f9; padding: 20px 30px; margin-top: -100px; position: relative; min-height: 100px; } .csgList ul li { font-size: 12pt; padding-left: 8px; position: relative; margin-bottom: 5px; } .csgList ul li:last-child { margin-bottom: 0; } .csgList ul li:before { content: ""; display: block; width: 2px; height: 2px; background: #888; position: absolute; left: 0; top: 50%; margin-top: -1px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .csgList ul li:last-child { margin-bottom: 0; } .csgSub { font-size: 15pt; color: #0047a7; font-weight: 400; position: relative; margin-top: 60px; margin-bottom: 10px; } .csgTable { position: relative; } .csgTable table { border-left: solid 2px #fff; border-right: solid 2px #fff; } .csgTable th, .csgTable td { font-size: 12pt; font-weight: 300; border: solid 1px #d6d6d6; padding: 10px; text-align: center; } .csgTable th { background: #f9f9f9; } .csgTable td.txtLeft { text-align: left; } .csgCall { margin-top: 20px; } .csgCall dt { font-size: 12pt; font-weight: 300; margin-bottom: 10px; } .csgCall dd { display: inline-block; vertical-align: middle; font-size: 12pt; font-weight: 300; margin-right: 25px; padding-left: 40px; position: relative; } .csgCall dd:last-child { margin-right: 0; } .csgCall dd:before { content: ""; display: block; width: 30px; height: 30px; background-size: 18px auto !important; position: absolute; left: 0; top: 50%; margin-top: -15px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .csgCall dd:nth-child(2):before { background: #d5d5d5 url("../../img/common/footer_ico01.png")no-repeat center center; } .csgCall dd:nth-child(3):before { background: #d5d5d5 url("../../img/common/footer_ico02.png")no-repeat center center } .csgCall dd:nth-child(4):before { background: #d5d5d5 url("../../img/common/footer_ico03.png")no-repeat center center } @media (max-width:1200px) { .csgPoint { margin: 0 -10px; } .csgPoint dd { padding: 0 10px; } .csgPoint dd > div { padding: 25px 0; } .csgPoint ul { padding-left: 60px; background-size: 50px auto !important; } .csgPoint dd:last-child div:before { right: 30%; } .csgPoint ul { min-height: auto; } .csgPoint ul li { font-size: 11pt; margin-bottom: 5px; line-height: 20px; } .csgList { margin: 0 -10px; } .csgList dd { padding: 15px 10px; } .csgList dd h5 { height: 140px; line-height: 40px; font-size: 12pt; } .csgList ul { padding: 10px 15px; min-height: auto; } .csgList ul li { font-size: 11pt; } } @media (max-width:800px) { .csgTitle { text-align: left; padding-bottom: 20px; position: relative; } .csgTitle:after { content: ""; display: block; width: 65px; height: 53px; bottom: 0; right: 50px; position: absolute; background: url("../../img/offline/consign_list_man.png")no-repeat left center; background-size: cover; } .csgTitle h4 { font-size: 18pt; } .csgTitle p { font-size: 12pt; margin-top: 10px; } .csgPoint dd { width: 100%; } .csgPoint dd:last-child { margin-top: 20px; } .csgPoint dd:last-child div:before { display: none; } .csgPoint dd > div { padding: 15px 25px; } .csgPoint ul { padding-left: 50px; background-size: 40px auto !important; display: block; } .csgPoint ul li { white-space: normal; } .csgTxt { padding: 30px 0; font-size: 11pt; } .csgList { margin: 0; } .csgList dd { padding: 15px 0; width: 100%; } .csgList dd:last-child { margin-left: 0; } /* .csgTable {overflow-x:auto; -webkit-overflow-scrolling: touch;} .csgTable table {width:1000px;} */ .csgTable th, .csgTable td { font-size: 11pt; padding: 5px; } .csgCall { margin-top: 10px; } .csgCall dt { font-size: 11pt; } .csgCall dd { font-size: 11pt; margin-right: 20px; padding-left: 30px; } .csgCall dd:before { width: 25px; height: 25px; background-size: 15px auto !important; margin-top: -13px; } .csgCall dd:last-child { margin-top: 10px; } } /* ISO */ .isoTitle { height: 252px; background: url("../../img/offline/iso_img.png")no-repeat right center; background-size: auto 252px; } .isoTitle > div { display: table; height: 100%; width: 100%; } .isoTitle > div > div { display: table-cell; width: 100%; vertical-align: middle; } .isoTitle h4 { font-size: 22pt; } .isoTitle p { color: #0047a7; font-size: 36pt; line-height: 1.2em; } .isoCont { margin-top: 50px; } .isoCont dt { height: 20px; line-height: 20px; padding-left: 25px; color: #0047a7; font-size: 14pt; font-weight: 400; letter-spacing: 0em; background: url("../../img/offline/iso_dot.png")no-repeat left center; background-size: 16px auto !important; } .isoCont dd { padding-left: 25px; } .isoCont dd h5 { font-size: 12pt; font-weight: 500; margin-top: 25px; } .isoCont dd ul { margin-top: 15px; } .isoCont dd ul li { font-size: 12pt; margin-bottom: 5px; } .isoCont dd ul li:last-child { margin-bottom: 0; } .isoTel { background: #f7f7f7; padding: 20px; margin-top: 60px; } .isoTel span { display: inline-block; white-space: nowrap; font-size: 12pt; margin-right: 25px; padding-left: 40px; height: 30px; line-height: 30px; position: relative; } .isoTel span:before { content: ""; display: block; width: 30px; height: 30px; background-size: 18px auto !important; position: absolute; left: 0; top: 50%; margin-top: -15px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .isoTel span:nth-child(1):before { background: #d5d5d5 url("../../img/offline/iso_ico01.png")no-repeat center center; } .isoTel span:nth-child(2):before { background: #d5d5d5 url("../../img/offline/iso_ico02.png")no-repeat center center } .isoTel span:nth-child(3):before { background: #d5d5d5 url("../../img/offline/iso_ico03.png")no-repeat center center } @media (max-width:1200px) { .isoTitle { height: 180px; background-size: auto 180px; } .isoTitle h4 { font-size: 18pt; } .isoTitle p { font-size: 26pt; } } @media (max-width:800px) { .isoTitle { height: auto; padding-bottom: 180px; background-position: center bottom !important; background-size: auto 150px; } .isoTitle h4 { font-size: 12pt; } .isoTitle p { font-size: 18pt; } .isoCont { margin-top: 40px; } .isoCont dt { height: 16px; line-height: 16px; padding-left: 18px; font-size: 12pt; background-size: 12px auto !important; } .isoCont dd { padding-left: 18px; } .isoCont dd h5 { font-size: 11pt; margin-top: 15px; } .isoCont dd ul { margin-top: 15px; } .isoCont dd ul li { font-size: 11pt; margin-bottom: 5px; } .isoTel { padding: 10px; margin-top: 40px; } .isoTel span { font-size: 11pt; margin-right: 0; display: block; margin-bottom: 10px; } .isoTel span:last-child { margin-bottom: 0; } } /* 190811 CSS추가 */ .fairTab.col4 li { width: 25%; } .meList.recList { margin-top: 20px; } .meList.recList li { padding: 10px; } .csgList.lawList { margin: 0; } .lawTitle { text-align: center; } .lawTitle h4 { font-size: 30pt; margin-bottom: 40px; } .lawTitle h5 { display: inline-block; white-space: nowrap; text-align: left; font-size: 30pt; color: #0047a7; padding-left: 120px; position: relative; } .lawTitle h5:before { content: ""; display: block; width: 95px; height: 120px; position: absolute; left: 0; top: 50%; margin-top: -60px; background: url("../../img/offline/law_title_img.png")no-repeat center center; } .lawTitle h5 span { display: block; font-size: 16pt; color: #000; } .lawTxt { margin-top: 100px; margin-bottom: 40px; } .lawTxt dd { display: table; height: 160px; margin-bottom: 30px; width: 100%; padding-left: 80px; } .lawTxt dd > div { display: table-cell; vertical-align: middle; position: relative; padding-left: 100px; margin-left: -80px; } .lawTxt dd:nth-child(2) > div { border: solid 2px #e4f6ff; } .lawTxt em { display: block; width: 160px; height: 160px; position: absolute; left: -80px; top: -2px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .lawTxt ul li { margin-bottom: 15px; font-size: 12pt; line-height: 25px; position: relative; padding-left: 22px; } .lawTxt ul li:before { content: ""; display: block; width: 14px; height: 11px; position: absolute; left: 0; top: 6px; background: url("../../img/offline/consign_list_dot.png")no-repeat center center; } .lawTxt ul li:last-child { margin-bottom: 0; } .lawTxt ul li.lawArw { padding-left: 25px; } .lawTxt ul li.lawArw:before { width: 20px; height: 20px; top: 3px; background: url("../../img/offline/law_arrow.png")no-repeat center center; } .lawTxt p { font-size: 12pt; line-height: 1.6em; padding-left: 20px; max-width: 75%; } .lawList li { font-size: 12pt; padding-left: 8px; position: relative; margin-bottom: 5px; } .lawList li:last-child { margin-bottom: 0; } .lawList li:before { content: ""; display: block; width: 2px; height: 2px; background: #888; position: absolute; left: 0; top: 12px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .lawList li:last-child { margin-bottom: 0; } .hstyList { display: table; width: 100%; margin: 0 -40px; } .hstyList > div { display: table-row; width: 100%; } .hstyList dl { display: table-cell; width: 50%; vertical-align: top; padding: 20px 40px; } .hstyList dl:after { content: ""; display: table; clear: both; } .hstyList dl dt { float: left; width: 130px; height: 50px; line-height: 50px; text-align: center; color: #fff; background: #0047a7; font-size: 22pt; } .hstyList dl dd { float: left; width: 100%; } .hstyList dl dd ul { border-top: solid 1px #c9c9c9; } .hstyList dl dd ul li { border-bottom: solid 1px #c9c9c9; padding: 15px; font-size: 12pt; position: relative; } .hstyList dl dd ul li:before { content: ""; display: block; width: 3px; height: 3px; background: #888; position: absolute; left: 7px; top: 26px; border-radius: 100% 100% 100% 100%; -moz-border-radius: 100% 100% 100% 100%; -webkit-border-radius: 100% 100% 100% 100%; } .acaFature { padding-right: 500px; background: url("../../img/academy/aca_feature.png")no-repeat right top; } .acaFature h5 { font-size: 24pt; } .acaFature ul li { margin-top: 25px; } .acaFlow { margin-top: 60px; } .acaFlow h5 { font-size: 24pt; } .acaFlow ul { margin: 0 -25px; padding-top: 30px; } .acaFlow ul:after { content: ""; display: table; clear: both; } .acaFlow ul li { float: left; width: 20%; padding: 0 25px; } .acaFlow ul li img { display: block; margin: 0 auto; max-width: 100%; } @media (max-width:800px) { .meList.recList li { padding: 0; } .lawList li { font-size: 11pt; } .lawList li:before { top: 10px; } .lawTitle h4 { display: none; } .lawTitle h5 { font-size: 16pt; padding-left: 60px; } .lawTitle h5:before { width: 56px; height: 70px; margin-top: -35px; background-size: contain; } .lawTitle h5 span { font-size: 11pt; } .lawTxt { margin-top: 60px; margin-bottom: 30px; } .lawTxt dd { display: block; height: auto; margin-bottom: 30px; padding-left: 0; padding-top: 50px; } .lawTxt dd > div { display: block; padding-left: 0; margin-left: 0; padding-top: 60px; } .lawTxt dd:nth-child(2) > div { border: solid 1px #e4f6ff; } .lawTxt em { width: 100px; height: 100px; left: 50%; margin-left: -50px; top: -50px; ; background-size: 42px auto !important; } .lawTxt ul li { margin-bottom: 10px; font-size: 11pt; line-height: 1.6em; padding-left: 20px; } .lawTxt ul li.lawArw { padding-left: 20px; } .lawTxt ul li.lawArw:before { width: 15px; height: 15px; top: 3px; background-size: cover !important; } .lawTxt p { font-size: 11pt; line-height: 1.6em; padding-left: 0; max-width: 100%; padding: 10px; } .lawList li { font-size: 11pt; padding-left: 8px; position: relative; margin-bottom: 5px; } .lawList li:last-child { margin-bottom: 0; } .hstyList { display: block; margin: 0; padding-top: 20px; } .hstyList > div { display: block; } .hstyList dl { display: block; width: 100%; padding: 0; margin-bottom: 30px; } .hstyList dl dt { width: 90px; height: 40px; line-height: 40px; font-size: 18pt; } .hstyList dl dd ul li { padding: 8px 10px; font-size: 11pt; } .hstyList dl dd ul li:before { left: 2px; top: 18px; } .acaFature { padding-right: 0; background: none; } .acaFature h5 { font-size: 18pt; } .acaFature ul li { margin-top: 15px; } .acaFlow { margin-top: 30px; } .acaFlow h5 { font-size: 18pt; } .acaFlow ul { margin: 0 -10px; padding-top: 30px; text-align: center; } .acaFlow ul li { float: none; display: inline-block; width: 48%; padding: 20px; } } /* certificate */ .cerWrap { width: 1200px; margin: 0 auto; background: #fff; } .cerTitle { background: #0047a7; position: relative; padding: 0 20px; } .cerTitle h5 { height: 70px; line-height: 70px; color: #fff; font-size: 16pt; } .cerTitle a { display: block; height: 70px; width: 70px; position: absolute; right: 0; top: 0; text-indent: -9999px; z-index: 1; cursor: pointer; background: url("../../img/common/gnb_close.png")no-repeat center center; background-size: 24px auto; } .cerCont { background: #fff; } .cer01 { padding: 50px 100px; text-align: center; background: url("../../img/certificate/cer01_img02.png")no-repeat center center; } .cer01 h6 { text-align: left; font-size: 16pt; font-weight: 300; } .cer01 h3 { height: 86px; text-indent: -9999px; margin: 150px 0; background: url("../../img/certificate/cer01_img01.png")no-repeat center center; } .cer01 ul { text-align: left; } .cer01 ul li { font-size: 18pt; letter-spacing: 0.05em; margin-bottom: 20px; font-weight: 300; } .cer01 ul li:last-child { margin-bottom: 0; } .cer01 ul li span { font-size: 18pt; font-weight: 300; letter-spacing: 1.25em; } .cer01 ul li b { font-size: 18pt; font-weight: 500; } .cer01 h4 { margin: 150px 0; font-size: 22pt; font-weight: 300; line-height: 1.8em; } .cer01 h4 b { font-weight: 500; font-size: 22pt; line-height: 1.8em; } .cer01 p { font-size: 22pt; font-weight: 300; } .cer01 h5 { margin-top: 80px; height: 100px; text-indent: -9999px; background: url("../../img/certificate/cer01_img03.png")no-repeat center center; } .cer02 { padding: 50px 100px; text-align: center; background: url("../../img/certificate/cer02_img02.png")no-repeat center center; } .cer02 h6 { text-align: left; font-size: 16pt; font-weight: 300; } .cer02 h3 { height: 87px; text-indent: -9999px; margin: 150px 0; background: url("../../img/certificate/cer02_img01.png")no-repeat center center; } .cer02 ul { text-align: left; } .cer02 ul li { font-size: 18pt; letter-spacing: 0.05em; margin-bottom: 20px; font-weight: 300; } .cer02 ul li:last-child { margin-bottom: 0; } .cer02 ul li span { font-size: 18pt; font-weight: 300; letter-spacing: 1.05em; } .cer02 ul li b { font-size: 18pt; font-weight: 500; } .cer02 h4 { margin: 150px 0; font-size: 22pt; font-weight: 300; line-height: 1.8em; } .cer02 h4 b { font-weight: 500; font-size: 22pt; line-height: 1.8em; } .cer02 p { font-size: 22pt; font-weight: 300; } .cer02 h5 { margin-top: 80px; height: 100px; text-indent: -9999px; background: url("../../img/certificate/cer02_img03.png")no-repeat center center; } .cer03 { padding: 50px 100px; text-align: center; background: url("../../img/certificate/cer03_img02.png")no-repeat center center; } .cer03 h6 { text-align: left; font-size: 16pt; font-weight: 300; } .cer03 h3 { height: 59px; text-indent: -9999px; margin: 150px 0; background: url("../../img/certificate/cer03_img01.png")no-repeat center center; } .cer03 ul { text-align: left; } .cer03 ul li { font-size: 18pt; margin-bottom: 20px; font-weight: 300; } .cer03 ul li:last-child { margin-bottom: 0; } .cer03 ul li span { font-size: 18pt; font-weight: 300; } .cer03 ul li span.wd2 { letter-spacing: 3.00em; } .cer03 ul li span.wd4 { letter-spacing: 0.37em; } .cer03 ul li span.wd5 { letter-spacing: 0.05em; } .cer03 ul li b { font-size: 18pt; font-weight: 500; } .cer03 h4 { margin: 150px 0; font-size: 22pt; font-weight: 300; line-height: 1.8em; } .cer03 h4 b { font-weight: 500; font-size: 22pt; line-height: 1.8em; } .cer03 p { font-size: 22pt; font-weight: 300; } .cer03 h5 { margin-top: 80px; height: 100px; text-indent: -9999px; background: url("../../img/certificate/cer03_img03.png")no-repeat center center; } .cer04 { padding: 50px 50px 130px; } .cer04 h5 { font-size: 22pt; font-weight: 500; margin-bottom: 30px; } .cer04 h6 { font-weight: 300; font-size: 15pt; margin-top: 30px; } .cer04 table { border-left: solid 2px #fff; border-right: solid 2px #fff; } .cer04 table th, .cer04 table td { border: solid 1px #d6d6d6; text-align: center; font-weight: 300; font-size: 12pt; } .cer04 table th { padding: 8px; background: #f9f9f9; } .cer04 table td { padding: 12px 20px; } .cer04 table td p { text-align: left; min-height: 23px; font-weight: 300; font-size: 12pt; } .cer05 { text-align: right; padding: 50px 170px 100px 30px; background: url("../../img/certificate/cer04_img01.png")no-repeat 100px 85%; } .cer05 h6 { text-align: left; font-weight: 300; font-size: 15pt; } .cer05 h2 { height: 207px; text-indent: 9999px; background: url("../../img/certificate/cer04_img02.png")no-repeat right center; } .cer05 h3 { margin-top: 120px; padding-top: 50px; font-size: 24pt; font-weight: 700; background: url("../../img/certificate/cer04_img03.png")no-repeat right top; } .cer05 ul { margin-top: 50px; padding-top: 200px; background: url("../../img/certificate/cer04_img04.png")no-repeat right top; } .cer05 ul li { margin-bottom: 20px; font-weight: 300; font-size: 16pt; } .cer05 ul li b { font-weight: 500; font-size: 16pt; } .cer05 h4 { height: 200px; background: url("../../img/certificate/cer04_img05.png")no-repeat right center; position: relative; text-indent: 9999px; } .cer05 h4:before, .cer05 h4:after { content: ""; display: block; height: 1px; background: #000; width: 300px; position: absolute; right: 0; } .cer05 h4:before { top: 0; } .cer05 h4:after { bottom: 0; } .cer05 h5 { height: 117px; margin-top: 30px; background: url("../../img/certificate/cer04_img06.png")no-repeat right center; } .cer05 p { height: 82px; margin-top: 30px; background: url("../../img/certificate/cer04_img07.png")no-repeat right center; } .cerCont.print { padding: 70px 50px; } .cerCont.print h3 { text-align: center; font-size: 30pt; font-weight: 400; margin-bottom: 80px; } .crprtTitle { padding-bottom: 30px; font-size: 14pt; } .crprtList { margin: 0 -40px; padding-bottom: 100px; } .crprtList:after { content: ""; display: table; clear: both; } .crprtList li { float: left; width: 50%; padding: 0 40px; } .crprtList li dl { } .crprtList li dl dt { height: 60px; background: #ecf4fb; text-align: center; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; } .crprtList li dl dt span { display: inline-block; height: 60px; line-height: 60px; padding-left: 50px; color: #0047a7; font-size: 14pt; } .crprtList li dl dd { padding-top: 20px; } .crprtList li dl dd img { display: block; margin: 0 auto; max-width: 100%; } .crprtList li dl dd h6 { font-size: 11pt; margin-top: 30px; margin-bottom: 10px; } .crprtList li dl dd p { font-size: 11pt; } .crprtList li dl dd p span { color: #ff0000; } /* 190811 CSS추가 */ /* 200829 css추가 */ .apyList { margin-top: 30px; } .apyList li { border: solid 1px #d6d6d6; border-bottom: none; padding: 19px; } .apyList li:last-child { border-bottom: solid 1px #d6d6d6; } .apyWrap { display: table; width: 100%; } .apyThumb { display: table-cell; width: 280px; vertical-align: top; position: relative; } .apyThumb em { display: block; padding-bottom: 64%; background-size: cover !important; } .apyThumb span { position: absolute; left: 0; top: 0; width: 80px; height: 30px; line-height: 30px; text-align: center; color: #fff; font-size: 10pt; } .apyThumb span.blu { background: #1e52bd; } .apyThumb span.grn { background: #008b5b; } .apyCont { display: table-cell; vertical-align: top; position: relative; padding-right: 200px; padding-left: 30px; } .apyCont h6 { display: inline-block; border: solid 1px #4082cc; color: #2b74c7; height: 30px; line-height: 28px; padding: 0 20px; font-size: 11pt; font-weight: 400; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; } .apyCont h5 { color: #222; font-size: 13pt; font-weight: 500; margin-top: 10px; } .apyCont dl { margin-top: 15px; color: #474747; } .apyCont dl dd { font-size: 11pt; margin-bottom: 3px; position: relative; padding-left: 8px; line-height: 1.4em; } .apyCont dl dd:last-child { margin-bottom: 0; } .apyCont dl dd:before { content: ''; display: block; width: 2px; height: 2px; background: #474747; position: absolute; left: 0; top: 9px; } .apyCont dl dd em { font-weight: 300; font-style: normal; } .apyCont dl dd span.red { color: #f00; } a.apyBtn { display: block; width: 180px; height: 80px; line-height: 80px; text-align: center; color: #fff; background: #0047a7; position: absolute; right: 0; top: 50%; margin-top: -40px; font-size: 14pt; } a.apyMore { display: block; width: 240px; height: 60px; border: solid 1px #d0d0d0; text-align: center; margin: 0 auto; margin-top: 30px; } a.apyMore span { display: inline-block; height: 58px; line-height: 58px; padding-right: 30px; color: #666; font-size: 12pt; font-weight: 500; background: url("../../img/common/apply_more.png")no-repeat right center; background-size: 13px auto; } .apyInfo { border: solid 1px #d6d6d6; background: #fff; } .apyiTop { background: #f1f8ff; padding: 25px 20px; } .apyiTop:after { content: ''; display: table; clear: both; } .apyiTop span { display: inline-block; vertical-align: middle; width: 80px; height: 30px; line-height: 30px; margin-right: 10px; text-align: center; color: #fff; font-size: 11pt; } .apyiTop span.blu { background: #1e52bd; } .apyiTop span.grn { background: #008b5b; } .apyiTop h5 { display: inline; vertical-align: middle; font-size: 14pt; font-weight: 500; } .apyiMid { display: table; width: 100%; padding: 25px 20px; } .apyiThumb { display: table-cell; vertical-align: middle; width: 230px; } .apyiThumb em { display: block; padding-bottom: 64%; background-size: cover !important; } .apyiTxt { display: table-cell; vertical-align: middle; padding-left: 20px; } .apyiTxt dl { } .apyiTxt dl dd { font-size: 12pt; position: relative; padding-left: 8px; line-height: 1.4em; margin-bottom: 10px; } .apyiTxt dl dd:last-child { margin-bottom: 0; } .apyiTxt dl dd:before { content: ''; display: block; width: 2px; height: 2px; background: #474747; position: absolute; left: 0; top: 9px; } .apyiTxt dl dd span.blu { color: #2b74c7; } .apyiTxt dl dd span.red { color: #f00; } .apyiTxt dl dd em { display: inline-block; width: 1px; height: 14px; background: #dadada; margin: 0 10px; } .apyiBot { background: #f9f9f9; padding: 10px 0; } .apyiBot a { display: block; width: 100px; height: 40px; line-height: 40px; margin: 0 auto; background: #0047a7; color: #fff; text-align: center; } .apydTitle { position: relative; padding-left: 20px; color: #000; font-size: 13pt; font-weight: 400; margin-top: 60px; } .apydTitle:before { content: ''; display: block; width: 16px; height: 16px; border: solid 4px #000; position: absolute; left: 0; top: 50%; margin-top: -8px; box-sizing: border-box; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; } .apydTxt { padding-left: 20px; margin-top: 10px; color: #666; font-weight: 300; font-size: 12pt; line-height: 1.6em; } .apydTable { border-left: solid 2px #fff; border-right: solid 2px #fff; margin-top: 20px; } .apydTable th, .apydTable td { border: solid 1px #d6d6d6; padding: 20px; } .apydTable th { background: #f9f9f9; font-weight: 400; width: 80px; } .apydTable td span { display: inline-block; width: 40px; height: 20px; line-height: 20px; color: #fff; background: #0047a7; margin-right: 10px; text-align: center; } .apypTitle { margin-bottom: 10px; font-size: 13pt; font-weight: 400; } .apypScr { border: solid 1px #d6d6d6; padding: 30px; height: 400px; overflow-y: auto; } .apypScr h5 { font-size: 13pt; font-weight: 500; line-height: 1.8em; } .apypScr h6 { font-size: 12pt; font-weight: 500; line-height: 1.8em; } .apypScr p { font-size: 11pt; color: #666; line-height: 1.8em; } .apydTable.scss th, .apydTable.scss td span { height: 30px; line-height: 30px; width: auto; padding: 0 20px; } .apydTable.scss td span.blu { background: #1e52bd; } .apydTable.scss td span.grn { background: #008b5b; } .apydTable.scss th { width: 200px; } .apydTable.scss td em { display: inline-block; width: 1px; height: 14px; background: #bbb; margin: 0 10px; } .apyDesc { margin-top: 20px; color: #474747; line-height: 1.8em; } .apyLnk { text-align: center; margin-top: 30px; } .apyLnk a { display: inline-block; width: 200px; height: 60px; line-height: 60px; color: #fff; background: #0047a7; font-size: 13pt; font-weight: 500; } .schrChk { margin-top: 30px; margin-bottom: -10px; } .schrChk:after { content: ''; display: table; clear: both; } .schrChk li { float: left; margin-right: 25px; } .schrChk li:last-child { margin-right: 0px; } .rcmTop { position: relative; padding-right: 110px; padding-left: 190px; } .rcmTop h5 { width: 170px; height: 60px; line-height: 60px; background: #303030; color: #fff; position: absolute; left: 0; top: 50%; margin-top: -30px; text-align: center; font-size: 12pt; font-weight: 300; border-radius: 30px 30px 30px 30px; -moz-border-radius: 30px 30px 30px 30px; -webkit-border-radius: 30px 30px 30px 30px; } .rcmTop p { color: #666; font-size: 12pt; padding: 25px 0; } .rcmTop a { display: block; width: 110px; height: 50px; line-height: 48px; border: solid 1px #303030; text-align: center; position: absolute; right: 0; top: 50%; margin-top: -25px; } @media (max-width:900px) { .apyList { margin-top: 30px; } .apyList li { border: solid 1px #d6d6d6; border-bottom: solid 1px #d6d6d6; margin-bottom: 15px; padding: 10px; } .apyWrap { display: block; } .apyThumb { display: block; width: 100%; } .apyCont { display: block; width: 100%; padding-right: 0; padding-left: 0; padding-top: 15px; } .apyCont h6 { padding: 0 15px; font-size: 10pt; } .apyCont h5 { font-size: 12pt; } .apyCont dl { margin-top: 10px; } .apyCont dl dd { font-size: 10pt; } a.apyBtn { width: 100%; height: 50px; line-height: 50px; position: static; margin-top: 15px; font-size: 12pt; } a.apyMore { width: 180px; height: 50px; } a.apyMore span { height: 48px; line-height: 48px; padding-right: 24px; font-size: 11pt; } .apyiTop { padding: 10px; } .apyiTop span { width: 60px; height: 26px; line-height: 26px; margin-right: 5px; font-size: 10pt; } .apyiTop h5 { font-size: 12pt; } .apyiMid { display: block; width: 100%; padding: 10px; } .apyiThumb { display: block; width: 100%; } .apyiTxt { display: block; padding-left: 0; } .apyiTxt dl { margin-top: 15px; } .apyiTxt dl dd { font-size: 11pt; margin-bottom: 5px; } .apyiTxt dl dd em { margin: 0 5px; } .apydTitle { font-size: 12pt; margin-top: 30px; } .apydTitle:before { width: 14px; height: 14px; border: solid 3px #000; margin-top: -7px; } .apydTxt { margin-top: 5px; font-size: 11pt; } .apydTable { margin-top: 10px; } .apydTable th, .apydTable td { padding: 10px; font-size: 10pt; } .apydTable th { width: 40px; } .apydTable td span { width: 30px; margin-right: 5px; font-size: 9pt; } .apypTitle { font-size: 12pt; } .apypScr { padding: 15px; height: 240px; } .apypScr h5 { font-size: 12pt; } .apypScr h6 { font-size: 11pt; } .apypScr p { font-size: 10pt; } .apydTable.scss th, .apydTable.scss td span { height: 24px; line-height: 24px; padding: 0 10px; } .apydTable.scss th { width: 80px; } .apyDesc { margin-top: 10px; font-size: 11pt; line-height: 1.6em; } .apyLnk a { width: 160px; height: 50px; line-height: 50px; font-size: 12pt; } .schrChk { margin-top: 20px; margin-bottom: -20px; } .schrChk li { float: left; margin-right: 15px; } .rcmTop { padding-right: 0; padding-left: 0; } .rcmTop h5 { width: 100px; height: 30px; line-height: 30px; position: static; margin-top: 0; font-size: 11pt; font-weight: 300; } .rcmTop p { font-size: 11pt; padding: 0; margin-top: 10px; } .rcmTop a { width: 80px; height: 40px; line-height: 38px; top: 0; margin-top: 0; } } .txtDot { } .txtDot li { margin-bottom: 5px; font-size: 11pt; color: #6b6b6b; position: relative; padding-left: 8px; } .txtDot li:last-child { margin-bottom: 0; } .txtDot li:before { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 9px; } .edTable { margin-top: 20px; border-right: solid 2px #fff; border-left: solid 2px #fff; border-top: solid 2px #d6d6d6; } .edTable th, .edTable td { border: solid 1px #d6d6d6; padding: 20px; font-size: 12pt; font-weight: 400; } .edTable th { background: #fafafa; } .edOln { padding-top: 40px; } .edOln img { display: block; max-width: 100%; margin: 0 auto; } @media (max-width:900px) { .txtDot.mt20 { margin-top: 0; } .edTable { margin-top: 20px; border-right: solid 2px #fff; border-left: solid 2px #fff; border-top: solid 2px #d6d6d6; } .edTable th, .edTable td { padding: 10px; font-size: 11pt; } .edTable td .txtDot li { font-size: 11pt; } .edOln { padding-top: 20px; } .edOln img { display: block; max-width: 100%; margin: 0 auto; } } .jnItro { padding-left: 420px; position: relative; padding-top: 80px; margin-bottom: 200px; } .jnItro:before { content: ''; display: block; width: 380px; height: 430px; position: absolute; left: 0; top: 50%; margin-top: -215px; background: url('../../img/mypage/join_intro.png')no-repeat center center; } .jnItro h5 { color: #0047a7; font-size: 26pt; letter-spacing: -0.075em; font-weight: 500; line-height: 1.2em; } .jnItro p { color: #666; font-size: 12pt; line-height: 1.8em; margin-top: 30px; } .jnItro a { display: block; width: 500px; height: 60px; line-height: 60px; text-align: center; color: #fff; background: #0047a7; font-size: 13pt; margin-top: 60px; } .privacy h4 { font-size: 12pt; font-weight: 500; color: #000; } .privacy h5 { font-size: 12pt; font-weight: 500; color: #0047a7; margin-top: 30px; } .privacy p { color: #666; font-size: 11pt; margin-top: 10px; line-height: 1.8em; } .privacy p a { color: #0047a7; font-weight: 500; } @media (max-width:900px) { .jnItro { padding-left: 0; position: relative; padding-top: 0; margin-bottom: 0; } .jnItro:before { width: 100%; height: auto; padding-bottom: 65%; position: static; margin-top: 0; background-size: 50% auto; } .jnItro h5 { font-size: 16pt; text-align: center; margin-top: 20px; } .jnItro p { font-size: 11pt; margin-top: 15px; } .jnItro a { width: 100%; height: 50px; line-height: 50px; font-size: 12pt; margin-top: 30px; } .privacy h4 { font-size: 11pt; } .privacy h5 { font-size: 11pt; } .privacy p { font-size: 10pt; } } .schCont li { float: left; width: 20%; padding-right: 10px; } /* 스마트검색 */ .pt0 { padding-top: 0; } .mt15 { margin-top: 15px; } .mt20 { margin-top: 20px; } .mb20 { margin-bottom: 20px; } .schBox { background: #f3f3f3; padding: 30px 20px; } .schTab { text-align: center; } .schTab:after { content: ''; display: table; clear: both; } .schTab li { display: inline-block; margin: 0 35px; position: relative; padding-bottom: 10px; } .schTab li a { font-size: 12pt; } .schTab li.current a { color: #0047a7; } .schTab li.current:after { content: ''; display: block; height: 2px; position: absolute; left: 0; right: 0; bottom: 0; background: #0047a7; } .schCont { position: relative; padding-right: 50px; margin-top: 20px; } .schCont:after { content: ''; display: table; clear: both; } .schCont li { float: left; width: 20%; padding-right: 10px; } .schCont li select { display: block; width: 100%; } .schCont li:last-child { width: 50px; position: absolute; right: 0; top: 0; padding-right: 0; } .schCont li:last-child a, .schCont li:last-child button, .schCont li:last-child input[type="submit"] { display: block; width: 50px; height: 50px; position: absolute; right: 0; top: 0; border: none; text-indent: -9999px; background: #3a3a3a url("../../img/online/search_ico.png")no-repeat center center; background-size: 50px auto; } .subDsc { font-size: 12pt; color: #666; } .subDsc.bk { color: #000; } span.lg { font-size: 14pt; } span.org { color: #ff5a00; } .smtLnk { margin-top: 20px; } .smtLnk:after { content: ''; display: table; clear: both; } .smtLnk li { float: left; margin-right: 10px; } .smtLnk li:last-child { margin-right: 0; } .smtLnk li a { display: block; height: 40px; line-height: 38px; border: solid 1px #232323; padding: 0 25px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .smtLnk li a:after { content: ''; display: inline-block; margin-left: 15px; width: 6px; height: 11px; background: url('../../img/common/link_arrow.png')no-repeat center center; background-size: 6px auto; } .smtList { margin-top: 50px; } .smtList.pop { margin-top: 0; } .smtList > li { border: solid 1px #d6d6d6; margin-bottom: 20px; } .smtList > li:last-child { margin-bottom: 0; } .smtlCont { position: relative; padding: 30px 20px; padding-right: 300px; word-break: keep-all; } .smtList.pop .smtlCont { padding-right: 20px; } .smtlCont h5 { font-size: 13pt; font-weight: 400; } .smtlCont h5 em { display: inline-block; vertical-align: middle; padding: 0 5px; height: 20px; line-height: 20px; color: #fff; font-size: 9pt; text-align: center; margin-right: 5px; font-style: normal; } .smtlCont h5 em.org { background: #f60; } .smtlCont h5 em.grn { background: #259e41; } .smtlCont h5 em.blu { background: #0000ff; } .smtlCont h5 span { vertical-align: middle; } .smtlCont p { margin-top: 10px; color: #888; position: relative; padding-left: 8px; } .smtlCont p:before { content: ''; display: block; width: 2px; height: 2px; background: #888; position: absolute; left: 0; top: 10px; } .smtlCont p span.sky { color: #238dfa; } .smtlCont .gry { background: #f9f9f9; padding: 20px 20px; margin: 20px -20px -30px; } .smtlCont .gry p { margin-top: 5px; } .smtlBtn { position: absolute; right: 20px; top: 50%; /*margin-top: -25px;*/ } .smtlBtn:after { content: ''; display: table; clear: both; } .smtlBtn li { float: left; margin-right: 10px; font-size: 18px } .smtlBtn li:last-child { margin-right: 0; } .smtlBtn li a { display: block; height: 50px; line-height: 48px; text-align: center; font-weight: 500; width: 100px; } .smtlBtn li a.smtlBtn01 { border: solid 1px #0047a7; color: #0047a7; } .smtlChk label { cursor: auto; font-size: 15pt; } .smtlBtn li a.smtlBtn02 { border: solid 1px #383838; background: #383838; color: #fff; } .smtlTab { background: #f9f9f9; padding: 30px 20px; } .smtlTab:after { content: ''; display: table; clear: both; } .smtlTab li { float: left; position: relative; margin-right: 15px; padding-right: 15px; } .smtlTab li:last-child { padding-right: 0; margin-right: 0; } .smtlTab li:after { content: ''; display: block; width: 1px; height: 14px; background: #e0e0e0; position: absolute; right: 0; top: 50%; margin-top: -7px; } .smtlTab li:last-child:after { display: none; } .smtlTab li a { display: block; } .smtlTab li.current a { color: #0047a7; } .smtlChk { padding: 0 20px; } .smtlChk li { padding: 30px; border-bottom: solid 1px #eaeaea; position: relative; line-height: 1.8em; } .smtlChk li:last-child { border-bottom: none; } .smtlChk li input[type="checkbox"] { position: absolute; left: 0; top: 50%; margin-top: -9px; } .smtlChk li p { } .smtlChk li p span { } .smtlChk li p span.blu { color: #0047a7; } .smtlChk li p span.gry { color: #666; } .smtlChk li p span.red { color: #f00; } .smtlChk li p span.cshapelabel { color: #fff; /* background: #333583;*/ padding: 0 10px; font-size: 10pt; margin-left: 5px; } .smtlChk li p span.nav_blu {background-color:#333583;color: #fff;padding: 0 10px; font-size: 11pt;margin-left: 5px;} .smtlChk li p span.nav_grn {background-color:#77b743;color: #fff;padding: 0 10px; font-size: 11pt; margin-left: 5px;} .smtlChkBtn { display: block; width: 120px; height: 50px; line-height: 48px; text-align: center; position: absolute; right: 0; top: 50%; margin-top: -25px; } .smtlChkBtn.smtlChk01 { border: solid 1px #0047a7; color: #0047a7; } .smtlChkBtn.smtlChk02 { border: solid 1px #383838; color: #383838; } .smtlChkBtn.smtlChk03 { border: solid 1px #0047a7; background: #0047a7; color: #fff; } .smtlChkBtn.smtlChk04 { border: solid 1px #f4f4f4; background: #f4f4f4; color: #929292; } .smtlChkBtn.smtlChk05 { border: solid 1px #f4f4f4; background: red; color: #fff; } @media (max-width:900px) { .schBox { padding: 10px; } .schTab { margin-top: -5px; margin-bottom: -5px; } .schTab li { margin: 5px 15px; padding-bottom: 5px; } .schTab li a { font-size: 10pt; } .schCont { padding-right: 0; margin-top: 10px; } .schCont li { float: none; width: 100%; padding-right: 0; margin-bottom: 5px; } .schCont li select { height: 40px; } .schCont li:last-child { width: 100%; position: static; margin-bottom: 0; } .schCont li:last-child a, .schCont li:last-child button, .schCont li:last-child input[type="submit"] { width: 100%; height: 40px; line-height: 40px; position: static; text-indent: 0; color: #fff; text-align: center; background: #3a3a3a; } .subDsc { font-size: 10pt; } .smtLnk { margin-top: 20px; } .smtLnk li { float: none; margin-right: 0; text-align: center; margin-bottom: 5px; } .smtLnk li:last-child { margin-bottom: 0; } .smtList { margin-top: 30px; } .smtList > li { margin-bottom: 10px; } .smtlCont { padding: 20px 10px; padding-right: 10px; } .smtList.pop .smtlCont { padding-right: 10px; } .smtlCont .gry { padding: 10px 10px; margin: 10px -10px -20px; } .smtlBtn { position: static; right: 0; top: 0; margin-top: 10px; margin-left: -5px; margin-right: -5px; width: auto; } .smtlBtn li { float: left; width: 50%; margin-right: 0; padding: 0 5px; } .smtlBtn li a { height: 40px; line-height: 38px; width: 100%; } .smtlTab { padding: 20px 10px; text-align: center; } .smtlTab li { margin-right: 10px; padding-right: 10px; display: inline-block; float: none; } .smtlTab li:after { height: 10px; margin-top: -5px; } .smtlTab li a { font-size: 10pt; } .smtlChk { padding: 0 10px; } .smtlChk li { padding: 20px 0; padding-right: 0; } .smtlChk li input[type="checkbox"] { position: absolute; left: 0; top: 20px; margin-top: 3px; } .smtlChk li p { padding-left: 30px; } .smtlChkBtn { width: 100%; height: 40px; line-height: 38px; text-align: center; position: static; margin-top: 10px; } } /* 교육비결제 */ .apyBox { border: solid 1px #d6d6d6; } .apyBox dt { padding: 20px; } .apyBox dt h5 { color: #111; font-size: 12pt; font-weight: 500; } .apyBox dt h5 span.blu { color: #0047a7; } .apyBox dt p { color: #666; font-size: 11pt; margin-top: 15px; } .apyBox dd { padding: 20px; background: #f9f9f9; font-size: 13pt; } .apyBox dd span.red { color: #f00; font-weight: 500; } .apyBox dd span.bk { color: #000; font-weight: 500; } .apyRdo { border: solid 1px #d6d6d6; padding: 20px; } .apyRdo:after { content: ''; display: table; clear: both; } .apyRdo > li { display: inline-block; vertical-align: middle; margin-right: 40px; } .apyRdo > li:last-child { margin-right: 0; } .apyPh { display: inline-block; vertical-align: middle; width: 370px; } .apyPh:after { content: ''; display: table; clear: both; } .apyPh li { float: left; } .apyPh li:nth-child(even) { width: 5%; height: 40px; line-height: 40px; text-align: center; } .apyPh li:nth-child(odd) { width: 30%; } .apyPh select, .apyPh input { display: block; width: 100%; height: 40px; min-width: 100%; } .apyScs { text-align: center; padding: 60px 0; } .apyScs h5 { font-size: 24pt; font-weight: 500; line-height: 1.2em; } .apyScs h6 { font-size: 20pt; font-weight: 500; line-height: 2.0em; margin-bottom: 40px; } .apyScs h6 span { color: #0047a7; } .apyScs p { font-size: 12pt; color: #666; margin-top: 5px; } .apyCost { background: #f9f9f9; padding: 20px; font-size: 12pt; } .apyCost span.red { color: #f00; font-size: 14pt; font-weight: 500; } .apyIpt { height: 40px; width: 420px; } .apyAddr { margin: -5px; width: 680px; position: relative; padding-right: 125px; } .apyAddr:after { content: ''; display: table; clear: both; } .apyAddr li { float: left; padding: 5px; } .apyAddr li:nth-child(1) { width: 30%; padding-bottom: 10px; } .apyAddr li:nth-child(2) { width: 70%; padding-bottom: 10px; } .apyAddr li:nth-child(3) { float: none; margin-right: -130px; } .apyAddr li:nth-child(4) { padding: 0; } .apyAddr li:nth-child(4) a { display: block; height: 40px; line-height: 40px; text-align: center; background: #878787; color: #fff; width: 120px; position: absolute; right: 0; top: 5px; } .usrNum { width: 420px; } .usrNum:after { content: ''; display: table; clear: both; } .usrNum li { float: left; width: 48%; } .usrNum li input[tyep="tel"] { display: block; width: 100%; } .usrNum li:nth-child(2) { width: 4%; text-align: center; height: 40px; line-height: 40px; } .usrPhn { width: 420px; } .usrPhn:after { content: ''; display: table; clear: both; } .usrPhn li { float: left; } .usrPhn li:nth-child(odd) { width: 30%; } .usrPhn li:nth-child(even) { width: 5%; text-align: center; height: 40px; line-height: 40px; } .usrPhn li select, .usrPhn li input[tyep="tel"] { display: block; width: 100%; } @media (max-width:900px) { .apyBox dt { padding: 15px; } .apyBox dt p { font-size: 10pt; margin-top: 10px; } .apyBox dd { padding: 15px; font-size: 11pt; } .apyBox dd span.red { font-size: 12pt; } .apyRdo { padding: 15px; } .apyRdo > li { margin-right: 20px; } .apyPh { width: 80%; margin-top: 5px; } .apyPh:after { content: ''; display: table; clear: both; } .apyPh li { float: left; } .apyPh li:nth-child(even) { width: 5%; height: 40px; line-height: 40px; text-align: center; } .apyPh li:nth-child(odd) { width: 30%; } .apyPh select, .apyPh input { display: block; width: 100%; height: 40px; min-width: 100%; } .apyScs { padding-top: 60px; padding-bottom: 20px; } .apyScs h5 { font-size: 16pt; } .apyScs h6 { font-size: 18pt; margin-bottom: 20px; } .apyScs p { font-size: 11pt; } .apyIpt { width: 100%; } .apyAddr { margin: 0; width: auto; padding-right: 0; } .apyAddr li { float: none; padding: 0; } .apyAddr li:nth-child(1) { width: 100%; padding-bottom: 5px; padding-right: 95px; } .apyAddr li:nth-child(2) { width: 100%; padding-bottom: 5px; } .apyAddr li:nth-child(3) { width: 100%; padding-bottom: 0; margin-right: 0; } .apyAddr li:nth-child(4) { padding: 0; } .apyAddr li:nth-child(4) a { width: 90px; font-size: 10pt; top: 0; } .usrNum { width: 100%; } .usrPhn { width: 100%; } } /* 교육일정 */ .schList { } .schList li { padding: 20px 0; border-bottom: solid 1px #eaeaea; position: relative; display: table; width: 100%; } .schList li:last-child { border-bottom: none; } .schList li h4 { display: table-cell; vertical-align: middle; width: 120px; text-align: center; font-weight: 400; font-size: 12pt; } .schList li > div { display: table-cell; vertical-align: middle; } .schList li h6 { font-size: 12pt; font-weight: 400; } .schList li h6 span.blu { color: #0047a7; } .schList li p { color: #666; font-size: 11pt; margin-top: 5px; } .schList.dim li h4 { color: #888; } .schList.dim li h6 { color: #888; } .schList.dim li h6 span.blu { color: #888; } .schList.dim li p { color: #888; } @media (max-width:900px) { .schList { } .schList li { display: block; padding: 20px 0; } .schList li h4 { display: block; width: 100%; font-size: 13pt; font-weight: 400; } .schList li > div { display: block; margin-top: 15px; } .schList li h6 { font-size: 12pt; font-weight: 500; } .schList li p { font-size: 11pt; margin-top: 5px; } } /* 회원가입 */ .jnStep { margin: 0 -8px; } .jnStep:after { content: ''; display: table; clear: both; } .jnStep li { float: left; width: 33.3333%; padding: 0 8px; } .jnStep li > div { height: 60px; padding: 2px; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; background: #0047a7; background: -moz-linear-gradient(45deg, #0047a7 21%, #e8b800 54%); background: -webkit-linear-gradient(45deg, #0047a7 21%,#e8b800 54%); background: linear-gradient(45deg, #0047a7 21%,#e8b800 54%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0047a7', endColorstr='#e8b800',GradientType=1 ); } .jnStep li > div > div { background: #fff; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; } .jnStep li span { display: block; height: 56px; line-height: 56px; text-align: center; color: #0047a7; font-size: 13pt; } .jnStep li.current > div { background: #0047a7; } .jnStep li.current > div > div { background: #0047a7; } .jnStep li.current span { color: #fff; } .jnStep li span:before { content: ''; display: inline-block; width: 28px; height: 33px; background-size: cover !important; vertical-align: middle; margin-right: 10px; margin-top: -5px; } .jnStep li:nth-child(1) span:before { background: url('../../img/common/join_step01.png')no-repeat center center; } .jnStep li:nth-child(2) span:before { background: url('../../img/common/join_step02.png')no-repeat center center; } .jnStep li:nth-child(3) span:before { background: url('../../img/common/join_step03.png')no-repeat center center; } .jnStep li:nth-child(1).current span:before { background: url('../../img/common/join_step01_on.png')no-repeat center center; } .jnStep li:nth-child(2).current span:before { background: url('../../img/common/join_step02_on.png')no-repeat center center; } .jnStep li:nth-child(3).current span:before { background: url('../../img/common/join_step03_on.png')no-repeat center center; } .jnSel { margin: 0 -30px; padding-top: 50px; text-align: center; } .jnSel:after { content: ''; display: table; clear: both; } .jnSel > div { /*float: left;*/ width: 33.3333%; padding: 0 30px; display: inline-block; } .jnsCont { background: #f8f8f8; border: solid 1px #e1e1e1; text-align: center; padding: 50px 0; } .jnsCont img { } .jnsCont p { font-size: 14pt; font-weight: 500; margin: 20px 0; } .jnsCont a { display: inline-block; width: 120px; height: 40px; line-height: 40px; color: #fff; background: #484848; font-size: 12pt; } .rstNon { text-align: center; padding: 30px 0; } .rstNon h6 { color: #0047a7; font-size: 13pt; font-weight: 400; } .rstNon p { color: #666; margin-top: 5px; } @media (max-width:900px) { .jnStep { margin: 0 -3px; } .jnStep li { padding: 0 3px; } .jnStep li > div { height: 40px; padding: 2px; } .jnStep li span { height: 36px; line-height: 36px; font-size: 10pt; } .jnStep li span:before { display: none; } .jnSel { margin: 0; padding-top: 30px; } .jnSel > div { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .jnSel > div:last-child { margin-bottom: 0; } .jnsCont { padding: 30px 0; } .jnsCont p { font-size: 12pt; margin: 15px 0; } } /* 인사말 */ .subTxt { font-size: 13pt; color: #000; line-height: 1.8em; } .subTxt.red { color: #f00; } .itrRut { margin: -20px; } .itrRut:after { content: ''; display: table; clear: both; } .itrRut > li { padding: 20px; float: left; width: 50%; } .itrRut > li div { } .itrRut > li h5 { height: 80px; line-height: 50px; padding: 0 20px; color: #fff; font-size: 13pt; font-weight: 400; text-transform: uppercase; border-radius: 0px 15px 0px 0px; -moz-border-radius: 0px 15px 0px 0px; -webkit-border-radius: 0px 15px 0px 0px; } .itrRut > li:nth-child(1) h5 { background: #539cff; } .itrRut > li:nth-child(2) h5 { background: #044eb2; } .itrRut > li:nth-child(3) h5 { background: #5853ff; } .itrRut > li:nth-child(4) h5 { background: #04aab2; } .itrRut > li > div > ul { background: #f7f7f7; position: relative; margin-top: -30px; padding: 30px 20px; height: 10em; border-radius: 15px 15px 0px 15px; -moz-border-radius: 15px 15px 0px 15px; -webkit-border-radius: 15px 15px 0px 15px; } .itrRut > li > div > ul > li { position: relative; padding-left: 8px; font-size: 12pt; margin-bottom: 6px; } .itrRut > li > div > ul > li:last-child { margin-bottom: 0; } .itrRut > li > div > ul > li:before { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 10px; } @media (max-width:900px) { .subTxt { font-size: 11pt; line-height: 1.5em; } .itrRut { margin: 0; } .itrRut > li { padding: 0; float: none; width: 100%; margin-bottom: 20px; } .itrRut > li:last-child { margin-bottom: 0; } .itrRut > li h5 { line-height: 40px; padding: 0 15px; font-size: 12pt; } .itrRut > li > div > ul { margin-top: -40px; padding: 20px 15px; height: auto; } .itrRut > li > div > ul > li { font-size: 11pt; margin-bottom: 5px; } } /* 연혁 */ .hsty { color: #666; font-size: 12pt; padding-left: 30px; position: relative; line-height: 1.8em; } .hsty:before { content: ''; display: block; width: 20px; height: 20px; position: absolute; left: 0; top: 5px; background-size: 20px auto !important; } .hsty01:before { background: url('../../img/common/history_ico01.png')no-repeat center center; } .hsty02:before { background: url('../../img/common/history_ico02.png')no-repeat center center; } .hsty03:before { background: url('../../img/common/history_ico03.png')no-repeat center center; } .hsty04:before { background: url('../../img/common/history_ico04.png')no-repeat center center; } .hsty05:before { background: url('../../img/common/history_ico05.png')no-repeat center center; } .hsty span { padding-right: 10px; margin-right: 5px; position: relative; } .hsty span:after { content: ''; display: block; width: 1px; height: 14px; background: #c6c6c6; position: absolute; right: 0; top: 50%; margin-top: -7px; } /* 교육비 */ .eduCost { border: solid 1px #d6d6d6; } .eduCost li { padding: 20px; border-bottom: solid 1px #d6d6d6; } .eduCost li:after { content: ''; display: table; clear: both; } .eduCost li:last-child { border-bottom: none; } .edcLeft { float: left; } .edcLeft h4 { color: #238dfa; font-size: 12pt; font-weight: 400; } .edcLeft h5 { font-size: 14pt; font-weight: 400; } .edcLeft p { font-size: 11pt; color: #888; margin-top: 15px; } .edcRht { float: right; text-align: right; } .edcRht span.red { color: #f00; } .edcTgt { margin-top: 20px; font-size: 12pt; } .edcTgt dt { color: #0047a7; font-weight: 500; } .edcTgt dd { margin-top: 5px; color: #666; } .edcTgt dd span.bk { color: #000; } @media (max-width:900px) { .eduCost { } .eduCost li { padding: 15px; } .edcLeft { float: none; } .edcLeft h4 { font-size: 11pt; } .edcLeft h5 { font-size: 12pt; } .edcLeft p { font-size: 10pt; margin-top: 5px; } .edcRht { float: none; font-size: 10pt; } .edcTgt { font-size: 11pt; } } .rfnd { padding-left: 80px; position: relative; margin-top: 30px; } .rfnd:before { content: ''; display: block; width: 60px; height: 60px; position: absolute; left: 0; top: 0; background-size: 28px auto !important; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; } .rfnd.card:before { background: #0070d5 url('../../img/common/refund_ico01.png')no-repeat center center; } .rfnd.bank:before { background: #0070d5 url('../../img/common/refund_ico02.png')no-repeat center center; } .rfnd h5 { color: #0047a7; font-size: 12pt; font-weight: 500; } .rfnd ul { margin-top: 10px; } .rfnd ul li { padding-left: 8px; color: #666; margin-bottom: 5px; position: relative; font-size: 11pt; } .rfnd ul li:last-child { margin-bottom: 0; } .rfnd ul li:before { content: ''; display: block; width: 2px; height: 2px; background: #888; position: absolute; left: 0; top: 10px; } @media (max-width:900px) { .rfnd { padding-left: 50px; } .rfnd:before { width: 40px; height: 40px; background-size: 20px auto !important; } } .rfndFlw { margin: 0 -10px; } .rfndFlw:after { content: ''; display: table; clear: both; } .rfndFlw > li { float: left; width: 16.6666%; padding: 0 10px; } .rfndFlw > li > div { border: solid 1px #0047a7; overflow: hidden; border-radius: 200px; -moz-border-radius: 200px; -webkit-border-radius: 200px; } .rfndFlw > li > div h5 { height: 60px; line-height: 60px; text-align: center; background: #0047a7; color: #fff; font-size: 12pt; font-weight: 500; } .rfndFlw > li > div > div { text-align: center; padding: 40px 0; } .rfndFlw > li > div h6 { font-size: 13pt; font-weight: 400; } .rfndFlw > li > div > div ul { margin-top: 15px; height: 5.0em; } .rfndFlw > li > div > div ul li { color: #666; font-size: 11pt; } .dotList { } .dotList li { margin-bottom: 5px; color: #666; font-size: 12pt; padding-left: 8px; position: relative; } .dotList li:last-child { margin-bottom: 0; } .dotList li:before { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 10px; } .dotList li span.red { color: #f00; } .rfndType { margin: 0 -30px; } .rfndType:after { content: ''; display: table; clear: both; } .rfndType li { padding: 0 30px; float: left; width: 33.3333%; } .rfndType li div { border: solid 2px #e0e0e0; overflow: hidden; text-align: center; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .rfndType li h5 { height: 60px; line-height: 60px; background: #f9f9f9; font-size: 13pt; font-weight: 400; } .rfndType li p { color: #666; font-size: 12pt; padding: 30px; } .dwnBtn { margin: 20px 0; } .dwnBtn a { display: inline-block; height: 40px; line-height: 40px; background: #515151; color: #fff; padding-left: 20px; padding-right: 65px; position: relative; } .dwnBtn a:after { content: ''; display: block; width: 40px; height: 40px; position: absolute; right: 0; top: 0; border-left: solid 1px #747474; background: url('../../img/common/ico_down.png')no-repeat center center; } .scrTb { } .subTable { } .subTable th, .subTable td { border: solid 1px #d6d6d6; padding: 10px; color: #666; font-size: 11pt; text-align: center; } .subTable th { background: #f7f7f7; color: #000; font-weight: 400; } .subTable span.blu { color: #0047a7; font-weight: 500; } @media (max-width:900px) { .rfndFlw { margin: 0; padding-top: 5px; } .rfndFlw > li { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .rfndFlw > li:last-child { margin-bottom: 0; } .rfndFlw > li > div { border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .rfndFlw > li > div h5 { height: 40px; line-height: 40px; font-size: 11pt; } .rfndFlw > li > div > div { text-align: left; padding: 15px; } .rfndFlw > li > div h6 { font-size: 12pt; font-weight: 500; } .rfndFlw > li > div > div ul { margin-top: 5px; height: auto; } .rfndFlw > li > div > div ul li { font-size: 11pt; } .dotList li { font-size: 11pt; } .rfndType { margin: 0; padding-top: 5px; } .rfndType li { padding: 0; float: none; width: 100%; margin-bottom: 15px; } .rfndType li:last-child { margin-bottom: 0; } .rfndType li h5 { height: 40px; line-height: 40px; font-size: 12pt; } .rfndType li p { font-size: 11pt; padding: 15px; } .dwnBtn a { display: block; font-size: 11pt; } .scrTb { overflow-x: auto; } .scrTb table { width: 1000px; } .subTable th, .subTable td { padding: 5px; font-size: 10pt; } } /* 교수소개 */ .tchCont { margin-top: 30px; } .tchCont h4 { height: 60px; line-height: 58px; text-align: center; border: solid 1px #d6d6d6; font-size: 16pt; font-weight: 500; } .tchCont h4 span { font-weight: 300; font-size: 13pt; } .tchCont > img { width: 27%; display: inline-block; margin: 30px 1%; vertical-align: top; } .tchCont > ul { width: 70%; display: inline-block; } .tchCont > ul:after { content: ''; display: table; clear: both; } .tchCont > ul > li { margin-top: 30px; position: relative; padding-left: 170px; } .tchCont > ul > li > h5 { width: 150px; height: 50px; line-height: 50px; text-align: center; background: #f9f9f9; font-size: 12pt; font-weight: 500; position: absolute; left: 0; top: 0; } .tchCont > ul > li > ul { min-height: 50px; } .tchCont > ul > li > ul > li { position: relative; padding-left: 8px; font-size: 11pt; color: #666; margin-bottom: 5px; } .tchCont > ul > li > ul > li:last-child { margin-bottom: 0; } .tchCont > ul > li > ul > li:after { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 10px; } @media (max-width:900px) { .tchCont { margin-top: 30px; } .tchCont h4 { height: auto; line-height: 1.5em; padding: 10px 0; font-size: 14pt; } .tchCont h4 span { display: block; font-size: 11pt; } .tchCont > ul > li { margin-top: 15px; float: none; width: 100%; padding-left: 0; } .tchCont > ul > li > h5 { width: 100%; height: 30px; line-height: 30px; font-size: 11pt; position: static; margin-bottom: 15px; } .tchCont > ul > li > ul > li { position: relative; padding-left: 8px; font-size: 11pt; color: #666; margin-bottom: 5px; } .tchCont > ul > li > ul > li:last-child { margin-bottom: 0; } .tchCont > ul > li > ul > li:after { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 10px; } } /* 진행절차 */ .plcStep { } .plcStep { margin: 0 -6px; } .plcStep:after { content: ''; display: table; clear: both; } .plcStep li { float: left; width: 16.6666%; padding: 0 6px; } .plcStep li > div { height: 80px; padding: 2px; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; background: #0047a7; background: -moz-linear-gradient(45deg, #0047a7 21%, #e8b800 54%); background: -webkit-linear-gradient(45deg, #0047a7 21%,#e8b800 54%); background: linear-gradient(45deg, #0047a7 21%,#e8b800 54%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0047a7', endColorstr='#e8b800',GradientType=1 ); } .plcStep li > div > div { height: 76px; background: #fff; color: #0047a7; text-align: center; padding: 15px 0; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } .plcStep li h6 { font-size: 13pt; font-weight: 500; } .plcStep li span { display: block; font-size: 11pt; } .plcStep li.current > div { background: #0047a7; } .plcStep li.current > div > div { background: #0047a7; color: #fff; } .plcInfo { margin-top: 50px; border-top: solid 1px #d6d6d6; } .plcInfo dl { display: table; width: 100%; padding: 20px 0; border-bottom: solid 1px #d6d6d6; } .plcInfo dl dt { display: table-cell; width: 200px; } .plcInfo dl dd { display: table-cell; } .plcUrl { margin-top: 30px; } .plcUrl dl { display: table; width: 100%; margin-bottom: 10px; } .plcUrl dl:last-child { margin-bottom: 0; } .plcUrl dl dt { display: table-cell; width: 190px; vertical-align: middle; height: 40px; line-height: 40px; text-align: center; color: #fff; background: #0070d5; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } .plcUrl dl dd { display: table-cell; vertical-align: middle; padding-left: 20px; text-transform: uppercase; font-size: 12pt; } .plcWrap { margin: -20px; } .plcWrap:after { content: ''; display: table; clear: both; } .plcWrap > li { padding: 20px; width: 50%; float: left; } .plcCont { padding-left: 210px; position: relative; padding-top: 10px; } .plcTitle { position: absolute; left: 0; top: 0; width: 190px; height: 70px; border: solid 1px #d1d1d1; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } .plcTitle > div { display: table; width: 100%; height: 100%; } .plcTitle > div > div { display: table-cell; width: 100%; vertical-align: middle; text-align: center; color: #0047a7; font-size: 12pt; font-weight: 500; } .gryBox { background: #f9f9f9; padding: 30px; margin-top: 30px; } .gryBox dl { margin-top: 30px; } .gryBox dl:first-child { margin-top: 0; } .gryBox dt { font-size: 12pt; color: #000; font-weight: 400; } .gryBox dd { margin-top: 10px; } .gryBox h5 { text-align: center; font-size: 16pt; line-height: 1.4em; } .cclCont { margin: 0 -30px; } .cclCont:after { content: ''; display: table; clear: both; } .cclCont li { float: left; width: 50%; padding: 0 30px; } .cclCont li div { background: #fafafa; overflow: hidden; padding: 0px 100px 30px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .cclCont li h5 { height: 100px; padding-top: 50px; line-height: 50px; background: #3a3a3b; color: #fff; margin-top: -50px; text-align: center; font-size: 12pt; font-weight: 500; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } .cclCont li p { margin: 0 -70px; padding-top: 30px; } .inGds { } .inGds li { display: table; width: 100%; margin-bottom: 10px; } .inGds li:last-child { margin-bottom: 0; } .inGds li em { display: table-cell; vertical-align: middle; width: 90px; } .inGds li em span { display: block; height: 90px; border: solid 1px #0047a7; background-size: 56px auto !important; } .inGds li div { display: table-cell; vertical-align: middle; padding-left: 20px; } .inGds li div h5 { font-size: 13pt; color: #0047a7; font-weight: 500; } .inGds li div p { color: #666; margin-top: 5px; } .inTgt { margin: 0 -30px; } .inTgt:after { content: ''; display: table; clear: both; } .inTgt li { float: left; width: 50%; padding: 0 30px; } .inTgt li > div { border: solid 2px #e0e0e0; overflow: hidden; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .inTgt li h5 { color: #000; text-align: center; background: #f9f9f9; padding: 15px; font-size: 15pt; font-weight: 500; } .inTgt li h5 span { display: block; color: #666; font-size: 11pt; font-weight: 400; margin-top: 5px; } .inTgtCnt { color: #666; display: table; width: 100%; height: 150px; text-align: center; } .inTgtCnt > div { display: table-cell; vertical-align: middle; line-height: 1.8em; } .inTgtCnt span.blu { color: #0047a7; } .inScd { margin-top: 20px; } .inScd dl { display: table; margin-bottom: 10px; } .inScd dl:last-child { margin-bottom: 0; } .inScd dl dt { display: table-cell; vertical-align: middle; width: 80px; height: 40px; line-height: 40px; text-align: center; background: #555; color: #fff; font-size: 12pt; font-weight: 500; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } .inScd dl dd { display: table-cell; vertical-align: middle; padding-left: 15px; } .inRul { margin: -15px -10px; } .inRul:after { content: ''; display: table; clear: both; } .inRul li { float: left; width: 50%; padding: 15px 10px; } .inRul li > div { border: solid 1px #0047a7; overflow: hidden; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .inRul li h5 { color: #fff; background: #0047a7; padding: 15px; font-size: 13pt; font-weight: 500; } .inRul li h5 span { font-size: 18pt; font-weight: 700; margin-right: 10px; } .inRulCnt { color: #666; display: table; width: 100%; height: 100px; } .inRulCnt > div { display: table-cell; vertical-align: middle; line-height: 1.8em; padding-left: 15px; padding-right: 15px; } .tal { text-align: left !important; } .db { display: block; } @media (max-width:900px) { .plcStep { margin: -3px; } .plcStep li { padding: 3px; width: 33.3333%; } .plcStep li > div { height: auto; padding: 2px; } .plcStep li > div > div { padding: 5px 0; height: auto; } .plcStep li h6 { font-size: 10pt; } .plcStep li span { height: auto; line-height: 1.5em; font-size: 9pt; white-space: nowrap; } .plcInfo { margin-top: 30px; } .plcInfo dl { display: block; padding: 15px 0; } .plcInfo dl dt { display: block; width: 100%; font-size: 12pt; } .plcInfo dl dd { display: block; margin-top: 10px; font-size: 11pt; } .plcUrl dl { display: block; margin-bottom: 20px; } .plcUrl dl dt { display: block; width: auto; } .plcUrl dl dd { display: block; padding-left: 0; font-size: 11pt; text-align: center; margin-top: 5px; } .plcWrap { margin: 0; } .plcWrap > li { padding: 0; width: 100%; float: none; } .plcCont { padding-left: 0; padding-top: 0; margin-top: 10px; } .plcTitle { position: static; width: 100%; height: auto; padding: 5px; margin-bottom: 10px; } .plcTitle > div > div { font-size: 11pt; } .plcTitle > div > div br { display: none; } .gryBox { padding: 15px; } .gryBox dl { margin-top: 15px; } .gryBox dt { font-size: 11pt; } .gryBox h5 { font-size: 12pt; } .cclCont { margin: 0; } .cclCont li { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .cclCont li:last-child { margin-bottom: 0; } .cclCont li div { padding: 0px 15px 15px; } .cclCont li h5 { height: 100px; padding-top: 60px; line-height: 40px; margin-top: -60px; font-size: 11pt; } .cclCont li p { margin: 0; padding-top: 15px; } .inGds { margin-top: 10px; } .inGds li em { width: 50px; vertical-align: top; } .inGds li em span { height: 50px; background-size: 28px auto !important; } .inGds li div { padding-left: 15px; vertical-align: top; } .inGds li div h5 { font-size: 11pt; } .inTgt { margin: 0; padding-top: 10px; } .inTgt li { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .inTgt li:last-child { margin-bottom: 0; } .inTgt li h5 { padding: 10px; font-size: 12pt; } .inTgt li h5 span { font-size: 10pt; margin-top: 0; } .inTgtCnt { display: block; height: auto; } .inTgtCnt > div { display: block; padding: 15px; font-size: 11pt; line-height: 1.8em; } .inScd { margin-top: 20px; } .inScd dl { display: table; margin-bottom: 10px; } .inScd dl:last-child { margin-bottom: 0; } .inScd dl dt { display: table-cell; vertical-align: middle; width: 80px; height: 40px; line-height: 40px; text-align: center; background: #555; color: #fff; font-size: 12pt; font-weight: 500; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; } .inScd dl dd { display: table-cell; vertical-align: middle; padding-left: 15px; } .inRul { margin: 0; padding-top: 10px; } .inRul li { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .inRul li:last-child { margin-bottom: 0; } .inRul li h5 { padding: 10px; font-size: 11pt; } .inRul li h5 span { font-size: 14pt; } .inRulCnt { display: block; height: auto; } .inRulCnt > div { display: block; padding: 10px; } .tchCont > img { margin-top: 15px; width: 37%; } .tchCont > ul { width: 60%; } } @media (max-width:1200px) { .root_daum_roughmap { width: 100% !important; } } /* 이수방법 */ .isuFlow { margin: 0 -15px; } .isuFlow:after { content: ''; display: table; clear: both; } .isuFlow > li { float: left; width: 25%; padding: 0 15px; } .isuFlow > li div { border: solid 2px #e6e6e6; padding: 8px; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; } .isuFlow > li h5 { background: #0047a7; color: #fff; height: 50px; line-height: 50px; text-align: center; font-size: 13pt; font-weight: 400; border-radius: 12px 12px 0 0; -moz-border-radius: 12px 12px 0 0; -webkit-border-radius: 12px 12px 0 0; } .isuFlow > li img { display: block; margin: 30px auto; width: 66px; } .isuFlow > li ul { padding: 0.5em 15px; background: #f4f4f4; height: 6.3em; border-radius: 0 0 12px 12px; -moz-border-radius: 0 0 12px 12px; -webkit-border-radius: 0 0 12px 12px; } .isuFlow > li ul li { color: #666; font-size: 12pt; line-height: 1.6em; } .isuCdtn { margin-top: 30px; } .isuCdtn dt { margin-bottom: 15px; color: #0047a7; font-size: 14pt; font-weight: 700; } .isuCdtn dd { } .subDot { } .subDot li { color: #666; font-size: 12pt; margin-bottom: 5px; position: relative; padding-left: 8px; } .subDot li:last-child { margin-bottom: 0; } .subDot li:before { content: ''; display: block; width: 2px; height: 2px; background: #666; position: absolute; left: 0; top: 10px; } .subDot li span.bk { color: #000; font-weight: 500; margin-right: 5px; } .subDot li span.bk:before { background: #000; } .isuRed { color: #f00; margin-top: 15px; font-size: 12pt; font-weight: 500; } .isuAtn { margin-top: 30px; border: solid 1px #e6e6e6; padding: 0 30px 30px; } .isuAtn h5 { background: #3a3a3b; text-align: center; color: #fff; height: 30px; line-height: 28px; width: 200px; margin: 0 auto; font-size: 12pt; font-weight: 500; border-radius: 0 0 30px 30px; -moz-border-radius: 0 0 30px 30px; -webkit-border-radius: 0 0 30px 30px; } .isuAtn p { margin-top: 30px; color: #666; font-size: 13pt; line-height: 1.6em; } .isuList { margin-top: 30px; } .isuList > li { position: relative; padding-left: 160px; margin-bottom: 30px; } .isuList > li:last-child { margin-bottom: 0; } .isuList > li span { display: block; width: 130px; height: 130px; border: solid 1px #0047a7; position: absolute; left: 0; top: 0; padding: 35px 0; } .isuList > li span img { display: block; margin: 0 auto; width: 60px; } .isuList > li dl { min-height: 160px; } .isuList > li dl dt { color: #0047a7; font-size: 14pt; font-weight: 500; } .isuList > li dl dd { margin-top: 10px; } .isuList > li dl dd ul { padding-left: 15px; } .isuList > li dl dd ul li { list-style: decimal; color: #666; font-size: 12pt; margin-bottom: 3px; } .isuList > li dl dd ul li:last-child { margin-bottom: 0; } @media (max-width:1200px) { .isuFlow { margin: 0; } .isuFlow > li { float: none; width: 100%; padding: 0; margin-bottom: 20px; } .isuFlow > li:last-child { margin-bottom: 0; } .isuFlow > li div { border: solid 1px #e6e6e6; padding: 5px; } .isuFlow > li h5 { height: 40px; line-height: 40px; font-size: 12pt; border-radius: 15px 15px 0 0; -moz-border-radius: 15px 15px 0 0; -webkit-border-radius: 15px 15px 0 0; } .isuFlow > li img { margin: 15px auto; width: 44px; } .isuFlow > li ul { padding: 10px; height: auto; border-radius: 0 0 15px 15px; -moz-border-radius: 0 0 15px 15px; -webkit-border-radius: 0 0 15px 15px; } .isuFlow > li ul li { font-size: 11pt; } .isuCdtn { margin-top: 20px; } .isuCdtn dt { margin-bottom: 10px; font-size: 13pt; } .subDot li { font-size: 11pt; } .subDot li span.bk { display: block; } .isuRed { font-size: 11pt; } .isuAtn { padding: 0 15px 15px; } .isuAtn h5 { width: 140px; font-size: 11pt; } .isuAtn p { margin-top: 15px; font-size: 11pt; } .isuList > li { padding-left: 90px; } .isuList > li:last-child { margin-bottom: 0; } .isuList > li span { width: 75px; height: 75px; padding: 22px 0; } .isuList > li span img { width: 30px; } .isuList > li dl dt { font-size: 12pt; } .isuList > li dl dd { margin-top: 5px; } .isuList > li dl dd ul { padding-left: 15px; } .isuList > li dl dd ul li { font-size: 11pt; margin-bottom: 10px; line-height: 1.5em; } } .mosaList { margin-top: 20px; } .mosaList dt { color: #0047a7; font-size: 13pt; font-weight: 500; } .mosaList dd { color: #666; font-size: 12pt; margin-top: 5px; } .mosaHow { margin: 0 -8px; } .mosaHow:after { content: ''; display: table; clear: both; } .mosaHow li { float: left; width: 33.3333%; padding: 0 8px; } .mosaHow li div { border: solid 2px #e6e6e6; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; overflow: hidden; } .mosaHow li h5 { background: #f9f9f9; height: 50px; line-height: 50px; text-align: center; font-size: 14pt; font-weight: 500; } .mosaHow li p { color: #666; font-size: 12pt; line-height: 1.6em; padding: 30px; text-align: center; } @media (max-width:1200px) { .mosaList { margin-top: 10px; } .mosaList dt { font-size: 12pt; } .mosaList dd { font-size: 11pt; margin-top: 2px; } .mosaHow { margin: 0; } .mosaHow li { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .mosaHow li:last-child { margin-bottom: 0; } .mosaHow li div { border: solid 1px #e6e6e6; } .mosaHow li h5 { height: 40px; line-height: 40px; font-size: 13pt; } .mosaHow li p { font-size: 11pt; padding: 15px; } } .prgInfo { background: #f9f9f9; padding: 30px; text-align: center; color: #0047a7; font-size: 13pt; font-weight: 500; } .prgDwn { margin: 0 -30px; } .prgDwn:after { content: ''; display: table; clear: both; } .prgDwn li { float: left; width: 50%; padding: 0 30px; } .prgDwn li a { display: block; padding: 30px 100px 30px 0; text-align: center; position: relative; border: solid 2px #0047a7; color: #0047a7; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; overflow: hidden; } .prgDwn li a:after { content: ''; display: block; width: 100px; position: absolute; right: 0; top: 0; bottom: 0; background: #0047a7 url('../../img/sub/program_down.png')no-repeat center center; } .prgDwn li a img { display: inline-block; vertical-align: middle; margin-right: 30px; } .prgDwn li a span { vertical-align: middle; font-size: 15pt; font-weight: 500; } @media (max-width:1200px) { .prgInfo { padding: 15px; font-size: 11pt; } .prgDwn { margin: 0; padding-top: 10px; } .prgDwn li { float: none; width: 100%; padding: 0; margin-bottom: 10px; } .prgDwn li:last-child { margin-bottom: 0; } .prgDwn li a { padding: 15px 60px 15px 0; border: solid 1px #0047a7; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } .prgDwn li a:after { width: 60px; background-size: 18px auto; } .prgDwn li a img { margin-right: 15px; width: 25px; } .prgDwn li a span { font-size: 12pt; } } ul.slyList:after { content: ''; display: table; clear: both; } ul.slyList li { float: left; } ul.slyList li a { display: block; white-space: nowrap; } @media (min-width:1201px) { .slyTab ul { transform: translateZ(0px) translateX(0px) !important; width: 100% !important; } } .buildTab ul li { width: 20%; } .buildTab ul li a { display: table; width: 100%; height: 90px; border: solid 1px #dfdfdf; background: #f9f9f9; border-right-color: #f9f9f9; } .buildTab ul li:last-child a { border-right-color: #dfdfdf; } .buildTab ul li a span { display: table-cell; width: 100%; vertical-align: middle; text-align: right; padding-left: 25px; padding-right: 25px; color: #898989; font-size: 11pt; line-height: 1.3em; position: relative; } .buildTab ul li.active a { border: solid 2px #0047a7; background: #fff; } .buildTab ul li.active a span { color: #0047a7; font-weight: 500; } .buildTab ul li a span:before { content: ''; display: block; width: 50px; height: 50px; position: absolute; left: 25px; top: 50%; margin-top: -25px; background-size: cover !important; } .buildTab ul li:nth-child(1) a span:before { background: url('../../img/sub/build_tab_ico01.png')no-repeat center center; } .buildTab ul li:nth-child(2) a span:before { background: url('../../img/sub/build_tab_ico02.png')no-repeat center center; } .buildTab ul li:nth-child(3) a span:before { background: url('../../img/sub/build_tab_ico03.png')no-repeat center center; } .buildTab ul li:nth-child(4) a span:before { background: url('../../img/sub/build_tab_ico04.png')no-repeat center center; } .buildTab ul li:nth-child(5) a span:before { background: url('../../img/sub/build_tab_ico05.png')no-repeat center center; } .buildTab ul li:nth-child(1).active a span:before { background: url('../../img/sub/build_tab_ico01_on.png')no-repeat center center; } .buildTab ul li:nth-child(2).active a span:before { background: url('../../img/sub/build_tab_ico02_on.png')no-repeat center center; } .buildTab ul li:nth-child(3).active a span:before { background: url('../../img/sub/build_tab_ico03_on.png')no-repeat center center; } .buildTab ul li:nth-child(4).active a span:before { background: url('../../img/sub/build_tab_ico04_on.png')no-repeat center center; } .buildTab ul li:nth-child(5).active a span:before { background: url('../../img/sub/build_tab_ico05_on.png')no-repeat center center; } .etcTab ul li { width: 33.3333%; } .etcTab ul li a { display: table; width: 100%; height: 90px; border: solid 1px #dfdfdf; background: #f9f9f9; border-right-color: #f9f9f9; text-align: center; } .etcTab ul li:last-child a { border-right-color: #dfdfdf; } .etcTab ul li a span { display: table-cell; width: 100%; vertical-align: middle; color: #898989; font-size: 11pt; line-height: 1.3em; position: relative; } .etcTab ul li.active a { border: solid 2px #0047a7; background: #fff; } .etcTab ul li.active a span { color: #0047a7; font-weight: 500; } .etcTab ul li a span:before { content: ''; display: block; width: 54px; height: 50px; display: inline-block; margin-right: 20px; vertical-align: middle; background-size: cover !important; } .etcTab ul li:nth-child(1) a span:before { background: url('../../img/sub/etc_tab_ico01.png')no-repeat center center; } .etcTab ul li:nth-child(1).active a span:before { background: url('../../img/sub/etc_tab_ico01_on.png')no-repeat center center; } .etcTab ul li.active a span { color: #0047a7; font-weight: 500; } .buildTab ul li a span:before { content: ''; display: block; width: 50px; height: 50px; position: absolute; left: 25px; top: 50%; margin-top: -25px; background-size: cover !important; } .subName { color: #0047a7; margin-top: 30px; margin-bottom: 15px; font-size: 14pt; font-weight: 500; } .subText { font-size: 12pt; line-height: 1.8em; margin-top: 15px; color: #666; } .subText span.bk { color: #000; } .subText span.org { color: #ff5a00; } @media (max-width:1200px) { .buildTab { margin: 0 -15px; padding: 0 15px; } .buildTab ul li { width: 200px; } .buildTab ul li a { height: 70px; } .buildTab ul li a span { padding-left: 15px; padding-right: 15px; } .buildTab ul li a span:before { width: 40px; height: 40px; left: 15px; margin-top: -20px; } .etcTab { margin: 0 -15px; padding: 0 15px; } .etcTab ul li { width: 260px; } .etcTab ul li a { height: 70px; } .etcTab ul li a span { padding-left: 15px; padding-right: 15px; } .etcTab ul li a span:before { width: 44px; height: 40px; } .subName { font-size: 13pt; } .subText { font-size: 11pt; } } .cptcy { } .cptcy:after { content: ''; display: table; clear: both; } .cptcy > div { float: left; width: 25%; padding: 0 6px; } .cptCont { border: solid 2px #d6d6d6; padding: 20px 15px; height: 460px; } .cptCont h5 { text-align: center; color: #0047a7; margin-bottom: 30px; font-size: 13pt; } .cptCont p { font-size: 11pt; line-height: 1.4em; } .cptCont li { font-size: 11pt; } .lstNum { padding-left: 15px; } .lstNum li { list-style: decimal; margin-bottom: 15px; } .lstNum li:last-child { margin-bottom: 0; } .lstNum li span.org { color: #ff5a00; } .lstNum li span.blu { color: #0047a7; } .scrWrap { margin: -15px -10px; padding-top: 50px; } .scrWrap:after { content: ''; display: table; clear: both; } .scrWrap > div { float: left; padding: 15px 10px; } .scrWrap > div.col1 { width: 100%; } .scrWrap > div.col2 { width: 50%; } .scrCont { border: solid 1px #000; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; overflow: hidden; } .scrCont > div { padding: 30px; } .scrWrap > div.col2 .scrCont { height: 560px; } .scrCont h5 { height: 50px; line-height: 50px; text-align: center; background: #3a3a3b; color: #fff; font-size: 15pt; font-weight: 500; width: 370px; margin: 0 auto; border-radius: 0px 0px 40px 40px; -moz-border-radius: 0px 0px 40px 40px; -webkit-border-radius: 0px 0px 40px 40px; } .scrHalf { padding: 30px; } .scrHalf:after { content: ''; display: table; clear: both; } .scrHalf dt { float: left; width: 40%; } .scrHalf dt h6 { font-size: 14pt; margin-bottom: 10px; } .scrHalf dd { float: left; width: 60%; padding-left: 20px; } .scrHalf p { font-size: 11pt; line-height: 1.4em; } .scrHalf li { font-size: 11pt; } .scrGrph { display: block; border: solid 1px #0047a7; margin-top: 20px; } .scrGrph img { display: block; width: 100%; } @media (max-width:1200px) { .cptcy > div { float: none; width: 100%; padding: 0; margin-bottom: 15px; } .cptcy > div:last-child { margin-bottom: 0; } .cptCont { height: auto; } .cptCont h5 { margin-bottom: } .lstNum li { margin-bottom: 5px; } .scrWrap { margin: 0; padding-top: 30px; } .scrWrap > div { float: none; padding: 0; margin-bottom: 15px; } .scrWrap > div:last-child { margin-bottom: 0; } .scrWrap > div.col2 { width: 100%; } .scrCont > div { padding: 15px; } .scrWrap > div.col2 .scrCont { height: auto; } .scrCont h5 { height: 40px; line-height: 40px; font-size: 12pt; width: 70%; border-radius: 0px 0px 30px 30px; -moz-border-radius: 0px 0px 30px 30px; -webkit-border-radius: 0px 0px 30px 30px; } .scrHalf { padding: 15px; } .scrHalf dt { float: none; width: 100%; } .scrHalf dt h6 { font-size: 14pt; margin-bottom: 5px; } .scrHalf dd { float: none; width: 100%; padding-left: 0; margin-top: 15px; } } Span.cshapelabel  { padding: 0  10px; color: #fff; margin-right: 5px; font-weight: 300; font-size: 10pt; background-color: #333583; }