@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);
/* ==================================================
   .Common
================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, 
ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
a:link, a:visited {color:#000;text-decoration:none}
a:hover, a:focus, a:active {color:#000;text-decoration:none;}
html {font-family:'Noto Sans', sans-serif;}
button{overflow: visible;border: 0;background: transparent;outline:none;white-space: nowrap;cursor: pointer;letter-spacing: -1px;word-spacing: 1px;}




html {letter-spacing: -1px;word-spacing: 1px; outline: none; }
body {
	background-color: #fff;
	position: relative;
	-webkit-text-size-adjust: none;
	min-width: 320px;
}

/* ==================================================
   .Header
================================================== */
header {text-align: center;line-height: 0;width: 100%;min-width: 320px;background: #fff;}
img.top-logo {margin-right: -15px;height: 42px;margin: 10px auto;}
header .open-menu {margin: 9px 7px 17px 0;position: absolute;right: 0;top: 0;padding: 5px;font-size:30px;}
header .open-menu a img {height: 27px; width:auto;}
header .open-menu a span {vertical-align: super;padding-left: 5px;font-size: 18px;font-weight: 700;color: #444;;}
header .open-menu a i {color:#0cb99e}
header .top-sub-tab {line-height: 22px;display: block;width: 100%;background: #fff;color: #1a1a1a;border-bottom: 1px solid #dbdbdb;border-top: 1px solid #dbdbdb;}
header .top-sub-tab li { padding: 12px 0; width: 25%;    font-size: 13px; float: left;  background: #fff;border-bottom:2px solid #fff;}
header .top-sub-tab a {font-family:'Nanum Gothic';font-weight:600;display:block;color:#656565;height:100%; font-size:1.3em;}
header .top-sub-tab li.active a {color: #1a1a1a;}
header .top-sub-tab li.active {border-bottom:2px solid #0cb99e;}
header .top-sub-tab li.last {border-right: 0;background: #fff;}
.push {margin-bottom: 20px;}
.padding-down {padding-bottom: 10px;}

.wrap-container {width: 100%; float:left;}
section {width: 100%;display: block;content: " ";display: table;}
.main-wallpaper {background: url(../css-images/main_bg.jpg) no-repeat; background-size: 100% 100%;}

.content span.mark {margin-right: 20px;vertical-align: text-bottom;}
/*.content p {padding-bottom: 10px;}*/

 .atab {width: 20%;float: left;padding: 2px;}
.atab-btn {text-align: center;color: #444;background: #ffffff;font-size: 14px;padding: 6px 0;border: 2px solid #0cb99e;}
.atab-btn.in-area { background: #0cb99e; color: #fff; font-weight: bold; }

.fter-btn {font-weight: 700;width: 100%;float: left;padding:15px 20px;background-color: #111;color: #fff;text-align: center;}
.fter-btn.white {background: #0cb99e;color: #fff;}
/* font-size: 10px;*/



/* ==================================================
   .Column
================================================== */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.clearfix {content: " ";clear: both;}

main#sub-container { padding: 15px; overflow-x: hidden; margin: 0 auto; width: 100%; min-width: 320px; min-height: 500px; display: block; background: #f4f4f4; }
main#main-container { overflow-x: hidden; margin: 0 auto; width: 100%; min-width: 320px; min-height: 500px; display: block; background: #f4f4f4; }
.main-content{padding: 0 15px 15px 15px;margin: 0 auto;max-width: 100%;overflow-x: visible;}
.normal-content {margin: 0 auto;max-width: 100%;overflow-x: visible;}
.block-content {margin: 0 auto;padding: 15px 15px;  max-width: 100%;overflow-x: visible; background: white;}
.row {margin-right: -15px;margin-left: -15px;}

img.responsive {width: 100%;}
.img-container {    position: relative;
    overflow: hidden;
    z-index: 0;
    display: block;}
.img-container img {float: left;    min-height: 133px;}
.production span {padding-left: 5px;color: #888;font-size: 14px;}

.block-title {padding: 15px 20px;}
.block-title.h3 {font-weight:bold;border-bottom:1px solid #92bcdf}
.block-title small {margin-left: 10px; font-size: 12px;}
.trans-bg {background: rgba(34, 34, 34, 0.25);}

.col-4,.col-6,.col-12,.col-5,.col-7,.col-3, .col-2, .col-1,.col-8
{float: left; position: relative; min-height: 1px; padding-right: 10px; padding-left: 10px;}
.col-12 {width: 100%;}
.col-6 {width: 50%;}
.col-1 {width: 8.33333333%;}
.col-2 {width: 16.66666667%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33333333%;}
.col-8 {width: 66.66666666%;}
.col-5 {width: 41.66666667%;}
.col-7 {width: 58.33333333%;}
.xs-row {clear: both;display: block;
    background: #fff;}
.col-xs-4,.col-xs-6,.col-xs-12, .col-xs-3, .col-xs-7, .col-xs-8, .col-xs-5
{float: left; position: relative; min-height: 1px;}
.col-xs-12 {width: 100%;}
.col-xs-6 {width: 50%;}
.col-xs-8 {width: 66.66666666%;}
.col-xs-4 {width: 33.33333333%;}
.col-xs-3 {width: 25%;}
.col-xs-5 {width: 41.66666667%;}
.col-xs-7 {width: 58.33333333%;}

.col-xs-7 .block-content {width: 100%;}


button.css-button {width: 100%;padding: 0;}
button.css-button div {font-weight: 700;padding:15px 0; width: 100%; color: #fff; font-size: 1.0em;background-color: #0cb99e;}
button.cross {background: url(../css-images/cross.png);width: 25px;height: 25px;font-size: 0;outline: none;float: right;}
a.rev-btn,button.rev-btn {display: block;border: 2px solid #fff;background: url(../css-images/rev-btn.png) right no-repeat;background-size: 35px;margin: auto;width: 80%;height: 35px;color: #fff;text-align: left;font-weight: 700;}
a.rev-btn {line-height:35px;text-align:center;}

.detail-view-btn {border: 1px solid #0cb99e;font-weight: 700;font-size: 15px;height: 40px;margin-top: 5px; color: #333;}
.btn-arrow { margin-left: 10px;}
.btn-arrow img {top: 2px;position: relative;}

.push-10 {margin-bottom: 10px !important;}
.push-20 {margin-bottom: 20px !important;}
.push-30 {margin-bottom: 30px !important;}
.push-50 {margin-bottom: 50px !important;}

.padding-down {padding-bottom: 20px;}
h1 {font-size: 0.9em; font-weight: 700;}
h2 {font-size: 18px; font-weight: 700;}
p {font-size: 12px; line-height: 1.6;
}


.color-white {color: white;}
.color-black {color: #2d2d2d}
.float-left {float: left;}
.font-bold {font-weight: 700;}
/* ==================================================
   .Menu
================================================== */




/* ==================================================
   .Only Main Page
================================================== */
.main-content .block-title {display:block; margin:0 10px 0.5em;padding:20px 0 0;font-size:16px;}
.main-content #act_btn {background:rgba(0,0,0,0.8);color:#fff;font-size:1.3em;font-weight:bold;padding:10px 0;}
.main-content #act_btn i {margin-left:1.0em;}
.main-content label.css-img-radio {width:100%;display:block;padding:1.0em 0; border:1px solid #828a8b;text-align:center;background-color:rgba(255,255,255,0.5);}
label.css-img-radio input[type="radio"],
label.css-img-radio input[type="checkbox"]
{
display: inline-block;width: 22px;height: 22px;vertical-align: middle;-webkit-appearance: none;border-radius: 0;border: 0;margin:0;padding:0;cursor: pointer;
outline:none; background: url(/css-images/cycle-radio.png) no-repeat 0 -22px;
}

label.css-img-radio.sel {background-color:#ffde00;opacity:0.8}
label.css-img-radio input[type="checkbox"]:checked ,
label.css-img-radio input[type="radio"]:checked {background-color:#0cb99e;}
label.css-img-radio {cursor: pointer; font-size: 17px;display: inline-block;text-align: left;}
label.css-img-radio span {vertical-align: middle;padding-left: 7px;font-size:13px; display:inline-block; }
label.css-img-radio.white-bg input[type="radio"] {outline:none; background: #fff;}
label.css-img-radio.white-bg input[type="radio"]:checked {background-color:#0cb99e;}
label.css-img-radio.white-bg {font-size: 14px;}

ul.main-pension {margin:0 15px;display:block;}
.main-pension > li {display:block;float:left;width:100%;background-color:#fff;border:1px solid #dbdbdb;margin-bottom:10px;}
.main-pension > li.clearfix{border:0;}
.main-pension > li .imgWrap {width:45%;float:left;height:200px;}
.main-pension > li .imgWrap img {max-width:100%;height:100%;}
.main-pension > li .descriptionBox {width:55%;float:left;}
.main-pension > li .descriptionBox dl {display:block;margin:25px 20px 0;color:#484848;}
.main-pension > li .descriptionBox dl dt {font-size:1.2em;font-weight:bold;}
.main-pension > li .descriptionBox dl dd .address {font-size:1.0em;display:block;padding:5px 0;margin:5px 0 16px 0;}
.main-pension > li .descriptionBox dl dd .view_button {background-color:#0cb99e;color:#fff;display:inline-block; padding:10px;}

.normal-content > h2{color:#2d2d2d;font-size:1.6em;letter-spacing:-0.05em;display:block;margin:0 15px;padding:0 0 0 10px;position:relative;}
.normal-content > h2 i.fa-plus-square-o {color:#113652;position:absolute;right:0;top:0.2em;}
.main-icon-box {margin:0 15px;}
.main-icon-box .col-xs-3 a {display:block;margin:0 5px;height:100%;}
.main-icon-box .col-xs-3 a img {width:100%;}
/* ==================================================
   .Sub page
================================================== */
.production h1 {color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; height: 17px; line-height: 17px;}
.production p {color: #888;}

.production span.icon-span-1, .production span.icon-span-2 {padding-left: 15px; color: #888; font-size: 14px;}
.production span.icon-span-1 {background: url(../css-images/mark1.png) no-repeat;background-size: 12px 18px;}
.production span.icon-span-2 {background: url(../css-images/mark2.png) no-repeat;margin-left: 10px; background-size: 10px 18px;}



.list-title {font-size: 13px;font-weight: 700;padding-left: 6px;border-left: 2px solid #0cb99e;}

input.css-selecter,
select.css-selecter {
    margin-top: -10px;
    border: 1px solid #d9d9d9;
    height: 35px;
    font-size: 0.9em;
    padding-left: 14px;
    color: #373737;
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff url(../css-images/select-arrow_bg.png) center right no-repeat;
    outline: none;
    background-size: 1.7em;
}
input.css-input {
    margin-top: -10px;
    border: 1px solid #d9d9d9;
    cursor: pointer;
    height: 35px;
    font-size: 0.9em;
    padding-left: 14px;
    color: #373737;
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    background-size: 1.7em;
}

.un-pl {padding-left: 0 !important;}
.full-size {width: 100%;}
.mid-size {width: 60%;}
.small-size {width: 40%;}
.float {float:left;}
.po-size {width: 30% !important;max-width: 100%;border-color: white !important;float: left;}





input[type="checkbox"].cont {
    display: inline-block;
    vertical-align: middle;
    -webkit-appearance: none;
    border-radius: 0;
    margin: 0;
    padding: 0;
    width: 22px;
    outline: 0;
    height: 22px;
    cursor: pointer;
    background: #fff url(../css-images/cycle-radio.png) no-repeat 0 -22px;
}
label.cont {vertical-align: middle;cursor: pointer; margin-left: 5px;font-size: 14px;display: inline-block;text-align: center;}
input[type="checkbox"].cont:checked { background-position: 0 0;}
input[type="checkbox"].cont:disabled { background: #fff url(../css-images/cycle-radio.png) no-repeat 0 -22px; }


textarea.css-textarea ,input[type="text"].cont ,input[type="number"].cont  {margin-top: -10px; width: 100%; padding-left: 14px; color: #373737; background-color: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: 0; height: 35px; line-height: 35px; font-size: 12px;}


.special-header {border-bottom: 3px solid #444;}
h2.sh {margin-top: 40px;border-bottom: 1px solid #444;height: 24px;}
.blank-box.cont {width: 60%; font-size: 15px; font-weight: 700; text-align: left;padding-left: 14px;}
.black-box.cont {width: 40%;font-size: 15px;font-weight: 700;padding:10px 0;}
.black-box.cont.blue {background: #063480;}
.css-selecter.cont , .css-input.cont {width: 60% !important; float: left; border-color: white;font-size: 14px; font-weight: 700;}


.blank-box {
    margin-top: -10px;
    background: white;
    text-align: center;
    padding: 8px 0;
    font-size: 15px;
    width: 50%;
    float: left;
    color: #444;
    font-weight: 700;
  }
.black-box {
    margin-top: -10px;
    background: #3b3b3b;
    text-align: center;
    padding: 12px 0;
    font-size: 12px;
    height: 35px;
    vertical-align: middle;
    width: 20%;
    float: left;
    color: white;
    font-weight: 700;
  }

.just-box {
    margin-top: -10px;
    background: #fff;
    text-align: center;
    padding: 10px 5px;
    font-size: 15px;
    border: 1px solid #d9d9d9;
}
.border-box {
    margin-top: -10px;
    border: 2px solid #0cb99e;
    height: 40px;
    padding: 10px 0;
    font-size: 1em;
    text-align: center;
    font-weight: 700;
}

small.op-info {font-size: 13px; color: #888;}

.view-tip {color: #fff;
    background: #0c2147;
    font-size: 15px;
    padding: 6px 0 !important;
    margin-top: -10px;
    border-radius: 20px;}
a.close-btn {
    color: #999;
    float: right;
    margin-right: 20px;
}
.tooltip {display: none;
  z-index: 9999;
    top: -15px;
    width: 230px;
    position: absolute;}
.tooltip.tool-active {display: block !important;}
.tooltip .block-title {width: 230px; margin: auto;background: url(../css-images/shape.png) no-repeat;color: #fff;font-weight: 700;font-size: 15px;background-size: 230px 60px;float: left;padding: 0;padding: 34px 0 11px 10px;}
.tooltip ul {
    width: 230px;
    float: left;
    padding: 20px;
    line-height: normal;
    background: #fff;
}
.tooltip ul li {
    width: 180px;
    float: left;
    list-style-type: disc;
    margin-left: 17px;
    font-weight: 700;
}



/* ==================================================
   CSS Tabs
================================================== */
.detail_cnt-tab_box {height: 550px;}
.tabs input[type=radio] {display: none;}
.tabs {width: 100%;height: 320px;float: none;list-style: none;position: relative;padding: 0;}
.tabs > li{float: left;width: 30%;border-top: 1px solid #e6e6e6;background: #444;}
.tabs li.margintab {top: 0px;    margin-top: 1px; }
.tabs label {border-left: 1px solid white;display: block;padding: 15px 0;text-align: center;color: #fff;font-size: 14px;font-weight: normal;background: rgba(255,255,255,0.2);cursor: pointer;position: relative;}
.tabs > li.margintab:first-child {}
.tabs label:hover {background: rgba(255,255,255,0.5);}
 
[id^=tab]:checked + label {background: #fff;color: #444;z-index: 3;}
[id^=tab]:checked ~ [id^=tab-content] {display: block;}
.tab-content{width:100%;float: left;z-index: 2;display: none;text-align: left;width: 100%; line-height: 140%;background: #fff;padding: 15px;position: absolute;left: 0;}
