@charset "utf-8";

/* ================================================
  common
==================================================*/






/* ================================================
  service
==================================================*/
.service .section-service {position: relative; margin-top: 30px; padding: 30px 20px; border: 2px solid #b2b2b2; box-sizing: border-box; }
.service .section-service:last-of-type {margin-bottom: 40px; }
.service .section-service:after {content: '+'; position: absolute; bottom: -1px; right: -1px; width: 30px; height: 30px; background-color: #545454; font-size: 30px; color: #fff; text-align: center; font-weight: 500; line-height: 30px;}
.service .section-service.on:after {content: '-'; position: absolute; bottom: -1px; right: -1px; width: 30px; height: 30px; background-color: #545454; font-size: 30px; color: #fff; text-align: center; font-weight: 500; line-height: 30px;}
.service .section-service h3 {margin-bottom: 15px; font-size: 25px; color: #000; font-weight: 400; }
.service .section-service h3  > strong {font-weight: 700; }
.service .section-service p {font-size: 16px; color: #545454; }
.service .section-service p.red {font-size: 16px; color: #ea4242; }
.service .section-service .gender-group {margin-top: 20px; }
.service .section-service .gender-group dl:after {content: ''; display:  block; clear: both; visibility: hidden;}
.service .section-service .gender-group dl dt {float: left; width: 70px; font-size: 16px; color: #333; font-weight: 500; }
.service .section-service .gender-group dl dt .icon {padding-left: 28px; background-position: left center; }
.service .section-service .gender-group dl dd {float: left; width: calc(100% - 70px); font-size: 16px; color: #333; font-weight: 400; }

.service .section-service .setp-info {display: none; margin: 40px auto; }
.service .section-service.on .setp-info {display: block; }
.service .section-service .step-list:after {content: ''; display:  block; clear: both; visibility: hidden;}
.service .section-service .step-list li {position: relative; }
.service .section-service .step-list li:nth-child(odd) {float: left; width: 45%; }
.service .section-service .step-list li:nth-child(odd):after {content: ''; position: absolute; top: 20px; right: calc( -10% - 15px); width: 20px; height: 30px; background: url('/images/common/arrow_gray.png') no-repeat center center; background-size: contain; }
.service .section-service .step-list li:nth-child(even) {float: right; width: 45%; }
.service .section-service .step-list .step-box {padding: 15px 10px; background-color: #d9d9d9; }
.service .section-service .step-box .step {font-size: 12px; color: #8c9195; }
.service .section-service .step-box strong {color: #000; font-size: 16px; font-weight: 500; }
.service .section-service .step-list .guide {height: 130px; box-sizing: border-box; padding: 10px 5px 20px; font-size: 14px; color: #666666; font-weight: 400; }
.service .section-service .step-guidelist {margin-bottom: 40px; padding-top: 30px; border-top: 1px solid #aeb2bb; }
.service .section-service .step-guidelist li {margin-bottom: 10px; }

.service .section-service .btn-big { margin: 0 auto; border-radius: 10px; background-color: #6a747d; font-size: 24px; color: #fff; }

.service .section-prestige {width: 100%; margin: 30px auto 40px; padding: 30px 20px; box-sizing: border-box; background-color: #022632; text-align: center; }
.service .section-prestige img {display: block; max-width: 100%; margin: 0 auto; }
.service .section-prestige .btn-prestige {display: block; max-width: 80%; height: 50px; margin: 30px auto 0; border-radius: 5px; border: 1px solid #18424e; background-color: #18424e; font-size: 16px; color: #fff; text-align: center; line-height: 48px; } 






/* ================================================
  step-type
==================================================*/
.step-type .header-tab .btn-tab {width: calc((100% - 3px)/2);  }

.step-type .top-type {margin-bottom: 20px; padding: 0 30px;}
.step-type .top-type:after {content: ''; display:  block; clear: both; visibility: hidden;}
.step-type .top-type li {float: left; widtH: 50%; margin: 0 auto; text-align: center; }
.step-type .top-type.alone li {float: none; width: 100%; margin: 0 auto; text-align: center; }
.step-type .top-type .tit {margin-bottom: 5px; font-size: 18px; color: #000; font-weight: 400;}
.step-type .top-type .tit > strong {font-weight: bold; font-size: 22px;}
.step-type .top-type .type-txt p {color: #232a32; font-size: 15px; }
.step-type .top-type .male > em {color: #17b9e8; font-size: 15px; font-weighT: 400; }
.step-type .top-type .woman > em {color: #d52ea8;  font-size: 15px; font-weighT: 400; }

.step-type .section-type {margin-bottom: 50px; }
.step-type .section-type .type-list > li {margin-bottom: 20px; padding: 20px 20px; box-sizing: border-box; border: 2px solid #b2b2b2; } 
.step-type .section-type .type-tit {margin-bottom: 5px; font-size: 20px; color: #000; font-weight: 400; }
.step-type .section-type .type-tit > strong {font-weight: 700; }
.step-type .section-type .list-plus {color: #545454; font-size: 15px; font-weight: 300; }
.step-type .section-type .price-group {margin-top: 10px; }
.section-type .price-group .term-box {width: 100%; padding: 10px 20px; box-sizing: border-box; }
.section-type .price-group .term-box + .term-box {margin-left: 10px; }
.section-type .price-group .term-box  .price-name {font-size: 18px; color: #fff; font-weight: 400; text-align: center; }
.section-type .price-group .term-box .price {color: #fff; font-weight: 300; font-size: 18px; text-align: center; }
.section-type .price-group .term-box .price > strong {font-size: 20px; font-weight: 900; }

.step-type .section-type .guide {font-size: 12px; color: #555; margin-top: 5px; }


/* 포인트 컬러 */
.step-type .point-color {color: #71addc !important;}
.step-type .term-bg {background-color: #71addc !important;}
.step-type .point-color02 {color: #048475 !important;}
.step-type .term-bg02 {background-color: #048475 !important;}


.step-type .sticky-sale {position: fixed; bottom: 85px; right: 25px; z-index: 10; width: 95px; height: 95px; box-sizing: border-box; border-radius: 100%; background-color: #ffd200; }
.step-type .sticky-sale .txt {display: block; padding-top: 24px; font-size: 15px; color: #000; font-weight: 600;  text-align: center; font-family: "SCoreDream", "Dotum", "돋움", Arial, sans-serif !important;}
.step-type .sticky-sale .pink {display: block; font-size: 20px; font-weight: 600; color: #ef0273; }
.step-type .sticky-sale .pink em {font-style: italic; }

/* ================================================
  child-counsel
==================================================*/
.child-counsel {}
.child-counsel .section-child img {display: block; max-width: 100%; margin: 0 auto;}
.child-counsel .section-child {margin-bottom: 80px; }
.child-counsel .section-child .btn-link {display: block; width: 100%; height: 100%; margin: 20px auto 0;}


.section-child.map {padding: 0 20px;}
.section-child.map .child-inner {max-width: 750px; margin: 0 auto; box-sizing: border-box; border: 2px solid #e9eee8; text-align: center; }
.section-child .tit {margin-bottom: 20px; font-size: 18px; color: #232323; font-weight: 700; text-align: center;  }
.section-child .txt {color: #777777; font-size: 16px; font-weight: 400; text-align: center; }
.section-child.map .counsel-map {display: inline-block; }
.section-child.map .counsel-map:after {content: ''; display:  block; clear: both; visibility: hidden;}
.section-child.map .counsel-map li {float: left; width: 50%; margin-top: 20px; font-size: 14px; color: #232323; font-weight: 300;}
.section-child.map .counsel-map li a {display: block; width: 100%; height: 100%; }
.section-child.map .counsel-map .number {display: inline-block; width: 25px; height: 25px; margin-right: 4px; box-sizing: border-box; border-radius: 100%; background-color: #000; font-size: 12px; color: #fff; text-align: center; font-weight: 500;  line-height: 23px; vertical-align: middle;  }
.section-child.map .counsel-map strong {font-weight: 700; }





/* ================================================
  benefit
==================================================*/
.benefit .benefit-company {padding: 0 10px; }

.company-list:after {content: ''; display:  block; clear: both; visibility: hidden;}

.company-list > li {margin-bottom: 10px; }
.company-list > li a {display: block; width: 100%; height: 100%; box-sizing: border-box; border: 1px solid #DCDCDC;}

.company-list > li:nth-child(1),
.company-list > li:nth-child(2),
.company-list > li:nth-child(3),
.company-list > li:nth-child(4) {float: none; width: 100%; margin-left:0; }

.company-list > li:nth-child(1) .company-info .date,
.company-list > li:nth-child(2) .company-info .date,
.company-list > li:nth-child(3) .company-info .date,
.company-list > li:nth-child(4) .company-info .date {font-size: 14px; color: #999999; }

.company-list > li:nth-child(1) .company-info .name,
.company-list > li:nth-child(2) .company-info .name,
.company-list > li:nth-child(3) .company-info .name,
.company-list > li:nth-child(4) .company-info .name {margin-top: 2px; font-size: 18px; color: #2a2a2a; font-weight: 500; }

/* 2단 */

.company-list > li {float: left; width: calc(50% - 5px); margin-left: 10px; }
.company-list > li:nth-child(odd) {margin-left: 0;}
.company-list .company-info .date {font-size: 12px; }
.company-list .company-info .name {width: calc(100% - 60px); font-size: 14px; }

.company-list .company-thumbs {width: 100%; height: 80px; padding: 25px 10px; box-sizing: border-box; }
.company-list .company-thumbs img {display: block; max-width:100%; height: 30px; margin: 0 auto;}
.company-list .company-info {position: relative; height: 80px; padding: 15px 10px; box-sizing: border-box;  border-top: 1px solid #DCDCDC; background-color: #F8F7F8; overflow: hidden; }

.company-list .company-info .benefit-tag {position: absolute; top: 0; right: 0; }
.company-list .company-info .benefit-tag li {width: 60px; height: 80px; text-align: center;}
.company-list .company-info .benefit-tag li .tag {display: block; width: 100%; height: 100%; padding: 18px 0 0; box-sizing: border-box; line-height: 1.3;}


/*
.company-list .company-info .benefit-tag li {width: 100%; height: auto; text-align: left; }
.company-list .company-info {height: auto; padding: 15px 10px 40px;}
.company-list .company-info .benefit-tag li {width: 100%; height: auto; text-align: left; }
.company-list .company-info .benefit-tag {top: auto; bottom: 0; left: 0;  }
.company-list .company-info .benefit-tag li .tag {height: auto; padding: 2px 10px; }
.company-list .company-info .benefit-tag li .tag br {display: none; }*/




/* benefit-consonant */
.benefit-consonant .header-title {margin: 80px auto 20px; }

.consonant-tab:after {content: ''; display:  block; clear: both; visibility: hidden;}
.consonant-tab li {float: left; width: 14.28%; height: 60px; margin-bottom: -1px; box-sizing: border-box; border-top: 1px solid #DCDCDC; border-bottom: 1px solid #DCDCDC; border-right: 1px solid #DCDCDC; line-height: 58px;}
.consonant-tab li:nth-child(7n) {border-right: 0; }
.consonant-tab li a {display: block; width: 100%; height: 100%;  background-color: #fff; font-size: 22px; color: #2c2c2c; font-weight: 400; text-align: center; }
.consonant-tab li.current a {background-color: #E5006E; color: #fff; }

.consonant-tab + div {margin-bottom: 30px; background-color: #f8f7f8; }
.consonant-sarch .search-header {display: none; padding: 20px 10px; background-color: #fff; font-size: 12px; font-weight: 400; color: #000; text-align: right;}
 .consonant-sarch .search-list {border-bottom: 2px solid #dcdcdc; }
.consonant-sarch .search-list > li {position: relative; border-bottom: 1px solid #DCDCDC; }
.consonant-sarch .search-list a {display: block; width: 100%; height: 100%; padding: 15px 10px; box-sizing: border-box; font-size: 14px; color: #2c2c2c; } 
.consonant-sarch .search-list .tag {position: absolute; top: 10px; right: 10px; }


/* benefit-etc */
.benefit-etc {padding: 0 10px; }
.benefit-etc .company-etc:after {content: ''; display:  block; clear: both; visibility: hidden;}
.benefit-etc .company-etc > li {float: left; width: calc((100% - 10px)/ 3); margin: 0 auto 10px; }
.benefit-etc .company-etc > li:nth-child(3n - 1) {margin: 0 5px 10px; }
.benefit-etc .company-etc .company-info .name {font-size: 14px; }

.benefit-etc .company-etc .company-thumbs {width: 100%; padding: 20px 5px; box-sizing: border-box; }
.benefit-etc .company-etc .company-thumbs img {display: block; max-width:100%; height: 20px; margin: 0 auto;}
.benefit-etc .company-etc .company-info {position: relative; height: auto; padding: 15px 10px; box-sizing: border-box;  border-top: 1px solid #DCDCDC; background-color: #F8F7F8; overflow: hidden; }

.benefit-etc .company-etc .company-info .benefit-tag {position: absolute; top: 0; right: 0; }
.benefit-etc .company-etc .company-info .benefit-tag li {width: 60px; height: 80px; text-align: center; }
.benefit-etc .company-etc .company-info .benefit-tag li .tag {display: block; width: 100%; height: 100%; padding: 18px 0 0; box-sizing: border-box; }



/* ================================================
  shopping
==================================================*/
.shopping img {display: block; width: 100%; }