/* 서브 ================================================================================= */
 
#container{
   position: relative;
   width: 100%;
   /*margin-bottom: 10rem;*/  /* Footer 스크롤 없이 하단 붙이기 */
   overflow: hidden;
}

#container #content{
   position: relative;
   width: 100%;
   max-width: 1100px;
   height: 100%;
   margin: 0 auto;
}

@media only screen and (max-width: 1100px) {
   #container #content{
      position: relative;
      width: 100%;
      max-width: 840px;
      height: 100%;
      margin: 0 auto;
   }
   
}

 .subVisual {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-bottom: 50px;
 }
 
 .subVisual .subBg {
    width:100%;
    height:220px;
    /*background-size: cover;*/
 }
 .subVisual .sub-bg-company {
    background: #b7dee8 url(../../images/sub/sub_01_bg.png) 50% 50% no-repeat;
    background-size: cover;
 }
 .subVisual .sub-bg-product {
   background: #f6cdab url(../../images/sub/sub_02_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-board {
   background: #ccc url(../../images/sub/sub_03_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-location {
   background: #c3d69b url(../../images/sub/sub_04_bg.png) 50% 50% no-repeat;
   background-size: cover;
}
.subVisual .sub-bg-login {
   background: #ccc url(../../images/sub/sub_03_bg.png) 50% 50% no-repeat;
   background-size: cover;
}

 .subimg {float:right; width:337px; height:220px;}
 
 /*
 .subVisual .subimg-company {
    background: url(../../images/sub/sub_v01.png) 0 0 no-repeat;
 }
 .subVisual .subimg-product {
    background: url(../../images/sub/sub_v02.png) 0 0 no-repeat;
 }
 .subVisual .subimg-board {
    background: url(../../images/sub/sub_v03.png) 0 0 no-repeat;
 }
 .subVisual .subimg-location {
    background: url(../../images/sub/sub_v04.png) 0 0 no-repeat;
 }
 .subVisual .subimg-login {
   background: url(../../images/sub/sub_v03.png) 0 0 no-repeat;
}
*/

.subVisual > .subBg > ul {
   width: 1100px;
   margin: 0 auto;
   position: relative;
}

.subVisual .subText {
   position: absolute;
   top: 105px;
   left: 40px;
}

.subVisual .subText >.title{
   color: rgba(255,255,255,1);
   font-size: 33px;
   font-weight: bold;
}

.subVisual .subText > .subTitle{
color: rgba(255,255,255,0.8);
   font-size: 24px;
   font-family: 500;
}
 
 /* .location {
     box-sizing: border-box;
     width: 100%;
     height: 50px;
     background: #109fa8;
     z-index: 10;
     /* overflow: hidden; *
 } */

.location {
   position: relative;
   box-sizing: border-box;
   width: 100%;
   height: 50px;
   background: #f8f8f8;
   border-bottom: 1px solid #e6e6e6;
   z-index: 10;
   /* overflow: hidden; */
}
 
.inner1100 {
   position: relative;
   width: 1100px;
   max-width: 1100px;
   margin: 0 auto;
}
 
.location .home {
   float: left;
   display: block;
   width: 54px;
   height: 50px;
   background: url(../../images/sub/subTop_home.png) no-repeat center center;
}

.location .sub_menu {
   position: relative;
   float: left;
}
 
.location .sub_menu > a {
   float: left;
   display: block;
   box-sizing: border-box;
   height: 50px;
   line-height: 50px;
   font-size: 13px;
   color: #888; 
   padding-left: 10px;
   padding-right: 10px;
}
 
.location .subArrow {
   float: left;
   width: 6px;
   height: 50px;
   background: url(../../images/sub/arrow5.png) no-repeat 0 center;
   display: block;
   margin: 0 10px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.location .sub_menu .twoD {
   display: none;
   position: absolute;
   top: 50px;
   left: 0;
   box-sizing: border-box;
   width: 249px;
   background: #109fa8;
   z-index: 1;
}
 
.location .sub_menu .twoD a {
   display: block;
   padding: 15px 30px;
   font-size: 16px;
   color: #fff;
   border-top: 1px solid rgba(255,255,255,0.2);
}

.location .sub_menu .twoD a:hover {
   color:#fff; 
   background:#109fa8;
}


/* .subCon {
    width: 100%;
    height: 100%;
} */


/*** 레프트메뉴 ***/

.lnb_wrap {
   display: block;
   position: relative;
   top: 0;
   z-index: 1;
   float: left;
   width: 210px;
   min-height: auto;
   margin: 0px 0 50px;
}
.lnb__title {
    display: block;
    position: relative;
    height: 80px;
    border-radius: 0 40px 0 0;
    background: #29448a url(/ccf/img/common/lnb_bg.png)no-repeat;
}
.lnb__title strong {
   display: block;
   position: relative;
   font-size: 22px;
   line-height: 80px;
   font-weight: 700;
   color: #fff;
   padding-left: 25px;
}
.lnb_depth2__list {
   border-bottom: 1px solid #e0e0e0;
}
.lnb_depth2__list > li {
   position: relative;
   border: 1px solid #e0e0e0;
   border-bottom: 0;
}
.lnb_depth2__list li a {
   position: relative;
   display: block;
   line-height: 1.2;
   word-wrap: break-word;
   word-break: keep-all;
}
.lnb_depth2__list >li> a span {
   position: relative;
   display: block;
   line-height: 1.2;
   word-wrap: break-word;
   word-break: keep-all;
   font-size: 15px;
   font-weight: normal;
   color: #555;
   text-align: left;
}
.lnb_depth2__list > li > a > span {
   padding: 18px 38px 18px 23px;
}
.lnb_depth2__list .active, 
.lnb_depth2__list .list a:hover {
   transition:none;
   background: url(../../images/sub/menu_arrow.png) 0 0 no-repeat;
   background-position: top 50% right 15px;
}
.lnb_depth2__list .active > span, 
.lnb_depth2__list .list:hover > a > span {
   color: #2390c8;
}

.depth3_ul {
   padding: 10px 0px 10px;
   background: #f8fcff;
   border-top: 1px solid #e0e0e0;
}
.depth3_ul .left_menu_sub3{
   padding-left: 30px;
   padding-top: 8px;
   padding-bottom: 8px;
   font-size: 14px;
}
.depth3_ul .left_menu_sub3 a{   
   color:#777;
}
.depth3_ul > li:hover>a span {
   color: #2390c8;   
}

.subContents {
   position: relative;
   float: right;
   width: calc(100% - 260px);
   padding-bottom: 130px;
}

@media only screen and (max-width: 1260px) {  
   .subContents {
   }
}

@media only screen and (max-width: 1024px) {  
   .subContents {
       /* width:800px; */
       width:100%;
       /* padding-bottom: 0px; */
   }
}

@media only screen and (max-width: 768px) { 
   .subContents {
       /* width:700px; */
       width:100%;
       /* padding-bottom: 0px; */
   }
 }

 @media only screen and (max-width: 480px) { 
    .subContents {
        /* width:400px; */
        width:100%;
        /* padding-bottom: 0px; */
    }
  }


.subContents > .title {
   position: relative;
   width: 100%;
   margin: 0 0 45px;
   padding: 15px 0 25px;
   text-align: left;
   border-bottom: 1px solid #29448a ;
}

.subContents > .title.title_board {
   margin-bottom: 30px;
}

.subContents > .title > h2{
   display: inline-block;
   color: #29448a;
   font-size: 30px;
   font-weight: bold;
   letter-spacing: -0.5px;
}


.subCon {
   width: 100%;
   height: 100%;
}

.subCon .subTitle2 {
   width: 100%;
   height: 180px;
   margin: 0 auto;
}

.subCon .subTitle2 > h2{
   color: #222;
   font-size: 26px;
   font-weight: 800;
   line-height: 180px;
   text-align: center;
}


/*** CEO 인사말 ***/
.ceoWrap {
   /*background: url(../../images/sub/company_bg.jpg) right 0 no-repeat;*/
}
.ceoWrap .ceo_top{
   font-size: 15px;
   line-height: 28px;
   color: #555;
   margin-bottom: 50px;
}
.ceoWrap .ceo_title {
   position: relative;
   float: left;
   width: 75%;
   font-size: 24px;
   line-height: 40px;
   color: #294489;
   font-weight: 800;
   padding-top: 55px;
}
.ceoWrap .ceo_title::before {
   display: block;
   width: 40px;
   height: 33px;
   content: "";
   z-index: 2;
   margin-bottom: 10px;
   background: url(../../images/sub/ceo_quotes01.png) 0 0 no-repeat;
}
.ceoWrap .ceo_photo{
   float: right;
   width: 25%;
}
.ceoWrap .ceo_title > strong {
   line-height: 38px;
   color: #555;
   font-weight: 800;
   padding-bottom : 30px;
}
.ceoWrap .point{
   font-size: 27px;
   color: #2390c8;
}
.ceoWrap .ceo_bottom  {
   padding-top: 280px;
}
.ceoWrap .ceo_bottom > .text {
   font-size: 15px;
   color: #777;
   line-height: 26px;
   margin-bottom: 20px;
}
.ceoWrap .ceo_bottom > .text.date {
   color: #777;
   line-height: 26px;
}
.ceoWrap .ceo_bottom > .text.ceoName {
   color: #555;
   line-height: 22px;
   margin-top: 30px;
}
.ceoWrap .ceo_bottom > .text.ceoName > span {
   display: inline-block;
   text-align: right;
   vertical-align: top;
}
.ceoWrap .ceo_bottom > .text.ceoName > span.name {
   font-weight: bold;
   margin-top: 17px;
}
.ceoWrap .ceo_bottom > .text.ceoName > span.sign {
   margin-left: 10px;
}


/*** 연혁 ***/
.history {
}
.logoInfo {
   padding: 20px 35px;
   border: 1px solid #ddd;
   background:#fff;
   margin-bottom: 10px;
}
.logoInfo > img {
   display: inline-block;
   vertical-align: middle;
}
.logoInfo > .logoInfo_text {
   display: inline-block;
   width: calc(100% - 130px);
   font-size: 14px;
   color: #777;
   line-height: 24px;
   margin-left: 40px;
   vertical-align: middle;
}
.history > .line > ul {
   padding-top: 25px;
   padding-bottom: 25px;
   border-bottom: 1px dotted #ddd;
}
.history > .line > ul > li  {
   display: inline-block;
   vertical-align: top;
}
.history > .line > ul > li.dot {
   vertical-align: top;
   margin-top: 5px;
}
.history > .line > ul > li.year {
   font-size: 20px;
   color: #373644;
   font-weight: 800;
   margin-left: 10px;
   line-height: 24px;
}
.history > .line > ul > li.month {
   width: 10%;
   font-size: 15px;
   color: #555;
   font-weight: bold;
   margin-left: 35px;
   line-height: 26px;
}
.history > .line > ul > li.text {
   font-size: 15px;
   color: #777;
   line-height: 26px;
}
.history > .line > ul > .none {
   display: none;
}
.sub_title {
   font-size: 22px;
   font-weight: bold;
   color: #294489;
   padding-bottom: 15px;
}


/*** 윤리강령 ***/
.ethical {
   width: 90%;
   margin: 0 auto;
   letter-spacing: -0.05em;
   position: relative;
   overflow: hidden;
}
.ethical::before {
   top: -6rem;
   left: -6rem;
}
.ethical::after {
   top: -6rem;
   right: -6rem;
}
.ethical .ethical_contents::before {
   bottom: -7rem;
   left: -7rem;
}
.ethical .ethical_contents::after {
   bottom: -7rem;
   right: -7rem;
}
.ethical::before, .ethical::after, .ethical .ethical_contents::before, .ethical .ethical_contents::after {
    display: block;
    content: "";
    width: 10rem;
    height: 10rem;
    background: #fff;
    border: 1.2rem solid #e8e8e8;
    border-radius: 50%;
    position: absolute;
    z-index: 2;
}
.ethical .ethical_contents {
   text-align: center;
   padding: 5rem 1.8rem;
   border: 1.2rem solid #e8e8e8;
   position: relative;
}
.ethical .top {
   position: relative;
   width: 90%;
   margin: 0 auto;
}
.ethical .top::before {
   left: 0;
   background: url(../../images/mps/content/humanrights-feather1.png)no-repeat center center / cover;
}
.ethical .top::before, .ethical .top::after {
   display: block;
   content: "";
   width: 60px;
   height: 98px;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   z-index: -999;
}
.ethical .top::before {
   left: 0;
   background: url(../../images/sub/wing_left.jpg)no-repeat center center / cover;
}
.ethical .top::after {
   right: 0;
   background: url(../../images/sub/wing_right.jpg)no-repeat center center / cover;
}
.ethical .top .title {
   display: block;
   margin-bottom: 18px;
}
.ethical .top .title > span {
   display: block;
   padding: 0 3rem;
   position: relative;
   font-size: 26px;
   font-weight: 800;
   color: #333;
   line-height: 34px;
}
.ethical .top > p {
   line-height: 2.2rem;
   font-size: 15px;
   font-weight: 500;
   padding: 0 58px;
   margin: 0 auto;
   color: #777;
}
.ethical .bottom {
   margin: 3.25rem 0;
}
.ethical .bottom ul {
   padding: .6rem 2.5rem;
}
.ethical .bottom ul li {
   padding: 20px 0px;
   padding-left: 9rem;
   position: relative;
   text-align: left;
   border-bottom: 1px dashed #dcdcdc;
   font-size: 14px;
   color: #777;
   line-height: 2rem;
}
.ethical .bottom ul li:last-child {
   border-bottom: none;
}
.ethical .bottom ul li::before {
   display: block;
   content: "하나";
   font-family: 'Noto Sans KR';
   width: 70px;
   height: 32px;
   background: #4571d3;
   position: absolute;
   top: 50%;
   left: 0;
   transform: translateY(-50%);
   text-align: center;
   color: #fff;
   font-size: 14px;
   line-height: 2.2em;
   border-radius: 50px;
}


/*** 정관 및 제규정 ***/
.ruleWrap {
}
.ruleWrap .ruleTable {
   color: #777;
   font-size: 14px;
   line-height: 24px;
}
.ruleList {
   border: 1px solid #cccccc; 
   padding: 30px 40px;
   line-height: 18px;
}
.ruleList > ul {
   float: left; 
   width: 50%;
}
.ruleList > ul > li {
   padding-bottom: 7px;
}
.ruleList > ul > li.last {
   padding-bottom: 0px;
}
.ruleTitle {
   font-size: 18px;
   font-weight: bold;
   color: #29448a;
   padding: 15px 0px;
}
.ruleStyle {
   margin-bottom: px;
}
.mb50 {
   margin-bottom: 50px;
}
.mb60 {
   margin-bottom: 60px;
}
.mb15 {
   margin-bottom: 15px !important;
}
.mb20 {
   margin-bottom: 20px !important;
}
.listProperty tr > .title{
   text-align: left;
   padding: 10px 0px;
}
.listProperty tr > td {
   text-align: center;
   padding: 5px 5px;;
}
.pl17 {
   padding-left: 17px;
}



/*** 조직도 ***/
.organization {
   padding: 20px;
}
.organization .ogzImg > img{
   display: block;
   margin: 0 auto;
   text-align: center;
}
.organization .ogzImg_m {
   display: none;
}

@media only screen and (max-width: 870px) {
   .organization .ogzImg > img{
      width: 100%;
   }
}


/*** 설립목적과 주요사업 ***/
.biz_ifgp {
   width: 100%;
   text-align: center;
}
.biz_ifgp .top_title {
   font-size: 25px;
   font-weight: 800;
   color: #555;
   line-height: 30px;
   height: 100px;
   margin-top: 40px;
   margin-bottom: 10px;
   background: url(../../images/sub/biz_ifgp_bg.png) 50% 0 no-repeat;
   background-position-y: bottom;
}
.biz_ifgp .top_title > span {
   font-size: 20px;
}
.biz_ifgp > .circle {
   display: inline-block;
   width: 12rem;
   height: 12rem;
   border: 20px solid rgba(41,68,137,0.3);
   border-radius: 50%;
   text-align: center;
   margin-bottom: 2rem;
   margin-right: 1.5rem;
}
.biz_ifgp > .circle.last {
   margin-right: 0rem;
}
.biz_ifgp > .circle.gray {
   border: 20px solid rgba(0,0,0,0.2);
}
.biz_ifgp > .circle > span {
   display: inline-block;
   line-height: 24px;
   margin-top: 37px;
   font-size: 17px;
   font-weight: bold;
   color: #555;
}
.business {
   display: inline-block;
   width: calc(50% - 10px);
   padding: 25px 0px;
   text-align: center;
   border-radius: 50px;
   background: rgba(77,113,204,0.1);
   margin-right: 5px;
   margin-bottom: 12px;
}
.business.odd {
   margin-right: 0px;
   margin-left: 5px;
}
.business .b_num {
   display: block;
   font-size: 14px;
   font-weight: bold;
   color: #8a9ed0;
   margin-bottom : 5px;
}
.business .businessText {
   display: block;
   overflow: hidden;
   font-size: 15px;
   font-weight: bold;
   line-height: 24px;
   color: #555;
   vertical-align: top;
}

@media only screen and (max-width: 767px) {
   .business {
      display: inline-block;
      width: calc(100% - 60px);
      padding: 20px 30px;
      margin-right: 0px;
   }
   .business.odd {
      margin-left: 0px;
   }
}

@media only screen and (max-width: 480px) {
   .biz_ifgp > .circle {
      display: inline-block;
      width: 10rem;
      height: 10rem;
      margin: 0 0.5rem 1rem;
   }
   .biz_ifgp .top_title {
      font-size: 22px;
   }
   .biz_ifgp > .circle > span {
      line-height: 20px;
      margin-top: 30px;
      font-size: 15px;
   }
}


/*** 역대회장명단 ***/
.presidentWrap {
   padding-top: 20px;
}
.president {
   position: relative;
   padding: 30px 0px 15px;
   border: 10px solid #f2f5f9;
   margin-bottom: 50px;
   text-align: center;
}
.president.last {
   margin-bottom: 0px;
}
.president > .year {
   position: absolute;
   left: 50%;
   top: -20px;
   width: 100px;
   margin-left: -50px;
   color: #5570a2;
   font-size: 30px;
   font-weight: 800;
   text-align: center;
}
.president > .each {
   display: inline-block;
   margin: 20px 10px;
   vertical-align: top;
}
.president .each > img {
   vertical-align: top;
}
.president > .each > p {
   font-size: 15px;
   line-height: 22px;
   color: #555;
   margin-top: 10px;
   letter-spacing: -0.5px;
}
.president > img:last-child {
   margin-right: 0px;
}

@media only screen and (max-width: 767px) {
   .president > .each {
      
   }
}


/*** 임원현황 ***/
.directorWrap {
   max-width: 840px;
   margin: 0 auto;
}
.directorTab {
   margin-bottom: 20px;
}
.directorTab > a {
   font-size: 0;
}
.directorList {
   display: block;
   margin-bottom: 50px;
}
.directorList .d_Title {
   font-size: 22px;
   font-weight: bold;
   color: #294489;
   padding: 15px 0px;
   margin: 0px 10px;
}
.directorList .d_Title > span.bar01 {
   display: none;
   width: 4px;
   height: 15px;
   background: #29448a;
   margin-right: 10px;
}
.director {
   display: inline-block;
   width: calc(50% - 64px);
   max-width: 356px;
   border: 1px solid #ddd;
   background: #f8f9fc;
   padding: 20px;
   margin: 0px 10px 20px;
   vertical-align: top;
}
.director .d_photo {
   display: inline-block;
   vertical-align: top;
   margin-right: 5%;
}
.director .imeDs {
   display: inline-block;
   width: calc(95% - 80px);
   font-size: 13px;
   line-height: 21px;
   color: #777;
}
.director .imeDs .titleName {
   display: inline-block;
   font-size: 15px;
   font-weight: bold;
   color: #2f3235;
   margin-bottom: 5px;
}
.director .imeDs > .ltsp-03 {
   letter-spacing:-0.3px
}

@media only screen and (max-width: 840px) {
   .director {
      min-height: 152px;
   }
   .director .imeDs > .none {
      display: none;
   }
}

.directorTab {
   margin: 0px 10px 20px 10px;
}
.tabs {
   font-size: 0;
}
.directorTab ul.tabs li.current span {
   color: #fff;
   background: #4760a1;
}
.directorTab ul.tabs li {
   display: inline-block;
   /* width: 16.3%; */
   width:calc((100% - 18px) / 6);
   vertical-align: top;
   margin-right: 3px;
}
.directorTab ul.tabs li > span {
   display: block;
   background: #ebebeb;
   height: 50px;
   line-height: 48px;
   text-align: center;
   color: #999;
   font-size: 16px;
   cursor: pointer;
}

.tab-content.current {
   display: block;
}


/*** 상임위원회 위원장 및 위원 ***/
.memberWrap {

}


/*** 직원명단 ***/
.contact {
   text-align: right;
   margin-bottom: 15px;
   font-size: 14px;
   color: #555;
}


/*** 시도지회현황 ***/
.branchfWrap {

}
.branch_grp {
   padding-top: 20px;
   margin-bottom: 50px;
   font-size: 0;
}
.branch_grp > span {
   display: inline-block;
   vertical-align: top;
}
.grp1 {
   width: 54%;
   text-align: center;
}
.grp2 {
   width: 38%;
   border: 1px solid #dddddd;
   padding: 25px 30px;
}

@media only screen and (max-width: 850px) {
   .grp1 {
      width: 100%;
      text-align: center;
   }
   .grp2 {
      width: calc(100% - 62px);
      border: 1px solid #dddddd;
      padding: 25px 30px;
      margin-top: 20px;
   }
}

.image_res{
   max-width:100%;
   height:auto;
}


/*** 협회 가입안내 ***/
.paragraph {
   margin-bottom: 60px;
}
.paragraph .jg_title {
   font-size: 22px;
   font-weight: bold;
   color: #294489;
   padding-bottom: 15px;
}
.paragraph > div {
   margin-bottom: 8px;
}
.sentence {
   display: block;
   overflow: hidden;
   font-size: 15px;
   line-height: 22px;
   color: #777;
   vertical-align: top;
}
.paragraph span.dot {
   position: relative;
   margin-right: 13px;
   text-indent: -9999px;
   float: left;
   margin-top: 5px;
}
.paragraph span.dot:after {
   content: "";
   position: absolute;
   top: 50%;
   margin-top: -4.5px;
   left: 0px;
   width: 5px;
   height: 9px;
   background-repeat: no-repeat;
   background-position: 50%;
   background-image: url(../../images/icons/bullet01.png);
}
.sentence+.sentence {
   margin-top: 7px;
   line-height: 24px;
   font-size: 14px;
}
.sentence.indent15 {
   padding-left: 15px;
   padding-bottom: 15px;
}
.contactLeft {
   margin-bottom: 15px;
   font-size: 14px;
   font-weight: bold;
   color: #555;
   min-width: 840px;
}


/*** 오시는길 ***/
.map {
   display: inline-block;
}
.mapWrap > .table_v2 {
   margin-top: 50px; 
}
.mapWrap span.mapIcon {
   display: block;
   margin-bottom: 5px;
}
.mapWrap > .table_v2 .p20{
   padding: 20px 10px;
}
.mapWrap > .table_v2 .pl30{
   padding-left: 30px;
}
.mapWrap > .locationInfo {
   margin-top: 60px;
}
.mapWrap > .locationInfo > .paragraph  {
   margin-bottom: 50px;
}
.sentence > .bar {
   display: inline-block;
   width: 1px;
   height: 10px;
   background: #d5d5d5;
   margin: 0px 10px;
}
.sentence .indent70 {
   display:block;
   padding-left: 70px;
   margin-top:5px;
   line-height: 24px;
}
/* .googlemap{
	position : absolute;
	top : 0;
	left : 0;
	width : 100%;
	height : 100%;
} */


/*** 회원사정보 ***/
.graphArea1 {
   display: inline-block;
   width: calc(50% - 40px);
   margin-right: 40px;
   vertical-align: top;
}
.graphArea1 > .title, .graphArea2 > .title,
.graphArea3 > .title {
   font-size: 20px;
   font-weight: bold;
   color: #294489;
   padding-bottom: 15px;
}
.graphArea1 .th2 {
   background: #f5f5f5;
}
.graphArea1 > .graphTab {

}
.graphArea1 > .graphTab > ul {

}
.graphArea1 > .graphTab > ul > li {
   display: inline-block;
   cursor: pointer;
   font-size: 15px;
   font-weight: bold;
   color: #294489;
   height: 50x;
   line-height: 49px;
   width: calc(50% - 2px);
   border: 1px solid #294489;
   text-align: center;
   margin-right: -1px;
   margin-bottom: -1px;
}
.graphArea1 > .graphTab > ul > li:hover {
   background: #e9edf8;
}
.graphArea2 {
   display: inline-block;
   width: 50%;
}
.graphArea2 .regioTitle {
   color: #0b9bef;
}
.table_v4 > div {
   padding-top: 40px;
}
.graphArea2 dl {
   display: inline-block;
   width: 20%;
}
.graphArea3 dl {
   display: inline-block;
   width: 10%;
}
.graphArea dl dt {
   height: 39px;
   margin-bottom: 50px;
   text-align: center;
}
.graphArea dl dt > div {
   display: inline-block;
   min-width: 50px;
   height: 30px;
   padding: 0 7px;
   margin: 0 auto;
   background: #e7edfd;
   line-height: 28px;
   font-size: 15px;
   font-weight: bold;
   color: #555;
   text-align: center;
   border-radius: 15px;
}
.graphArea3 dl dt > div { 
   background: #e5f5f4;
}
.graphArea dl dd.graph {
   position: relative;
   display: block;
   height: 100px;
}
.graphArea dl dd.graph > div {
   position: absolute;
   width: 28px;
   left: 50%;
   bottom: 0;
   margin-left: -14px;
   background: url(../../images/company/graph_bg.png);
}
.graphArea3 .graphArea dl dd.graph > div {
   background: url(../../images/company/graph_bg_02.png);
}
.graphArea dl dd.bottom {
   display: block;
   height: 22px;
   text-align: center;
   font-size: 13px;
   padding-top: 5px;
   line-height: 24px;
   border-top: 1px solid #999;
}
.graphArea dl dd.bottom span {
   color: #555;
   font-size: 14px;
}
.graphArea3 {
   width: 100%;
   margin-top: 20px;
}
.font0 {
   font-size: 0;
}


/*** 지회소식 ***/
.branchWrap {
   max-width: 840px;
   margin: 0 auto;
}
/* .branchTab {
   margin: 0px 10px 20px 10px; 
} */
.tabAreaBranch{
   display: block;
}
.tabAreaBranch_select {
   display: none;
}
.tabAreaBranch_select select {
   display: inline-block;
   width: 100%;
   height: 48px;
   border: 1px solid #ccc;
   background-color: #f9f9f9;
   color: #646464;
   padding-left: 15px;
   margin-right: 3px;
   font-size: 16px;
   font-weight: bold;
   background: #f9f9f9 url(/images/sub/arrow1.png) 96% 50% no-repeat;
   /* background: url(/images/more06.png) 0 0 no-repeat;
   background-position-y: 17px;
   background-position-x: 86px; */
}
.branch_text {
   font-size: 15px;
   color: #777;
   line-height: 26px;
   margin-bottom: 20px;
   padding: 0px 30px;
}
.branch_text > div {
   display: inline-block;
   vertical-align: middle;
}
.branch_photo {
   margin-right: 50px;
}
.branch_notice {
}
.branch_notice > h4 > a {
   display: block;
   font-size: 18px;
   color: #555;
}
.branch_notice > h4 > a > .title {
   display: inline-block;
   color: #fff;
   padding: 0px 15px 2px;
   border-radius: 50px;
   background:#29448a;
   margin-right: 5px;
   font-size: 14px;
}
.branch_notice > h4 > a > .title2 {
   font-weight: bold;
   color:#333;
}
.branch_notice > ul {
   margin: 10px 0px 0px 80px;
}
.branch_notice > ul > li {
   text-align: left;
}
.branch_notice > ul > li > a {
   color: #333;
}

@media screen and (max-width: 767px) {
   .branch_text {
      padding: 0px 10px;
   }
   .branch_notice {
      margin-top: 50px;
   }
   .branch_notice > ul {
      margin: 10px 0px 0px 0px;
   }
}

@media screen and (max-width: 480px) {
   .branch_photo {
      width: 100%;
      text-align: center;
   }
   .branch_notice > h4 > a {
      font-size: 17px;
   }
}


/*** KGSP안내 ***/
.kgsp {
   font-size: 0px;
}
.kgsp_top {
   display: inline-block;
   width: calc(100% - 80px);
   background: #4764af url(../../images/sub/kgsp_top_bg.png) right 0 no-repeat; 
   background-size: cover;
   padding: 40px 40px;
   margin-bottom: 40px;
}
.kgsp_top > h4 {
   font-size: 22px;
   font-weight: bold;
   color: #fff;
   margin-bottom: 15px;
}
.kgsp_top > ul {
   display: inline-block;
}
.kgsp_top > ul > li {
   display: block;
   font-size: 15px;
   color: rgba(255,255,255,0.8);
   line-height: 24px;
}
.kgsp_top > span {
   float: right;
   display: block;
   width: 80px;
   height: 80px;
}
.kgsp_top > span > a {
   display: block;
   width: 80px;
   height: 80px;
   border-radius: 50px;
   font-size: 15px;
   font-weight: bold;
   color: #fff;
   background: #29448a;
   line-height: 80px;
   text-align: center;
}
.kgsp_bottom > .linkBox {
   display: inline-block;
   width: calc(50% - 20px);
   vertical-align: top;
   padding-bottom: 20px;
}
.kgsp_bottom > .linkBox > h4 > a {
   display: block;
   font-size: 20px;
   font-weight: bold;
   margin-left: 10px;
   padding: 20px 0px 20px 0px;
}
.kgsp_bottom > .linkBox > h4 > a > img {
   display: inline-block;
   float: right;
   padding: 0px 10px 0px 0px;
}
.kgsp_bottom > .linkBox > p > a {
   display: block;
   color: #777;
   font-size: 15px;
   line-height: 20px;
   padding-left: 15px;
   padding-right: 15px;
   margin-bottom: 8px;
   margin-left: 12px;
   white-space: nowrap ;
   overflow: hidden;
   text-overflow: ellipsis;
}
.kgsp_bottom > .linkBox1 {
   padding-bottom: 76px;
   border-top: 4px solid #4571d3;
   border-bottom: 1px solid #ddd;
   margin-right: 20px;
}
.kgsp_bottom > .linkBox1 > h4 > a {
  color: #4571d3;
}
.kgsp_bottom > .linkBox1 > p > a {
   background: url(../../images/sub/kgsp_arrow01.jpg) 0 4px no-repeat;
}
.kgsp_bottom > .linkBox2 {
   border-top: 4px solid #459cd3;
   border-bottom: 1px solid #ddd;
   margin-left: 20px;
}
.kgsp_bottom > .linkBox2 > h4 > a {
   color: #459cd3;
}
 .kgsp_bottom > .linkBox2 > p > a {
   background: url(../../images/sub/kgsp_arrow02.jpg) 0 5px no-repeat;
}

@media screen and (max-width: 767px) {
   .kgsp_top {
      padding: 40px 40px;
   }
   .kgsp_bottom > .linkBox {
      width: 100%;
   }
   .kgsp_bottom > .linkBox1 {
      margin-right: 0px;
      margin-bottom: 40px;
      padding-bottom: 20px;
   }
   .kgsp_bottom > .linkBox2 {
      margin-left: 0px;
   }
  
}

@media screen and (max-width: 480px) {
   .kgsp_top {
      display: inline-block;
      width: calc(100% - 70px);
      padding: 35px 35px 30px;
      margin-bottom: 40px;
   }
 }


 /*** 불공정거래행위 신고센터 ***/
 .uf_top {
   display: inline-block;
   width: calc(100% - 80px);
   background: #4764af url(../../images/sub/uf_top_bg.png) right 0 no-repeat;
   background-size: cover;
   padding: 40px 40px 45px;
   margin-bottom: 40px;
}
.uf_top > h4 {
   font-size: 20px;
   font-weight: bold;
   color: #fff;
   line-height: 30px;
}
.uf_top > h4 > span {
   font-size: 17px;
   color: rgba(255,255,255,0.8);
}
 .paragraph .uf_title {
   font-size: 18px;
   line-height: 28px;
   font-weight: bold;
   color: #555;
   padding-bottom: 10px;
   padding-left: 15px;
   background: url(../../images/sub/bar03.png) 0 6px no-repeat;
}
.pl15 {
   padding-left: 15px;
}
.sentence.indent25 {
   padding-left: 25px;
}
.sentence .arrow {
   vertical-align: top;
   margin-top: 9px;
}
.stepWrap {
   display: inline-block;
   vertical-align: top;
   margin-top: 10px;
   font-size: 0;
}
.stepWrap > .step {
   width: 105px;
   height: 100px;
   text-align: center;
   border: 1px solid #9ba0ab;
   font-size: 0;
}
.stepWrap > .step > h5 {
   font-size: 14px;
   font-weight: bold;
   background: #9ba0ab;
   color: #fff;
   padding: 10px 0px 12px;

}
.stepWrap > .step > span {
   display: block;
   font-size: 13px;
   font-weight: bold;
   color: #777;
   line-height: 18px;
   padding: 10px 5px;
}
.step_arrow {
   display: inline-block;
   vertical-align: middle;
   padding: 55px 8px 0px 8px;
}

@media screen and (max-width: 766px) {
   .stepWrap {
      width: 42%;
   }
   .stepWrap > .step {
      width: calc(100% - 4px);
   }
 }

@media screen and (max-width: 480px) {
   .stepWrap {
      width: 41%;
   }
   .stepWrap > .step {
      width: calc(100% - 4px);
   }
 }


/*** 공급중단 등 수급불안정 의약품 신고센터 ***/
.unfairWrap > .paragraph {
   margin-bottom: 30px;
}
.paragraph .us_title {
   position: relative;
   font-size: 15px;
   line-height: 26px;
   color: #777;
   margin-bottom: 10px;
}
.btnWrap > .green {
   width: unset;
   padding: 0px 20px;
   background: #368aae;
}
.unfairWrap > .paragraph > .us_title.dot {
   padding-left: 12px;
}
.unfairWrap > .paragraph > .dot:after {
   display: block;
   position: absolute;
   top: 7px;
   left: 0;
   width: 3px;
   height: 13px;
   content: "";
   background-color: #29448a;
}
.asterisk {color: #e21833}


/*** 관련법령 ***/
.rawWrap {
   font-size: 0;
}
.raw {
   display: inline-block;
   width: calc(( 100% - 60px ) / 4) ;
   background: #9ba0ab;
   margin-right: 20px;
}
.raw > a {
   display: inline-block;
   width: 100%;
   transition: 0.2s;
}
.raw:last-child {
   margin-right: 0px;
}
.raw > a > .num {
   font-size: 35px;
   font-weight: bold;
   margin-top: 30px;
   margin-left: 27px;
   color: rgba(255,255,255,0.5);
}
.raw > a > h4 {
   font-size: 21px;
   font-weight: bold;
   margin-top: 15px;
   margin-left: 27px;
   color: rgba(255,255,255,0.9);
}
.raw > a > h4 > span {
   display: block;
   font-size: 14px;
   font-weight: normal;
   margin-top: 10px;
   margin-left: 2px;
   color: rgba(255,255,255,0.5);
}
.raw > a > .raw_more {
   display: block;
   position: relative;
   float: right;
   font-size: 14px;
   margin-top: 80px;
   margin-bottom: 40px;
   padding-right: 30px;
   padding-bottom: 10px;
   color: rgba(255,255,255,0.5);
}
.raw > a > .raw_more:after {
   position: absolute;
   top: 25px;
   content: '';
   display: block;
   width: 0;
   height: 1px;
   background: #5c2e98;
   -webkit-transition: 0.3s;
   transition: 0.3s;
}
.raw > a:hover{
   background: #368aae;
}
.raw > a:hover > h4 {
   color: rgba(255,255,255,1);
}
.raw > a:hover > .raw_more {
   color: rgba(255,255,255,1);
}
.raw > a:hover > .raw_more:after {
   width: 100%;
   height: 1px;
   background: #fff;
   -webkit-transition: 0.3s;
   transition: 0.3s;
}

@media only screen and (max-width: 1000px) {
   .raw {
      width: calc(( 100% - 20px ) / 2) ;
      margin-top: 20px;
   }
   .raw:first-child {
      margin-top: 0px;
   }
   .raw:nth-child(2){
      margin-right: 0px;
      margin-top: 0px;
   }
   .raw > a > .raw_more {
      margin-top: 30px;
      margin-bottom: 30px;
   }
}

@media only screen and (max-width: 480px) {
   .raw {
      width: 100% ;
      margin-right: 0px;
      background: #368aae;
   }
   .raw:nth-child(2){
      margin-top: 20px;
   }
   .raw > a > .num {
      margin-top: 20px;
   }
   .raw > a > .raw_more {
      margin-top: 20px;
   }
}

.rawList {
   
}
.save {
   border: 1px solid #999;
   margin-top: 50px;
}
.save .raw_title {
   height: 50px;
   line-height: 48px;
   background: #555;
   color: #fff;
   font-size: 18px;
   font-weight: bold;
   padding-left: 30px;
}
.save > ul {
   border-bottom: 1px solid #999;
}
.save > ul:last-child  {
   border-bottom: none;
}
.save > ul > li {
   display: block;
   line-height: 55px;
   color: #777;
   border-bottom: 1px solid #e5e5e5;
   background: url(../../images/sub/dot01.png) 30px 23px no-repeat;
}
.save > ul > li:last-child {
   border-bottom: none;
}
.save > ul > li > a {
   display: inline-block;
   line-height: 20px;
   font-size: 15px;
   color: #777;
   padding-left: 40px;
   vertical-align: middle;
}
.save > ul > li > a:hover {
   color: #555;
   font-weight: bold;
}

.slideWrap {
   overflow-y: auto;
   width: calc(100% - 80px);
   height: 250px;
   padding: 20px 40px;
   background: #f5f5f5;
   border-top: 1px solid #777;
}
.slideWrap > .title {
   font-size: 15px;
   color: #555;
}
.slideWrap > p {
   font-size: 14px;
   color: #777;
   line-height: 26px;
}
.y_box {
   font-size: 13px;
   line-height: 18px;
   padding: 12px 20px;
}
.slideWrap > p > a {
   font-size: 14px;
   color: #555;
   line-height: 26px;
}


/*** 회원가입 ***/
.acceptWrap {

}
.acceptWrap > .table_v2 {
   overflow-x: unset;
}
.acceptWrap > h4 {
   font-size: 18px;
   font-weight: bold;
   color: #414a61;
   padding-bottom: 15px;
}
.acceptWrap > .join_box {
   height: 200px;
   border: 1px solid #ddd;
   font-size: 13px;
   line-height: 20px;
   color: #777;
   padding: 20px;
   overflow-y: auto;
}
.acceptWrap > .join_box > p {
   margin-bottom: 10px;
}

.joinCheck {
   padding: 20px 0px 50px;
   text-align: center;
}
.joinCheck > input {
   width: 16px;
   height: 16px;
}
.joinCheck > label {
   font-size: 14px;
   vertical-align: top;
   margin-left: 3px;
   color: #555;
}
.btnWrap.join > a {
   width: 150px;
}


.btn_02 {
   display: inline-block;
   margin-left: 8px;
}
.btn_02 > a{
   display: block;
   height: 28px;
   line-height: 28px;
   font-size: 13px;
   color: #4964aa;
   border: 1px solid #4964aa;
   background-color: #fff;
   text-align: center;
   font-weight: bold;
   padding: 0px 15px;
}
.join_info {
   display: inline-block;
   vertical-align: top;
   margin-top: 3px;
   margin-left: 8px;
}

/* Style the container */
.joinWrap {
   border: 1px solid #c5c5c5;
   padding: 15px 40px 20px;
   background: #f9f9f9;
}
.joinWrap input, select, textarea {
   width: calc(100% - 22px);
   padding: 2px 10px;
   border: 1px solid #c5c5c5;
   resize: vertical;
   border-radius: 3px;
}
.joinWrap input::placeholder {
   color: #bbb;
   font-size: 13px;
 }
.joinWrap label {
   font-size: 15px;
   color:#777;
   font-weight: bold;
   padding: 10px 12px 10px 0;
   display: inline-block;
}
.joinWrap textarea {
   padding: 10px 
}
.btn_ex {
   display: inline-block;
   font-size: 14px;
   color: #999;
   margin-top: 6px;
   margin-left: 6px;
   line-height: 32px;
   vertical-align: top;
}
.btn_check {
   display: inline-block;
   margin-left: 6px;
   margin-top: 6px;
   vertical-align: top;
}
.btn_check > a {
   display: block;
   padding: 0px 15px;
   height: 34px;
   line-height: 32px;
   font-size: 14px;
   color: #fff;
   text-align: center;
   background: #9ba0ab;
   border-radius: 3px;
}
.btn_zipCode {
   display: inline-block;
   margin-left: 6px;
   margin-top: 0px;
   margin-bottom: 6px;
   vertical-align: top;
}
.btn_zipCode > a {
   display: block;
   padding: 0px 15px;
   height: 30px;
   line-height: 28px;
   font-size: 13px;
   color: #fff;
   text-align: center;
   background: #9ba0ab;
   border-radius: 3px;
}
.mr7 {
   margin-right: 7px
}

.row {
   margin-bottom: 4px;
}
.col-10 {
   float: left;
   width: 10%;
   min-width: 70px;
   margin-top: 6px;
 }
 .col-18 {
   float: left;
   width: 18%;
   margin-top: 6px;
 }
.col-25 {
   float: left;
   width: 25%;
   margin-top: 6px;
   min-width: 70px;
 }
.col-30 {
   float: left;
   width: 30%;
   margin-top: 6px;
 }
.col-40 {
   float: left;
   width: 40%;
   margin-top: 6px;
 }
 .col-50 {
   float: left;
   width: 50%;
   margin-top: 6px;
 }
.col-30 {
   min-width: 227px;
 }
.col-70 {
   float: left;
   width: 70%;
   margin-top: 6px;
 }
.col-80 {
   float: left;
   width: 80%;
   margin-top: 6px;
}
.col-40.w303 {
   min-width: 303px;
 }
.col-10 > input {
   text-align: center;
 }

.joinWrap.findWrap {
   float: left;
   width: calc(50% - 32px);
   background: #f9fbff;
   padding: 0px;
   margin-right: 15px;
   margin-left: 15px;
}
.joinWrap.findWrap .inline {
   padding: 30px 40px;
}
.findTitle {
   font-size: 18px;
   color: #fff;
   padding: 16px 0px;
   text-align: center;
   background: #8e97ad;
}
.findTitle.pw {
   background: #8e97ad;
}
.findTitle:before {
   display: block;
   width: 100px;
   height: 20px;
   background: #414a61;
}
.btn_find {
   display: block;
   margin: 0 auto;
   text-align: center;
}
.btn_find > a {
   display: inline-block;
   padding: 0px 40px;
   height: 45px;
   line-height: 44px;
   font-size: 15px;
   font-weight: bold;
   color: #fff;
   text-align: center;
   background: #4571d3;
   border-radius: 5px;
   margin-bottom: 30px;
}
.btn_find.btn_pw > a {
   background: #4571d3;
}

.joinWrap.secessionWrap {
   float: left;
   width: calc(100% - 32px);
   background: #f9fbff;
   padding: 0px;
   margin-right: 15px;
   margin-left: 15px;
}
.joinWrap.secessionWrap > .findTitle {
   background: #8e97ad;
}
.joinWrap.secessionWrap .inquiry {
   text-align: center;
   font-size: 18px;
   color: #666;
   padding: 50px;
}
.joinWrap.secessionWrap .cancel {
   margin-right: 7px;
   background: #fff;
   color: #666;
   border: 1px solid #8e97ad;
}
.joinWrap .hyphen {
   display: inline-block;
   vertical-align: top;
   margin-top: 10px;
   color: #777;
}

.mt50 {
   margin-top: 50px;
}
.mr50 {
   margin-right: 20px;
}
 
 /* Clear floats after the columns */
 .row:after {
   content: "";
   display: table;
   clear: both;
}
 
 /* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
 @media screen and (max-width: 820px) {

}
 
 @media screen and (max-width: 767px) {
   .col-18, .col-30, .col-40, .col-50, .col-80, input[type=submit] {
     width: 100%;
   }
   .col-30.w227 {
      max-width: 227px;
    }
   .joinWrap {
      border: 1px solid #ddd;
      padding: 15px 15px;
      background: #f9f9f9;
   }
   .joinWrap label {
      padding: 12px 12px 2px 0;
   }
   .row {
      margin-bottom: 10px;
   }
   .btn_ex {
      margin-left: 0px;
      margin-top: 0px;
   }
   .btn_ex.id {
      width: 100%
   }
   .joinWrap.findWrap {
      width: 100%;
      margin-right: 0px;
      margin-left: 0px;
      margin-bottom: 50px;
   }
   .joinWrap.findWrap .inline {
      display: block;
   }
 }
 
 @media screen and (max-width: 480px) {
   .btn_ex.id {
      margin-top: 0px;
      margin-left: 0px;
   }
 }


/*** 사이트맵 ***/
.sitemap {
   display: block;
   overflow: hidden;
   margin-bottom: 4rem;
   padding-bottom: 2.5rem;
   border-bottom: 1px solid #DCDBDB;
}
.sitemap > .menu {
   float: left;
   width: 18%;
   font-size: 22px;
   font-weight: bold;
   color: #222;
}
.sitemap > ul.sitemap_link {
   float: left;
   width: 82%;
   /* padding-left: ; */
}
.sitemap > ul.sitemap_link > li {
   float: left;
   width: 25%;
   display: table;
   table-layout: fixed;
   margin-bottom: 15px;
}
.sitemap > ul.sitemap_link > li > a {
   width: 100%;
   font-weight: bold;
   font-size: 14px;
   line-height: 22px;
   color: #777;
   display: table-cell;
   vertical-align: middle;
}

@media screen and (max-width: 840px) {
   .sitemap > ul.sitemap_link > li {
      width: 33%;
  }
}

@media screen and (max-width: 767px) {
   .naviWrap {
      padding: 0px 10px;
   }
   .sitemap > .menu {
      width: 100%;
      margin-bottom: 25px;
  }
   .sitemap > ul.sitemap_link {
      width: 100%;
   }
   .sitemap > ul.sitemap_link > li {
      width: 50%;
  }
}

@media screen and (max-width: 480px) {
   .btn_ex.id {
      margin-top: 0px;
      margin-left: 0px;
   }
}


/*** 관련사이트 ***/
.siteWrap {
   font-size: 0;
}
.subsite {
   display: inline-block;
   margin-bottom: 50px;
}
.subsite > .menu {
   display: block;
   font-size: 18px;
   font-weight: bold;
   color: #333;
   line-height: 24px;
   padding-bottom: 10px;
   margin-bottom: 12px;
   border-bottom: 1px solid #333;
}
.subsite > ul.subsite_link {
   
}
.subsite > ul.subsite_link > li {
   float: left;
   width: 25%;
   display: table;
   table-layout: fixed;
   margin-bottom: 10px;
}
.subsite > ul.subsite_link li > a {
   position: relative;
   font-size: 14px;
   padding-left: 9px;
   color: #777;
   line-height: 22px;
   display: table-cell;
   vertical-align: middle;
}
.subsite > ul.subsite_link li > a:after {
   display: block;
   position: absolute;
   top: 9px;
   left: 0;
   width: 4px;
   height: 4px;
   content: "";
   background-color: #9aa2ac;
}

@media screen and (max-width: 767px) {
   .subsite > ul.subsite_link > li {
      float: left;
      width: 50%;
      display: table;
      table-layout: fixed;
   }
}


/*** 이용약관 ***/
.using {

}
.using > .copyright {
   font-size: 20px;
   font-weight: bold;
   color: #294489;
   margin-top: 20px;
}
.using > h4 {
   font-size: 15px;
   font-weight: bold;
   color: #555;
}
.using .OneLine {
   font-size: 14px;
   color: #777;
   line-height: 24px;
}
.using > .top {
   font-size: 15px;
   line-height: 24px;
   color: #777;
   padding: 25px 20px;
   border-top: 1px solid #ccc;
   border-bottom: 1px solid #ccc;
}
.using > .top > span {
   color: #4571d3;
   font-weight: bold;
}
.using .list {
   font-size: 15px;
   color: #333;
   line-height: 28px;
}


/*** 제약사회원 로그인 ***/
#loginWrap {

}
#login-board {
   /* min-height: 300px; */
   margin: 0 auto;
   padding-top: 30px;
}
#login-board > h4 {
   font-size: 18px;
   line-height: 28px;
   color: #555;
   text-align: center;
   margin-bottom: 25px;
}
#login-board > h4 > span {
   font-size: 15px;
   font-weight: normal;
   color:#999;
}
#login-board .common-login {
   width: 300px;
   max-width: 100%;
   margin: 0 auto;
}
.input_area > input[type=text], .input_area > input[type=password] {
   width: calc(100% - 12px);
   border-color: #ccc;
   color: #777;
   font-size: 14px;
   padding: 0 0 0 10px;
   line-height: 45px;
   height: 45px;
   margin-bottom: 10px;
   border-radius: 4px;
 }
.login_join{
   font-size: 0;
} 
.login_join > a {
   display: inline-block;
   width: 100%;
   height: 40px;
   line-height: 40px;
   border: 1px solid #368aae;
   font-size: 14px;
   color: #368aae;
   text-align: center;
   border-radius: 4px;
}
.login_go > a {
   display: inline-block;
   background: #368aae;
   width: 100%;
   height: 58px;
   line-height: 58px;
   color: #fff;
   font-size: 16px;
   text-align: center;
   border-radius: 5px;
   margin-bottom: 10px;
}
@media only screen and (max-width: 480px) {
   #login-board > h4 {
      font-size: 16px;
      line-height: 26px;
   }

}


/*** table ***/
.placeholder_wrap {
   box-sizing: border-box;
   position: relative;
   display: inline-block;
   border: 1px solid #ccc;
}

.placeholder_wrap input[type='text'], .placeholder_wrap textarea {
   width: 200px;
   height: 36px;
   padding-right: 50px;
   padding-left: 15px;
   border: 0;
   box-sizing: border-box;
}

.placeholder_wrap > .placeholder {
   color: #999;
   font-size: 14px;
   font-weight: 300;
   position: absolute;
   top: 8px;
   left: 15px;
}
  
.search_box > .btn_search {
   width: 19px;
   height: 19px;
   font-size: 0;
   background: url(/images/common/icon_search.png) 50% no-repeat;
   position: absolute;
   top: 10px;
   right: 12px;
   display: inline-block;
}
.search_box > .btn_search.out {
   position: unset;
   margin-left: 10px;
}


.table_v2 {
   width: 100%;
   overflow: hidden;
   margin-bottom: 50px;
   border-top: 1px solid #29448a;
}  
.table_v2 > table {
   position: relative;
   overflow: hidden;
   width: 100%;
}  
.table_v2 > table tr {
   vertical-align: middle;
   text-align: center;
   border-bottom: 1px solid #e5e5e5;
}
.table_v2 > table th {
   font-size: 14px;
   color: #777;
   background: #f7f9ff;
   border-right: 1px solid #e5e5e5;
   padding: 10px 10px 10px;
   line-height: 20px;
   white-space: normal;
   word-break: break-all;
}
.table_v2 > table td {
   font-size: 14px;
   color: #777;
   padding: 10px 15px;
   line-height: 22px;
   border-right: 1px solid #e5e5e5;
   white-space: normal;
   word-break: break-all;
}
.table_v2 > table td > a {
   font-size: 14px;
   color: #777;
}
.table_v2 td:last-child {
   border-right: none;
}
.table_v2 .last {
   border-right: none;
}
.table_v2 .borderRight {
   border-right: 1px solid #e5e5e5 !important;
}
.table_v2 .w3 {
   width: 3%;
}
.table_v2 .w5 {
   width: 5%;
}
.table_v2 .w6 {
   width: 6%;
}
.table_v2 .w8 {
   width: 8%;
}
.table_v2 .w13 {
   width: 13%;
}
.table_v2 .w15 {
   width: 15%;
}
.table_v2 .w30 {
   width: 30%;
}
.table_v2 .w35 {
   width: 35%;
}

.table_v2 > table.table_s td {
   padding: 10px 10px;
}

  
@media screen and (max-width: 1100px) {
   .table_v2 {
      position: relative;
      width: 100%;
      overflow-x: scroll;
   }
   .table_v2.table-scroll > table {
      min-width: 840px;
   }
   .table_v2.scrollNone {
      overflow-x: hidden;
   }
   .table_v3, .table_v4 {
      overflow-x: unset;
   }
   .table_v4.table-scroll > .graphArea {
      min-width: 840px;
      padding-bottom: 20px;
   }
}

@media screen and (max-width: 767px) {
   .graphArea1 {
      width: 100%;
      margin-right: 0px;
  }
  .graphArea2 {
   width: 100%;
   }
   .graphArea1 > .graphTab {
      margin-bottom: 50px;
   }
}

  
/*** 버튼 공통 ***/
.btnWrap {
   width: 100%;
   margin: 0 auto;
   margin-top: 40px;
   font-size: 0;
   text-align: center;
}
.btnWrap > a {
   display: inline-block;
   width: 120px;
   height: 45px;
   line-height: 43px;
   background: #29448a;
   color: #fff;
   font-size: 15px;
   margin-right: 5px;
   border-radius: 5px;
   box-sizing: border-box;
   vertical-align: top;
}
.btnWrap > a:last-child {
   margin-right: 0px;
}
.btnWrap > .btnList, .btnWrap > .btnModify{
   background: #fff;
   border: 1px solid #29448a;
   color: #29448a;
}
.btnWrap > .btnDelete {
   background: #bc3958;
   color: #fff;
}

.scrollInfo {
   display: none;
   font-size: 12px;
   color: #888;
   margin-bottom: 10px;
}
.exMark {
   display: inline-block;
   width: 13px;
   height: 13px;
   border: 1px solid #aaa;
   border-radius: 50px;
   text-align: center;
}
.btnWrap > .red {
   background: #bc3958;
}
.btnWrap > .gray {
   background: #9ba0ab;
}



/*** Sub footer ***/
#footerSub {
   clear: both; 
   width: 100%;
   Height: 15rem; 
   text-align:center;
   /* margin-top: -16rem; */ /* Footer 스크롤 없이 하단 붙이기 */
   background: #232428;
   /* padding: 20px 0px 20px; */
   /* border-top: 1px solid #d5d5d5; */
   /* overflow:hidden; */
   /* position: fixed;
   bottom: 0px; */
}

.footerSub {
   max-width: 1100px;
   margin: 0 auto;
   padding-top: 20px;
}

.footerSub_logo {
   display: inline-block;
   vertical-align: top;
}

#footerSub .address {
   display: inline-block;
   /* padding-left: 0px; */
   color: #999;
   font-size: 13px;
   line-height: 26px;
}

#footerSub .address .privacy > a{
   display: inline-block;
   color: #999;
   font-weight: bold;
   margin-bottom: 10px;
}
 
#footerSub .address .privacy > a:hover{
   color: #ea1414;
}

#footerSub .address > img{
   vertical-align: top;
   margin: 9px 10px 0px 10px;
   opacity: 0.7;
}
.footerAddr, .footerTel {
   display: inline-block;
}
.footerCopy {
   display: block;
}

@media (max-width: 1100px) {

   .footerSub {
   
   }
}
 
@media only screen and (max-width: 767px) {
   
   #footerSub .address {
      font-size: 11px;
      line-height: 20px;
   }
   .footerAddr, .footerTel {
      display: block;
   }
}
  

   

@media only screen and (max-width: 1260px) {
   #header .header_wrap {
      width: calc(100% - 40px) ;
   }

   #container #content{
      width: calc(100% - 40px) ;
      padding: 0px 20px;
   }

   .inner1100 {
      width: 100%;
      padding: 0px 20px;
   }
   
   .subContents {
       box-sizing: border-box;
   }

   .map > .table {
      /* margin-top: 30px; */
      margin-top:480px;
   }

   .tabMenu ul.tabs li {
      width: 24.5%;
      height: 50px;
      margin-bottom: 3px;
   }
   .tabMenu ul.tabs li > span {
      width: 100%;
      height: 50px;
      line-height: 50px;
      font-size: 14px;
   }
   .tabMenu ul.tabs li.current {
      background: none;
   }

   .productWrap {
      height: 100%;
   }
   .productArea > .proTitle {
      height: 40px;
      font-size: 20px;
   }
   .productArea > ul > li {
      width: 33.3%;
   }
   .product > .productArea {
      padding: 10px 0px 15px;
      margin-bottom: 0px;
   }
}

#snb{
   display: block;
}

#dimmed {
   position: fixed;
   top: 0px;
   right: 0;
   z-index: 12;
   width: 100%;
   height: 100%;
   background-color: rgba(0,0,0,0.5);
}

@media only screen and (max-width: 1100px) { 

   .lnb__title {
      cursor: pointer;
      /* display: block;
      position: relative; */
      height: 55px;
      border-radius: 0 0 0 0;
      /* background: #29448a url(/ccf/img/common/lnb_bg.png)no-repeat; */
      background: #29448a  url(/images/sub/arrow3.png) 96% 50% no-repeat;
  }

  .lnb__title strong {
      /* display: block;
      position: relative;*/
      font-size: 17px; 
      line-height: 55px;
      /* font-weight: 700;
      color: #fff; */
      padding-left: 20px;
   }

   #snb{
      display: none;
      z-index: 9999;
      position: absolute;
      width: 100%;
      background: #fff;
   }

   #container #content{
      width: 100%;
      padding: 0px;
      max-width: 100%;
   }

   .inner1100 {
      border-top: 1px solid #e5e5e5;
   }

   .lnb_wrap {
      /* display: none; */
      width:100%;      
      display: block;
      /* position: relative; */
      top: 0;
      /* z-index: 1; */
      float: left;
      /* width: 210px; */
      min-height: auto;
      /* margin: 0px 0 20px; */
      margin: 0px 0 48px;
   }

   .subContents {
      width: 100%;
      padding: 0px 30px 100px 30px;
   }
   .subVisual {
      /* margin-bottom: 20px; */
      margin-bottom: 0px;
   }
   .subVisual .subBg {
      height: 230px;
      margin-top: 70px;
   }
   .subVisual .subBg > ul{
      width: 100%;
   }
   .subVisual .subBg .subimg {
      background-size: 275px;
      background-position-x: right;
   }
   .subVisual .subText {
      left: 30px;
      top: 78px;
   }
   .subVisual .subText > .subTitle {
      font-size: 20px;
   }

   .subContents > .title {
      text-align: center;
   }

   .scrollInfo {
      display: block;
   }
}

@media only screen and (max-width: 1023px) { 

}


@media only screen and (max-width: 767px) { 
   .inner1100 {
      width: 100% ;
      padding: 0px;
   }

   .subVisual .subText > .subTitle {
      font-size: 18px;
   }
   .subContents {
      padding: 0 15px 150px 15px;
   }
   .subContents > .title {
      margin: 0 0 30px;
   }
   .subContents > .title > h2 {
      font-size: 25px;
   }

   .ceoWrap .ceo_top {
      display: inline-block;
   }
   .ceoWrap .ceo_title {
      width: 100%;
      text-align: center;
      padding-top: 0;
      margin-bottom: 50px;
   }
   .ceoWrap .ceo_photo{
      width: 100%;
   }
   .ceoWrap .ceo_photo > img {
      display: block;
      margin: 0 auto;
   }
   .ceoWrap .ceo_bottom {
      padding: 0px 10px;
  }
   .ceoWrap .ceo_title::before {
      width: 100%;
      background-position-x: 50%;
  }

   .history > .line > ul > li.text {
      width: 100%;
      margin-left: 10px;
      margin-top: 10px;
   }

   .ethical {
      width: 100%;
      margin: 0;
   }
   .ethical .top {
      width: 100%;
   }
   .ethical .top .title > span {
      font-size: 26px;
   }
   .ethical .bottom ul {
      padding: 0;
  }

   .organization img{
      width: 100%;
   }

   .president > img {
      margin: 0px 10px 10px;
   }

   .director {
      min-height: 231px;
   }
   .director .imeDs {
      width: 100%;
   }
   .director .imeDs .titleName {
      margin-top:15px;
   }
   .director .imeDs > .none {
      display: none;
   }

   .directorTab ul.tabs li {
      width:calc((100% - 18px) / 3);
      vertical-align: top;
      margin-right: 5px;
      margin-bottom: 5px;
   }

   .map > .table {
      /* margin-top: 30px; */
      margin-top: 420px;
   }

   .tabAreaBranch_select {
      display: block;
   }
   .tabAreaBranch{
      display: none;
   }

   .table_v2 > table.join_table tr th {
      padding-left: 15px;
  }
}


 @media only screen and (max-width: 480px) { 
   .subVisual .subBg .subimg {
      width: 50%;
   }

   .location .subArrow {
      margin: 0px;
   }

   .ceoWrap .ceo_bottom > .text.ceoName > span.name {
      margin-top: 10px;
   }
   .ceoWrap .ceo_bottom > .text.ceoName > span.sign {
      width: 45%;
   }
   .ceoWrap .ceo_bottom > .text.ceoName > span.sign > img {
      width: 100%;
   }

   .logoInfo {
      padding: 20px 25px;
  }
   .logoInfo > img {
      display: block;
      margin: 0 auto;
  }
   .logoInfo > .logoInfo_text {
      width: 100%;
      margin-left: 0px;
      margin-top: 10px;
   }

   .ruleList {
      padding: 20px;
   }
   .ruleList > ul {
      float: left; 
      width: 100%;
   }

   .ethical .bottom ul li::before {
      width: 60px;
   }
   .ethical .bottom ul li {
      padding-left: 7rem
   }

   .organization .ogzImg {
      display: none;
   }
   .organization .ogzImg_m {
      display: block;
   }

   .president > img {
      margin: 0px 8px 10px;
   }

   .director {
      width: calc(100% - 42px);
      margin: 0px 0px 10px;
      border: 1px solid #cccccc;
      min-height: unset;
   }
   .director .imeDs {
      width: 65%;
   }
   .director .d_photo {
      margin-right: 20px;
   }
   .director .imeDs .titleName {
      margin-top: 0px;
   }
   .directorList .d_Title {
      margin: 0px;
   }
   .directorTab {
      margin: 0px 0px 20px 0px;
   }
   .directorTab ul.tabs li > span {
      font-size: 15px;
  }

   .contact {
      font-size: 13px;
      margin-bottom: 10px;
  }

  .branch_grp {
   padding-top: 20px;
   margin-bottom: 20px;
   font-size: 0;
   }

   .sentence .indent70 {
      padding-left: 0px;
   }

   .table_v2 > table th {
      font-size: 13px;
   }
   .table_v2 > table td {
      font-size: 13px;
   }

   .tabAreaBranch_select {
      display: block;
   }
   .tabAreaBranch{
      display: none;
   }

   .save .raw_title {
      padding-left: 20px;
   }
   .save > ul > li {
      background: url(../../images/sub/dot01.png) 20px 25px no-repeat;
   }
   .save > ul > li > a {
      padding-left: 30px;
      padding-right: 20px;
  }

}