diff --git a/FO/css/style.css b/FO/css/style.css index 2badcae..881e08e 100644 --- a/FO/css/style.css +++ b/FO/css/style.css @@ -2462,10 +2462,594 @@ html.lock, body.lock {display:block; width:100%; height:100%; overflow:hidden;} .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;} -} - - - +} + + + +/* ½º¸¶Æ®°Ë»ö */ +.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: 25%; + 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: 11pt; + 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: 240px; +} + +.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; + width: 50px; + 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 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; + } + + .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; + } + + .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 0; + border-bottom: solid 1px #eaeaea; + position: relative; + padding-left: 30px; + padding-right: 140px; + } + + .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; + } + +.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; + } + + +@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; + } +}