@charset "UTF-8";
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 100;
  src: url(../fonts/NotoSansKR-Thin.woff2) format("woff2"), url(../fonts/NotoSansKR-Thin.woff) format("woff"), url(../fonts/NotoSansKR-Thin.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/NotoSansKR-Light.woff2) format("woff2"), url(../fonts/NotoSansKR-Light.woff) format("woff"), url(../fonts/NotoSansKR-Light.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/NotoSansKR-Regular.woff2) format("woff2"), url(../fonts/NotoSansKR-Regular.woff) format("woff"), url(../fonts/NotoSansKR-Regular.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  src: url(../fonts/NotoSansKR-Medium.woff2) format("woff2"), url(../fonts/NotoSansKR-Medium.woff) format("woff"), url(../fonts/NotoSansKR-Medium.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 700;
  src: url(../fonts/NotoSansKR-Bold.woff2) format("woff2"), url(../fonts/NotoSansKR-Bold.woff) format("woff"), url(../fonts/NotoSansKR-Bold.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 900;
  src: url(../fonts/NotoSansKR-Black.woff2) format("woff2"), url(../fonts/NotoSansKR-Black.woff) format("woff"), url(../fonts/NotoSansKR-Black.otf) format("opentype");
}

.nationOption {height: 54px;
  padding-left: 20px;
  padding-right: 20px;
  line-height: 52px;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: #fff;
  position:relative;
  outline-color: #4415a0;
}
.nationOption:focus{color:#4415a0}
.nationOption:focus::-moz-placeholder {
  color: #4415a0;
}

.nationOption:focus::placeholder {
  color: #4415a0;
}

.arrow::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  margin:0 auto;
  transform: rotate(-45deg);
}
.arrow {   position: absolute;
  top: 50%;
  width: 20px;
  height: 20px;
  display: block;
  transform: translateY(50%);
  text-align: center;
  right: 20px;
}
.selectBox .arrow {
  transform: translateY(-50%);}

.suggestions_box {
  display: none; /* 기본적으로 숨김 */
  position: absolute; /* 위치 설정 */
  z-index: 10; /* 다른 요소 위에 표시 */
  background: white; /* 배경색 설정 */
  border: 1px solid #ccc; /* 테두리 설정 */
  max-height: 200px; /* 최대 높이 */
  overflow-y: auto; /* 스크롤 가능하도록 설정 */
}
.half {position:relative;}
.selectBox > div, .suggestions {display: none; height:200px; position:absolute; width:100%; overflow:hidden; overflow-y:scroll;
z-index: 3;
    position: absolute;
    display: none;
    width: 100%;
    overflow: auto;
    background: #fff;
    -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
    -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);}
.suggestion {padding:0 20px; line-height:2.5; cursor: pointer;}
.suggestion:hover {color:#4415a0;}
#contents.groupBd .intro .info .logo img, #contents.groupGr .intro .info .logo img, #contents.groupBd .ongoing ul li a::after, #detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button span::before, #detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button::after, #contents.statusList > .list .list a:not(.btn) .img img,
#contents.statusList .tabTarget > .list .list a:not(.btn) .img img, #contents.home .vi h1, #recruit .container .board .recommend > a > div img, .recruit .container .board .recommend > a > div img, #contents.crList .tabTarget .recommend > a > div img, #contents.pressList > .list .recommend > a > div img, #contents.performanceList > .list .recommend > a > div img, #contents.research .list .recommend > a > div img, #recruit .container .board .recommend > a .imgLink img, .recruit .container .board .recommend > a .imgLink img, #contents.crList .tabTarget .recommend > a .imgLink img, #contents.pressList > .list .recommend > a .imgLink img, #contents.performanceList > .list .recommend > a .imgLink img, #contents.research .list .recommend > a .imgLink img, #recruit .container .board .recommend .swiper-slide > div img, .recruit .container .board .recommend .swiper-slide > div img, #contents.crList .tabTarget .recommend .swiper-slide > div img, #contents.pressList > .list .recommend .swiper-slide > div img, #contents.performanceList > .list .recommend .swiper-slide > div img, #contents.research .list .recommend .swiper-slide > div img, #recruit .container .board .recommend .swiper-slide .imgLink img, .recruit .container .board .recommend .swiper-slide .imgLink img, #contents.crList .tabTarget .recommend .swiper-slide .imgLink img, #contents.pressList > .list .recommend .swiper-slide .imgLink img, #contents.performanceList > .list .recommend .swiper-slide .imgLink img, #contents.research .list .recommend .swiper-slide .imgLink img, .thumbMode.active ~ .list > a > div img, .thumbMode.active ~ .list > a .imgLink img, .thumbMode.active ~ .list .swiper-slide > div img, .thumbMode.active ~ .list .swiper-slide .imgLink img, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div > .closeZoom, #contents.develop .detailContainer > section.gallery .zoom > div > .closeZoom, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div, #contents.develop .detailContainer > section.gallery .zoom > div, .popup > div, .popup > div > .closePopup,
.popup > .closePopup, .toastMessage p {
  position: absolute !important;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
#contents.groupBd .headline ul .summary .info span + span::before, #recruit .container .board .selectBox > button::after, .recruit .container .board .selectBox > button::after, #contents.crDetail > section .shortcut > div > div button.selected::before, #contents.crList .sort .selectBox > button::after, .historyContainer .content .year h1::after,
.awardContainer .content .year h1::after, .historyContainer .content .year h1::before,
.awardContainer .content .year h1::before, #detailContents.portfolioDetail > header .percent button::after, #detailContents.portfolioDetail > header .percent button::before, #detailContents.portfolioDetail > header .direction > *, #contents.performance .headline .summary .info span + span::before, #header > div > button, #header h1 img, #contents > header .breadcrumb > li + li::before, #recruit .selectjob .form .application > section > header p::before, .recruit .selectjob .form .application > section > header p::before, #recruit .form > section > header p::before, .recruit .form > section > header p::before, #recruit .container #inquiry form.inquiry > section > header p::before, .recruit .container #inquiry form.inquiry > section > header p::before, #contents.contact .inquiry > section > header p::before, #contents.research .application > section > header p::before,
#recruit .selectjob .form .application > section label.required::after,
.recruit .selectjob .form .application > section label.required::after,
#recruit .form > section label.required::after,
.recruit .form > section label.required::after,
#recruit .container #inquiry form.inquiry > section label.required::after,
.recruit .container #inquiry form.inquiry > section label.required::after,
#contents.contact .inquiry > section label.required::after,
#contents.research .application > section label.required::after, #contents.brochure .downloadInfo > div > p .choose button + button::before, #contents.research .downloadInfo > div > p .choose button + button::before,
#contents.brochure .downloadInfo > div > div .choose button + button::before,
#contents.research .downloadInfo > div > div .choose button + button::before, #recruit .container .board .jobOpeningList a .info span:not(:last-child)::after, .recruit .container .board .jobOpeningList a .info span:not(:last-child)::after, #contents.crList .tabTarget .jobOpeningList a .info span:not(:last-child)::after, #contents.pressList > .list .jobOpeningList a .info span:not(:last-child)::after, #contents.performanceList > .list .jobOpeningList a .info span:not(:last-child)::after, #contents.research .list .jobOpeningList a .info span:not(:last-child)::after, #recruit .container .board .downloadList > li .buttons, .recruit .container .board .downloadList > li .buttons, #contents.crList .tabTarget .downloadList > li .buttons, #contents.pressList > .list .downloadList > li .buttons, #contents.performanceList > .list .downloadList > li .buttons, #contents.research .list .downloadList > li .buttons,
#recruit .container .board .listTextMode > li .buttons,
.recruit .container .board .listTextMode > li .buttons,
#contents.crList .tabTarget .listTextMode > li .buttons,
#contents.pressList > .list .listTextMode > li .buttons,
#contents.performanceList > .list .listTextMode > li .buttons,
#contents.research .list .listTextMode > li .buttons, #recruit .container .board .downloadList > a span + span::before, .recruit .container .board .downloadList > a span + span::before, #contents.crList .tabTarget .downloadList > a span + span::before, #contents.pressList > .list .downloadList > a span + span::before, #contents.performanceList > .list .downloadList > a span + span::before, #contents.research .list .downloadList > a span + span::before,
#recruit .container .board .listTextMode > a span + span::before,
.recruit .container .board .listTextMode > a span + span::before,
#contents.crList .tabTarget .listTextMode > a span + span::before,
#contents.pressList > .list .listTextMode > a span + span::before,
#contents.performanceList > .list .listTextMode > a span + span::before,
#contents.research .list .listTextMode > a span + span::before, .textMode.active ~ .list > li .buttons, .textMode.active ~ .list > a span + span::before, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnPrev, #contents.develop .detailContainer > section.gallery .zoom > div .btnPrev,
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnNext,
#contents.develop .detailContainer > section.gallery .zoom > div .btnNext, #recruit .selectjob .form .application > section .file > div p button, .recruit .selectjob .form .application > section .file > div p button, #recruit .form > section .file > div p button, .recruit .form > section .file > div p button, #recruit .container #inquiry form.inquiry > section .file > div p button, .recruit .container #inquiry form.inquiry > section .file > div p button, #contents.contact .inquiry > section .file > div p button, #contents.research .application > section .file > div p button, #recruit .selectjob .form .application > section .input .reset, .recruit .selectjob .form .application > section .input .reset, #recruit .form > section .input .reset, .recruit .form > section .input .reset, #recruit .container #inquiry form.inquiry > section .input .reset, .recruit .container #inquiry form.inquiry > section .input .reset, #contents.contact .inquiry > section .input .reset, #contents.research .application > section .input .reset, #recruit .container .board .search label .reset, .recruit .container .board .search label .reset, #contents.crList .tabTarget .search label .reset, #contents.pressList > .list .search label .reset, #contents.performanceList > .list .search label .reset, #contents.research .list .search label .reset, .popup > div .full .inputTxt .reset {
  position: absolute !important;
  top: 0;
  bottom: 0;
  margin: auto;
}

#detailContents.portfolioDetail > header .percent p span::before, #detailContents.portfolioDetail > header .percent p span::after {
  position: absolute !important;
  left: 0;
  right: 0;
  margin: auto;
}

#contents.pressList .newsPick > div li, #contents.home .performanceList > div li, #footer address, #footer nav section, #recruit .selectjob .form .application > section .radio, .recruit .selectjob .form .application > section .radio, #recruit .form > section .radio, .recruit .form > section .radio, #recruit .container #inquiry form.inquiry > section .radio, .recruit .container #inquiry form.inquiry > section .radio, #contents.contact .inquiry > section .radio, #contents.research .application > section .radio, #detailContents.pressDetail > header .utility > div, #recruit .container .board .recommend .swiper-wrapper, .recruit .container .board .recommend .swiper-wrapper, #contents.crList .tabTarget .recommend .swiper-wrapper, #contents.pressList > .list .recommend .swiper-wrapper, #contents.performanceList > .list .recommend .swiper-wrapper, #contents.research .list .recommend .swiper-wrapper, .thumbMode.active ~ .list .swiper-wrapper, body.print .basic .basicInfo {
  font-size: 0;
  line-height: 0;
  letter-spacing: -4px;
}
#contents.pressList .newsPick > div li > *, #contents.home .performanceList > div li > *, #footer address > *, #footer nav section > *, #recruit .selectjob .form .application > section .radio > *, .recruit .selectjob .form .application > section .radio > *, #recruit .form > section .radio > *, .recruit .form > section .radio > *, #recruit .container #inquiry form.inquiry > section .radio > *, .recruit .container #inquiry form.inquiry > section .radio > *, #contents.contact .inquiry > section .radio > *, #contents.research .application > section .radio > *, #detailContents.pressDetail > header .utility > div > *, #recruit .container .board .recommend .swiper-wrapper > *, .recruit .container .board .recommend .swiper-wrapper > *, #contents.crList .tabTarget .recommend .swiper-wrapper > *, #contents.pressList > .list .recommend .swiper-wrapper > *, #contents.performanceList > .list .recommend .swiper-wrapper > *, #contents.research .list .recommend .swiper-wrapper > *, .thumbMode.active ~ .list .swiper-wrapper > *, body.print .basic .basicInfo > * {
  display: inline-block;
}

@media (min-width: 1025px) {
  #contents.recruitInfo .recruitList, #contents.benefits .detailContainer > section, #contents.jobinfo .collapse, #recruit .container #faq ul, .recruit .container #faq ul, #contents.crDetail > section footer.button, #contents.crDetail > section dl.info, #contents.crDetail > section .departmentWrapper, #contents.license .list, .historyContainer,
  .awardContainer, #contents.cibi > section.identity:not(.heading):not(.tabTarget),
  #contents.ci > section.identity:not(.heading):not(.tabTarget), #contents.brochure .heading, #contents.pressList > section, #detailContents.portfolioDetail footer.button, #detailContents.portfolioDetail .statusContent, #contents.statusList > .list,
  #contents.statusList .tabTarget > .list, #contents.statusList .empty, #recruit .selectjob .form .application, .recruit .selectjob .form .application, #recruit .form, .recruit .form, #recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry, #contents.contact .inquiry, #contents.research .application, #recruit .container .myinfoInfo, .recruit .container .myinfoInfo, #contents.contact .info, #detailContents.pressDetail .info, #detailContents.pressDetail .detail, #contents.performance .clients, #recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination, #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend, #recruit .container .board .empty, .recruit .container .board .empty, #contents.crList .tabTarget .empty, #contents.pressList > .list .empty, #contents.performanceList > .list .empty, #contents.research .list .empty, #contents.groupBd .recommend, #detailContents.portfolioDetail .recommend, #detailContents.pressDetail .recommend {
    margin-bottom: 150px;
  }
  #contents.recruitInfo .recruitList + *, #contents.benefits .detailContainer > section + *, #contents.jobinfo .collapse + *, #recruit .container #faq ul + *, .recruit .container #faq ul + *, #contents.crDetail > section footer.button + *, #contents.crDetail > section dl.info + *, #contents.crDetail > section .departmentWrapper + *, #contents.license .list + *, .historyContainer + *,
  .awardContainer + *, #contents.cibi > section.identity:not(.heading):not(.tabTarget) + *,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) + *, #contents.brochure .heading + *, #contents.pressList > section + *, #detailContents.portfolioDetail footer.button + *, #detailContents.portfolioDetail .statusContent + *, #contents.statusList > .list + *,
  #contents.statusList .tabTarget > .list + *, #contents.statusList .empty + *, #recruit .selectjob .form .application + *, .recruit .selectjob .form .application + *, #recruit .form + *, .recruit .form + *, #recruit .container #inquiry form.inquiry + *, .recruit .container #inquiry form.inquiry + *, #contents.contact .inquiry + *, #contents.research .application + *, #recruit .container .myinfoInfo + *, .recruit .container .myinfoInfo + *, #contents.contact .info + *, #detailContents.pressDetail .info + *, #detailContents.pressDetail .detail + *, #contents.performance .clients + *, #recruit .container .board .pagination + *, .recruit .container .board .pagination + *, #contents.crList .tabTarget .pagination + *, #contents.pressList > .list .pagination + *, #contents.performanceList > .list .pagination + *, #contents.research .list .pagination + *, #recruit .container .board .recommend + *, .recruit .container .board .recommend + *, #contents.crList .tabTarget .recommend + *, #contents.pressList > .list .recommend + *, #contents.performanceList > .list .recommend + *, #contents.research .list .recommend + *, #recruit .container .board .empty + *, .recruit .container .board .empty + *, #contents.crList .tabTarget .empty + *, #contents.pressList > .list .empty + *, #contents.performanceList > .list .empty + *, #contents.research .list .empty + *, #contents.groupBd .recommend + *, #detailContents.portfolioDetail .recommend + *, #detailContents.pressDetail .recommend + * {
    margin-top: -150px;
  }
}
@media (max-width: 1024px) {
  #contents.recruitInfo .recruitList, #contents.benefits .detailContainer > section, #contents.jobinfo .collapse, #recruit .container #faq ul, .recruit .container #faq ul, #contents.crDetail > section footer.button, #contents.crDetail > section dl.info, #contents.crDetail > section .departmentWrapper, #contents.license .list, .historyContainer,
  .awardContainer, #contents.cibi > section.identity:not(.heading):not(.tabTarget),
  #contents.ci > section.identity:not(.heading):not(.tabTarget), #contents.brochure .heading, #contents.pressList > section, #detailContents.portfolioDetail footer.button, #detailContents.portfolioDetail .statusContent, #contents.statusList > .list,
  #contents.statusList .tabTarget > .list, #contents.statusList .empty, #recruit .selectjob .form .application, .recruit .selectjob .form .application, #recruit .form, .recruit .form, #recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry, #contents.contact .inquiry, #contents.research .application, #recruit .container .myinfoInfo, .recruit .container .myinfoInfo, #contents.contact .info, #detailContents.pressDetail .info, #detailContents.pressDetail .detail, #contents.performance .clients, #recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination, #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend, #recruit .container .board .empty, .recruit .container .board .empty, #contents.crList .tabTarget .empty, #contents.pressList > .list .empty, #contents.performanceList > .list .empty, #contents.research .list .empty, #contents.groupBd .recommend, #detailContents.portfolioDetail .recommend, #detailContents.pressDetail .recommend {
    margin-bottom: 80px;
  }
  #contents.recruitInfo .recruitList + *, #contents.benefits .detailContainer > section + *, #contents.jobinfo .collapse + *, #recruit .container #faq ul + *, .recruit .container #faq ul + *, #contents.crDetail > section footer.button + *, #contents.crDetail > section dl.info + *, #contents.crDetail > section .departmentWrapper + *, #contents.license .list + *, .historyContainer + *,
  .awardContainer + *, #contents.cibi > section.identity:not(.heading):not(.tabTarget) + *,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) + *, #contents.brochure .heading + *, #contents.pressList > section + *, #detailContents.portfolioDetail footer.button + *, #detailContents.portfolioDetail .statusContent + *, #contents.statusList > .list + *,
  #contents.statusList .tabTarget > .list + *, #contents.statusList .empty + *, #recruit .selectjob .form .application + *, .recruit .selectjob .form .application + *, #recruit .form + *, .recruit .form + *, #recruit .container #inquiry form.inquiry + *, .recruit .container #inquiry form.inquiry + *, #contents.contact .inquiry + *, #contents.research .application + *, #recruit .container .myinfoInfo + *, .recruit .container .myinfoInfo + *, #contents.contact .info + *, #detailContents.pressDetail .info + *, #detailContents.pressDetail .detail + *, #contents.performance .clients + *, #recruit .container .board .pagination + *, .recruit .container .board .pagination + *, #contents.crList .tabTarget .pagination + *, #contents.pressList > .list .pagination + *, #contents.performanceList > .list .pagination + *, #contents.research .list .pagination + *, #recruit .container .board .recommend + *, .recruit .container .board .recommend + *, #contents.crList .tabTarget .recommend + *, #contents.pressList > .list .recommend + *, #contents.performanceList > .list .recommend + *, #contents.research .list .recommend + *, #recruit .container .board .empty + *, .recruit .container .board .empty + *, #contents.crList .tabTarget .empty + *, #contents.pressList > .list .empty + *, #contents.performanceList > .list .empty + *, #contents.research .list .empty + *, #contents.groupBd .recommend + *, #detailContents.portfolioDetail .recommend + *, #detailContents.pressDetail .recommend + * {
    margin-top: -80px;
  }
}

#contents.performance .portfolio .thumbMode.active ~ .more + *, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer + *, #recruit .container .board .mapMode.active ~ .list .swiperContainer + *, .recruit .container .board .mapMode.active ~ .list .swiperContainer + *, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer + *, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.research .list .mapMode.active ~ .list .swiperContainer + * {
  background: #fff;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio .thumbMode.active ~ .more, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer, #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    padding-bottom: 150px;
  }
  #contents.performance .portfolio .thumbMode.active ~ .more + *, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer + *, #recruit .container .board .mapMode.active ~ .list .swiperContainer + *, .recruit .container .board .mapMode.active ~ .list .swiperContainer + *, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer + *, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.research .list .mapMode.active ~ .list .swiperContainer + * {
    margin-top: -150px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio .thumbMode.active ~ .more, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer, #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    padding-bottom: 80px;
  }
  #contents.performance .portfolio .thumbMode.active ~ .more + *, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer + *, #recruit .container .board .mapMode.active ~ .list .swiperContainer + *, .recruit .container .board .mapMode.active ~ .list .swiperContainer + *, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer + *, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer + *, #contents.research .list .mapMode.active ~ .list .swiperContainer + * {
    margin-top: -80px;
  }
}

@media (min-width: 1025px) {
  #contents.groupBd .category, #contents.groupGr .category, #contents.groupBd .headline, #contents.groupBd .recommend, #contents.benefits .detailContainer > section, #contents.pressList .newsCollect, #detailContents.portfolioDetail .progressCalendar, #detailContents.portfolioDetail .detailContainer > section, #contents.performance .performanceInfo.enc + section, #contents.develop .detailContainer > section, #contents.develop .process, #detailContents > header hgroup .modifier,
  #detailContents > header hgroup .title, #detailContents > header .modifier, #detailContents.portfolioDetail .recommend, #detailContents.pressDetail .recommend {
    padding-top: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .category, #contents.groupGr .category, #contents.groupBd .headline, #contents.groupBd .recommend, #contents.benefits .detailContainer > section, #contents.pressList .newsCollect, #detailContents.portfolioDetail .progressCalendar, #detailContents.portfolioDetail .detailContainer > section, #contents.performance .performanceInfo.enc + section, #contents.develop .detailContainer > section, #contents.develop .process, #detailContents > header hgroup .modifier,
  #detailContents > header hgroup .title, #detailContents > header .modifier, #detailContents.portfolioDetail .recommend, #detailContents.pressDetail .recommend {
    padding-top: 50px;
  }
}

@media (min-width: 1025px) {
  #contents.brochure .heading + .downloadInfo, #detailContents.portfolioDetail .map, #contents.performance .portfolio, #contents.performance .performanceInfo + .headline, #contents.performance .performanceInfo + .clients, #contents.performance .performanceInfo.enc + section, #contents.research .heading + .downloadInfo, #contents.develop .process {
    margin-top: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.brochure .heading + .downloadInfo, #detailContents.portfolioDetail .map, #contents.performance .portfolio, #contents.performance .performanceInfo + .headline, #contents.performance .performanceInfo + .clients, #contents.performance .performanceInfo.enc + section, #contents.research .heading + .downloadInfo, #contents.develop .process {
    margin-top: 50px;
  }
}

@media print {
  body {
    width: 420mm;
    height: 594mm;
    margin: 30mm 45mm 30mm 45mm;
  }
  .pagebreak {
    page-break-before: always;
  } /* page-break-after works, as well */
  .noPrint {
    display: none;
  }
}
.hidden {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

@media (max-width: 1024px) {
  .wideOnly {
    display: none;
  }
}

@media (min-width: 1025px) {
  .middleOnly {
    display: none;
  }
}

.narrowOnly {
  display: none;
}
@media (max-width: 640px) {
  .narrowOnly {
    display: unset;
  }
}

.narrowestOnly {
  display: none;
}
@media (max-width: 480px) {
  .narrowestOnly {
    display: unset;
  }
}

html {
  margin: 0;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: none;
  font-size: 16px;
}

body {
  margin: 0;
  color: #212121;
  -webkit-text-size-adjust: none;
  line-height: 1;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}

html, body {
  overscroll-behavior-y: none;
}

body.resizing * {
  transition: none !important;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  -webkit-text-size-adjust: none;
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: transparent;
}

body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  vertical-align: baseline;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 100%;
}

body,
input,
select,
textarea,
button,
pre {
  font-family: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
}

article,
aside,
hgroup,
header,
footer,
figure,
figcaption,
nav,
section,
time,
mark,
canvas,
video,
audio,
details,
summary {
  display: block;
}

ul {
  list-style: none;
}

address {
  font-style: normal;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  vertical-align: baseline;
  margin: 0;
  padding: 0;
  background: transparent;
  text-decoration: none;
  color: inherit;
}

b,
strong,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
}

ins {
  color: #212121;
}

em {
  font-style: normal;
}

mark {
  background-color: #ff9;
  font-style: italic;
  font-weight: bold;
  color: #212121;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}

hr {
  display: block;
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

input,
select,
textarea,
button {
  margin: 0;
  padding: 0;
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
}

textarea {
  resize: none;
}

input[type=text],
input[type=password],
input[type=tel],
input[type=search],
input[type=email],
input[type=time],
input[type=month],
input[type=date],
input[type=url],
input[type=image],
input[type=button],
input[type=submit],
input[type=reset],
input[type=file],
textarea,
select,
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
}

input[type=hidden],
input::-ms-clear,
input::-ms-reveal {
  display: none;
}

input[type=button]::-moz-focus-inner,
button::-moz-focus-inner {
  margin: -1px;
  padding: 0;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=button],
input[type=image],
input[type=file],
input[type=submit],
button {
  border: 0;
  background: transparent;
  cursor: pointer;
}

input:disabled,
button:disabled {
  cursor: default;
}

input[type=date] {
  background: transparent;
}

input::-webkit-calendar-picker-indicator {
  opacity: 0;
}

::-moz-placeholder {
  color: #a5a5a5;
  font-family: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
  opacity: 1;
}

::placeholder {
  color: #a5a5a5;
  font-family: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
  opacity: 1;
}

/**
 * Swiper 8.2.4
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2022 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 13, 2022
 */
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}

.swiper-pointer-events {
  touch-action: pan-y;
}

.swiper-pointer-events.swiper-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  backface-visibility: hidden;
}

.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}

.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}

.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}

.swiper-centered > .swiper-wrapper::before {
  content: "";
  flex-shrink: 0;
  order: 9999;
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}

.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}

.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
}

.swiper-virtual .swiper-slide {
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}

.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
  height: 1px;
  width: var(--swiper-virtual-size);
}

.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
  width: 1px;
  height: var(--swiper-virtual-size);
}

:root {
  --swiper-navigation-size: 44px;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}

.swiper-button-next.swiper-button-hidden,
.swiper-button-prev.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}

.swiper-navigation-disabled .swiper-button-next,
.swiper-navigation-disabled .swiper-button-prev {
  display: none !important;
}

.swiper-button-lock {
  display: none;
}

.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 0.3s opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}

.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: 50%;
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-bullet:only-child {
  display: none !important;
}

.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}

.swiper-pagination-vertical.swiper-pagination-bullets,
.swiper-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}

.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 0.2s transform, 0.2s top;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 5px);
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 0.2s transform, 0.2s left;
}

.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 0.2s transform, 0.2s right;
}

.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}

.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}

.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-vertical > .swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}

.swiper-pagination-lock {
  display: none;
}

.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}

.swiper-scrollbar-disabled > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
  display: none !important;
}

.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}

.swiper-scrollbar.swiper-scrollbar-vertical,
.swiper-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-scrollbar-lock {
  display: none;
}

.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.swiper-zoom-container > canvas,
.swiper-zoom-container > img,
.swiper-zoom-container > svg {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.swiper-slide-zoomed {
  cursor: move;
}

.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}

.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}

@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.swiper .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}

.swiper-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}

.swiper-grid > .swiper-wrapper {
  flex-wrap: wrap;
}

.swiper-grid-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}

.swiper-fade.swiper-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}

.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}

.swiper-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-cube {
  overflow: visible;
}

.swiper-cube .swiper-slide {
  pointer-events: none;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}

.swiper-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-cube.swiper-rtl .swiper-slide {
  transform-origin: 100% 0;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-next + .swiper-slide,
.swiper-cube .swiper-slide-prev {
  pointer-events: auto;
  visibility: visible;
}

.swiper-cube .swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-right,
.swiper-cube .swiper-slide-shadow-top {
  z-index: 0;
  backface-visibility: hidden;
}

.swiper-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 0;
}

.swiper-cube .swiper-cube-shadow:before {
  content: "";
  background: #000;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  filter: blur(50px);
}

.swiper-flip {
  overflow: visible;
}

.swiper-flip .swiper-slide {
  pointer-events: none;
  backface-visibility: hidden;
  z-index: 1;
}

.swiper-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-flip .swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-right,
.swiper-flip .swiper-slide-shadow-top {
  z-index: 0;
  backface-visibility: hidden;
}

.swiper-creative .swiper-slide {
  backface-visibility: hidden;
  overflow: hidden;
  transition-property: transform, opacity, height;
}

.swiper-cards {
  overflow: visible;
}

.swiper-cards .swiper-slide {
  transform-origin: center bottom;
  backface-visibility: hidden;
  overflow: hidden;
}

.swiper .swiper-pagination-bullet {
  background-color: #dcdcdc;
  opacity: 1;
}
.swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #0097e0;
}

@media (min-width: 1025px) {
  #contents > header .vi p {
    font-size: 60px;
    line-height: 74px;
    letter-spacing: -0.05em;
  }
}
@media (max-width: 1024px) {
  #contents > header .vi p {
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.025em;
  }
}

@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div h2, .recruit .loginWrap .joinInfo > div h2, #recruit .loginWrap .login h2, .recruit .loginWrap .login h2, #recruit .container h2, .recruit .container h2, #contents.pressList .newsCollect > div .swiper button em, #contents.home .news header p, #contents.home .performance ul li em, #contents > header hgroup h2, .error404 section h2, .preview > section > div > header h2 {
    font-size: 50px;
    line-height: 62px;
    letter-spacing: -0.035em;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div h2, .recruit .loginWrap .joinInfo > div h2, #recruit .loginWrap .login h2, .recruit .loginWrap .login h2, #recruit .container h2, .recruit .container h2, #contents.pressList .newsCollect > div .swiper button em, #contents.home .news header p, #contents.home .performance ul li em, #contents > header hgroup h2, .error404 section h2, .preview > section > div > header h2 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
}

@media (min-width: 1025px) {
  #contents.groupBd .category h3, #contents.groupGr .category h3, #contents.groupBd .intro > header h3, #contents.groupGr .intro > header h3, #contents.groupBd .headline ul .summary em, #contents.groupBd .headline > header h3, #contents.groupBd .headline > h3, #contents.groupBd .recommend .swiperContainer .swiper-slide strong, #contents.groupBd .recommend h3, #contents.recruitInfo .copyText, #contents.jobinfo .heading h1,
  #contents.jobinfo .heading p:first-child, #contents.hr .heading h1,
  #contents.hr .heading p:first-child, #recruit .find h2,
  #recruit .join h2,
  #recruit .complete h2, .recruit .find h2,
  .recruit .join h2,
  .recruit .complete h2, #recruit .selectjob > header h1, .recruit .selectjob > header h1, #contents.crDetail > section > header .cover h1, #contents.crDetail > section > header > h1, #contents.crList .total, #contents.introduction .heading h1,
  #contents.introduction .heading p:first-child, #contents.history .historyInfo, #contents.historyCenter .book h1, #contents.cibi .heading h1,
  #contents.cibi .heading p:first-child, #contents.cibi .heading h1 + p,
  #contents.ci .heading h1,
  #contents.ci .heading p:first-child,
  #contents.ci .heading h1 + p, #contents.brochure .heading, #detailContents.portfolioDetail .progressCalendar .performance header h1, #contents.performance .headline .summary em, #contents.performance .performanceInfo, #contents.research .heading h1, #contents.research .heading p:first-child, #contents.develop .process h1, #contents.develop .overview > p, #detailContents > header hgroup .title, .popup > div .terms h1, .popup > div .full h1:not(.caseSmall) {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .category h3, #contents.groupGr .category h3, #contents.groupBd .intro > header h3, #contents.groupGr .intro > header h3, #contents.groupBd .headline ul .summary em, #contents.groupBd .headline > header h3, #contents.groupBd .headline > h3, #contents.groupBd .recommend .swiperContainer .swiper-slide strong, #contents.groupBd .recommend h3, #contents.recruitInfo .copyText, #contents.jobinfo .heading h1,
  #contents.jobinfo .heading p:first-child, #contents.hr .heading h1,
  #contents.hr .heading p:first-child, #recruit .find h2,
  #recruit .join h2,
  #recruit .complete h2, .recruit .find h2,
  .recruit .join h2,
  .recruit .complete h2, #recruit .selectjob > header h1, .recruit .selectjob > header h1, #contents.crDetail > section > header .cover h1, #contents.crDetail > section > header > h1, #contents.crList .total, #contents.introduction .heading h1,
  #contents.introduction .heading p:first-child, #contents.history .historyInfo, #contents.historyCenter .book h1, #contents.cibi .heading h1,
  #contents.cibi .heading p:first-child, #contents.cibi .heading h1 + p,
  #contents.ci .heading h1,
  #contents.ci .heading p:first-child,
  #contents.ci .heading h1 + p, #contents.brochure .heading, #detailContents.portfolioDetail .progressCalendar .performance header h1, #contents.performance .headline .summary em, #contents.performance .performanceInfo, #contents.research .heading h1, #contents.research .heading p:first-child, #contents.develop .process h1, #contents.develop .overview > p, #detailContents > header hgroup .title, .popup > div .terms h1, .popup > div .full h1:not(.caseSmall) {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}

@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div .swiper strong, .recruit .loginWrap .joinInfo > div .swiper strong, #recruit .container #inquiry h2, .recruit .container #inquiry h2, #recruit .container .list > li > p, .recruit .container .list > li > p, #contents.crDetail > section > header .cover em, #contents.historyCenter .book > div p, #contents.cibi > section h1,
  #contents.ci > section h1, #contents.pressList .newsCollect > div .swiper button p, #contents.pressList .newsPick > div li .detail em, #contents.performance .performanceInfo.enc + section > header h1, #contents.develop .processSwipe .swiper .swiper-wrapper > li em, #contents.home .performanceList > div li .detail em, #recruit .selectjob .form .application > section > header h1, .recruit .selectjob .form .application > section > header h1, #recruit .form > section > header h1, .recruit .form > section > header h1, #recruit .container #inquiry form.inquiry > section > header h1, .recruit .container #inquiry form.inquiry > section > header h1, #contents.contact .inquiry > section > header h1, #contents.research .application > section > header h1,
  #recruit .selectjob .form .application > section > h1,
  .recruit .selectjob .form .application > section > h1,
  #recruit .form > section > h1,
  .recruit .form > section > h1,
  #recruit .container #inquiry form.inquiry > section > h1,
  .recruit .container #inquiry form.inquiry > section > h1,
  #contents.contact .inquiry > section > h1,
  #contents.research .application > section > h1,
  #recruit .selectjob .form .application > section > header h2,
  .recruit .selectjob .form .application > section > header h2,
  #recruit .form > section > header h2,
  .recruit .form > section > header h2,
  #recruit .container #inquiry form.inquiry > section > header h2,
  .recruit .container #inquiry form.inquiry > section > header h2,
  #contents.contact .inquiry > section > header h2,
  #contents.research .application > section > header h2,
  #recruit .selectjob .form .application > section > h2,
  .recruit .selectjob .form .application > section > h2,
  #recruit .form > section > h2,
  .recruit .form > section > h2,
  #recruit .container #inquiry form.inquiry > section > h2,
  .recruit .container #inquiry form.inquiry > section > h2,
  #contents.contact .inquiry > section > h2,
  #contents.research .application > section > h2, #contents.performance .portfolio header p, #recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1, #recruit .container .board .empty p, .recruit .container .board .empty p, #contents.crList .tabTarget .empty p, #contents.pressList > .list .empty p, #contents.performanceList > .list .empty p, #contents.research .list .empty p, #recruit .container .board .jobOpeningList a p, .recruit .container .board .jobOpeningList a p, #contents.crList .tabTarget .jobOpeningList a p, #contents.pressList > .list .jobOpeningList a p, #contents.performanceList > .list .jobOpeningList a p, #contents.research .list .jobOpeningList a p, #detailContents.portfolioDetail .detailContainer > section .detail .summary, #contents.develop .detailContainer > section .detail .summary, #detailContents.pressDetail .detail .summary, .popup > div .full > p:not(.case).big, #contents.pressList > section h1, #contents.groupBd .recommend h1, #detailContents.portfolioDetail .recommend h1, #detailContents.pressDetail .recommend h1 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div .swiper strong, .recruit .loginWrap .joinInfo > div .swiper strong, #recruit .container #inquiry h2, .recruit .container #inquiry h2, #recruit .container .list > li > p, .recruit .container .list > li > p, #contents.crDetail > section > header .cover em, #contents.historyCenter .book > div p, #contents.cibi > section h1,
  #contents.ci > section h1, #contents.pressList .newsCollect > div .swiper button p, #contents.pressList .newsPick > div li .detail em, #contents.performance .performanceInfo.enc + section > header h1, #contents.develop .processSwipe .swiper .swiper-wrapper > li em, #contents.home .performanceList > div li .detail em, #recruit .selectjob .form .application > section > header h1, .recruit .selectjob .form .application > section > header h1, #recruit .form > section > header h1, .recruit .form > section > header h1, #recruit .container #inquiry form.inquiry > section > header h1, .recruit .container #inquiry form.inquiry > section > header h1, #contents.contact .inquiry > section > header h1, #contents.research .application > section > header h1,
  #recruit .selectjob .form .application > section > h1,
  .recruit .selectjob .form .application > section > h1,
  #recruit .form > section > h1,
  .recruit .form > section > h1,
  #recruit .container #inquiry form.inquiry > section > h1,
  .recruit .container #inquiry form.inquiry > section > h1,
  #contents.contact .inquiry > section > h1,
  #contents.research .application > section > h1,
  #recruit .selectjob .form .application > section > header h2,
  .recruit .selectjob .form .application > section > header h2,
  #recruit .form > section > header h2,
  .recruit .form > section > header h2,
  #recruit .container #inquiry form.inquiry > section > header h2,
  .recruit .container #inquiry form.inquiry > section > header h2,
  #contents.contact .inquiry > section > header h2,
  #contents.research .application > section > header h2,
  #recruit .selectjob .form .application > section > h2,
  .recruit .selectjob .form .application > section > h2,
  #recruit .form > section > h2,
  .recruit .form > section > h2,
  #recruit .container #inquiry form.inquiry > section > h2,
  .recruit .container #inquiry form.inquiry > section > h2,
  #contents.contact .inquiry > section > h2,
  #contents.research .application > section > h2, #contents.performance .portfolio header p, #recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1, #recruit .container .board .empty p, .recruit .container .board .empty p, #contents.crList .tabTarget .empty p, #contents.pressList > .list .empty p, #contents.performanceList > .list .empty p, #contents.research .list .empty p, #recruit .container .board .jobOpeningList a p, .recruit .container .board .jobOpeningList a p, #contents.crList .tabTarget .jobOpeningList a p, #contents.pressList > .list .jobOpeningList a p, #contents.performanceList > .list .jobOpeningList a p, #contents.research .list .jobOpeningList a p, #detailContents.portfolioDetail .detailContainer > section .detail .summary, #contents.develop .detailContainer > section .detail .summary, #detailContents.pressDetail .detail .summary, .popup > div .full > p:not(.case).big, #contents.pressList > section h1, #contents.groupBd .recommend h1, #detailContents.portfolioDetail .recommend h1, #detailContents.pressDetail .recommend h1 {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
}

@media (min-width: 1025px) {
  #contents.performance .performanceInfo.case, #recruit .container .board .downloadList > a p, .recruit .container .board .downloadList > a p, #contents.crList .tabTarget .downloadList > a p, #contents.pressList > .list .downloadList > a p, #contents.performanceList > .list .downloadList > a p, #contents.research .list .downloadList > a p,
  #recruit .container .board .downloadList > li p,
  .recruit .container .board .downloadList > li p,
  #contents.crList .tabTarget .downloadList > li p,
  #contents.pressList > .list .downloadList > li p,
  #contents.performanceList > .list .downloadList > li p,
  #contents.research .list .downloadList > li p,
  #recruit .container .board .listTextMode > a p,
  .recruit .container .board .listTextMode > a p,
  #contents.crList .tabTarget .listTextMode > a p,
  #contents.pressList > .list .listTextMode > a p,
  #contents.performanceList > .list .listTextMode > a p,
  #contents.research .list .listTextMode > a p,
  #recruit .container .board .listTextMode > li p,
  .recruit .container .board .listTextMode > li p,
  #contents.crList .tabTarget .listTextMode > li p,
  #contents.pressList > .list .listTextMode > li p,
  #contents.performanceList > .list .listTextMode > li p,
  #contents.research .list .listTextMode > li p, .textMode.active ~ .list > a p,
  .textMode.active ~ .list > li p {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.case, #recruit .container .board .downloadList > a p, .recruit .container .board .downloadList > a p, #contents.crList .tabTarget .downloadList > a p, #contents.pressList > .list .downloadList > a p, #contents.performanceList > .list .downloadList > a p, #contents.research .list .downloadList > a p,
  #recruit .container .board .downloadList > li p,
  .recruit .container .board .downloadList > li p,
  #contents.crList .tabTarget .downloadList > li p,
  #contents.pressList > .list .downloadList > li p,
  #contents.performanceList > .list .downloadList > li p,
  #contents.research .list .downloadList > li p,
  #recruit .container .board .listTextMode > a p,
  .recruit .container .board .listTextMode > a p,
  #contents.crList .tabTarget .listTextMode > a p,
  #contents.pressList > .list .listTextMode > a p,
  #contents.performanceList > .list .listTextMode > a p,
  #contents.research .list .listTextMode > a p,
  #recruit .container .board .listTextMode > li p,
  .recruit .container .board .listTextMode > li p,
  #contents.crList .tabTarget .listTextMode > li p,
  #contents.pressList > .list .listTextMode > li p,
  #contents.performanceList > .list .listTextMode > li p,
  #contents.research .list .listTextMode > li p, .textMode.active ~ .list > a p,
  .textMode.active ~ .list > li p {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}

@media (min-width: 1025px) {
  #contents.recruitInfo .recruitList a strong, #recruit .find.result > div p,
  #recruit .join.result > div p,
  #recruit .complete.result > div p, .recruit .find.result > div p,
  .recruit .join.result > div p,
  .recruit .complete.result > div p, #contents.crDetail > section .department h1 {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #contents.recruitInfo .recruitList a strong, #recruit .find.result > div p,
  #recruit .join.result > div p,
  #recruit .complete.result > div p, .recruit .find.result > div p,
  .recruit .join.result > div p,
  .recruit .complete.result > div p, #contents.crDetail > section .department h1 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
}

@media (min-width: 1025px) {
  #recruit .join h3, .recruit .join h3, #recruit .find.result > div.logout.case > strong,
  #recruit .join.result > div.logout.case > strong,
  #recruit .complete.result > div.logout.case > strong, .recruit .find.result > div.logout.case > strong,
  .recruit .join.result > div.logout.case > strong,
  .recruit .complete.result > div.logout.case > strong, #recruit .find.result > div.withdrawal,
  #recruit .join.result > div.withdrawal,
  #recruit .complete.result > div.withdrawal, .recruit .find.result > div.withdrawal,
  .recruit .join.result > div.withdrawal,
  .recruit .complete.result > div.withdrawal, #contents.develop .detailContainer .accordionWrapper button, #contents.develop .detailContainer .accordionWrapper h2, #contents.develop .detailContainer dt, #recruit .container .myinfoInfo p, .recruit .container .myinfoInfo p, #contents.contact .info p, #detailContents.pressDetail .info p, #contents.brochure .downloadInfo > div > p span, #contents.research .downloadInfo > div > p span,
  #contents.brochure .downloadInfo > div > div span,
  #contents.research .downloadInfo > div > div span, .popup > div .full .info h2 {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #recruit .join h3, .recruit .join h3, #recruit .find.result > div.logout.case > strong,
  #recruit .join.result > div.logout.case > strong,
  #recruit .complete.result > div.logout.case > strong, .recruit .find.result > div.logout.case > strong,
  .recruit .join.result > div.logout.case > strong,
  .recruit .complete.result > div.logout.case > strong, #recruit .find.result > div.withdrawal,
  #recruit .join.result > div.withdrawal,
  #recruit .complete.result > div.withdrawal, .recruit .find.result > div.withdrawal,
  .recruit .join.result > div.withdrawal,
  .recruit .complete.result > div.withdrawal, #contents.develop .detailContainer .accordionWrapper button, #contents.develop .detailContainer .accordionWrapper h2, #contents.develop .detailContainer dt, #recruit .container .myinfoInfo p, .recruit .container .myinfoInfo p, #contents.contact .info p, #detailContents.pressDetail .info p, #contents.brochure .downloadInfo > div > p span, #contents.research .downloadInfo > div > p span,
  #contents.brochure .downloadInfo > div > div span,
  #contents.research .downloadInfo > div > div span, .popup > div .full .info h2 {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}

@media (min-width: 1025px) {
  #contents.groupBd .ongoing ul, #contents.groupBd .ongoing p, #contents.groupBd .ongoing h3, #recruit .find.result > p,
  #recruit .join.result > p,
  #recruit .complete.result > p, .recruit .find.result > p,
  .recruit .join.result > p,
  .recruit .complete.result > p, #recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button, #contents.crDetail > section dl.info dt, #contents.crDetail > section > header .utility dl, #contents.crList .sort .selectBox > button, #detailContents.portfolioDetail .progressCalendar .performance header p, #contents.home .banner > section h1, #contents.home .banner > section:last-of-type p, #contents.home .banner > div.case p, #contents.brochure .downloadInfo > div > p .choose, #contents.research .downloadInfo > div > p .choose,
  #contents.brochure .downloadInfo > div > div .choose,
  #contents.research .downloadInfo > div > div .choose, #recruit .container .board .recommend > a p, .recruit .container .board .recommend > a p, #contents.crList .tabTarget .recommend > a p, #contents.pressList > .list .recommend > a p, #contents.performanceList > .list .recommend > a p, #contents.research .list .recommend > a p, #recruit .container .board .recommend > a .subjectLink, .recruit .container .board .recommend > a .subjectLink, #contents.crList .tabTarget .recommend > a .subjectLink, #contents.pressList > .list .recommend > a .subjectLink, #contents.performanceList > .list .recommend > a .subjectLink, #contents.research .list .recommend > a .subjectLink, #recruit .container .board .recommend .swiper-slide p, .recruit .container .board .recommend .swiper-slide p, #contents.crList .tabTarget .recommend .swiper-slide p, #contents.pressList > .list .recommend .swiper-slide p, #contents.performanceList > .list .recommend .swiper-slide p, #contents.research .list .recommend .swiper-slide p, #recruit .container .board .recommend .swiper-slide .subjectLink, .recruit .container .board .recommend .swiper-slide .subjectLink, #contents.crList .tabTarget .recommend .swiper-slide .subjectLink, #contents.pressList > .list .recommend .swiper-slide .subjectLink, #contents.performanceList > .list .recommend .swiper-slide .subjectLink, #contents.research .list .recommend .swiper-slide .subjectLink, .thumbMode.active ~ .list > a p, .thumbMode.active ~ .list > a .subjectLink, .thumbMode.active ~ .list .swiper-slide p, .thumbMode.active ~ .list .swiper-slide .subjectLink, .error404 section p, .popup > div .full.joinComplete dl, #contents.hr .tab ul, #recruit .container .tab ul, .recruit .container .tab ul, #contents.crList .tab ul, #contents.location .tab ul, #contents.history .historyTab ul, #contents.cibi .tab ul,
  #contents.ci .tab ul, #contents.statusList .tab ul, #contents.performance .tab ul, #contents.research .tab ul {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    line-height: 32px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing ul, #contents.groupBd .ongoing p, #contents.groupBd .ongoing h3, #recruit .find.result > p,
  #recruit .join.result > p,
  #recruit .complete.result > p, .recruit .find.result > p,
  .recruit .join.result > p,
  .recruit .complete.result > p, #recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button, #contents.crDetail > section dl.info dt, #contents.crDetail > section > header .utility dl, #contents.crList .sort .selectBox > button, #detailContents.portfolioDetail .progressCalendar .performance header p, #contents.home .banner > section h1, #contents.home .banner > section:last-of-type p, #contents.home .banner > div.case p, #contents.brochure .downloadInfo > div > p .choose, #contents.research .downloadInfo > div > p .choose,
  #contents.brochure .downloadInfo > div > div .choose,
  #contents.research .downloadInfo > div > div .choose, #recruit .container .board .recommend > a p, .recruit .container .board .recommend > a p, #contents.crList .tabTarget .recommend > a p, #contents.pressList > .list .recommend > a p, #contents.performanceList > .list .recommend > a p, #contents.research .list .recommend > a p, #recruit .container .board .recommend > a .subjectLink, .recruit .container .board .recommend > a .subjectLink, #contents.crList .tabTarget .recommend > a .subjectLink, #contents.pressList > .list .recommend > a .subjectLink, #contents.performanceList > .list .recommend > a .subjectLink, #contents.research .list .recommend > a .subjectLink, #recruit .container .board .recommend .swiper-slide p, .recruit .container .board .recommend .swiper-slide p, #contents.crList .tabTarget .recommend .swiper-slide p, #contents.pressList > .list .recommend .swiper-slide p, #contents.performanceList > .list .recommend .swiper-slide p, #contents.research .list .recommend .swiper-slide p, #recruit .container .board .recommend .swiper-slide .subjectLink, .recruit .container .board .recommend .swiper-slide .subjectLink, #contents.crList .tabTarget .recommend .swiper-slide .subjectLink, #contents.pressList > .list .recommend .swiper-slide .subjectLink, #contents.performanceList > .list .recommend .swiper-slide .subjectLink, #contents.research .list .recommend .swiper-slide .subjectLink, .thumbMode.active ~ .list > a p, .thumbMode.active ~ .list > a .subjectLink, .thumbMode.active ~ .list .swiper-slide p, .thumbMode.active ~ .list .swiper-slide .subjectLink, .error404 section p, .popup > div .full.joinComplete dl, #contents.hr .tab ul, #recruit .container .tab ul, .recruit .container .tab ul, #contents.crList .tab ul, #contents.location .tab ul, #contents.history .historyTab ul, #contents.cibi .tab ul,
  #contents.ci .tab ul, #contents.statusList .tab ul, #contents.performance .tab ul, #contents.research .tab ul {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}

@media (min-width: 1025px) {
  #contents.groupBd .intro > p, #contents.groupGr .intro > p, #recruit .find h2 + p,
  #recruit .join h2 + p,
  #recruit .complete h2 + p, .recruit .find h2 + p,
  .recruit .join h2 + p,
  .recruit .complete h2 + p, .historyContainer .content ul li,
  .awardContainer .content ul li, #detailContents.portfolioDetail > header .percent button, #contents.performance .performanceInfo > small, #contents.develop .detailContainer .logos li span, #contents.develop .process p, #contents.home .performance ul li p, .preview > section > div > header h2 small, .popup > div .terms .termsContents h1 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    line-height: 32px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro > p, #contents.groupGr .intro > p, #recruit .find h2 + p,
  #recruit .join h2 + p,
  #recruit .complete h2 + p, .recruit .find h2 + p,
  .recruit .join h2 + p,
  .recruit .complete h2 + p, .historyContainer .content ul li,
  .awardContainer .content ul li, #detailContents.portfolioDetail > header .percent button, #contents.performance .performanceInfo > small, #contents.develop .detailContainer .logos li span, #contents.develop .process p, #contents.home .performance ul li p, .preview > section > div > header h2 small, .popup > div .terms .termsContents h1 {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
  }
}

#contents.groupBd .intro .info p, #contents.groupGr .intro .info p, #contents.groupBd .headline ul .summary p, #contents.groupBd .recommend .swiperContainer .swiper-slide p, #contents.groupSt .developer header p, #contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn, #contents.groupSt .value section.swiper-slide .imgWrapper > p, #contents.groupSt .challenge section p, #contents.groupSt > section header:not(.case) p, #contents.groupSt section.swiper-slide header:not(.case) p, #contents.groupSt > section header:not(.case) h1, #contents.groupSt section.swiper-slide header:not(.case) h1, #contents.recruitInfo .recruitList a p, #contents.jobinfo .collapse li, #recruit .join .phoneCertify > strong, .recruit .join .phoneCertify > strong, #recruit .join .phoneCertify p strong, .recruit .join .phoneCertify p strong, #recruit .completeBox dl, .recruit .completeBox dl, #recruit .find.result > div.logout > button,
#recruit .join.result > div.logout > button,
#recruit .complete.result > div.logout > button, .recruit .find.result > div.logout > button,
.recruit .join.result > div.logout > button,
.recruit .complete.result > div.logout > button, #recruit .find form label:not(.check) span,
#recruit .find form .label span, #recruit .find .completeBox label:not(.check) span,
#recruit .find .completeBox .label span,
#recruit .join form label:not(.check) span,
#recruit .join form .label span,
#recruit .join .completeBox label:not(.check) span,
#recruit .join .completeBox .label span,
#recruit .complete form label:not(.check) span,
#recruit .complete form .label span,
#recruit .complete .completeBox label:not(.check) span,
#recruit .complete .completeBox .label span, .recruit .find form label:not(.check) span,
.recruit .find form .label span, .recruit .find .completeBox label:not(.check) span,
.recruit .find .completeBox .label span,
.recruit .join form label:not(.check) span,
.recruit .join form .label span,
.recruit .join .completeBox label:not(.check) span,
.recruit .join .completeBox .label span,
.recruit .complete form label:not(.check) span,
.recruit .complete form .label span,
.recruit .complete .completeBox label:not(.check) span,
.recruit .complete .completeBox .label span, #recruit .loginWrap .joinInfo > div .swiper p, .recruit .loginWrap .joinInfo > div .swiper p, #recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p, #recruit .loginWrap .login form label span, .recruit .loginWrap .login form label span, #recruit .selectjob .form .application div.case1 .label,
#recruit .selectjob .form .application div.case2 .label, .recruit .selectjob .form .application div.case1 .label,
.recruit .selectjob .form .application div.case2 .label, #recruit .container #faq ul li, .recruit .container #faq ul li, #contents.historyCenter .historyTab section p, #contents.historyCenter .historyTab nav, #detailContents.portfolioDetail .progressCalendar .performance header h2,
#detailContents.portfolioDetail .progressCalendar .performance header ul, #detailContents.portfolioDetail .progressCalendar .performance header div, #detailContents.portfolioDetail .overview, #detailContents.portfolioDetail > header .detailInfo, #contents.statusList > .list .list a:not(.btn) dl,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl, #contents.performance .headline .summary p, #contents.develop .detailContainer .accordionWrapper li div, #contents.develop .detailContainer .accordionWrapper button span, #contents.develop .detailContainer .developSwiper li p, #contents.develop .detailContainer dd, #contents.develop .processSwipe .swiper .swiper-wrapper > li ul, #contents.develop .overview > ul li span, #groupHeader .menu section ul, #recruit .selectjob .form .application > section > label, .recruit .selectjob .form .application > section > label, #recruit .form > section > label, .recruit .form > section > label, #recruit .container #inquiry form.inquiry > section > label, .recruit .container #inquiry form.inquiry > section > label, #contents.contact .inquiry > section > label, #contents.research .application > section > label, #recruit .selectjob .form .application > section > .label, .recruit .selectjob .form .application > section > .label, #recruit .form > section > .label, .recruit .form > section > .label, #recruit .container #inquiry form.inquiry > section > .label, .recruit .container #inquiry form.inquiry > section > .label, #contents.contact .inquiry > section > .label, #contents.research .application > section > .label,
#recruit .selectjob .form .application > section .half > label,
.recruit .selectjob .form .application > section .half > label,
#recruit .form > section .half > label,
.recruit .form > section .half > label,
#recruit .container #inquiry form.inquiry > section .half > label,
.recruit .container #inquiry form.inquiry > section .half > label,
#contents.contact .inquiry > section .half > label,
#contents.research .application > section .half > label, #recruit .selectjob .form .application > section .half > .label, .recruit .selectjob .form .application > section .half > .label, #recruit .form > section .half > .label, .recruit .form > section .half > .label, #recruit .container #inquiry form.inquiry > section .half > .label, .recruit .container #inquiry form.inquiry > section .half > .label, #contents.contact .inquiry > section .half > .label, #contents.research .application > section .half > .label,
#recruit .selectjob .form .application > section .clear > label,
.recruit .selectjob .form .application > section .clear > label,
#recruit .form > section .clear > label,
.recruit .form > section .clear > label,
#recruit .container #inquiry form.inquiry > section .clear > label,
.recruit .container #inquiry form.inquiry > section .clear > label,
#contents.contact .inquiry > section .clear > label,
#contents.research .application > section .clear > label, #recruit .selectjob .form .application > section .clear > .label, .recruit .selectjob .form .application > section .clear > .label, #recruit .form > section .clear > .label, .recruit .form > section .clear > .label, #recruit .container #inquiry form.inquiry > section .clear > .label, .recruit .container #inquiry form.inquiry > section .clear > .label, #contents.contact .inquiry > section .clear > .label, #contents.research .application > section .clear > .label, #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl, #recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span, #recruit .container .myinfoInfo > ul li small, .recruit .container .myinfoInfo > ul li small, #contents.contact .info > ul li small, #detailContents.pressDetail .info > ul li small, #contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
#contents.brochure .downloadInfo > div > div p,
#contents.research .downloadInfo > div > div p, #detailContents.pressDetail > header .utility > span, #detailContents.portfolioDetail .detailContainer > section .detail, #contents.develop .detailContainer > section .detail, #detailContents.pressDetail .detail, .popup > div .terms .termsContents h2, .popup > div .full.joinComplete .info ul, .popup > div .full .bullet, .popup > div .full .result h1, .popup > div .full > p.case, .popup > div .full > label span {
  color: #666;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro .info p, #contents.groupGr .intro .info p, #contents.groupBd .headline ul .summary p, #contents.groupBd .recommend .swiperContainer .swiper-slide p, #contents.groupSt .developer header p, #contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn, #contents.groupSt .value section.swiper-slide .imgWrapper > p, #contents.groupSt .challenge section p, #contents.groupSt > section header:not(.case) p, #contents.groupSt section.swiper-slide header:not(.case) p, #contents.groupSt > section header:not(.case) h1, #contents.groupSt section.swiper-slide header:not(.case) h1, #contents.recruitInfo .recruitList a p, #contents.jobinfo .collapse li, #recruit .join .phoneCertify > strong, .recruit .join .phoneCertify > strong, #recruit .join .phoneCertify p strong, .recruit .join .phoneCertify p strong, #recruit .completeBox dl, .recruit .completeBox dl, #recruit .find.result > div.logout > button,
  #recruit .join.result > div.logout > button,
  #recruit .complete.result > div.logout > button, .recruit .find.result > div.logout > button,
  .recruit .join.result > div.logout > button,
  .recruit .complete.result > div.logout > button, #recruit .find form label:not(.check) span,
  #recruit .find form .label span, #recruit .find .completeBox label:not(.check) span,
  #recruit .find .completeBox .label span,
  #recruit .join form label:not(.check) span,
  #recruit .join form .label span,
  #recruit .join .completeBox label:not(.check) span,
  #recruit .join .completeBox .label span,
  #recruit .complete form label:not(.check) span,
  #recruit .complete form .label span,
  #recruit .complete .completeBox label:not(.check) span,
  #recruit .complete .completeBox .label span, .recruit .find form label:not(.check) span,
  .recruit .find form .label span, .recruit .find .completeBox label:not(.check) span,
  .recruit .find .completeBox .label span,
  .recruit .join form label:not(.check) span,
  .recruit .join form .label span,
  .recruit .join .completeBox label:not(.check) span,
  .recruit .join .completeBox .label span,
  .recruit .complete form label:not(.check) span,
  .recruit .complete form .label span,
  .recruit .complete .completeBox label:not(.check) span,
  .recruit .complete .completeBox .label span, #recruit .loginWrap .joinInfo > div .swiper p, .recruit .loginWrap .joinInfo > div .swiper p, #recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p, #recruit .loginWrap .login form label span, .recruit .loginWrap .login form label span, #recruit .selectjob .form .application div.case1 .label,
  #recruit .selectjob .form .application div.case2 .label, .recruit .selectjob .form .application div.case1 .label,
  .recruit .selectjob .form .application div.case2 .label, #recruit .container #faq ul li, .recruit .container #faq ul li, #contents.historyCenter .historyTab section p, #contents.historyCenter .historyTab nav, #detailContents.portfolioDetail .progressCalendar .performance header h2,
  #detailContents.portfolioDetail .progressCalendar .performance header ul, #detailContents.portfolioDetail .progressCalendar .performance header div, #detailContents.portfolioDetail .overview, #detailContents.portfolioDetail > header .detailInfo, #contents.statusList > .list .list a:not(.btn) dl,
  #contents.statusList .tabTarget > .list .list a:not(.btn) dl, #contents.performance .headline .summary p, #contents.develop .detailContainer .accordionWrapper li div, #contents.develop .detailContainer .accordionWrapper button span, #contents.develop .detailContainer .developSwiper li p, #contents.develop .detailContainer dd, #contents.develop .processSwipe .swiper .swiper-wrapper > li ul, #contents.develop .overview > ul li span, #groupHeader .menu section ul, #recruit .selectjob .form .application > section > label, .recruit .selectjob .form .application > section > label, #recruit .form > section > label, .recruit .form > section > label, #recruit .container #inquiry form.inquiry > section > label, .recruit .container #inquiry form.inquiry > section > label, #contents.contact .inquiry > section > label, #contents.research .application > section > label, #recruit .selectjob .form .application > section > .label, .recruit .selectjob .form .application > section > .label, #recruit .form > section > .label, .recruit .form > section > .label, #recruit .container #inquiry form.inquiry > section > .label, .recruit .container #inquiry form.inquiry > section > .label, #contents.contact .inquiry > section > .label, #contents.research .application > section > .label,
  #recruit .selectjob .form .application > section .half > label,
  .recruit .selectjob .form .application > section .half > label,
  #recruit .form > section .half > label,
  .recruit .form > section .half > label,
  #recruit .container #inquiry form.inquiry > section .half > label,
  .recruit .container #inquiry form.inquiry > section .half > label,
  #contents.contact .inquiry > section .half > label,
  #contents.research .application > section .half > label, #recruit .selectjob .form .application > section .half > .label, .recruit .selectjob .form .application > section .half > .label, #recruit .form > section .half > .label, .recruit .form > section .half > .label, #recruit .container #inquiry form.inquiry > section .half > .label, .recruit .container #inquiry form.inquiry > section .half > .label, #contents.contact .inquiry > section .half > .label, #contents.research .application > section .half > .label,
  #recruit .selectjob .form .application > section .clear > label,
  .recruit .selectjob .form .application > section .clear > label,
  #recruit .form > section .clear > label,
  .recruit .form > section .clear > label,
  #recruit .container #inquiry form.inquiry > section .clear > label,
  .recruit .container #inquiry form.inquiry > section .clear > label,
  #contents.contact .inquiry > section .clear > label,
  #contents.research .application > section .clear > label, #recruit .selectjob .form .application > section .clear > .label, .recruit .selectjob .form .application > section .clear > .label, #recruit .form > section .clear > .label, .recruit .form > section .clear > .label, #recruit .container #inquiry form.inquiry > section .clear > .label, .recruit .container #inquiry form.inquiry > section .clear > .label, #contents.contact .inquiry > section .clear > .label, #contents.research .application > section .clear > .label, #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl, #recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span, #recruit .container .myinfoInfo > ul li small, .recruit .container .myinfoInfo > ul li small, #contents.contact .info > ul li small, #detailContents.pressDetail .info > ul li small, #contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
  #contents.brochure .downloadInfo > div > div p,
  #contents.research .downloadInfo > div > div p, #detailContents.pressDetail > header .utility > span, #detailContents.portfolioDetail .detailContainer > section .detail, #contents.develop .detailContainer > section .detail, #detailContents.pressDetail .detail, .popup > div .terms .termsContents h2, .popup > div .full.joinComplete .info ul, .popup > div .full .bullet, .popup > div .full .result h1, .popup > div .full > p.case, .popup > div .full > label span {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
    line-height: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro .info p, #contents.groupGr .intro .info p, #contents.groupBd .headline ul .summary p, #contents.groupBd .recommend .swiperContainer .swiper-slide p, #contents.groupSt .developer header p, #contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn, #contents.groupSt .value section.swiper-slide .imgWrapper > p, #contents.groupSt .challenge section p, #contents.groupSt > section header:not(.case) p, #contents.groupSt section.swiper-slide header:not(.case) p, #contents.groupSt > section header:not(.case) h1, #contents.groupSt section.swiper-slide header:not(.case) h1, #contents.recruitInfo .recruitList a p, #contents.jobinfo .collapse li, #recruit .join .phoneCertify > strong, .recruit .join .phoneCertify > strong, #recruit .join .phoneCertify p strong, .recruit .join .phoneCertify p strong, #recruit .completeBox dl, .recruit .completeBox dl, #recruit .find.result > div.logout > button,
  #recruit .join.result > div.logout > button,
  #recruit .complete.result > div.logout > button, .recruit .find.result > div.logout > button,
  .recruit .join.result > div.logout > button,
  .recruit .complete.result > div.logout > button, #recruit .find form label:not(.check) span,
  #recruit .find form .label span, #recruit .find .completeBox label:not(.check) span,
  #recruit .find .completeBox .label span,
  #recruit .join form label:not(.check) span,
  #recruit .join form .label span,
  #recruit .join .completeBox label:not(.check) span,
  #recruit .join .completeBox .label span,
  #recruit .complete form label:not(.check) span,
  #recruit .complete form .label span,
  #recruit .complete .completeBox label:not(.check) span,
  #recruit .complete .completeBox .label span, .recruit .find form label:not(.check) span,
  .recruit .find form .label span, .recruit .find .completeBox label:not(.check) span,
  .recruit .find .completeBox .label span,
  .recruit .join form label:not(.check) span,
  .recruit .join form .label span,
  .recruit .join .completeBox label:not(.check) span,
  .recruit .join .completeBox .label span,
  .recruit .complete form label:not(.check) span,
  .recruit .complete form .label span,
  .recruit .complete .completeBox label:not(.check) span,
  .recruit .complete .completeBox .label span, #recruit .loginWrap .joinInfo > div .swiper p, .recruit .loginWrap .joinInfo > div .swiper p, #recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p, #recruit .loginWrap .login form label span, .recruit .loginWrap .login form label span, #recruit .selectjob .form .application div.case1 .label,
  #recruit .selectjob .form .application div.case2 .label, .recruit .selectjob .form .application div.case1 .label,
  .recruit .selectjob .form .application div.case2 .label, #recruit .container #faq ul li, .recruit .container #faq ul li, #contents.historyCenter .historyTab section p, #contents.historyCenter .historyTab nav, #detailContents.portfolioDetail .progressCalendar .performance header h2,
  #detailContents.portfolioDetail .progressCalendar .performance header ul, #detailContents.portfolioDetail .progressCalendar .performance header div, #detailContents.portfolioDetail .overview, #detailContents.portfolioDetail > header .detailInfo, #contents.statusList > .list .list a:not(.btn) dl,
  #contents.statusList .tabTarget > .list .list a:not(.btn) dl, #contents.performance .headline .summary p, #contents.develop .detailContainer .accordionWrapper li div, #contents.develop .detailContainer .accordionWrapper button span, #contents.develop .detailContainer .developSwiper li p, #contents.develop .detailContainer dd, #contents.develop .processSwipe .swiper .swiper-wrapper > li ul, #contents.develop .overview > ul li span, #groupHeader .menu section ul, #recruit .selectjob .form .application > section > label, .recruit .selectjob .form .application > section > label, #recruit .form > section > label, .recruit .form > section > label, #recruit .container #inquiry form.inquiry > section > label, .recruit .container #inquiry form.inquiry > section > label, #contents.contact .inquiry > section > label, #contents.research .application > section > label, #recruit .selectjob .form .application > section > .label, .recruit .selectjob .form .application > section > .label, #recruit .form > section > .label, .recruit .form > section > .label, #recruit .container #inquiry form.inquiry > section > .label, .recruit .container #inquiry form.inquiry > section > .label, #contents.contact .inquiry > section > .label, #contents.research .application > section > .label,
  #recruit .selectjob .form .application > section .half > label,
  .recruit .selectjob .form .application > section .half > label,
  #recruit .form > section .half > label,
  .recruit .form > section .half > label,
  #recruit .container #inquiry form.inquiry > section .half > label,
  .recruit .container #inquiry form.inquiry > section .half > label,
  #contents.contact .inquiry > section .half > label,
  #contents.research .application > section .half > label, #recruit .selectjob .form .application > section .half > .label, .recruit .selectjob .form .application > section .half > .label, #recruit .form > section .half > .label, .recruit .form > section .half > .label, #recruit .container #inquiry form.inquiry > section .half > .label, .recruit .container #inquiry form.inquiry > section .half > .label, #contents.contact .inquiry > section .half > .label, #contents.research .application > section .half > .label,
  #recruit .selectjob .form .application > section .clear > label,
  .recruit .selectjob .form .application > section .clear > label,
  #recruit .form > section .clear > label,
  .recruit .form > section .clear > label,
  #recruit .container #inquiry form.inquiry > section .clear > label,
  .recruit .container #inquiry form.inquiry > section .clear > label,
  #contents.contact .inquiry > section .clear > label,
  #contents.research .application > section .clear > label, #recruit .selectjob .form .application > section .clear > .label, .recruit .selectjob .form .application > section .clear > .label, #recruit .form > section .clear > .label, .recruit .form > section .clear > .label, #recruit .container #inquiry form.inquiry > section .clear > .label, .recruit .container #inquiry form.inquiry > section .clear > .label, #contents.contact .inquiry > section .clear > .label, #contents.research .application > section .clear > .label, #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl, #recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span, #recruit .container .myinfoInfo > ul li small, .recruit .container .myinfoInfo > ul li small, #contents.contact .info > ul li small, #detailContents.pressDetail .info > ul li small, #contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
  #contents.brochure .downloadInfo > div > div p,
  #contents.research .downloadInfo > div > div p, #detailContents.pressDetail > header .utility > span, #detailContents.portfolioDetail .detailContainer > section .detail, #contents.develop .detailContainer > section .detail, #detailContents.pressDetail .detail, .popup > div .terms .termsContents h2, .popup > div .full.joinComplete .info ul, .popup > div .full .bullet, .popup > div .full .result h1, .popup > div .full > p.case, .popup > div .full > label span {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
  }
}

#contents.groupBd .intro .info p span, #contents.groupGr .intro .info p span, #contents.groupBd .headline ul .summary span, #recruit .applicationBtn p, .recruit .applicationBtn p, #recruit .join .phoneCertify p, .recruit .join .phoneCertify p, #recruit .find.result > div dl,
#recruit .join.result > div dl,
#recruit .complete.result > div dl, .recruit .find.result > div dl,
.recruit .join.result > div dl,
.recruit .complete.result > div dl, #recruit .find.result > div span,
#recruit .join.result > div span,
#recruit .complete.result > div span, .recruit .find.result > div span,
.recruit .join.result > div span,
.recruit .complete.result > div span, #recruit .find form label:not(.check).email .selectBox > div,
#recruit .find form .label.email .selectBox > div, #recruit .find .completeBox label:not(.check).email .selectBox > div,
#recruit .find .completeBox .label.email .selectBox > div,
#recruit .join form label:not(.check).email .selectBox > div,
#recruit .join form .label.email .selectBox > div,
#recruit .join .completeBox label:not(.check).email .selectBox > div,
#recruit .join .completeBox .label.email .selectBox > div,
#recruit .complete form label:not(.check).email .selectBox > div,
#recruit .complete form .label.email .selectBox > div,
#recruit .complete .completeBox label:not(.check).email .selectBox > div,
#recruit .complete .completeBox .label.email .selectBox > div, .recruit .find form label:not(.check).email .selectBox > div,
.recruit .find form .label.email .selectBox > div, .recruit .find .completeBox label:not(.check).email .selectBox > div,
.recruit .find .completeBox .label.email .selectBox > div,
.recruit .join form label:not(.check).email .selectBox > div,
.recruit .join form .label.email .selectBox > div,
.recruit .join .completeBox label:not(.check).email .selectBox > div,
.recruit .join .completeBox .label.email .selectBox > div,
.recruit .complete form label:not(.check).email .selectBox > div,
.recruit .complete form .label.email .selectBox > div,
.recruit .complete .completeBox label:not(.check).email .selectBox > div,
.recruit .complete .completeBox .label.email .selectBox > div, #recruit .find form label:not(.check).email .selectBox > button,
#recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
#recruit .find .completeBox .label.email .selectBox > button,
#recruit .join form label:not(.check).email .selectBox > button,
#recruit .join form .label.email .selectBox > button,
#recruit .join .completeBox label:not(.check).email .selectBox > button,
#recruit .join .completeBox .label.email .selectBox > button,
#recruit .complete form label:not(.check).email .selectBox > button,
#recruit .complete form .label.email .selectBox > button,
#recruit .complete .completeBox label:not(.check).email .selectBox > button,
#recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
.recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
.recruit .find .completeBox .label.email .selectBox > button,
.recruit .join form label:not(.check).email .selectBox > button,
.recruit .join form .label.email .selectBox > button,
.recruit .join .completeBox label:not(.check).email .selectBox > button,
.recruit .join .completeBox .label.email .selectBox > button,
.recruit .complete form label:not(.check).email .selectBox > button,
.recruit .complete form .label.email .selectBox > button,
.recruit .complete .completeBox label:not(.check).email .selectBox > button,
.recruit .complete .completeBox .label.email .selectBox > button, #recruit .find form label:not(.check).phone div button,
#recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
#recruit .find .completeBox .label.phone div button,
#recruit .join form label:not(.check).phone div button,
#recruit .join form .label.phone div button,
#recruit .join .completeBox label:not(.check).phone div button,
#recruit .join .completeBox .label.phone div button,
#recruit .complete form label:not(.check).phone div button,
#recruit .complete form .label.phone div button,
#recruit .complete .completeBox label:not(.check).phone div button,
#recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
.recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
.recruit .find .completeBox .label.phone div button,
.recruit .join form label:not(.check).phone div button,
.recruit .join form .label.phone div button,
.recruit .join .completeBox label:not(.check).phone div button,
.recruit .join .completeBox .label.phone div button,
.recruit .complete form label:not(.check).phone div button,
.recruit .complete form .label.phone div button,
.recruit .complete .completeBox label:not(.check).phone div button,
.recruit .complete .completeBox .label.phone div button, #recruit .find form .required, #recruit .find .completeBox .required,
#recruit .join form .required,
#recruit .join .completeBox .required,
#recruit .complete form .required,
#recruit .complete .completeBox .required, .recruit .find form .required, .recruit .find .completeBox .required,
.recruit .join form .required,
.recruit .join .completeBox .required,
.recruit .complete form .required,
.recruit .complete .completeBox .required, #recruit .find h2 + p + p,
#recruit .join h2 + p + p,
#recruit .complete h2 + p + p, .recruit .find h2 + p + p,
.recruit .join h2 + p + p,
.recruit .complete h2 + p + p, #recruit .selectjob .form .application .languages .period p,
#recruit .selectjob .form .application .licenses .period p,
#recruit .selectjob .form .application .acts .period p,
#recruit .selectjob .form .application .globalExp .period p,
#recruit .selectjob .form .application .prizeExp .period p,
#recruit .selectjob .form .application .expContainer .period p,
#recruit .selectjob .form .application .exps .period p, .recruit .selectjob .form .application .languages .period p,
.recruit .selectjob .form .application .licenses .period p,
.recruit .selectjob .form .application .acts .period p,
.recruit .selectjob .form .application .globalExp .period p,
.recruit .selectjob .form .application .prizeExp .period p,
.recruit .selectjob .form .application .expContainer .period p,
.recruit .selectjob .form .application .exps .period p, #recruit .selectjob .form .application .edu div.case span, .recruit .selectjob .form .application .edu div.case span, #recruit .selectjob .form .application .salary span, .recruit .selectjob .form .application .salary span, #recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2, #recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box, #recruit .form .phone button, .recruit .form .phone button, #recruit .form .passwordInfo, .recruit .form .passwordInfo, #recruit .container .list > li > div, .recruit .container .list > li > div, #recruit .container .list > li > ul, .recruit .container .list > li > ul, #recruit .container .list > li > span, .recruit .container .list > li > span, #recruit .container .board .selectBox > div, .recruit .container .board .selectBox > div, #contents.crDetail > section .department > .table table tbody th,
#contents.crDetail > section .department > .table table tbody td, #contents.crList .sort .selectBox > div, #contents.location .info h1, .historyContainer .content ul li figure figcaption,
.awardContainer .content ul li figure figcaption, #contents.historyCenter .historyTab section > div > div button, #contents.historyCenter .historyTab section > div > button, #contents.pressList .newsCollect > div .swiper button em::after, #contents.pressList .newsPick > div li .detail > span, #detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div, #contents.statusList .empty span, #contents.performance .headline .summary span, .popNotice footer, #contents.home .performanceList > div li .detail > span, #recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p, #recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section, #recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span,
#recruit .selectjob .form .application > section .phone span,
.recruit .selectjob .form .application > section .phone span,
#recruit .form > section .phone span,
.recruit .form > section .phone span,
#recruit .container #inquiry form.inquiry > section .phone span,
.recruit .container #inquiry form.inquiry > section .phone span,
#contents.contact .inquiry > section .phone span,
#contents.research .application > section .phone span, #recruit .selectjob .form .application > section .selectBox > div, .recruit .selectjob .form .application > section .selectBox > div, #recruit .form > section .selectBox > div, .recruit .form > section .selectBox > div, #recruit .container #inquiry form.inquiry > section .selectBox > div, .recruit .container #inquiry form.inquiry > section .selectBox > div, #contents.contact .inquiry > section .selectBox > div, #contents.research .application > section .selectBox > div, #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button, #recruit .selectjob .form .application > section .file > p, .recruit .selectjob .form .application > section .file > p, #recruit .form > section .file > p, .recruit .form > section .file > p, #recruit .container #inquiry form.inquiry > section .file > p, .recruit .container #inquiry form.inquiry > section .file > p, #contents.contact .inquiry > section .file > p, #contents.research .application > section .file > p, #recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span, #recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p, .inquiry.groupCr > div > div > a, #detailContents.portfolioDetail .inquiry > div > div > a, #contents.contact .contactInfo > div > div > a, .inquiry.groupCr > div > a, #detailContents.portfolioDetail .inquiry > div > a, #contents.contact .contactInfo > div > a, #contents.performance .portfolio > div > p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performance .portfolio header .selectBox > div, #contents.performance .portfolio header .selectBox > button, #contents.performance .portfolio header h1, #recruit .container .board .recommend > a span, .recruit .container .board .recommend > a span, #contents.crList .tabTarget .recommend > a span, #contents.pressList > .list .recommend > a span, #contents.performanceList > .list .recommend > a span, #contents.research .list .recommend > a span, #recruit .container .board .recommend .swiper-slide span, .recruit .container .board .recommend .swiper-slide span, #contents.crList .tabTarget .recommend .swiper-slide span, #contents.pressList > .list .recommend .swiper-slide span, #contents.performanceList > .list .recommend .swiper-slide span, #contents.research .list .recommend .swiper-slide span, #recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em, #recruit .container .board .recommend > p, .recruit .container .board .recommend > p, #contents.crList .tabTarget .recommend > p, #contents.pressList > .list .recommend > p, #contents.performanceList > .list .recommend > p, #contents.research .list .recommend > p, #recruit .container .board .empty span, .recruit .container .board .empty span, #contents.crList .tabTarget .empty span, #contents.pressList > .list .empty span, #contents.performanceList > .list .empty span, #contents.research .list .empty span, #recruit .container .board .downloadList > a span, .recruit .container .board .downloadList > a span, #contents.crList .tabTarget .downloadList > a span, #contents.pressList > .list .downloadList > a span, #contents.performanceList > .list .downloadList > a span, #contents.research .list .downloadList > a span,
#recruit .container .board .listTextMode > a span,
.recruit .container .board .listTextMode > a span,
#contents.crList .tabTarget .listTextMode > a span,
#contents.pressList > .list .listTextMode > a span,
#contents.performanceList > .list .listTextMode > a span,
#contents.research .list .listTextMode > a span, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p, .thumbMode.active ~ .list > a span, .thumbMode.active ~ .list .swiper-slide span, .thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em, .thumbMode.active ~ .list > p, .textMode.active ~ .list > a span, .popup > div .terms .termsContents *:not(h2):not(h1), .popup > div .terms .selectBox > div, .popup > div .terms .selectBox > button, .popup > div .full .result table, .popup > div .full > p:not(.case), .toastMessage p, #recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea, #recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div, #recruit .find form label:not(.check) input,
#recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
#recruit .find .completeBox .label input,
#recruit .join form label:not(.check) input,
#recruit .join form .label input,
#recruit .join .completeBox label:not(.check) input,
#recruit .join .completeBox .label input,
#recruit .complete form label:not(.check) input,
#recruit .complete form .label input,
#recruit .complete .completeBox label:not(.check) input,
#recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
.recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
.recruit .find .completeBox .label input,
.recruit .join form label:not(.check) input,
.recruit .join form .label input,
.recruit .join .completeBox label:not(.check) input,
.recruit .join .completeBox .label input,
.recruit .complete form label:not(.check) input,
.recruit .complete form .label input,
.recruit .complete .completeBox label:not(.check) input,
.recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
#recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
#recruit .find .completeBox .label textarea,
#recruit .join form label:not(.check) textarea,
#recruit .join form .label textarea,
#recruit .join .completeBox label:not(.check) textarea,
#recruit .join .completeBox .label textarea,
#recruit .complete form label:not(.check) textarea,
#recruit .complete form .label textarea,
#recruit .complete .completeBox label:not(.check) textarea,
#recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
.recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
.recruit .find .completeBox .label textarea,
.recruit .join form label:not(.check) textarea,
.recruit .join form .label textarea,
.recruit .join .completeBox label:not(.check) textarea,
.recruit .join .completeBox .label textarea,
.recruit .complete form label:not(.check) textarea,
.recruit .complete form .label textarea,
.recruit .complete .completeBox label:not(.check) textarea,
.recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea, .guideBtnEx12, .guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
  color: #666;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro .info p span, #contents.groupGr .intro .info p span, #contents.groupBd .headline ul .summary span, #recruit .applicationBtn p, .recruit .applicationBtn p, #recruit .join .phoneCertify p, .recruit .join .phoneCertify p, #recruit .find.result > div dl,
  #recruit .join.result > div dl,
  #recruit .complete.result > div dl, .recruit .find.result > div dl,
  .recruit .join.result > div dl,
  .recruit .complete.result > div dl, #recruit .find.result > div span,
  #recruit .join.result > div span,
  #recruit .complete.result > div span, .recruit .find.result > div span,
  .recruit .join.result > div span,
  .recruit .complete.result > div span, #recruit .find form label:not(.check).email .selectBox > div,
  #recruit .find form .label.email .selectBox > div, #recruit .find .completeBox label:not(.check).email .selectBox > div,
  #recruit .find .completeBox .label.email .selectBox > div,
  #recruit .join form label:not(.check).email .selectBox > div,
  #recruit .join form .label.email .selectBox > div,
  #recruit .join .completeBox label:not(.check).email .selectBox > div,
  #recruit .join .completeBox .label.email .selectBox > div,
  #recruit .complete form label:not(.check).email .selectBox > div,
  #recruit .complete form .label.email .selectBox > div,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div,
  #recruit .complete .completeBox .label.email .selectBox > div, .recruit .find form label:not(.check).email .selectBox > div,
  .recruit .find form .label.email .selectBox > div, .recruit .find .completeBox label:not(.check).email .selectBox > div,
  .recruit .find .completeBox .label.email .selectBox > div,
  .recruit .join form label:not(.check).email .selectBox > div,
  .recruit .join form .label.email .selectBox > div,
  .recruit .join .completeBox label:not(.check).email .selectBox > div,
  .recruit .join .completeBox .label.email .selectBox > div,
  .recruit .complete form label:not(.check).email .selectBox > div,
  .recruit .complete form .label.email .selectBox > div,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div,
  .recruit .complete .completeBox .label.email .selectBox > div, #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > button, #recruit .find form label:not(.check).phone div button,
  #recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
  #recruit .find .completeBox .label.phone div button,
  #recruit .join form label:not(.check).phone div button,
  #recruit .join form .label.phone div button,
  #recruit .join .completeBox label:not(.check).phone div button,
  #recruit .join .completeBox .label.phone div button,
  #recruit .complete form label:not(.check).phone div button,
  #recruit .complete form .label.phone div button,
  #recruit .complete .completeBox label:not(.check).phone div button,
  #recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
  .recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
  .recruit .find .completeBox .label.phone div button,
  .recruit .join form label:not(.check).phone div button,
  .recruit .join form .label.phone div button,
  .recruit .join .completeBox label:not(.check).phone div button,
  .recruit .join .completeBox .label.phone div button,
  .recruit .complete form label:not(.check).phone div button,
  .recruit .complete form .label.phone div button,
  .recruit .complete .completeBox label:not(.check).phone div button,
  .recruit .complete .completeBox .label.phone div button, #recruit .find form .required, #recruit .find .completeBox .required,
  #recruit .join form .required,
  #recruit .join .completeBox .required,
  #recruit .complete form .required,
  #recruit .complete .completeBox .required, .recruit .find form .required, .recruit .find .completeBox .required,
  .recruit .join form .required,
  .recruit .join .completeBox .required,
  .recruit .complete form .required,
  .recruit .complete .completeBox .required, #recruit .find h2 + p + p,
  #recruit .join h2 + p + p,
  #recruit .complete h2 + p + p, .recruit .find h2 + p + p,
  .recruit .join h2 + p + p,
  .recruit .complete h2 + p + p, #recruit .selectjob .form .application .languages .period p,
  #recruit .selectjob .form .application .licenses .period p,
  #recruit .selectjob .form .application .acts .period p,
  #recruit .selectjob .form .application .globalExp .period p,
  #recruit .selectjob .form .application .prizeExp .period p,
  #recruit .selectjob .form .application .expContainer .period p,
  #recruit .selectjob .form .application .exps .period p, .recruit .selectjob .form .application .languages .period p,
  .recruit .selectjob .form .application .licenses .period p,
  .recruit .selectjob .form .application .acts .period p,
  .recruit .selectjob .form .application .globalExp .period p,
  .recruit .selectjob .form .application .prizeExp .period p,
  .recruit .selectjob .form .application .expContainer .period p,
  .recruit .selectjob .form .application .exps .period p, #recruit .selectjob .form .application .edu div.case span, .recruit .selectjob .form .application .edu div.case span, #recruit .selectjob .form .application .salary span, .recruit .selectjob .form .application .salary span, #recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2, #recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box, #recruit .form .phone button, .recruit .form .phone button, #recruit .form .passwordInfo, .recruit .form .passwordInfo, #recruit .container .list > li > div, .recruit .container .list > li > div, #recruit .container .list > li > ul, .recruit .container .list > li > ul, #recruit .container .list > li > span, .recruit .container .list > li > span, #recruit .container .board .selectBox > div, .recruit .container .board .selectBox > div, #contents.crDetail > section .department > .table table tbody th,
  #contents.crDetail > section .department > .table table tbody td, #contents.crList .sort .selectBox > div, #contents.location .info h1, .historyContainer .content ul li figure figcaption,
  .awardContainer .content ul li figure figcaption, #contents.historyCenter .historyTab section > div > div button, #contents.historyCenter .historyTab section > div > button, #contents.pressList .newsCollect > div .swiper button em::after, #contents.pressList .newsPick > div li .detail > span, #detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div, #contents.statusList .empty span, #contents.performance .headline .summary span, .popNotice footer, #contents.home .performanceList > div li .detail > span, #recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p, #recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section, #recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span,
  #recruit .selectjob .form .application > section .phone span,
  .recruit .selectjob .form .application > section .phone span,
  #recruit .form > section .phone span,
  .recruit .form > section .phone span,
  #recruit .container #inquiry form.inquiry > section .phone span,
  .recruit .container #inquiry form.inquiry > section .phone span,
  #contents.contact .inquiry > section .phone span,
  #contents.research .application > section .phone span, #recruit .selectjob .form .application > section .selectBox > div, .recruit .selectjob .form .application > section .selectBox > div, #recruit .form > section .selectBox > div, .recruit .form > section .selectBox > div, #recruit .container #inquiry form.inquiry > section .selectBox > div, .recruit .container #inquiry form.inquiry > section .selectBox > div, #contents.contact .inquiry > section .selectBox > div, #contents.research .application > section .selectBox > div, #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button, #recruit .selectjob .form .application > section .file > p, .recruit .selectjob .form .application > section .file > p, #recruit .form > section .file > p, .recruit .form > section .file > p, #recruit .container #inquiry form.inquiry > section .file > p, .recruit .container #inquiry form.inquiry > section .file > p, #contents.contact .inquiry > section .file > p, #contents.research .application > section .file > p, #recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span, #recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p, .inquiry.groupCr > div > div > a, #detailContents.portfolioDetail .inquiry > div > div > a, #contents.contact .contactInfo > div > div > a, .inquiry.groupCr > div > a, #detailContents.portfolioDetail .inquiry > div > a, #contents.contact .contactInfo > div > a, #contents.performance .portfolio > div > p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performance .portfolio header .selectBox > div, #contents.performance .portfolio header .selectBox > button, #contents.performance .portfolio header h1, #recruit .container .board .recommend > a span, .recruit .container .board .recommend > a span, #contents.crList .tabTarget .recommend > a span, #contents.pressList > .list .recommend > a span, #contents.performanceList > .list .recommend > a span, #contents.research .list .recommend > a span, #recruit .container .board .recommend .swiper-slide span, .recruit .container .board .recommend .swiper-slide span, #contents.crList .tabTarget .recommend .swiper-slide span, #contents.pressList > .list .recommend .swiper-slide span, #contents.performanceList > .list .recommend .swiper-slide span, #contents.research .list .recommend .swiper-slide span, #recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em, #recruit .container .board .recommend > p, .recruit .container .board .recommend > p, #contents.crList .tabTarget .recommend > p, #contents.pressList > .list .recommend > p, #contents.performanceList > .list .recommend > p, #contents.research .list .recommend > p, #recruit .container .board .empty span, .recruit .container .board .empty span, #contents.crList .tabTarget .empty span, #contents.pressList > .list .empty span, #contents.performanceList > .list .empty span, #contents.research .list .empty span, #recruit .container .board .downloadList > a span, .recruit .container .board .downloadList > a span, #contents.crList .tabTarget .downloadList > a span, #contents.pressList > .list .downloadList > a span, #contents.performanceList > .list .downloadList > a span, #contents.research .list .downloadList > a span,
  #recruit .container .board .listTextMode > a span,
  .recruit .container .board .listTextMode > a span,
  #contents.crList .tabTarget .listTextMode > a span,
  #contents.pressList > .list .listTextMode > a span,
  #contents.performanceList > .list .listTextMode > a span,
  #contents.research .list .listTextMode > a span, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p, .thumbMode.active ~ .list > a span, .thumbMode.active ~ .list .swiper-slide span, .thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em, .thumbMode.active ~ .list > p, .textMode.active ~ .list > a span, .popup > div .terms .termsContents *:not(h2):not(h1), .popup > div .terms .selectBox > div, .popup > div .terms .selectBox > button, .popup > div .full .result table, .popup > div .full > p:not(.case), .toastMessage p, #recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea, #recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div, #recruit .find form label:not(.check) input,
  #recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox .label input,
  #recruit .join form label:not(.check) input,
  #recruit .join form .label input,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox .label input,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form .label input,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
  .recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox .label input,
  .recruit .join form label:not(.check) input,
  .recruit .join form .label input,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox .label input,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form .label input,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
  #recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
  #recruit .find .completeBox .label textarea,
  #recruit .join form label:not(.check) textarea,
  #recruit .join form .label textarea,
  #recruit .join .completeBox label:not(.check) textarea,
  #recruit .join .completeBox .label textarea,
  #recruit .complete form label:not(.check) textarea,
  #recruit .complete form .label textarea,
  #recruit .complete .completeBox label:not(.check) textarea,
  #recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
  .recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
  .recruit .find .completeBox .label textarea,
  .recruit .join form label:not(.check) textarea,
  .recruit .join form .label textarea,
  .recruit .join .completeBox label:not(.check) textarea,
  .recruit .join .completeBox .label textarea,
  .recruit .complete form label:not(.check) textarea,
  .recruit .complete form .label textarea,
  .recruit .complete .completeBox label:not(.check) textarea,
  .recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea, .guideBtnEx12, .guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    line-height: 28px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro .info p span, #contents.groupGr .intro .info p span, #contents.groupBd .headline ul .summary span, #recruit .applicationBtn p, .recruit .applicationBtn p, #recruit .join .phoneCertify p, .recruit .join .phoneCertify p, #recruit .find.result > div dl,
  #recruit .join.result > div dl,
  #recruit .complete.result > div dl, .recruit .find.result > div dl,
  .recruit .join.result > div dl,
  .recruit .complete.result > div dl, #recruit .find.result > div span,
  #recruit .join.result > div span,
  #recruit .complete.result > div span, .recruit .find.result > div span,
  .recruit .join.result > div span,
  .recruit .complete.result > div span, #recruit .find form label:not(.check).email .selectBox > div,
  #recruit .find form .label.email .selectBox > div, #recruit .find .completeBox label:not(.check).email .selectBox > div,
  #recruit .find .completeBox .label.email .selectBox > div,
  #recruit .join form label:not(.check).email .selectBox > div,
  #recruit .join form .label.email .selectBox > div,
  #recruit .join .completeBox label:not(.check).email .selectBox > div,
  #recruit .join .completeBox .label.email .selectBox > div,
  #recruit .complete form label:not(.check).email .selectBox > div,
  #recruit .complete form .label.email .selectBox > div,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div,
  #recruit .complete .completeBox .label.email .selectBox > div, .recruit .find form label:not(.check).email .selectBox > div,
  .recruit .find form .label.email .selectBox > div, .recruit .find .completeBox label:not(.check).email .selectBox > div,
  .recruit .find .completeBox .label.email .selectBox > div,
  .recruit .join form label:not(.check).email .selectBox > div,
  .recruit .join form .label.email .selectBox > div,
  .recruit .join .completeBox label:not(.check).email .selectBox > div,
  .recruit .join .completeBox .label.email .selectBox > div,
  .recruit .complete form label:not(.check).email .selectBox > div,
  .recruit .complete form .label.email .selectBox > div,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div,
  .recruit .complete .completeBox .label.email .selectBox > div, #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > button, #recruit .find form label:not(.check).phone div button,
  #recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
  #recruit .find .completeBox .label.phone div button,
  #recruit .join form label:not(.check).phone div button,
  #recruit .join form .label.phone div button,
  #recruit .join .completeBox label:not(.check).phone div button,
  #recruit .join .completeBox .label.phone div button,
  #recruit .complete form label:not(.check).phone div button,
  #recruit .complete form .label.phone div button,
  #recruit .complete .completeBox label:not(.check).phone div button,
  #recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
  .recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
  .recruit .find .completeBox .label.phone div button,
  .recruit .join form label:not(.check).phone div button,
  .recruit .join form .label.phone div button,
  .recruit .join .completeBox label:not(.check).phone div button,
  .recruit .join .completeBox .label.phone div button,
  .recruit .complete form label:not(.check).phone div button,
  .recruit .complete form .label.phone div button,
  .recruit .complete .completeBox label:not(.check).phone div button,
  .recruit .complete .completeBox .label.phone div button, #recruit .find form .required, #recruit .find .completeBox .required,
  #recruit .join form .required,
  #recruit .join .completeBox .required,
  #recruit .complete form .required,
  #recruit .complete .completeBox .required, .recruit .find form .required, .recruit .find .completeBox .required,
  .recruit .join form .required,
  .recruit .join .completeBox .required,
  .recruit .complete form .required,
  .recruit .complete .completeBox .required, #recruit .find h2 + p + p,
  #recruit .join h2 + p + p,
  #recruit .complete h2 + p + p, .recruit .find h2 + p + p,
  .recruit .join h2 + p + p,
  .recruit .complete h2 + p + p, #recruit .selectjob .form .application .languages .period p,
  #recruit .selectjob .form .application .licenses .period p,
  #recruit .selectjob .form .application .acts .period p,
  #recruit .selectjob .form .application .globalExp .period p,
  #recruit .selectjob .form .application .prizeExp .period p,
  #recruit .selectjob .form .application .expContainer .period p,
  #recruit .selectjob .form .application .exps .period p, .recruit .selectjob .form .application .languages .period p,
  .recruit .selectjob .form .application .licenses .period p,
  .recruit .selectjob .form .application .acts .period p,
  .recruit .selectjob .form .application .globalExp .period p,
  .recruit .selectjob .form .application .prizeExp .period p,
  .recruit .selectjob .form .application .expContainer .period p,
  .recruit .selectjob .form .application .exps .period p, #recruit .selectjob .form .application .edu div.case span, .recruit .selectjob .form .application .edu div.case span, #recruit .selectjob .form .application .salary span, .recruit .selectjob .form .application .salary span, #recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2, #recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box, #recruit .form .phone button, .recruit .form .phone button, #recruit .form .passwordInfo, .recruit .form .passwordInfo, #recruit .container .list > li > div, .recruit .container .list > li > div, #recruit .container .list > li > ul, .recruit .container .list > li > ul, #recruit .container .list > li > span, .recruit .container .list > li > span, #recruit .container .board .selectBox > div, .recruit .container .board .selectBox > div, #contents.crDetail > section .department > .table table tbody th,
  #contents.crDetail > section .department > .table table tbody td, #contents.crList .sort .selectBox > div, #contents.location .info h1, .historyContainer .content ul li figure figcaption,
  .awardContainer .content ul li figure figcaption, #contents.historyCenter .historyTab section > div > div button, #contents.historyCenter .historyTab section > div > button, #contents.pressList .newsCollect > div .swiper button em::after, #contents.pressList .newsPick > div li .detail > span, #detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div, #contents.statusList .empty span, #contents.performance .headline .summary span, .popNotice footer, #contents.home .performanceList > div li .detail > span, #recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p, #recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section, #recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span,
  #recruit .selectjob .form .application > section .phone span,
  .recruit .selectjob .form .application > section .phone span,
  #recruit .form > section .phone span,
  .recruit .form > section .phone span,
  #recruit .container #inquiry form.inquiry > section .phone span,
  .recruit .container #inquiry form.inquiry > section .phone span,
  #contents.contact .inquiry > section .phone span,
  #contents.research .application > section .phone span, #recruit .selectjob .form .application > section .selectBox > div, .recruit .selectjob .form .application > section .selectBox > div, #recruit .form > section .selectBox > div, .recruit .form > section .selectBox > div, #recruit .container #inquiry form.inquiry > section .selectBox > div, .recruit .container #inquiry form.inquiry > section .selectBox > div, #contents.contact .inquiry > section .selectBox > div, #contents.research .application > section .selectBox > div, #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button, #recruit .selectjob .form .application > section .file > p, .recruit .selectjob .form .application > section .file > p, #recruit .form > section .file > p, .recruit .form > section .file > p, #recruit .container #inquiry form.inquiry > section .file > p, .recruit .container #inquiry form.inquiry > section .file > p, #contents.contact .inquiry > section .file > p, #contents.research .application > section .file > p, #recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span, #recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p, .inquiry.groupCr > div > div > a, #detailContents.portfolioDetail .inquiry > div > div > a, #contents.contact .contactInfo > div > div > a, .inquiry.groupCr > div > a, #detailContents.portfolioDetail .inquiry > div > a, #contents.contact .contactInfo > div > a, #contents.performance .portfolio > div > p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performance .portfolio header .selectBox > div, #contents.performance .portfolio header .selectBox > button, #contents.performance .portfolio header h1, #recruit .container .board .recommend > a span, .recruit .container .board .recommend > a span, #contents.crList .tabTarget .recommend > a span, #contents.pressList > .list .recommend > a span, #contents.performanceList > .list .recommend > a span, #contents.research .list .recommend > a span, #recruit .container .board .recommend .swiper-slide span, .recruit .container .board .recommend .swiper-slide span, #contents.crList .tabTarget .recommend .swiper-slide span, #contents.pressList > .list .recommend .swiper-slide span, #contents.performanceList > .list .recommend .swiper-slide span, #contents.research .list .recommend .swiper-slide span, #recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em, #recruit .container .board .recommend > p, .recruit .container .board .recommend > p, #contents.crList .tabTarget .recommend > p, #contents.pressList > .list .recommend > p, #contents.performanceList > .list .recommend > p, #contents.research .list .recommend > p, #recruit .container .board .empty span, .recruit .container .board .empty span, #contents.crList .tabTarget .empty span, #contents.pressList > .list .empty span, #contents.performanceList > .list .empty span, #contents.research .list .empty span, #recruit .container .board .downloadList > a span, .recruit .container .board .downloadList > a span, #contents.crList .tabTarget .downloadList > a span, #contents.pressList > .list .downloadList > a span, #contents.performanceList > .list .downloadList > a span, #contents.research .list .downloadList > a span,
  #recruit .container .board .listTextMode > a span,
  .recruit .container .board .listTextMode > a span,
  #contents.crList .tabTarget .listTextMode > a span,
  #contents.pressList > .list .listTextMode > a span,
  #contents.performanceList > .list .listTextMode > a span,
  #contents.research .list .listTextMode > a span, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p, .thumbMode.active ~ .list > a span, .thumbMode.active ~ .list .swiper-slide span, .thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em, .thumbMode.active ~ .list > p, .textMode.active ~ .list > a span, .popup > div .terms .termsContents *:not(h2):not(h1), .popup > div .terms .selectBox > div, .popup > div .terms .selectBox > button, .popup > div .full .result table, .popup > div .full > p:not(.case), .toastMessage p, #recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea, #recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div, #recruit .find form label:not(.check) input,
  #recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox .label input,
  #recruit .join form label:not(.check) input,
  #recruit .join form .label input,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox .label input,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form .label input,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
  .recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox .label input,
  .recruit .join form label:not(.check) input,
  .recruit .join form .label input,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox .label input,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form .label input,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
  #recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
  #recruit .find .completeBox .label textarea,
  #recruit .join form label:not(.check) textarea,
  #recruit .join form .label textarea,
  #recruit .join .completeBox label:not(.check) textarea,
  #recruit .join .completeBox .label textarea,
  #recruit .complete form label:not(.check) textarea,
  #recruit .complete form .label textarea,
  #recruit .complete .completeBox label:not(.check) textarea,
  #recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
  .recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
  .recruit .find .completeBox .label textarea,
  .recruit .join form label:not(.check) textarea,
  .recruit .join form .label textarea,
  .recruit .join .completeBox label:not(.check) textarea,
  .recruit .join .completeBox .label textarea,
  .recruit .complete form label:not(.check) textarea,
  .recruit .complete form .label textarea,
  .recruit .complete .completeBox label:not(.check) textarea,
  .recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea, .guideBtnEx12, .guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
}

#contents.pressList > section h1, #contents.groupBd .recommend h1, #detailContents.portfolioDetail .recommend h1, #detailContents.pressDetail .recommend h1 {
  display: block;
  padding-bottom: 20px;
}

.exclamation {
  position: relative;
  padding-left: 27px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #666;
}
.exclamation::before {
  content: "!";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 20px;
  height: 20px;
  border: 1px solid #666;
  border-radius: 50%;
  text-align: center;
  font-size: 12px;
  line-height: 18px;
}

@media (min-width: 1025px) {
  .editor h1,
  #contents.crDetail dl.info dd:not(.diagram) h1,
  #detailContents.portfolioDetail .progressCalendar .performance header div h1,
  #detailContents.pressDetail .detail h1,
  #detailContents.portfolioDetail .detailContainer > section .detail h1 {
    font-size: 36px;
    line-height: 48px;
    letter-spacing: -0.03em;
  }
  .editor h2,
  #contents.crDetail dl.info dd:not(.diagram) h2,
  #detailContents.portfolioDetail .progressCalendar .performance header div h2,
  #detailContents.pressDetail .detail h2,
  #detailContents.portfolioDetail .detailContainer > section .detail h2 {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
  .editor h3,
  #contents.crDetail dl.info dd:not(.diagram) h3,
  #detailContents.portfolioDetail .progressCalendar .performance header div h3,
  #detailContents.pressDetail .detail h3,
  #detailContents.portfolioDetail .detailContainer > section .detail h3 {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}
@media (max-width: 1024px) {
  .editor h1,
  #contents.crDetail dl.info dd:not(.diagram) h1,
  #detailContents.portfolioDetail .progressCalendar .performance header div h1,
  #detailContents.pressDetail .detail h1,
  #detailContents.portfolioDetail .detailContainer > section .detail h1 {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  .editor h2,
  #contents.crDetail dl.info dd:not(.diagram) h2,
  #detailContents.portfolioDetail .progressCalendar .performance header div h2,
  #detailContents.pressDetail .detail h2,
  #detailContents.portfolioDetail .detailContainer > section .detail h2 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  .editor h3,
  #contents.crDetail dl.info dd:not(.diagram) h3,
  #detailContents.portfolioDetail .progressCalendar .performance header div h3,
  #detailContents.pressDetail .detail h3,
  #detailContents.portfolioDetail .detailContainer > section .detail h3 {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
  }
}
.editor p,
#contents.crDetail dl.info dd:not(.diagram) p,
#detailContents.portfolioDetail .progressCalendar .performance header div p,
#detailContents.pressDetail .detail p,
#detailContents.portfolioDetail .detailContainer > section .detail p {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
}

.guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  text-align: center;
}
.guideBtnEx11:not(:disabled):hover, #recruit .selectjob .form .application > section .radio > label span:not(:disabled):hover, .recruit .selectjob .form .application > section .radio > label span:not(:disabled):hover, #recruit .form > section .radio > label span:not(:disabled):hover, .recruit .form > section .radio > label span:not(:disabled):hover, #recruit .container #inquiry form.inquiry > section .radio > label span:not(:disabled):hover, .recruit .container #inquiry form.inquiry > section .radio > label span:not(:disabled):hover, #contents.contact .inquiry > section .radio > label span:not(:disabled):hover, #contents.research .application > section .radio > label span:not(:disabled):hover {
  border-color: #4415a0;
  color: #4415a0;
}
@media (min-width: 1025px) {
  .guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
    min-width: 206px;
    padding: 0 20px;
    line-height: 52px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx11, #recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
    min-width: 160px;
    padding: 0 15px;
    line-height: 38px;
  }
}

.guideBtnEx12 {
  border-radius: 4px;
  text-align: center;
  background: #0097e0;
  color: #fff;
}
@media (min-width: 1025px) {
  .guideBtnEx12 {
    padding: 0 20px;
    line-height: 48px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx12 {
    width: 100%;
    line-height: 48px;
  }
}

#recruit .selectjob .form .application > section .input, .recruit .selectjob .form .application > section .input, #recruit .form > section .input, .recruit .form > section .input, #recruit .container #inquiry form.inquiry > section .input, .recruit .container #inquiry form.inquiry > section .input, #contents.contact .inquiry > section .input, #contents.research .application > section .input, #recruit .container .board .search label, .recruit .container .board .search label, #contents.crList .tabTarget .search label, #contents.pressList > .list .search label, #contents.performanceList > .list .search label, #contents.research .list .search label, .popup > div .full .inputTxt {
  position: relative;
}
#recruit .selectjob .form .application > section .input input:focus, .recruit .selectjob .form .application > section .input input:focus, #recruit .form > section .input input:focus, .recruit .form > section .input input:focus, #recruit .container #inquiry form.inquiry > section .input input:focus, .recruit .container #inquiry form.inquiry > section .input input:focus, #contents.contact .inquiry > section .input input:focus, #contents.research .application > section .input input:focus, #recruit .container .board .search label input:focus, .recruit .container .board .search label input:focus, #contents.crList .tabTarget .search label input:focus, #contents.pressList > .list .search label input:focus, #contents.performanceList > .list .search label input:focus, #contents.research .list .search label input:focus, .popup > div .full .inputTxt input:focus {
  outline: 0;
  border-color: #4415a0;
}
#recruit .selectjob .form .application > section .input .reset, .recruit .selectjob .form .application > section .input .reset, #recruit .form > section .input .reset, .recruit .form > section .input .reset, #recruit .container #inquiry form.inquiry > section .input .reset, .recruit .container #inquiry form.inquiry > section .input .reset, #contents.contact .inquiry > section .input .reset, #contents.research .application > section .input .reset, #recruit .container .board .search label .reset, .recruit .container .board .search label .reset, #contents.crList .tabTarget .search label .reset, #contents.pressList > .list .search label .reset, #contents.performanceList > .list .search label .reset, #contents.research .list .search label .reset, .popup > div .full .inputTxt .reset {
  right: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #a5a5a5;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
#recruit .selectjob .form .application > section .input .reset::before, .recruit .selectjob .form .application > section .input .reset::before, #recruit .form > section .input .reset::before, .recruit .form > section .input .reset::before, #recruit .container #inquiry form.inquiry > section .input .reset::before, .recruit .container #inquiry form.inquiry > section .input .reset::before, #contents.contact .inquiry > section .input .reset::before, #contents.research .application > section .input .reset::before, #recruit .container .board .search label .reset::before, .recruit .container .board .search label .reset::before, #contents.crList .tabTarget .search label .reset::before, #contents.pressList > .list .search label .reset::before, #contents.performanceList > .list .search label .reset::before, #contents.research .list .search label .reset::before, .popup > div .full .inputTxt .reset::before, #recruit .selectjob .form .application > section .input .reset::after, .recruit .selectjob .form .application > section .input .reset::after, #recruit .form > section .input .reset::after, .recruit .form > section .input .reset::after, #recruit .container #inquiry form.inquiry > section .input .reset::after, .recruit .container #inquiry form.inquiry > section .input .reset::after, #contents.contact .inquiry > section .input .reset::after, #contents.research .application > section .input .reset::after, #recruit .container .board .search label .reset::after, .recruit .container .board .search label .reset::after, #contents.crList .tabTarget .search label .reset::after, #contents.pressList > .list .search label .reset::after, #contents.performanceList > .list .search label .reset::after, #contents.research .list .search label .reset::after, .popup > div .full .inputTxt .reset::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 14px;
  height: 1px;
  background: #fff;
}
#recruit .selectjob .form .application > section .input .reset::before, .recruit .selectjob .form .application > section .input .reset::before, #recruit .form > section .input .reset::before, .recruit .form > section .input .reset::before, #recruit .container #inquiry form.inquiry > section .input .reset::before, .recruit .container #inquiry form.inquiry > section .input .reset::before, #contents.contact .inquiry > section .input .reset::before, #contents.research .application > section .input .reset::before, #recruit .container .board .search label .reset::before, .recruit .container .board .search label .reset::before, #contents.crList .tabTarget .search label .reset::before, #contents.pressList > .list .search label .reset::before, #contents.performanceList > .list .search label .reset::before, #contents.research .list .search label .reset::before, .popup > div .full .inputTxt .reset::before {
  transform: rotate(45deg);
}
#recruit .selectjob .form .application > section .input .reset::after, .recruit .selectjob .form .application > section .input .reset::after, #recruit .form > section .input .reset::after, .recruit .form > section .input .reset::after, #recruit .container #inquiry form.inquiry > section .input .reset::after, .recruit .container #inquiry form.inquiry > section .input .reset::after, #contents.contact .inquiry > section .input .reset::after, #contents.research .application > section .input .reset::after, #recruit .container .board .search label .reset::after, .recruit .container .board .search label .reset::after, #contents.crList .tabTarget .search label .reset::after, #contents.pressList > .list .search label .reset::after, #contents.performanceList > .list .search label .reset::after, #contents.research .list .search label .reset::after, .popup > div .full .inputTxt .reset::after {
  transform: rotate(-45deg);
}
#recruit .selectjob .form .application > section .input input:not(:valid) ~ .reset, .recruit .selectjob .form .application > section .input input:not(:valid) ~ .reset, #recruit .form > section .input input:not(:valid) ~ .reset, .recruit .form > section .input input:not(:valid) ~ .reset, #recruit .container #inquiry form.inquiry > section .input input:not(:valid) ~ .reset, .recruit .container #inquiry form.inquiry > section .input input:not(:valid) ~ .reset, #contents.contact .inquiry > section .input input:not(:valid) ~ .reset, #contents.research .application > section .input input:not(:valid) ~ .reset, #recruit .container .board .search label input:not(:valid) ~ .reset, .recruit .container .board .search label input:not(:valid) ~ .reset, #contents.crList .tabTarget .search label input:not(:valid) ~ .reset, #contents.pressList > .list .search label input:not(:valid) ~ .reset, #contents.performanceList > .list .search label input:not(:valid) ~ .reset, #contents.research .list .search label input:not(:valid) ~ .reset, .popup > div .full .inputTxt input:not(:valid) ~ .reset {
  display: none;
}

#recruit .find form label:not(.check) input,
#recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
#recruit .find .completeBox .label input,
#recruit .join form label:not(.check) input,
#recruit .join form .label input,
#recruit .join .completeBox label:not(.check) input,
#recruit .join .completeBox .label input,
#recruit .complete form label:not(.check) input,
#recruit .complete form .label input,
#recruit .complete .completeBox label:not(.check) input,
#recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
.recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
.recruit .find .completeBox .label input,
.recruit .join form label:not(.check) input,
.recruit .join form .label input,
.recruit .join .completeBox label:not(.check) input,
.recruit .join .completeBox .label input,
.recruit .complete form label:not(.check) input,
.recruit .complete form .label input,
.recruit .complete .completeBox label:not(.check) input,
.recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
#recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
#recruit .find .completeBox .label textarea,
#recruit .join form label:not(.check) textarea,
#recruit .join form .label textarea,
#recruit .join .completeBox label:not(.check) textarea,
#recruit .join .completeBox .label textarea,
#recruit .complete form label:not(.check) textarea,
#recruit .complete form .label textarea,
#recruit .complete .completeBox label:not(.check) textarea,
#recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
.recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
.recruit .find .completeBox .label textarea,
.recruit .join form label:not(.check) textarea,
.recruit .join form .label textarea,
.recruit .join .completeBox label:not(.check) textarea,
.recruit .join .completeBox .label textarea,
.recruit .complete form label:not(.check) textarea,
.recruit .complete form .label textarea,
.recruit .complete .completeBox label:not(.check) textarea,
.recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea {
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: #fff;
}
#recruit .find form label:not(.check) input.zoom,
#recruit .find form .label input.zoom, #recruit .find .completeBox label:not(.check) input.zoom,
#recruit .find .completeBox .label input.zoom,
#recruit .join form label:not(.check) input.zoom,
#recruit .join form .label input.zoom,
#recruit .join .completeBox label:not(.check) input.zoom,
#recruit .join .completeBox .label input.zoom,
#recruit .complete form label:not(.check) input.zoom,
#recruit .complete form .label input.zoom,
#recruit .complete .completeBox label:not(.check) input.zoom,
#recruit .complete .completeBox .label input.zoom, .recruit .find form label:not(.check) input.zoom,
.recruit .find form .label input.zoom, .recruit .find .completeBox label:not(.check) input.zoom,
.recruit .find .completeBox .label input.zoom,
.recruit .join form label:not(.check) input.zoom,
.recruit .join form .label input.zoom,
.recruit .join .completeBox label:not(.check) input.zoom,
.recruit .join .completeBox .label input.zoom,
.recruit .complete form label:not(.check) input.zoom,
.recruit .complete form .label input.zoom,
.recruit .complete .completeBox label:not(.check) input.zoom,
.recruit .complete .completeBox .label input.zoom, #recruit .loginWrap .login form label input.zoom, .recruit .loginWrap .login form label input.zoom, #recruit .selectjob .form .application > section .input input.zoom, .recruit .selectjob .form .application > section .input input.zoom, #recruit .form > section .input input.zoom, .recruit .form > section .input input.zoom, #recruit .container #inquiry form.inquiry > section .input input.zoom, .recruit .container #inquiry form.inquiry > section .input input.zoom, #contents.contact .inquiry > section .input input.zoom, #contents.research .application > section .input input.zoom, .popup > div .full .inputTxt input.zoom, #recruit .find form label:not(.check) textarea.zoom,
#recruit .find form .label textarea.zoom, #recruit .find .completeBox label:not(.check) textarea.zoom,
#recruit .find .completeBox .label textarea.zoom,
#recruit .join form label:not(.check) textarea.zoom,
#recruit .join form .label textarea.zoom,
#recruit .join .completeBox label:not(.check) textarea.zoom,
#recruit .join .completeBox .label textarea.zoom,
#recruit .complete form label:not(.check) textarea.zoom,
#recruit .complete form .label textarea.zoom,
#recruit .complete .completeBox label:not(.check) textarea.zoom,
#recruit .complete .completeBox .label textarea.zoom, .recruit .find form label:not(.check) textarea.zoom,
.recruit .find form .label textarea.zoom, .recruit .find .completeBox label:not(.check) textarea.zoom,
.recruit .find .completeBox .label textarea.zoom,
.recruit .join form label:not(.check) textarea.zoom,
.recruit .join form .label textarea.zoom,
.recruit .join .completeBox label:not(.check) textarea.zoom,
.recruit .join .completeBox .label textarea.zoom,
.recruit .complete form label:not(.check) textarea.zoom,
.recruit .complete form .label textarea.zoom,
.recruit .complete .completeBox label:not(.check) textarea.zoom,
.recruit .complete .completeBox .label textarea.zoom, #recruit .loginWrap .login form label textarea.zoom, .recruit .loginWrap .login form label textarea.zoom, #recruit .selectjob .form .application > section .input textarea.zoom, .recruit .selectjob .form .application > section .input textarea.zoom, #recruit .form > section .input textarea.zoom, .recruit .form > section .input textarea.zoom, #recruit .container #inquiry form.inquiry > section .input textarea.zoom, .recruit .container #inquiry form.inquiry > section .input textarea.zoom, #contents.contact .inquiry > section .input textarea.zoom, #contents.research .application > section .input textarea.zoom, .popup > div .full .inputTxt textarea.zoom {
  background-image: url("../images/icon/iconZoom3.svg");
  background-repeat: no-repeat;
  background-position: right 17px center;
}
#recruit .find form label:not(.check) input:disabled,
#recruit .find form .label input:disabled, #recruit .find .completeBox label:not(.check) input:disabled,
#recruit .find .completeBox .label input:disabled,
#recruit .join form label:not(.check) input:disabled,
#recruit .join form .label input:disabled,
#recruit .join .completeBox label:not(.check) input:disabled,
#recruit .join .completeBox .label input:disabled,
#recruit .complete form label:not(.check) input:disabled,
#recruit .complete form .label input:disabled,
#recruit .complete .completeBox label:not(.check) input:disabled,
#recruit .complete .completeBox .label input:disabled, .recruit .find form label:not(.check) input:disabled,
.recruit .find form .label input:disabled, .recruit .find .completeBox label:not(.check) input:disabled,
.recruit .find .completeBox .label input:disabled,
.recruit .join form label:not(.check) input:disabled,
.recruit .join form .label input:disabled,
.recruit .join .completeBox label:not(.check) input:disabled,
.recruit .join .completeBox .label input:disabled,
.recruit .complete form label:not(.check) input:disabled,
.recruit .complete form .label input:disabled,
.recruit .complete .completeBox label:not(.check) input:disabled,
.recruit .complete .completeBox .label input:disabled, #recruit .loginWrap .login form label input:disabled, .recruit .loginWrap .login form label input:disabled, #recruit .selectjob .form .application > section .input input:disabled, .recruit .selectjob .form .application > section .input input:disabled, #recruit .form > section .input input:disabled, .recruit .form > section .input input:disabled, #recruit .container #inquiry form.inquiry > section .input input:disabled, .recruit .container #inquiry form.inquiry > section .input input:disabled, #contents.contact .inquiry > section .input input:disabled, #contents.research .application > section .input input:disabled, .popup > div .full .inputTxt input:disabled, #recruit .find form label:not(.check) textarea:disabled,
#recruit .find form .label textarea:disabled, #recruit .find .completeBox label:not(.check) textarea:disabled,
#recruit .find .completeBox .label textarea:disabled,
#recruit .join form label:not(.check) textarea:disabled,
#recruit .join form .label textarea:disabled,
#recruit .join .completeBox label:not(.check) textarea:disabled,
#recruit .join .completeBox .label textarea:disabled,
#recruit .complete form label:not(.check) textarea:disabled,
#recruit .complete form .label textarea:disabled,
#recruit .complete .completeBox label:not(.check) textarea:disabled,
#recruit .complete .completeBox .label textarea:disabled, .recruit .find form label:not(.check) textarea:disabled,
.recruit .find form .label textarea:disabled, .recruit .find .completeBox label:not(.check) textarea:disabled,
.recruit .find .completeBox .label textarea:disabled,
.recruit .join form label:not(.check) textarea:disabled,
.recruit .join form .label textarea:disabled,
.recruit .join .completeBox label:not(.check) textarea:disabled,
.recruit .join .completeBox .label textarea:disabled,
.recruit .complete form label:not(.check) textarea:disabled,
.recruit .complete form .label textarea:disabled,
.recruit .complete .completeBox label:not(.check) textarea:disabled,
.recruit .complete .completeBox .label textarea:disabled, #recruit .loginWrap .login form label textarea:disabled, .recruit .loginWrap .login form label textarea:disabled, #recruit .selectjob .form .application > section .input textarea:disabled, .recruit .selectjob .form .application > section .input textarea:disabled, #recruit .form > section .input textarea:disabled, .recruit .form > section .input textarea:disabled, #recruit .container #inquiry form.inquiry > section .input textarea:disabled, .recruit .container #inquiry form.inquiry > section .input textarea:disabled, #contents.contact .inquiry > section .input textarea:disabled, #contents.research .application > section .input textarea:disabled, .popup > div .full .inputTxt textarea:disabled {
  background: #f9f9f9;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check) input,
  #recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox .label input,
  #recruit .join form label:not(.check) input,
  #recruit .join form .label input,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox .label input,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form .label input,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
  .recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox .label input,
  .recruit .join form label:not(.check) input,
  .recruit .join form .label input,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox .label input,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form .label input,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
  #recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
  #recruit .find .completeBox .label textarea,
  #recruit .join form label:not(.check) textarea,
  #recruit .join form .label textarea,
  #recruit .join .completeBox label:not(.check) textarea,
  #recruit .join .completeBox .label textarea,
  #recruit .complete form label:not(.check) textarea,
  #recruit .complete form .label textarea,
  #recruit .complete .completeBox label:not(.check) textarea,
  #recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
  .recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
  .recruit .find .completeBox .label textarea,
  .recruit .join form label:not(.check) textarea,
  .recruit .join form .label textarea,
  .recruit .join .completeBox label:not(.check) textarea,
  .recruit .join .completeBox .label textarea,
  .recruit .complete form label:not(.check) textarea,
  .recruit .complete form .label textarea,
  .recruit .complete .completeBox label:not(.check) textarea,
  .recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea {
    height: 54px;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 52px;
  }
  #recruit .find form label:not(.check) .reset,
  #recruit .find form .label .reset, #recruit .find .completeBox label:not(.check) .reset,
  #recruit .find .completeBox .label .reset,
  #recruit .join form label:not(.check) .reset,
  #recruit .join form .label .reset,
  #recruit .join .completeBox label:not(.check) .reset,
  #recruit .join .completeBox .label .reset,
  #recruit .complete form label:not(.check) .reset,
  #recruit .complete form .label .reset,
  #recruit .complete .completeBox label:not(.check) .reset,
  #recruit .complete .completeBox .label .reset, .recruit .find form label:not(.check) .reset,
  .recruit .find form .label .reset, .recruit .find .completeBox label:not(.check) .reset,
  .recruit .find .completeBox .label .reset,
  .recruit .join form label:not(.check) .reset,
  .recruit .join form .label .reset,
  .recruit .join .completeBox label:not(.check) .reset,
  .recruit .join .completeBox .label .reset,
  .recruit .complete form label:not(.check) .reset,
  .recruit .complete form .label .reset,
  .recruit .complete .completeBox label:not(.check) .reset,
  .recruit .complete .completeBox .label .reset, #recruit .loginWrap .login form label .reset, .recruit .loginWrap .login form label .reset, #recruit .selectjob .form .application > section .input .reset, .recruit .selectjob .form .application > section .input .reset, #recruit .form > section .input .reset, .recruit .form > section .input .reset, #recruit .container #inquiry form.inquiry > section .input .reset, .recruit .container #inquiry form.inquiry > section .input .reset, #contents.contact .inquiry > section .input .reset, #contents.research .application > section .input .reset, .popup > div .full .inputTxt .reset {
    right: 20px;
  }
  #recruit .find form label:not(.check) input.zoom ~ .reset,
  #recruit .find form .label input.zoom ~ .reset, #recruit .find .completeBox label:not(.check) input.zoom ~ .reset,
  #recruit .find .completeBox .label input.zoom ~ .reset,
  #recruit .join form label:not(.check) input.zoom ~ .reset,
  #recruit .join form .label input.zoom ~ .reset,
  #recruit .join .completeBox label:not(.check) input.zoom ~ .reset,
  #recruit .join .completeBox .label input.zoom ~ .reset,
  #recruit .complete form label:not(.check) input.zoom ~ .reset,
  #recruit .complete form .label input.zoom ~ .reset,
  #recruit .complete .completeBox label:not(.check) input.zoom ~ .reset,
  #recruit .complete .completeBox .label input.zoom ~ .reset, .recruit .find form label:not(.check) input.zoom ~ .reset,
  .recruit .find form .label input.zoom ~ .reset, .recruit .find .completeBox label:not(.check) input.zoom ~ .reset,
  .recruit .find .completeBox .label input.zoom ~ .reset,
  .recruit .join form label:not(.check) input.zoom ~ .reset,
  .recruit .join form .label input.zoom ~ .reset,
  .recruit .join .completeBox label:not(.check) input.zoom ~ .reset,
  .recruit .join .completeBox .label input.zoom ~ .reset,
  .recruit .complete form label:not(.check) input.zoom ~ .reset,
  .recruit .complete form .label input.zoom ~ .reset,
  .recruit .complete .completeBox label:not(.check) input.zoom ~ .reset,
  .recruit .complete .completeBox .label input.zoom ~ .reset, #recruit .loginWrap .login form label input.zoom ~ .reset, .recruit .loginWrap .login form label input.zoom ~ .reset, #recruit .selectjob .form .application > section .input input.zoom ~ .reset, .recruit .selectjob .form .application > section .input input.zoom ~ .reset, #recruit .form > section .input input.zoom ~ .reset, .recruit .form > section .input input.zoom ~ .reset, #recruit .container #inquiry form.inquiry > section .input input.zoom ~ .reset, .recruit .container #inquiry form.inquiry > section .input input.zoom ~ .reset, #contents.contact .inquiry > section .input input.zoom ~ .reset, #contents.research .application > section .input input.zoom ~ .reset, .popup > div .full .inputTxt input.zoom ~ .reset {
    right: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check) input,
  #recruit .find form .label input, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox .label input,
  #recruit .join form label:not(.check) input,
  #recruit .join form .label input,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox .label input,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form .label input,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox .label input, .recruit .find form label:not(.check) input,
  .recruit .find form .label input, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox .label input,
  .recruit .join form label:not(.check) input,
  .recruit .join form .label input,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox .label input,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form .label input,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox .label input, #recruit .loginWrap .login form label input, .recruit .loginWrap .login form label input, #recruit .selectjob .form .application > section .input input, .recruit .selectjob .form .application > section .input input, #recruit .form > section .input input, .recruit .form > section .input input, #recruit .container #inquiry form.inquiry > section .input input, .recruit .container #inquiry form.inquiry > section .input input, #contents.contact .inquiry > section .input input, #contents.research .application > section .input input, .popup > div .full .inputTxt input, #recruit .find form label:not(.check) textarea,
  #recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
  #recruit .find .completeBox .label textarea,
  #recruit .join form label:not(.check) textarea,
  #recruit .join form .label textarea,
  #recruit .join .completeBox label:not(.check) textarea,
  #recruit .join .completeBox .label textarea,
  #recruit .complete form label:not(.check) textarea,
  #recruit .complete form .label textarea,
  #recruit .complete .completeBox label:not(.check) textarea,
  #recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
  .recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
  .recruit .find .completeBox .label textarea,
  .recruit .join form label:not(.check) textarea,
  .recruit .join form .label textarea,
  .recruit .join .completeBox label:not(.check) textarea,
  .recruit .join .completeBox .label textarea,
  .recruit .complete form label:not(.check) textarea,
  .recruit .complete form .label textarea,
  .recruit .complete .completeBox label:not(.check) textarea,
  .recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea {
    height: 40px;
    padding-left: 15px;
    padding-right: 15px;
    line-height: 38px;
  }
  #recruit .find form label:not(.check) .reset,
  #recruit .find form .label .reset, #recruit .find .completeBox label:not(.check) .reset,
  #recruit .find .completeBox .label .reset,
  #recruit .join form label:not(.check) .reset,
  #recruit .join form .label .reset,
  #recruit .join .completeBox label:not(.check) .reset,
  #recruit .join .completeBox .label .reset,
  #recruit .complete form label:not(.check) .reset,
  #recruit .complete form .label .reset,
  #recruit .complete .completeBox label:not(.check) .reset,
  #recruit .complete .completeBox .label .reset, .recruit .find form label:not(.check) .reset,
  .recruit .find form .label .reset, .recruit .find .completeBox label:not(.check) .reset,
  .recruit .find .completeBox .label .reset,
  .recruit .join form label:not(.check) .reset,
  .recruit .join form .label .reset,
  .recruit .join .completeBox label:not(.check) .reset,
  .recruit .join .completeBox .label .reset,
  .recruit .complete form label:not(.check) .reset,
  .recruit .complete form .label .reset,
  .recruit .complete .completeBox label:not(.check) .reset,
  .recruit .complete .completeBox .label .reset, #recruit .loginWrap .login form label .reset, .recruit .loginWrap .login form label .reset, #recruit .selectjob .form .application > section .input .reset, .recruit .selectjob .form .application > section .input .reset, #recruit .form > section .input .reset, .recruit .form > section .input .reset, #recruit .container #inquiry form.inquiry > section .input .reset, .recruit .container #inquiry form.inquiry > section .input .reset, #contents.contact .inquiry > section .input .reset, #contents.research .application > section .input .reset, .popup > div .full .inputTxt .reset {
    right: 15px;
  }
  #recruit .find form label:not(.check) .zoom + .reset,
  #recruit .find form .label .zoom + .reset, #recruit .find .completeBox label:not(.check) .zoom + .reset,
  #recruit .find .completeBox .label .zoom + .reset,
  #recruit .join form label:not(.check) .zoom + .reset,
  #recruit .join form .label .zoom + .reset,
  #recruit .join .completeBox label:not(.check) .zoom + .reset,
  #recruit .join .completeBox .label .zoom + .reset,
  #recruit .complete form label:not(.check) .zoom + .reset,
  #recruit .complete form .label .zoom + .reset,
  #recruit .complete .completeBox label:not(.check) .zoom + .reset,
  #recruit .complete .completeBox .label .zoom + .reset, .recruit .find form label:not(.check) .zoom + .reset,
  .recruit .find form .label .zoom + .reset, .recruit .find .completeBox label:not(.check) .zoom + .reset,
  .recruit .find .completeBox .label .zoom + .reset,
  .recruit .join form label:not(.check) .zoom + .reset,
  .recruit .join form .label .zoom + .reset,
  .recruit .join .completeBox label:not(.check) .zoom + .reset,
  .recruit .join .completeBox .label .zoom + .reset,
  .recruit .complete form label:not(.check) .zoom + .reset,
  .recruit .complete form .label .zoom + .reset,
  .recruit .complete .completeBox label:not(.check) .zoom + .reset,
  .recruit .complete .completeBox .label .zoom + .reset, #recruit .loginWrap .login form label .zoom + .reset, .recruit .loginWrap .login form label .zoom + .reset, #recruit .selectjob .form .application > section .input .zoom + .reset, .recruit .selectjob .form .application > section .input .zoom + .reset, #recruit .form > section .input .zoom + .reset, .recruit .form > section .input .zoom + .reset, #recruit .container #inquiry form.inquiry > section .input .zoom + .reset, .recruit .container #inquiry form.inquiry > section .input .zoom + .reset, #contents.contact .inquiry > section .input .zoom + .reset, #contents.research .application > section .input .zoom + .reset, .popup > div .full .inputTxt .zoom + .reset {
    right: 50px;
  }
}
@media (max-width: 480px) {
  #recruit .find form label:not(.check) textarea,
  #recruit .find form .label textarea, #recruit .find .completeBox label:not(.check) textarea,
  #recruit .find .completeBox .label textarea,
  #recruit .join form label:not(.check) textarea,
  #recruit .join form .label textarea,
  #recruit .join .completeBox label:not(.check) textarea,
  #recruit .join .completeBox .label textarea,
  #recruit .complete form label:not(.check) textarea,
  #recruit .complete form .label textarea,
  #recruit .complete .completeBox label:not(.check) textarea,
  #recruit .complete .completeBox .label textarea, .recruit .find form label:not(.check) textarea,
  .recruit .find form .label textarea, .recruit .find .completeBox label:not(.check) textarea,
  .recruit .find .completeBox .label textarea,
  .recruit .join form label:not(.check) textarea,
  .recruit .join form .label textarea,
  .recruit .join .completeBox label:not(.check) textarea,
  .recruit .join .completeBox .label textarea,
  .recruit .complete form label:not(.check) textarea,
  .recruit .complete form .label textarea,
  .recruit .complete .completeBox label:not(.check) textarea,
  .recruit .complete .completeBox .label textarea, #recruit .loginWrap .login form label textarea, .recruit .loginWrap .login form label textarea, #recruit .selectjob .form .application > section .input textarea, .recruit .selectjob .form .application > section .input textarea, #recruit .form > section .input textarea, .recruit .form > section .input textarea, #recruit .container #inquiry form.inquiry > section .input textarea, .recruit .container #inquiry form.inquiry > section .input textarea, #contents.contact .inquiry > section .input textarea, #contents.research .application > section .input textarea, .popup > div .full .inputTxt textarea {
    height: 60px !important;
    padding-top: 12px;
    line-height: 17px;
  }
}

#recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div {
  position: relative;
  padding-right: 100px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: #f9f9f9;
}
#recruit .selectjob .form .application > section .file > div p span, .recruit .selectjob .form .application > section .file > div p span, #recruit .form > section .file > div p span, .recruit .form > section .file > div p span, #recruit .container #inquiry form.inquiry > section .file > div p span, .recruit .container #inquiry form.inquiry > section .file > div p span, #contents.contact .inquiry > section .file > div p span, #contents.research .application > section .file > div p span {
  display: inline-block !important;
  max-width: calc(100% - 30px);
  padding-right: 15px;
}
#recruit .selectjob .form .application > section .file > div p button, .recruit .selectjob .form .application > section .file > div p button, #recruit .form > section .file > div p button, .recruit .form > section .file > div p button, #recruit .container #inquiry form.inquiry > section .file > div p button, .recruit .container #inquiry form.inquiry > section .file > div p button, #contents.contact .inquiry > section .file > div p button, #contents.research .application > section .file > div p button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 20px;
  height: 20px;
  border: 1px solid #c8c8c8;
  border-radius: 2px;
}
#recruit .selectjob .form .application > section .file > div p button:not(.active), .recruit .selectjob .form .application > section .file > div p button:not(.active), #recruit .form > section .file > div p button:not(.active), .recruit .form > section .file > div p button:not(.active), #recruit .container #inquiry form.inquiry > section .file > div p button:not(.active), .recruit .container #inquiry form.inquiry > section .file > div p button:not(.active), #contents.contact .inquiry > section .file > div p button:not(.active), #contents.research .application > section .file > div p button:not(.active) {
  display: none;
}
#recruit .selectjob .form .application > section .file > div p button::before, .recruit .selectjob .form .application > section .file > div p button::before, #recruit .form > section .file > div p button::before, .recruit .form > section .file > div p button::before, #recruit .container #inquiry form.inquiry > section .file > div p button::before, .recruit .container #inquiry form.inquiry > section .file > div p button::before, #contents.contact .inquiry > section .file > div p button::before, #contents.research .application > section .file > div p button::before, #recruit .selectjob .form .application > section .file > div p button::after, .recruit .selectjob .form .application > section .file > div p button::after, #recruit .form > section .file > div p button::after, .recruit .form > section .file > div p button::after, #recruit .container #inquiry form.inquiry > section .file > div p button::after, .recruit .container #inquiry form.inquiry > section .file > div p button::after, #contents.contact .inquiry > section .file > div p button::after, #contents.research .application > section .file > div p button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 11px;
  height: 1px;
  background: #666;
}
#recruit .selectjob .form .application > section .file > div p button::before, .recruit .selectjob .form .application > section .file > div p button::before, #recruit .form > section .file > div p button::before, .recruit .form > section .file > div p button::before, #recruit .container #inquiry form.inquiry > section .file > div p button::before, .recruit .container #inquiry form.inquiry > section .file > div p button::before, #contents.contact .inquiry > section .file > div p button::before, #contents.research .application > section .file > div p button::before {
  transform: rotate(45deg);
}
#recruit .selectjob .form .application > section .file > div p button::after, .recruit .selectjob .form .application > section .file > div p button::after, #recruit .form > section .file > div p button::after, .recruit .form > section .file > div p button::after, #recruit .container #inquiry form.inquiry > section .file > div p button::after, .recruit .container #inquiry form.inquiry > section .file > div p button::after, #contents.contact .inquiry > section .file > div p button::after, #contents.research .application > section .file > div p button::after {
  transform: rotate(-45deg);
}
#recruit .selectjob .form .application > section .file > div label, .recruit .selectjob .form .application > section .file > div label, #recruit .form > section .file > div label, .recruit .form > section .file > div label, #recruit .container #inquiry form.inquiry > section .file > div label, .recruit .container #inquiry form.inquiry > section .file > div label, #contents.contact .inquiry > section .file > div label, #contents.research .application > section .file > div label {
  position: absolute;
  top: 0;
  right: 0;
  width: 100px;
  border-left: 1px solid #c8c8c8;
  text-align: center;
  cursor: pointer;
}
#recruit .selectjob .form .application > section .file > div label input, .recruit .selectjob .form .application > section .file > div label input, #recruit .form > section .file > div label input, .recruit .form > section .file > div label input, #recruit .container #inquiry form.inquiry > section .file > div label input, .recruit .container #inquiry form.inquiry > section .file > div label input, #contents.contact .inquiry > section .file > div label input, #contents.research .application > section .file > div label input {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div {
    height: 54px;
    line-height: 52px;
  }
  #recruit .selectjob .form .application > section .file > div p span, .recruit .selectjob .form .application > section .file > div p span, #recruit .form > section .file > div p span, .recruit .form > section .file > div p span, #recruit .container #inquiry form.inquiry > section .file > div p span, .recruit .container #inquiry form.inquiry > section .file > div p span, #contents.contact .inquiry > section .file > div p span, #contents.research .application > section .file > div p span {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 3.25em;
    line-height: 3.25 !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
    padding-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section .file > div, .recruit .selectjob .form .application > section .file > div, #recruit .form > section .file > div, .recruit .form > section .file > div, #recruit .container #inquiry form.inquiry > section .file > div, .recruit .container #inquiry form.inquiry > section .file > div, #contents.contact .inquiry > section .file > div, #contents.research .application > section .file > div {
    height: 50px;
    line-height: 48px;
  }
  #recruit .selectjob .form .application > section .file > div p span, .recruit .selectjob .form .application > section .file > div p span, #recruit .form > section .file > div p span, .recruit .form > section .file > div p span, #recruit .container #inquiry form.inquiry > section .file > div p span, .recruit .container #inquiry form.inquiry > section .file > div p span, #contents.contact .inquiry > section .file > div p span, #contents.research .application > section .file > div p span {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 3.4285em;
    line-height: 3.4285 !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
    padding-left: 15px;
  }
}

#recruit .selectjob .form .application > section .textarea, .recruit .selectjob .form .application > section .textarea, #recruit .form > section .textarea, .recruit .form > section .textarea, #recruit .container #inquiry form.inquiry > section .textarea, .recruit .container #inquiry form.inquiry > section .textarea, #contents.contact .inquiry > section .textarea, #contents.research .application > section .textarea {
  position: relative;
}
#recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea {
  width: 100%;
  padding-top: 15px;
  padding-bottom: 15px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
}
#recruit .selectjob .form .application > section .textarea textarea:focus, .recruit .selectjob .form .application > section .textarea textarea:focus, #recruit .form > section .textarea textarea:focus, .recruit .form > section .textarea textarea:focus, #recruit .container #inquiry form.inquiry > section .textarea textarea:focus, .recruit .container #inquiry form.inquiry > section .textarea textarea:focus, #contents.contact .inquiry > section .textarea textarea:focus, #contents.research .application > section .textarea textarea:focus {
  outline: none;
  border-color: #4415a0;
}
#recruit .selectjob .form .application > section .textarea p, .recruit .selectjob .form .application > section .textarea p, #recruit .form > section .textarea p, .recruit .form > section .textarea p, #recruit .container #inquiry form.inquiry > section .textarea p, .recruit .container #inquiry form.inquiry > section .textarea p, #contents.contact .inquiry > section .textarea p, #contents.research .application > section .textarea p {
  text-align: right;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: #666;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea {
    height: 260px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section .textarea textarea, .recruit .selectjob .form .application > section .textarea textarea, #recruit .form > section .textarea textarea, .recruit .form > section .textarea textarea, #recruit .container #inquiry form.inquiry > section .textarea textarea, .recruit .container #inquiry form.inquiry > section .textarea textarea, #contents.contact .inquiry > section .textarea textarea, #contents.research .application > section .textarea textarea {
    height: 120px;
    padding-left: 15px;
    padding-right: 15px;
  }
}

#recruit .join label.check, .recruit .join label.check, #recruit .selectjob .form .application > section .terms label, .recruit .selectjob .form .application > section .terms label, #recruit .form > section .terms label, .recruit .form > section .terms label, #recruit .container #inquiry form.inquiry > section .terms label, .recruit .container #inquiry form.inquiry > section .terms label, #contents.contact .inquiry > section .terms label, #contents.research .application > section .terms label {
  position: relative;
  display: inline-block;
  padding-left: 36px;
}
#recruit .join label.check input, .recruit .join label.check input, #recruit .selectjob .form .application > section .terms label input, .recruit .selectjob .form .application > section .terms label input, #recruit .form > section .terms label input, .recruit .form > section .terms label input, #recruit .container #inquiry form.inquiry > section .terms label input, .recruit .container #inquiry form.inquiry > section .terms label input, #contents.contact .inquiry > section .terms label input, #contents.research .application > section .terms label input {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#recruit .join label.check span, .recruit .join label.check span, #recruit .selectjob .form .application > section .terms label span, .recruit .selectjob .form .application > section .terms label span, #recruit .form > section .terms label span, .recruit .form > section .terms label span, #recruit .container #inquiry form.inquiry > section .terms label span, .recruit .container #inquiry form.inquiry > section .terms label span, #contents.contact .inquiry > section .terms label span, #contents.research .application > section .terms label span {
  font-size: 16px;
  line-height: 24px;
  color: #666;
}
#recruit .join label.check span::before, .recruit .join label.check span::before, #recruit .selectjob .form .application > section .terms label span::before, .recruit .selectjob .form .application > section .terms label span::before, #recruit .form > section .terms label span::before, .recruit .form > section .terms label span::before, #recruit .container #inquiry form.inquiry > section .terms label span::before, .recruit .container #inquiry form.inquiry > section .terms label span::before, #contents.contact .inquiry > section .terms label span::before, #contents.research .application > section .terms label span::before, #recruit .join label.check span::after, .recruit .join label.check span::after, #recruit .selectjob .form .application > section .terms label span::after, .recruit .selectjob .form .application > section .terms label span::after, #recruit .form > section .terms label span::after, .recruit .form > section .terms label span::after, #recruit .container #inquiry form.inquiry > section .terms label span::after, .recruit .container #inquiry form.inquiry > section .terms label span::after, #contents.contact .inquiry > section .terms label span::after, #contents.research .application > section .terms label span::after {
  content: "";
  position: absolute;
}
#recruit .join label.check span::before, .recruit .join label.check span::before, #recruit .selectjob .form .application > section .terms label span::before, .recruit .selectjob .form .application > section .terms label span::before, #recruit .form > section .terms label span::before, .recruit .form > section .terms label span::before, #recruit .container #inquiry form.inquiry > section .terms label span::before, .recruit .container #inquiry form.inquiry > section .terms label span::before, #contents.contact .inquiry > section .terms label span::before, #contents.research .application > section .terms label span::before {
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  border: 1px solid #c8c8c8;
  border-radius: 2px;
}
#recruit .join label.check input:checked + span, .recruit .join label.check input:checked + span, #recruit .selectjob .form .application > section .terms label input:checked + span, .recruit .selectjob .form .application > section .terms label input:checked + span, #recruit .form > section .terms label input:checked + span, .recruit .form > section .terms label input:checked + span, #recruit .container #inquiry form.inquiry > section .terms label input:checked + span, .recruit .container #inquiry form.inquiry > section .terms label input:checked + span, #contents.contact .inquiry > section .terms label input:checked + span, #contents.research .application > section .terms label input:checked + span {
  color: #212121;
}
#recruit .join label.check input:checked + span::before, .recruit .join label.check input:checked + span::before, #recruit .selectjob .form .application > section .terms label input:checked + span::before, .recruit .selectjob .form .application > section .terms label input:checked + span::before, #recruit .form > section .terms label input:checked + span::before, .recruit .form > section .terms label input:checked + span::before, #recruit .container #inquiry form.inquiry > section .terms label input:checked + span::before, .recruit .container #inquiry form.inquiry > section .terms label input:checked + span::before, #contents.contact .inquiry > section .terms label input:checked + span::before, #contents.research .application > section .terms label input:checked + span::before {
  border: 0;
  background: #4415a0;
}
#recruit .join label.check input:checked + span::after, .recruit .join label.check input:checked + span::after, #recruit .selectjob .form .application > section .terms label input:checked + span::after, .recruit .selectjob .form .application > section .terms label input:checked + span::after, #recruit .form > section .terms label input:checked + span::after, .recruit .form > section .terms label input:checked + span::after, #recruit .container #inquiry form.inquiry > section .terms label input:checked + span::after, .recruit .container #inquiry form.inquiry > section .terms label input:checked + span::after, #contents.contact .inquiry > section .terms label input:checked + span::after, #contents.research .application > section .terms label input:checked + span::after {
  top: 6px;
  left: 6px;
  width: 13px;
  height: 7px;
  border-style: solid;
  border-color: #fff;
  border-width: 0 0 2px 2px;
  transform: rotate(-45deg);
}

#recruit .selectjob .form .application > section .radio > label, .recruit .selectjob .form .application > section .radio > label, #recruit .form > section .radio > label, .recruit .form > section .radio > label, #recruit .container #inquiry form.inquiry > section .radio > label, .recruit .container #inquiry form.inquiry > section .radio > label, #contents.contact .inquiry > section .radio > label, #contents.research .application > section .radio > label {
  cursor: pointer;
}
#recruit .selectjob .form .application > section .radio > label + label, .recruit .selectjob .form .application > section .radio > label + label, #recruit .form > section .radio > label + label, .recruit .form > section .radio > label + label, #recruit .container #inquiry form.inquiry > section .radio > label + label, .recruit .container #inquiry form.inquiry > section .radio > label + label, #contents.contact .inquiry > section .radio > label + label, #contents.research .application > section .radio > label + label {
  margin-left: 10px;
}
#recruit .selectjob .form .application > section .radio > label input, .recruit .selectjob .form .application > section .radio > label input, #recruit .form > section .radio > label input, .recruit .form > section .radio > label input, #recruit .container #inquiry form.inquiry > section .radio > label input, .recruit .container #inquiry form.inquiry > section .radio > label input, #contents.contact .inquiry > section .radio > label input, #contents.research .application > section .radio > label input {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#recruit .selectjob .form .application > section .radio > label span, .recruit .selectjob .form .application > section .radio > label span, #recruit .form > section .radio > label span, .recruit .form > section .radio > label span, #recruit .container #inquiry form.inquiry > section .radio > label span, .recruit .container #inquiry form.inquiry > section .radio > label span, #contents.contact .inquiry > section .radio > label span, #contents.research .application > section .radio > label span {
  display: inline-block;
}
#recruit .selectjob .form .application > section .radio > label input:checked + span, .recruit .selectjob .form .application > section .radio > label input:checked + span, #recruit .form > section .radio > label input:checked + span, .recruit .form > section .radio > label input:checked + span, #recruit .container #inquiry form.inquiry > section .radio > label input:checked + span, .recruit .container #inquiry form.inquiry > section .radio > label input:checked + span, #contents.contact .inquiry > section .radio > label input:checked + span, #contents.research .application > section .radio > label input:checked + span {
  border-color: #4415a0;
  color: #4415a0;
}

.hasDatepicker {
  background-image: url("../images/icon/iconCalendar.svg") !important;
  background-repeat: no-repeat !important;
  background-position: right 20px center !important;
}
@media (min-width: 1025px) {
  .hasDatepicker {
    background-size: 34px !important;
  }
}
@media (max-width: 1024px) {
  .hasDatepicker {
    background-size: 24px !important;
  }
}

.switch-container {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.switch-container i {
  display: inline-block;
  position: relative;
  top: -9px;
}
.switch-container .btn-color-mode-switch {
  display: inline-block;
  margin: 0px;
  position: relative;
}
.switch-container .btn-color-mode-switch > label.btn-color-mode-switch-inner {
  margin: 0px;
  width: 140px;
  height: 30px;
  /* background: #e0e0e0; */
  border: 1px solid #ddd;
  border-radius: 26px;
  overflow: hidden;
  position: relative;
  transition: all 0.3s ease;
  /*box-shadow: 0px 0px 8px 0px rgba(17, 17, 17, 0.34) inset;*/
  display: block;
}
.switch-container .btn-color-mode-switch > label.btn-color-mode-switch-inner:before {
  content: attr(data-on);
  position: absolute;
  font-size: 12px;
  font-weight: 500;
  top: 7px;
  right: 20px;
}
.switch-container .btn-color-mode-switch > label.btn-color-mode-switch-inner:after {
  content: attr(data-off);
  width: 70px;
  background: #fff;
  border-radius: 26px;
  position: absolute;
  left: 0;
  top: -1px;
  bottom: -1px;
  text-align: center;
  transition: all 0.3s ease;
  border: 1px solid #ddd;
  padding: 5px 0px;
}
.switch-container .btn-color-mode-switch > .alert {
  display: none;
  background: #ff9800;
  border: none;
  color: #fff;
}
.switch-container input[type=checkbox] {
  cursor: pointer;
  width: 50px;
  height: 25px;
  opacity: 0;
  position: absolute;
  top: 0;
  z-index: 1;
  margin: 0px;
}
.switch-container input[type=checkbox]:checked + label.btn-color-mode-switch-inner:after {
  content: attr(data-on);
  left: 68px;
}
.switch-container input[type=checkbox]:checked + label.btn-color-mode-switch-inner:before {
  content: attr(data-off);
  right: auto;
  left: 20px;
}
.switch-container input[type=checkbox]:checked ~ .alert {
  display: block;
}

#contents.hr .tab, #recruit .container .tab, .recruit .container .tab, #contents.crList .tab, #contents.location .tab, #contents.history .historyTab, #contents.cibi .tab,
#contents.ci .tab, #contents.statusList .tab, #contents.performance .tab, #contents.research .tab {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.hr .tab > div, #recruit .container .tab > div, .recruit .container .tab > div, #contents.crList .tab > div, #contents.location .tab > div, #contents.history .historyTab > div, #contents.cibi .tab > div,
#contents.ci .tab > div, #contents.statusList .tab > div, #contents.performance .tab > div, #contents.research .tab > div {
  position: relative;
}
#contents.hr .tab ul, #recruit .container .tab ul, .recruit .container .tab ul, #contents.crList .tab ul, #contents.location .tab ul, #contents.history .historyTab ul, #contents.cibi .tab ul,
#contents.ci .tab ul, #contents.statusList .tab ul, #contents.performance .tab ul, #contents.research .tab ul {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-right: 20px;
  white-space: nowrap;
}
#contents.hr .tab ul li, #recruit .container .tab ul li, .recruit .container .tab ul li, #contents.crList .tab ul li, #contents.location .tab ul li, #contents.history .historyTab ul li, #contents.cibi .tab ul li,
#contents.ci .tab ul li, #contents.statusList .tab ul li, #contents.performance .tab ul li, #contents.research .tab ul li {
  color: #666;
}
#contents.hr .tab ul li.active, #recruit .container .tab ul li.active, .recruit .container .tab ul li.active, #contents.crList .tab ul li.active, #contents.location .tab ul li.active, #contents.history .historyTab ul li.active, #contents.cibi .tab ul li.active,
#contents.ci .tab ul li.active, #contents.statusList .tab ul li.active, #contents.performance .tab ul li.active, #contents.research .tab ul li.active {
  font-weight: 700;
  color: #212121;
}
#contents.hr .tab ul li > *, #recruit .container .tab ul li > *, .recruit .container .tab ul li > *, #contents.crList .tab ul li > *, #contents.location .tab ul li > *, #contents.history .historyTab ul li > *, #contents.cibi .tab ul li > *,
#contents.ci .tab ul li > *, #contents.statusList .tab ul li > *, #contents.performance .tab ul li > *, #contents.research .tab ul li > * {
  display: block;
}
#contents.hr .tab .indicator, #recruit .container .tab .indicator, .recruit .container .tab .indicator, #contents.crList .tab .indicator, #contents.location .tab .indicator, #contents.history .historyTab .indicator, #contents.cibi .tab .indicator,
#contents.ci .tab .indicator, #contents.statusList .tab .indicator, #contents.performance .tab .indicator, #contents.research .tab .indicator {
  z-index: 1;
  position: absolute;
  bottom: 0;
  width: 0;
  height: 3px;
  border-radius: 2px;
  background: #4415a0;
  transition: all 0.3s;
}
@media (min-width: 1025px) {
  #contents.hr .tab, #recruit .container .tab, .recruit .container .tab, #contents.crList .tab, #contents.location .tab, #contents.history .historyTab, #contents.cibi .tab,
  #contents.ci .tab, #contents.statusList .tab, #contents.performance .tab, #contents.research .tab {
    margin-bottom: 90px;
  }
  #contents.hr .tab ul, #recruit .container .tab ul, .recruit .container .tab ul, #contents.crList .tab ul, #contents.location .tab ul, #contents.history .historyTab ul, #contents.cibi .tab ul,
  #contents.ci .tab ul, #contents.statusList .tab ul, #contents.performance .tab ul, #contents.research .tab ul {
    min-width: 100%;
    border-bottom: 2px solid #e5e5e5;
  }
  #contents.hr .tab ul li + li, #recruit .container .tab ul li + li, .recruit .container .tab ul li + li, #contents.crList .tab ul li + li, #contents.location .tab ul li + li, #contents.history .historyTab ul li + li, #contents.cibi .tab ul li + li,
  #contents.ci .tab ul li + li, #contents.statusList .tab ul li + li, #contents.performance .tab ul li + li, #contents.research .tab ul li + li {
    padding-left: 45px;
  }
  #contents.hr .tab ul li > *, #recruit .container .tab ul li > *, .recruit .container .tab ul li > *, #contents.crList .tab ul li > *, #contents.location .tab ul li > *, #contents.history .historyTab ul li > *, #contents.cibi .tab ul li > *,
  #contents.ci .tab ul li > *, #contents.statusList .tab ul li > *, #contents.performance .tab ul li > *, #contents.research .tab ul li > * {
    padding-bottom: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.hr .tab, #recruit .container .tab, .recruit .container .tab, #contents.crList .tab, #contents.location .tab, #contents.history .historyTab, #contents.cibi .tab,
  #contents.ci .tab, #contents.statusList .tab, #contents.performance .tab, #contents.research .tab {
    z-index: 9;
    position: sticky;
    top: 0;
    width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    margin-top: -15px;
    margin-bottom: 55px;
    padding-top: 15px;
    background: #fff;
  }
  #contents.hr .tab::-webkit-scrollbar, #recruit .container .tab::-webkit-scrollbar, .recruit .container .tab::-webkit-scrollbar, #contents.crList .tab::-webkit-scrollbar, #contents.location .tab::-webkit-scrollbar, #contents.history .historyTab::-webkit-scrollbar, #contents.cibi .tab::-webkit-scrollbar,
  #contents.ci .tab::-webkit-scrollbar, #contents.statusList .tab::-webkit-scrollbar, #contents.performance .tab::-webkit-scrollbar, #contents.research .tab::-webkit-scrollbar {
    display: none;
  }
  #contents.hr .tab ul, #recruit .container .tab ul, .recruit .container .tab ul, #contents.crList .tab ul, #contents.location .tab ul, #contents.history .historyTab ul, #contents.cibi .tab ul,
  #contents.ci .tab ul, #contents.statusList .tab ul, #contents.performance .tab ul, #contents.research .tab ul {
    margin-left: -20px;
    margin-right: -20px;
    min-width: calc(100% + 20px + 20px);
    padding-left: 20px;
    padding-right: 20px;
    border-bottom: 1px solid #e5e5e5;
  }
  #contents.hr .tab ul li + li, #recruit .container .tab ul li + li, .recruit .container .tab ul li + li, #contents.crList .tab ul li + li, #contents.location .tab ul li + li, #contents.history .historyTab ul li + li, #contents.cibi .tab ul li + li,
  #contents.ci .tab ul li + li, #contents.statusList .tab ul li + li, #contents.performance .tab ul li + li, #contents.research .tab ul li + li {
    padding-left: 35px;
  }
  #contents.hr .tab ul li > *, #recruit .container .tab ul li > *, .recruit .container .tab ul li > *, #contents.crList .tab ul li > *, #contents.location .tab ul li > *, #contents.history .historyTab ul li > *, #contents.cibi .tab ul li > *,
  #contents.ci .tab ul li > *, #contents.statusList .tab ul li > *, #contents.performance .tab ul li > *, #contents.research .tab ul li > * {
    padding-bottom: 15px;
  }
}

#contents.hr .tabTarget:not(.active), #recruit .container .tabTarget:not(.active), .recruit .container .tabTarget:not(.active), #contents.crList .tabTarget:not(.active), #contents.location .tabTarget:not(.active), #contents.cibi .tabTarget:not(.active),
#contents.ci .tabTarget:not(.active), #contents.statusList .tabTarget:not(.active), #contents.performance .tabTarget:not(.active), #contents.research .tabTarget:not(.active) {
  display: none;
}
#contents.hr .tabTarget > h1, #recruit .container .tabTarget > h1, .recruit .container .tabTarget > h1, #contents.crList .tabTarget > h1, #contents.location .tabTarget > h1, #contents.cibi .tabTarget > h1,
#contents.ci .tabTarget > h1, #contents.statusList .tabTarget > h1, #contents.performance .tabTarget > h1, #contents.research .tabTarget > h1 {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

#contents.benefits > .shortcutMiddle, #detailContents.portfolioDetail > .shortcutMiddle, #contents.develop > .shortcutMiddle {
  z-index: 2;
  position: sticky;
  top: 0;
  font-size: 18px;
}
#contents.benefits > .shortcutMiddle:not(.shortcutMiddle), #detailContents.portfolioDetail > .shortcutMiddle:not(.shortcutMiddle), #contents.develop > .shortcutMiddle:not(.shortcutMiddle) {
  display: none;
}
#contents.benefits > .shortcutMiddle > button, #detailContents.portfolioDetail > .shortcutMiddle > button, #contents.develop > .shortcutMiddle > button {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  min-width: 315px;
  padding: 0 20px;
  background: #4b4e83;
  text-align: left;
  line-height: 65px;
  color: #fff;
}
#contents.benefits > .shortcutMiddle > button::after, #detailContents.portfolioDetail > .shortcutMiddle > button::after, #contents.develop > .shortcutMiddle > button::after {
  content: "";
  display: block;
  background: url(../images/icon/iconArrowInvert.svg) no-repeat center;
  background-size: 100% auto;
  width: 32px;
  height: 32px;
}
#contents.benefits > .shortcutMiddle > button:not(.on)::after, #detailContents.portfolioDetail > .shortcutMiddle > button:not(.on)::after, #contents.develop > .shortcutMiddle > button:not(.on)::after {
  transform: rotate(180deg);
}
#contents.benefits > .shortcutMiddle > ul, #detailContents.portfolioDetail > .shortcutMiddle > ul, #contents.develop > .shortcutMiddle > ul {
  position: absolute;
  display: none;
  width: 100%;
  padding: 0 20px 30px;
  background: #f8f8f8;
}
#contents.benefits > .shortcutMiddle > ul button, #detailContents.portfolioDetail > .shortcutMiddle > ul button, #contents.develop > .shortcutMiddle > ul button {
  position: relative;
  margin-top: 25px;
  padding-left: 20px;
}
#contents.benefits > .shortcutMiddle > ul button:not(.active), #detailContents.portfolioDetail > .shortcutMiddle > ul button:not(.active), #contents.develop > .shortcutMiddle > ul button:not(.active) {
  opacity: 0.7;
}
#contents.benefits > .shortcutMiddle > ul button.active::before, #detailContents.portfolioDetail > .shortcutMiddle > ul button.active::before, #contents.develop > .shortcutMiddle > ul button.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #4415a0;
}

#contents.groupSt .pageNav, #contents.home .pageNav {
  position: fixed;
  right: 30px;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  margin: auto;
  width: 20px;
  height: 200px;
}
#contents.groupSt .pageNav button, #contents.home .pageNav button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 8px;
  height: 8px;
  background: #D9D9D9;
  border-radius: 50%;
}
#contents.groupSt .pageNav button + button, #contents.home .pageNav button + button {
  margin-top: 15px;
}
#contents.groupSt .pageNav button.active, #contents.home .pageNav button.active {
  width: 20px;
  height: 15px;
  background: url("../images/shinyoung/home/iconNav.svg") no-repeat center;
  border-radius: unset;
}
@media (max-width: 1024px) {
  #contents.groupSt .pageNav, #contents.home .pageNav {
    display: none;
  }
}

.toastMessage {
  z-index: 99999;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  background: rgba(0, 0, 0, 0.3);
}
.toastMessage p {
  padding: 0 20px;
  -ms-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.102);
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.102);
  background: #fff;
  text-align: center;
  color: #4415a0;
}
@media (min-width: 1025px) {
  .toastMessage p {
    width: 600px;
    height: 60px;
    line-height: 60px;
  }
}
@media (max-width: 1024px) {
  .toastMessage p {
    width: 290px;
    height: 50px;
    line-height: 50px;
  }
}

.popup {
  z-index: 9999;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  margin: auto;
}
.popup > div > .closePopup,
.popup > .closePopup {
  z-index: 0;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  cursor: default;
}
.popup .btnFooterCase {
  text-align: center;
}
@media (min-width: 1025px) {
  .popup .btnFooterCase {
    padding-top: 40px;
  }
}
@media (max-width: 1024px) {
  .popup .btnFooterCase {
    padding-top: 30px;
  }
}
.popup .btnFooterCase > * {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.popup .btnFooterCase > *::before, .popup .btnFooterCase > *::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.popup .btnFooterCase > *:not(:disabled):hover, .popup .btnFooterCase > *:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.popup .btnFooterCase > *:not(:disabled):hover::before, .popup .btnFooterCase > *:not(:disabled):hover::after, .popup .btnFooterCase > *:not(:disabled):focus::before, .popup .btnFooterCase > *:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .popup .btnFooterCase > * {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  .popup .btnFooterCase > *::before {
    margin-right: 10px;
  }
  .popup .btnFooterCase > *::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .popup .btnFooterCase > * {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  .popup .btnFooterCase > *::before {
    margin-right: 14px;
  }
  .popup .btnFooterCase > *::after {
    margin-left: 18px;
  }
}
.popup > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
.popup > div .wrapper {
  position: relative;
  border: 1px solid #c8c8c8;
  background: #fff;
}
.popup > div .wrapper .close {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
.popup > div .notice {
  word-break: keep-all;
}
.popup > div .notice p strong {
  color: #4415a0;
}
.popup > div .notice span {
  display: block;
  margin-top: 25px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-weight: 300;
  color: #666;
}
.popup > div .notice .close, .popup > div .full .close, .popup > div .terms .close {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 28px;
  height: 28px;
}
.popup > div .notice .close::before, .popup > div .notice .close::after, .popup > div .full .close::before, .popup > div .full .close::after, .popup > div .terms .close::before, .popup > div .terms .close::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 28px;
  height: 2px;
  background: #c8c8c8;
}
.popup > div .notice .close::before, .popup > div .full .close::before, .popup > div .terms .close::before {
  transform: rotate(45deg);
}
.popup > div .notice .close::after, .popup > div .full .close::after, .popup > div .terms .close::after {
  transform: rotate(-45deg);
}
.popup > div .full {
  max-height: calc(100vh - 40px);
  max-height: calc(var(--vh, 1vh) * 100 - 40px);
  overflow-y: auto;
}
.popup > div .full h1:not(.caseSmall) {
  font-weight: 400;
}
.popup > div .full h1:not(.caseSmall) + label > span {
  margin-top: 0 !important;
}
.popup > div .full h1:not(.caseSmall) em {
  font-weight: 600;
  color: #4415a0;
}
.popup > div .full h1.caseSmall {
  margin-top: -10px;
  margin-bottom: 0;
  padding-bottom: 20px;
  font-size: 26px;
  line-height: 36px;
  letter-spacing: -0.02em;
}
.popup > div .full .sentenceCase {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #666;
}
@media (min-width: 1025px) {
  .popup > div .full .inputTxt {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full .inputTxt {
    margin-top: 5px;
  }
}
.popup > div .full .inputTxt input {
  color: #212121;
}
.popup > div .full > label span {
  display: block;
  color: #212121;
}
@media (min-width: 1025px) {
  .popup > div .full > label span {
    margin-top: 45px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full > label span {
    margin-top: 25px;
  }
}
.popup > div .full > p {
  word-break: keep-all;
}
.popup > div .full > p:not(.case) {
  margin-top: 12px;
  color: #a5a5a5;
}
.popup > div .full > p:not(.case).big {
  color: #212121;
}
.popup > div .full > p:not(.case).big strong {
  color: #4415a0;
}
@media (min-width: 1025px) {
  .popup > div .full > p.case {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full > p.case {
    margin-top: 30px;
  }
}
.popup > div .full label.caseSchool span {
  width: 100%;
}
.popup > div .full label.caseSchool > button {
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  background: #f9f9f9;
  font-size: 14px;
  font-weight: 500;
  color: #666;
}
.popup > div .full .result table {
  table-layout: fixed;
  margin-top: 15px;
  width: 100%;
  border-top: 2px solid #212121;
  color: #212121;
}
.popup > div .full .result table th {
  background: #f6f6f6;
  font-weight: 400;
}
.popup > div .full .result table th, .popup > div .full .result table td {
  border-bottom: 1px solid #c8c8c8;
}
.popup > div .full .result table th:first-child, .popup > div .full .result table td:first-child {
  text-align: center;
}
.popup > div .full .result table th:not(:first-child), .popup > div .full .result table td:not(:first-child) {
  border-left: 1px solid #c8c8c8;
}
.popup > div .full .result table td:last-child {
  padding-left: 30px;
}
.popup > div .full .result table tr:hover {
  background: rgba(68, 21, 160, 0.2);
}
@media (min-width: 1025px) {
  .popup > div .full .result {
    margin-top: 48px;
  }
  .popup > div .full .result table th, .popup > div .full .result table td {
    padding: 17px 10px;
  }
  .popup > div .full .result table th:first-child, .popup > div .full .result table td:first-child {
    width: 90px;
  }
  .popup > div .full .result + .caseSchool {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full .result {
    margin-top: 25px;
  }
  .popup > div .full .result table th, .popup > div .full .result table td {
    padding: 12px 10px;
  }
  .popup > div .full .result table th:first-child, .popup > div .full .result table td:first-child {
    width: 85px;
  }
  .popup > div .full .result + .caseSchool {
    margin-top: 20px;
  }
}
.popup > div .full .info {
  padding-top: 40px;
}
.popup > div .full .info h2.caseEmph {
  color: #4415a0;
}
.popup > div .full .bullet {
  margin-top: 20px;
  word-break: keep-all;
}
.popup > div .full .bullet.caseMarginShort {
  margin-top: 8px;
}
.popup > div .full .bullet li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.popup > div .full .bullet li::before {
  content: "•";
  margin-right: 4px;
}
.popup > div .full .bullet li b {
  color: #212121;
}
.popup > div .full .btns {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
.popup > div .full .btns > *:not(.case) {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  .popup > div .full .btns > *:not(.case) {
    font-size: 14px;
  }
}
.popup > div .full .btns > *:not(.case):hover {
  background: #4415a0;
  border-color: #4415a0;
  color: #fff;
}
.popup > div .full .btns > *.case {
  display: inline-block;
  width: 100%;
  border: 1px solid #4415a0;
  border-radius: 25px;
  background: #4415a0;
  text-align: center;
  line-height: 50px;
  color: #fff;
}
@media (max-width: 1024px) {
  .popup > div .full .btns > *.case {
    font-size: 14px;
  }
}
@media (min-width: 1025px) {
  .popup > div .full .btns {
    padding-top: 20px;
  }
  .popup > div .full .btns.casePaddingLong {
    padding-top: 50px;
  }
  .popup > div .full .btns > * {
    width: calc(50% - 10px) !important;
  }
}
@media (max-width: 1024px) {
  .popup > div .full .btns {
    padding-top: 40px;
  }
  .popup > div .full .btns > * {
    width: calc(50% - 5px);
  }
}
.popup > div .full .btnsFull button {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  .popup > div .full .btnsFull button {
    font-size: 14px;
  }
}
.popup > div .full .btnsFull button:hover {
  border-color: #4415a0;
  color: #4415a0;
}
@media (min-width: 1025px) {
  .popup > div .full .btnsFull {
    margin-top: 50px;
  }
  .popup > div .full .btnsFull > * + * {
    margin-top: 25px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full .btnsFull {
    margin-top: 45px;
  }
  .popup > div .full .btnsFull > * + * {
    margin-top: 10px;
  }
}
.popup > div .full.joinComplete dl {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 20px;
  background: #f9f9f9;
}
.popup > div .full.joinComplete dl dd {
  color: #4415a0;
}
.popup > div .full.joinComplete .info {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #c8c8c8;
}
.popup > div .full.joinComplete .info ul {
  margin-top: 20px;
  word-break: keep-all;
}
.popup > div .full.joinComplete .info ul strong {
  color: #212121;
}
.popup > div .full.joinComplete .info ul p {
  padding-top: 12px;
}
@media (min-width: 1025px) {
  .popup > div .full.joinComplete dl {
    padding: 30px;
  }
  .popup > div .full.joinComplete ul li + li {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) {
  .popup > div .full.joinComplete dl {
    padding: 15px 10px;
  }
  .popup > div .full.joinComplete ul li + li {
    margin-top: 15px;
  }
}
.popup > div .terms {
  width: calc(100% - 40px);
  max-width: 980px;
  height: calc(100% - 40px);
  max-height: 705px;
}
.popup > div .terms h1 {
  font-weight: 400;
}
.popup > div .terms .selectBox {
  position: relative;
  position: absolute;
}
.popup > div .terms .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  padding-bottom: 7px;
}
.popup > div .terms .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
  top: 7px;
  right: 8px;
}
.popup > div .terms .selectBox > button.placeholder {
  color: #a5a5a5;
}
.popup > div .terms .selectBox > button.active {
  color: #4415a0;
}
.popup > div .terms .selectBox > button.active::after {
  border-color: #4415a0;
}
.popup > div .terms .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
.popup > div .terms .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
}
.popup > div .terms .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
.popup > div .terms .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  .popup > div .terms .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  .popup > div .terms .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  .popup > div .terms .selectBox > button,
  .popup > div .terms .selectBox > div button {
    padding-left: 12px;
  }
}
@media (max-width: 1024px) {
  .popup > div .terms .selectBox > div > button {
    padding-left: 10px;
  }
  .popup > div .terms .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  .popup > div .terms .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
}
.popup > div .terms .termsContents {
  position: absolute;
  border: 1px solid #c8c8c8;
  overflow: auto;
}
.popup > div .terms .termsContents h1 {
  font-weight: 700;
}
.popup > div .terms .termsContents h2 {
  font-weight: 400;
  color: #212121;
}
.popup > div .terms .termsContents > section + section {
  margin-top: 40px;
}
.popup > div .terms .termsContents > section > * + * {
  margin-top: 15px;
}
.popup > div .terms .termsContents > section li + li {
  margin-top: 5px;
}
.popup > div .terms .termsContents > section .listDash > li, .popup > div .terms .termsContents > section p.dash {
  position: relative;
  padding-left: 0.7em;
}
.popup > div .terms .termsContents > section .listDash > li::before, .popup > div .terms .termsContents > section p.dash::before {
  content: "-";
  position: absolute;
  left: 0;
  width: 1.2em;
}
.popup > div .terms .termsContents > section .listNum {
  counter-reset: item;
}
.popup > div .terms .termsContents > section .listNum > li {
  list-style: none;
  position: relative;
  padding-left: 1.5em;
}
.popup > div .terms .termsContents > section .listNum > li::before {
  content: "(" counter(item) ")";
  counter-increment: item;
  position: absolute;
  left: 0;
}
.popup > div .terms .termsContents > section .listCircle {
  counter-reset: item;
}
.popup > div .terms .termsContents > section .listCircle > li {
  list-style: none;
  position: relative;
  padding-left: 1.5em;
}
.popup > div .terms .termsContents > section .listCircle > li::before {
  content: counter(item);
  counter-increment: item;
  position: absolute;
  left: 0;
  top: 0.4em;
  width: 1.4em;
  height: 1.4em;
  border: 1px solid #666;
  border-radius: 50%;
  font-size: 12px;
  text-align: center;
  line-height: 1.3em;
  overflow: hidden;
}
.popup > div .terms .termsContents > section .listOrder {
  margin-left: 1em;
}
.popup > div .terms .termsContents > section .tableWrapper {
  overflow-x: auto;
}
.popup > div .terms .termsContents > section .tableWrapper table {
  table-layout: fixed;
}
.popup > div .terms .termsContents table {
  table-layout: unset;
  width: 100%;
  border-top: 2px solid #212121;
}
.popup > div .terms .termsContents table th {
  background: #f6f6f6;
  font-weight: 400;
  color: #212121;
}
.popup > div .terms .termsContents table th, .popup > div .terms .termsContents table td {
  padding: 5px 10px;
  border-bottom: 1px solid #c8c8c8;
}
.popup > div .terms .termsContents table th:not(:first-child), .popup > div .terms .termsContents table td:not(:first-child) {
  border-left: 1px solid #c8c8c8;
}
@media (min-width: 1025px) {
  .popup {
    background: rgba(0, 0, 0, 0.8);
  }
  .popup .notice {
    width: 540px;
    padding: 80px 60px 85px;
  }
  .popup .notice.full {
    width: 600px;
  }
  .popup .notice p {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  .popup .full {
    width: 600px;
    padding: 80px 50px;
  }
  .popup .full.gwell {
    padding-bottom: 50px;
  }
  .popup .full h1 {
    margin-bottom: 26px;
  }
  .popup .full h1.case {
    font-size: 25px;
    line-height: 40px;
    letter-spacing: -0.025em;
    font-weight: 700;
  }
  .popup .full label.caseSchool {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  .popup .full label.caseSchool .inputTxt {
    width: calc(100% - 110px);
  }
  .popup .full label.caseSchool > button {
    margin-top: 10px;
    width: 100px;
    height: 54px;
  }
  .popup .terms {
    padding: 88px 50px 48px;
  }
  .popup .terms .selectBox {
    top: 139px;
    right: 50px;
    width: 184px;
  }
  .popup .terms .termsContents {
    top: 189px;
    left: 50px;
    width: calc(100% - 100px);
    height: calc(100% - 240px);
    padding: 15px 20px;
  }
}
@media (max-width: 1024px) {
  .popup {
    background: rgba(0, 0, 0, 0.7);
  }
  .popup .notice {
    width: calc(100% - 40px);
    max-width: 320px;
    padding: 120px 0;
  }
  .popup .notice p,
  .popup .notice span {
    margin-left: auto;
    margin-right: auto;
    width: 220px;
  }
  .popup .notice p {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  .popup .full {
    width: calc(100% - 40px);
    max-width: 600px;
    min-width: 280px;
    padding: 87px 30px 80px;
  }
  .popup .full h1 {
    margin-bottom: 14px;
  }
  .popup .full label.caseSchool {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  .popup .full label.caseSchool span {
    width: 100%;
  }
  .popup .full label.caseSchool .inputTxt {
    width: calc(100% - 90px);
  }
  .popup .full label.caseSchool > button {
    margin-top: 5px;
    width: 80px;
    height: 40px;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  .popup .full label.caseSchool .inputTxt, .popup .full label.caseSchool > button {
    width: 100%;
  }
}
@media (max-width: 1024px) {
  .popup .notice.full.gwell {
    padding: 65px 20px 30px;
  }
  .popup .notice.full.gwell .close {
    top: 20px;
    right: 20px;
  }
  .popup .terms {
    padding: 70px 20px 30px;
  }
  .popup .terms .selectBox {
    top: 115px;
    left: 20px;
    width: 150px;
  }
  .popup .terms .termsContents {
    top: 165px;
    left: 20px;
    width: calc(100% - 40px);
    height: calc(100% - 190px);
    padding: 10px;
  }
}

.tabPop {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
.tabPop > * {
  position: relative;
  flex-basis: 100%;
  padding-bottom: 10px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
}
@media (min-width: 1025px) {
  .tabPop > * {
    margin-bottom: 38px;
  }
}
@media (max-width: 1024px) {
  .tabPop > * {
    margin-bottom: 30px;
  }
}
.tabPop > *.active {
  border-bottom: 1px solid #0097e0;
  font-weight: 700;
  color: #0097e0;
}
.tabPop > *:not(.active) {
  border-bottom: 1px solid #e5e5e5;
  color: #666;
}
.tabPop > * + *::before {
  content: "";
  position: absolute;
  bottom: 15px;
  left: 0;
  width: 1px;
  height: 15px;
  background: #e5e5e5;
}

.preview > section {
  background: #fff;
}
.preview > section > div {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
.preview > section > div > .closePopup {
  position: absolute;
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #4415a0;
  background: #141642;
}
@media (min-width: 1025px) {
  .preview > section > div > .closePopup {
    top: 100px;
    right: 107px;
    width: 48px;
    height: 48px;
  }
  .preview > section > div > .closePopup::before, .preview > section > div > .closePopup::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 23px;
    height: 1px;
    background: #fff;
  }
  .preview > section > div > .closePopup::before {
    transform: rotate(45deg);
  }
  .preview > section > div > .closePopup::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  .preview > section > div > .closePopup {
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
  }
  .preview > section > div > .closePopup::before, .preview > section > div > .closePopup::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #fff;
  }
  .preview > section > div > .closePopup::before {
    transform: rotate(45deg);
  }
  .preview > section > div > .closePopup::after {
    transform: rotate(-45deg);
  }
}
@media (min-width: 1025px) {
  .preview > section > div > .closePopup {
    top: 30px;
    right: 10px;
  }
}
@media screen and (min-width: 1025px) and (min-width: 1400px) {
  .preview > section > div > .closePopup {
    top: 80px !important;
    right: -80px;
  }
}
.preview > section > div > header {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  border-bottom: 0;
}
.preview > section > div > header h2 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
}
.preview > section > div > header h2 small {
  padding-left: 20px;
  font-weight: normal;
  color: #666;
}
.preview > section > div > header p {
  position: absolute;
  right: 50px;
}
@media (max-width: 690px) {
  .preview > section > div > header p {
    right: 0;
    top: 110px;
    line-height: 1.3;
  }
}
.preview > section > div > header button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 40px;
  height: 40px;
  background: url("../images/icon/iconPrint.svg") no-repeat center;
}
@media (min-width: 1025px) {
  .preview > section > div > header {
    padding-top: 100px;
  }
}
@media (max-width: 1024px) {
  .preview > section > div > header {
    padding-top: 58px;
  }
}

body.print {
  margin: 50px;
}
@media print {
  body.print {
    width: 210mm;
    height: 297mm;
    margin: 0;
    padding: 10mm;
  }
}
body.print .printWrapper {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
body.print table {
  width: 100%;
}
body.print .tbPrint, body.print .introduce {
  border: 1px solid #333;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: -0.015em;
}
body.print .tbPrint + .tbPrint, body.print .tbPrint + .introduce, body.print .introduce + .tbPrint, body.print .introduce + .introduce {
  margin-top: 15px;
}
body.print .tbPrint tr > *, body.print .introduce tr > * {
  padding: 3px;
  border-left: 1px solid #777;
  vertical-align: middle;
}
body.print .tbPrint dt, body.print .tbPrint dd, body.print .introduce dt, body.print .introduce dd {
  padding: 6px;
}
body.print .tbPrint tr + tr > *,
body.print .tbPrint thead + tbody tr:first-child > *,
body.print .tbPrint * + dd, body.print .tbPrint * + dt, body.print .introduce tr + tr > *,
body.print .introduce thead + tbody tr:first-child > *,
body.print .introduce * + dd, body.print .introduce * + dt {
  border-top: 1px solid #777;
}
body.print .tbPrint thead + tbody td, body.print .introduce thead + tbody td {
  text-align: center;
}
body.print .tbPrint th, body.print .tbPrint dt, body.print .introduce th, body.print .introduce dt {
  background: #eee;
}
body.print .tbPrint th, body.print .introduce th {
  text-align: center;
}
body.print .tbPrint dt, body.print .introduce dt {
  padding: 15px;
  font-size: 13px;
  font-weight: 600;
}
body.print .tbPrint dd, body.print .introduce dd {
  padding: 6px 15px;
}
body.print .tbPrint dd, body.print .introduce dd {
  min-height: 326px;
  line-height: 1.5;
  color: #666;
  width: 100%;
}
@media print {
  body.print .tbPrint dd, body.print .introduce dd {
    height: 113.5mm;
  }
}
body.print .printTitle {
  margin-top: 5px;
  margin-bottom: 2px;
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: -0.03em;
  font-weight: 500;
}
@media print {
  body.print .printTitle.pagebreak {
    margin-top: 0;
  }
}
body.print .blockTitle {
  margin-bottom: 20px;
  border: 1px solid #777;
  font-size: 20px;
  font-weight: 500;
  line-height: 50px;
  text-align: center;
}
body.print img {
  display: inline-block;
}
body.print .photo {
  width: 120px;
  border: 1px solid #777;
  vertical-align: middle;
}
body.print .photo img {
  display: block;
  width: 100%;
}
body.print .basic {
  padding-left: 20px;
  vertical-align: top;
}
body.print .basic .logo {
  border: 1px solid #777;
  text-align: center;
}
body.print .basic .logo td {
  vertical-align: middle;
  height: 50px;
}
body.print .basic .logo td:first-child {
  width: 250px;
}
body.print .basic .logo td + td {
  border-left: 1px solid #777;
  font-size: 20px;
  font-weight: 500;
}
body.print .basic .basicInfo > div {
  margin-top: 20px;
  width: calc(50% - 10px);
}
body.print .basic .basicInfo > div + div {
  margin-left: 20px;
}
body.print .career {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: stretch;
  align-items: stretch;
  margin-top: 100px;
  margin-bottom: 100px;
}
@media print {
  body.print .career {
    margin-top: 0;
    margin-bottom: 0;
    min-height: 277mm;
  }
}
body.print .career .tbPrint + .blockTitle {
  margin-top: 30px;
  margin-bottom: 0;
}
body.print .career .con {
  flex-grow: 1;
  min-height: 200px;
  padding: 6px;
  border-left: 1px solid #333;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: -0.015em;
}

#detailContents.portfolioDetail .detailContainer > section.gallery .zoom, #contents.develop .detailContainer > section.gallery .zoom {
  z-index: 9999;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  margin: auto;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div, #contents.develop .detailContainer > section.gallery .zoom > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div > .closeZoom, #contents.develop .detailContainer > section.gallery .zoom > div > .closeZoom {
  z-index: 0;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  cursor: default;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .wrapper, #contents.develop .detailContainer > section.gallery .zoom > div .wrapper {
  position: relative;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close, #contents.develop .detailContainer > section.gallery .zoom > div .close {
  position: fixed;
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close, #contents.develop .detailContainer > section.gallery .zoom > div .close {
    top: 100px;
    right: 107px;
    width: 48px;
    height: 48px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::before, #contents.develop .detailContainer > section.gallery .zoom > div .close::before, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::after, #contents.develop .detailContainer > section.gallery .zoom > div .close::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 23px;
    height: 1px;
    background: #fff;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::before, #contents.develop .detailContainer > section.gallery .zoom > div .close::before {
    transform: rotate(45deg);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::after, #contents.develop .detailContainer > section.gallery .zoom > div .close::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close, #contents.develop .detailContainer > section.gallery .zoom > div .close {
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::before, #contents.develop .detailContainer > section.gallery .zoom > div .close::before, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::after, #contents.develop .detailContainer > section.gallery .zoom > div .close::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #fff;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::before, #contents.develop .detailContainer > section.gallery .zoom > div .close::before {
    transform: rotate(45deg);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .close::after, #contents.develop .detailContainer > section.gallery .zoom > div .close::after {
    transform: rotate(-45deg);
  }
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .swiper-slide, #contents.develop .detailContainer > section.gallery .zoom > div .swiper-slide {
  cursor: default;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .swiper-slide p, #contents.develop .detailContainer > section.gallery .zoom > div .swiper-slide p {
  display: none;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .swiper-slide span, #contents.develop .detailContainer > section.gallery .zoom > div .swiper-slide span {
  display: block;
  margin-left: auto;
  margin-right: auto;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnPrev, #contents.develop .detailContainer > section.gallery .zoom > div .btnPrev,
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnNext,
#contents.develop .detailContainer > section.gallery .zoom > div .btnNext {
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnPrev, #contents.develop .detailContainer > section.gallery .zoom > div .btnPrev {
  left: 0;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom > div .btnNext, #contents.develop .detailContainer > section.gallery .zoom > div .btnNext {
  right: 0;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom .zoomPagination, #contents.develop .detailContainer > section.gallery .zoom .zoomPagination {
  z-index: 2;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom .zoomPagination .swiper-pagination-bullet, #contents.develop .detailContainer > section.gallery .zoom .zoomPagination .swiper-pagination-bullet {
  margin: 0 6px;
  width: 8px !important;
  height: 8px !important;
  background: #fff;
  opacity: 1 !important;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .zoom .zoomPagination .swiper-pagination-bullet.swiper-pagination-bullet-active, #contents.develop .detailContainer > section.gallery .zoom .zoomPagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #0097e0;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom, #contents.develop .detailContainer > section.gallery .zoom {
    background: rgba(0, 0, 0, 0.7);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper, #contents.develop .detailContainer > section.gallery .zoom .wrapper {
    width: 990px;
    padding: 0 55px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .close, #contents.develop .detailContainer > section.gallery .zoom .wrapper .close {
    top: 50px;
    right: 70px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev {
    width: 40px;
    height: 40px;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #fff;
    border-style: solid;
    transform: rotate(45deg);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 11px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):focus, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):focus {
    border-color: #0097e0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover::after, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):focus::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):focus::after {
    border-color: #0097e0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext {
    width: 40px;
    height: 40px;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #fff;
    border-style: solid;
    transform: rotate(-135deg);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 11px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):focus, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):focus {
    border-color: #0097e0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover::after, #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):focus::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):focus::after {
    border-color: #0097e0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .swiper-slide img, #contents.develop .detailContainer > section.gallery .zoom .wrapper .swiper-slide img {
    width: calc(100% - 30px);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .swiper-slide span, #contents.develop .detailContainer > section.gallery .zoom .wrapper .swiper-slide span {
    width: 848px;
    height: 600px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom, #contents.develop .detailContainer > section.gallery .zoom {
    background: rgba(0, 0, 0, 0.9);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper, #contents.develop .detailContainer > section.gallery .zoom .wrapper {
    width: calc(100% - 16px);
    padding: 0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover {
    border-color: #4415a0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover {
    border-color: #4415a0;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .swiper-slide img, #contents.develop .detailContainer > section.gallery .zoom .wrapper .swiper-slide img {
    width: calc(100% - 20px);
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .swiper-slide span, #contents.develop .detailContainer > section.gallery .zoom .wrapper .swiper-slide span {
    width: 100%;
    height: 0;
    padding-bottom: 70.7547%;
  }
}
@media (max-width: 1024px) and (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnPrev::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
@media (max-width: 1024px) and (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .zoom .wrapper .btnNext::after, #contents.develop .detailContainer > section.gallery .zoom .wrapper .btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}

.error404 {
  min-height: calc(100vh + 0px);
  min-height: calc(var(--vh, 1vh) * 100 + 0px);
}
.error404 h1 {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  .error404 h1 {
    height: 90px;
    padding-top: 30px;
  }
}
@media (max-width: 1024px) {
  .error404 h1 {
    height: 120px;
    padding-top: 20px;
  }
}
@media (min-width: 1025px) {
  .error404 h1 img:not(.case):not(.case2):not(.case3) {
    width: 162px;
  }
}
@media (max-width: 1024px) {
  .error404 h1 img:not(.case):not(.case2):not(.case3) {
    width: 105px;
  }
}
@media (min-width: 1025px) {
  .error404 h1 img.case {
    width: 26px;
  }
}
@media (max-width: 1024px) {
  .error404 h1 img.case {
    width: 17px;
  }
}
.error404 h1 img.case2 {
  width: 57px;
}
@media (min-width: 1025px) {
  .error404 h1 img.case3 {
    width: 122px;
  }
}
@media (max-width: 1024px) {
  .error404 h1 img.case3 {
    width: 90px;
  }
}
@media (min-width: 1025px) {
  .error404.type01 {
    background: url("../images/common/lineError.svg") no-repeat center;
  }
}
.error404.type01 section::before {
  background: url("../images/common/imgError.svg") no-repeat center;
}
.error404.type02 section::before {
  background: url("../images/common/imgErrorSlp.svg") no-repeat center;
}
.error404.type03 section::before {
  background: url("../images/common/imgErrorGwell.svg") no-repeat center;
}
.error404 section {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}
@media (min-width: 1025px) {
  .error404 section {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    min-height: calc(100vh - 90px);
    min-height: calc(var(--vh, 1vh) * 100 - 90px);
    padding-bottom: 90px;
  }
}
@media (max-width: 1024px) {
  .error404 section {
    padding-bottom: 210px;
  }
}
.error404 section::before {
  position: absolute;
  content: "";
  margin: auto;
}
@media (min-width: 1025px) {
  .error404 section::before {
    top: 190px;
    right: 0;
    bottom: 0;
    width: 461px;
    height: 159px;
  }
}
@media (max-width: 1024px) {
  .error404 section::before {
    left: 0;
    right: 0;
    bottom: 0;
    width: 320px;
    height: 110px;
    background-size: 320px !important;
  }
}
@media (min-width: 1025px) {
  .error404 section h2 {
    padding-bottom: 52px;
  }
}
@media (max-width: 1024px) {
  .error404 section h2 {
    padding-bottom: 28px;
  }
}
.error404 section a {
  display: inline-block;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  text-align: center;
  width: 145px;
  height: 44px;
  border: 1px solid #c8c8c8;
  border-radius: 22px;
  line-height: 42px;
  color: #666;
  /*&.case {
    @include btnSlp2;
  }*/
}
@media (min-width: 1025px) {
  .error404 section a {
    margin-top: 28px;
  }
}
@media (max-width: 1024px) {
  .error404 section a {
    margin-top: 23px;
  }
}
.error404 section a:hover, .error404 section a:focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}

#detailContents.portfolioDetail .detailContainer > section .detail img, #contents.develop .detailContainer > section .detail img, #detailContents.pressDetail .detail img {
  max-width: 100%;
}
#detailContents.portfolioDetail .detailContainer > section .detail .summary, #contents.develop .detailContainer > section .detail .summary, #detailContents.pressDetail .detail .summary {
  font-weight: 700;
  word-break: keep-all;
  color: #212121;
}
#detailContents.portfolioDetail .detailContainer > section .detail ul.summary li, #contents.develop .detailContainer > section .detail ul.summary li, #detailContents.pressDetail .detail ul.summary li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#detailContents.portfolioDetail .detailContainer > section .detail ul.summary li::before, #contents.develop .detailContainer > section .detail ul.summary li::before, #detailContents.pressDetail .detail ul.summary li::before {
  content: "";
  margin-right: 10px;
  width: 4px;
  height: 4px;
  background: #212121;
  border-radius: 50%;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section .detail ul.summary li::before, #contents.develop .detailContainer > section .detail ul.summary li::before, #detailContents.pressDetail .detail ul.summary li::before {
    margin-top: 16px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section .detail ul.summary li::before, #contents.develop .detailContainer > section .detail ul.summary li::before, #detailContents.pressDetail .detail ul.summary li::before {
    margin-top: 12px;
  }
}
#detailContents.portfolioDetail .detailContainer > section .detail .description, #contents.develop .detailContainer > section .detail .description, #detailContents.pressDetail .detail .description {
  word-break: keep-all;
}
#detailContents.portfolioDetail .detailContainer > section .detail .description dt, #contents.develop .detailContainer > section .detail .description dt, #detailContents.pressDetail .detail .description dt {
  color: #212121;
}
#detailContents.portfolioDetail .detailContainer > section .detail .description dd, #contents.develop .detailContainer > section .detail .description dd, #detailContents.pressDetail .detail .description dd {
  margin-top: 12px;
}
#detailContents.portfolioDetail .detailContainer > section .detail .description dd + dt, #contents.develop .detailContainer > section .detail .description dd + dt, #detailContents.pressDetail .detail .description dd + dt {
  border-top: 1px solid #c8c8c8;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section .detail > h2 + *, #contents.develop .detailContainer > section .detail > h2 + *, #detailContents.pressDetail .detail > h2 + * {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail > * + h2, #contents.develop .detailContainer > section .detail > * + h2, #detailContents.pressDetail .detail > * + h2 {
    margin-top: 60px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail > *:not(h2) + *, #contents.develop .detailContainer > section .detail > *:not(h2) + *, #detailContents.pressDetail .detail > *:not(h2) + * {
    margin-top: 15px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .summary + *, #contents.develop .detailContainer > section .detail .summary + *, #detailContents.pressDetail .detail .summary + * {
    margin-top: 80px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dt, #contents.develop .detailContainer > section .detail .description dt, #detailContents.pressDetail .detail .description dt {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dd, #contents.develop .detailContainer > section .detail .description dd, #detailContents.pressDetail .detail .description dd {
    padding-bottom: 38px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dd + dt, #contents.develop .detailContainer > section .detail .description dd + dt, #detailContents.pressDetail .detail .description dd + dt {
    padding-top: 42px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section .detail > h2 + *, #contents.develop .detailContainer > section .detail > h2 + *, #detailContents.pressDetail .detail > h2 + * {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail > * + h2, #contents.develop .detailContainer > section .detail > * + h2, #detailContents.pressDetail .detail > * + h2 {
    margin-top: 40px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail > *:not(h2) + *, #contents.develop .detailContainer > section .detail > *:not(h2) + *, #detailContents.pressDetail .detail > *:not(h2) + * {
    margin-top: 15px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dt, #contents.develop .detailContainer > section .detail .description dt, #detailContents.pressDetail .detail .description dt {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dd, #contents.develop .detailContainer > section .detail .description dd, #detailContents.pressDetail .detail .description dd {
    padding-bottom: 30px;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail .description dd + dt, #contents.develop .detailContainer > section .detail .description dd + dt, #detailContents.pressDetail .detail .description dd + dt {
    padding-top: 30px;
  }
}

#detailContents.pressDetail > header .utility button, #contents.crDetail > section > header .utility > div div.share button, #detailContents > header .modifier div.share button, #recruit .container .board .jobOpeningList .share button, .recruit .container .board .jobOpeningList .share button, #contents.crList .tabTarget .jobOpeningList .share button, #contents.pressList > .list .jobOpeningList .share button, #contents.performanceList > .list .jobOpeningList .share button, #contents.research .list .jobOpeningList .share button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
#detailContents.pressDetail > header .utility button.download, #contents.crDetail > section > header .utility > div div.share button.download, #detailContents > header .modifier div.share button.download, #recruit .container .board .jobOpeningList .share button.download, .recruit .container .board .jobOpeningList .share button.download, #contents.crList .tabTarget .jobOpeningList .share button.download, #contents.pressList > .list .jobOpeningList .share button.download, #contents.performanceList > .list .jobOpeningList .share button.download, #contents.research .list .jobOpeningList .share button.download {
  background-image: url("../images/icon/iconDownload.svg");
}
#detailContents.pressDetail > header .utility button.print, #contents.crDetail > section > header .utility > div div.share button.print, #detailContents > header .modifier div.share button.print, #recruit .container .board .jobOpeningList .share button.print, .recruit .container .board .jobOpeningList .share button.print, #contents.crList .tabTarget .jobOpeningList .share button.print, #contents.pressList > .list .jobOpeningList .share button.print, #contents.performanceList > .list .jobOpeningList .share button.print, #contents.research .list .jobOpeningList .share button.print {
  background-image: url("../images/icon/iconPrint.svg");
}
#detailContents.pressDetail > header .utility button.naverBlog, #contents.crDetail > section > header .utility > div div.share button.naverBlog, #detailContents > header .modifier div.share button.naverBlog, #recruit .container .board .jobOpeningList .share button.naverBlog, .recruit .container .board .jobOpeningList .share button.naverBlog, #contents.crList .tabTarget .jobOpeningList .share button.naverBlog, #contents.pressList > .list .jobOpeningList .share button.naverBlog, #contents.performanceList > .list .jobOpeningList .share button.naverBlog, #contents.research .list .jobOpeningList .share button.naverBlog {
  background-image: url("../images/icon/iconShareBlog.svg");
}
#detailContents.pressDetail > header .utility button.kakaotalk, #contents.crDetail > section > header .utility > div div.share button.kakaotalk, #detailContents > header .modifier div.share button.kakaotalk, #recruit .container .board .jobOpeningList .share button.kakaotalk, .recruit .container .board .jobOpeningList .share button.kakaotalk, #contents.crList .tabTarget .jobOpeningList .share button.kakaotalk, #contents.pressList > .list .jobOpeningList .share button.kakaotalk, #contents.performanceList > .list .jobOpeningList .share button.kakaotalk, #contents.research .list .jobOpeningList .share button.kakaotalk {
  background-image: url("../images/icon/iconShareKakaotalk.svg");
}
#detailContents.pressDetail > header .utility button.twitter, #contents.crDetail > section > header .utility > div div.share button.twitter, #detailContents > header .modifier div.share button.twitter, #recruit .container .board .jobOpeningList .share button.twitter, .recruit .container .board .jobOpeningList .share button.twitter, #contents.crList .tabTarget .jobOpeningList .share button.twitter, #contents.pressList > .list .jobOpeningList .share button.twitter, #contents.performanceList > .list .jobOpeningList .share button.twitter, #contents.research .list .jobOpeningList .share button.twitter {
  background-image: url("../images/icon/iconShareTwiter.svg");
}
#detailContents.pressDetail > header .utility button.facebook, #contents.crDetail > section > header .utility > div div.share button.facebook, #detailContents > header .modifier div.share button.facebook, #recruit .container .board .jobOpeningList .share button.facebook, .recruit .container .board .jobOpeningList .share button.facebook, #contents.crList .tabTarget .jobOpeningList .share button.facebook, #contents.pressList > .list .jobOpeningList .share button.facebook, #contents.performanceList > .list .jobOpeningList .share button.facebook, #contents.research .list .jobOpeningList .share button.facebook {
  background-image: url("../images/icon/iconShareFacebook.svg");
}
#detailContents.pressDetail > header .utility button.url, #contents.crDetail > section > header .utility > div div.share button.url, #detailContents > header .modifier div.share button.url, #recruit .container .board .jobOpeningList .share button.url, .recruit .container .board .jobOpeningList .share button.url, #contents.crList .tabTarget .jobOpeningList .share button.url, #contents.pressList > .list .jobOpeningList .share button.url, #contents.performanceList > .list .jobOpeningList .share button.url, #contents.research .list .jobOpeningList .share button.url {
  background-image: url("../images/icon/iconShareUrl.svg");
}
@media (max-width: 1024px) {
  #detailContents.pressDetail > header .utility button.print, #contents.crDetail > section > header .utility > div div.share button.print, #detailContents > header .modifier div.share button.print, #recruit .container .board .jobOpeningList .share button.print, .recruit .container .board .jobOpeningList .share button.print, #contents.crList .tabTarget .jobOpeningList .share button.print, #contents.pressList > .list .jobOpeningList .share button.print, #contents.performanceList > .list .jobOpeningList .share button.print, #contents.research .list .jobOpeningList .share button.print {
    display: none;
  }
}
@media (min-width: 1025px) {
  #detailContents.pressDetail > header .utility button, #contents.crDetail > section > header .utility > div div.share button, #detailContents > header .modifier div.share button, #recruit .container .board .jobOpeningList .share button, .recruit .container .board .jobOpeningList .share button, #contents.crList .tabTarget .jobOpeningList .share button, #contents.pressList > .list .jobOpeningList .share button, #contents.performanceList > .list .jobOpeningList .share button, #contents.research .list .jobOpeningList .share button {
    width: 36px;
    height: 36px;
  }
  #detailContents.pressDetail > header .utility button + button, #contents.crDetail > section > header .utility > div div.share button + button, #detailContents > header .modifier div.share button + button, #recruit .container .board .jobOpeningList .share button + button, .recruit .container .board .jobOpeningList .share button + button, #contents.crList .tabTarget .jobOpeningList .share button + button, #contents.pressList > .list .jobOpeningList .share button + button, #contents.performanceList > .list .jobOpeningList .share button + button, #contents.research .list .jobOpeningList .share button + button {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #detailContents.pressDetail > header .utility button, #contents.crDetail > section > header .utility > div div.share button, #detailContents > header .modifier div.share button, #recruit .container .board .jobOpeningList .share button, .recruit .container .board .jobOpeningList .share button, #contents.crList .tabTarget .jobOpeningList .share button, #contents.pressList > .list .jobOpeningList .share button, #contents.performanceList > .list .jobOpeningList .share button, #contents.research .list .jobOpeningList .share button {
    width: 24px;
    height: 24px;
  }
  #detailContents.pressDetail > header .utility button + button, #contents.crDetail > section > header .utility > div div.share button + button, #detailContents > header .modifier div.share button + button, #recruit .container .board .jobOpeningList .share button + button, .recruit .container .board .jobOpeningList .share button + button, #contents.crList .tabTarget .jobOpeningList .share button + button, #contents.pressList > .list .jobOpeningList .share button + button, #contents.performanceList > .list .jobOpeningList .share button + button, #contents.research .list .jobOpeningList .share button + button {
    margin-left: 15px;
  }
}

#contents.crDetail > section > header .utility > div div.share, #detailContents > header .modifier div.share, #recruit .container .board .jobOpeningList .share, .recruit .container .board .jobOpeningList .share, #contents.crList .tabTarget .jobOpeningList .share, #contents.pressList > .list .jobOpeningList .share, #contents.performanceList > .list .jobOpeningList .share, #contents.research .list .jobOpeningList .share {
  position: absolute;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  max-width: 0;
  padding: 0;
  overflow: hidden;
  -ms-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  -o-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  background: #fff;
  transition: all 0.3s;
}
#contents.crDetail > section > header .utility > div button.active + div.share, #detailContents > header .modifier button.active + div.share, #recruit .container .board .jobOpeningList button.active + .share, .recruit .container .board .jobOpeningList button.active + .share, #contents.crList .tabTarget .jobOpeningList button.active + .share, #contents.pressList > .list .jobOpeningList button.active + .share, #contents.performanceList > .list .jobOpeningList button.active + .share, #contents.research .list .jobOpeningList button.active + .share {
  max-width: 420px;
  padding: 20px;
}
@media (max-width: 1024px) {
  #contents.crDetail > section > header .utility > div div.share .print, #detailContents > header .modifier div.share .print, #recruit .container .board .jobOpeningList .share .print, .recruit .container .board .jobOpeningList .share .print, #contents.crList .tabTarget .jobOpeningList .share .print, #contents.pressList > .list .jobOpeningList .share .print, #contents.performanceList > .list .jobOpeningList .share .print, #contents.research .list .jobOpeningList .share .print {
    display: none;
  }
}

.textMode,
.thumbMode,
.mapMode {
  z-index: 2;
  position: absolute;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 24px;
  height: 24px;
  margin-top: 0 !important;
}

.textMode {
  background: url("../images/icon/iconTextMode.svg") no-repeat center;
}
.textMode.active {
  background-image: url("../images/icon/iconTextModeActive.svg");
}
.textMode.active ~ .list > a,
.textMode.active ~ .list > li {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #c8c8c8;
}
.textMode.active ~ .list > a:hover, .textMode.active ~ .list > a:focus {
  border-color: #4415a0;
}
.textMode.active ~ .list > a:hover::after, .textMode.active ~ .list > a:focus::after {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
.textMode.active ~ .list > a > div {
  display: none;
}
.textMode.active ~ .list > a span {
  display: inline-block;
  color: #666;
}
.textMode.active ~ .list > a span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
.textMode.active ~ .list > a span + span::before {
  content: "";
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
.textMode.active ~ .list > a::after {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  background: url("../images/icon/iconArrow.svg") no-repeat center;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.3;
}
.textMode.active ~ .list > a.download::after {
  background-image: url("../images/icon/iconDownload3.svg");
  opacity: 1;
}
.textMode.active ~ .list > li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
.textMode.active ~ .list > li p {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 2.8em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
.textMode.active ~ .list > li .buttons {
  height: 30px;
}
.textMode.active ~ .list > li .buttons a {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.9;
}
.textMode.active ~ .list > li .buttons a.download {
  background-image: url("../images/icon/iconDownload3.svg");
}
.textMode.active ~ .list > li .buttons a.zoom {
  background-image: url("../images/icon/iconZoom2.svg");
}
.textMode.active ~ .list > li .buttons a:hover, .textMode.active ~ .list > li .buttons a:focus {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
@media (min-width: 1025px) {
  .textMode.active ~ .list > a,
  .textMode.active ~ .list > li {
    padding-left: 70px;
  }
  .textMode.active ~ .list > a + a, .textMode.active ~ .list > a + li,
  .textMode.active ~ .list > li + a,
  .textMode.active ~ .list > li + li {
    margin-top: 20px;
  }
  .textMode.active ~ .list > a {
    min-height: 170px;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-right: 150px;
  }
  .textMode.active ~ .list > a p {
    margin-top: 10px;
  }
  .textMode.active ~ .list > a::after {
    top: 80px;
    right: 48px;
  }
  .textMode.active ~ .list > li {
    height: 164px;
    padding-right: 180px;
  }
  .textMode.active ~ .list > li .buttons {
    right: 50px;
  }
  .textMode.active ~ .list > li .buttons a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  .textMode.active ~ .list > a,
  .textMode.active ~ .list > li {
    padding-left: 25px;
  }
  .textMode.active ~ .list > a + a, .textMode.active ~ .list > a + li,
  .textMode.active ~ .list > li + a,
  .textMode.active ~ .list > li + li {
    margin-top: 15px;
  }
  .textMode.active ~ .list > a {
    height: 130px;
    padding-top: 33px;
    padding-right: 25px;
  }
  .textMode.active ~ .list > a p {
    margin-top: 5px;
    padding-right: 50px;
    font-weight: 300;
  }
  .textMode.active ~ .list > a::after {
    bottom: 37px;
    right: 25px;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  .textMode.active ~ .list > a {
    height: 145px;
  }
  .textMode.active ~ .list > a:not(.download)::after {
    display: none;
  }
  .textMode.active ~ .list > a:not(.download) p {
    padding-right: 0;
  }
  .textMode.active ~ .list > a p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 2.8em;
    line-height: 1.4 !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  .textMode.active ~ .list > a::after {
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
@media (max-width: 1024px) {
  .textMode.active ~ .list li {
    height: 95px;
    padding-right: 25px;
  }
  .textMode.active ~ .list li p {
    padding-right: 100px;
  }
  .textMode.active ~ .list li .buttons {
    position: absolute;
    right: 30px;
  }
  .textMode.active ~ .list li .buttons a + a {
    margin-left: 10px;
  }
}

.thumbMode {
  background: url("../images/icon/iconThumbMode.svg") no-repeat center;
}
.thumbMode.active {
  background-image: url("../images/icon/iconThumbModeActive.svg");
}
.thumbMode.active ~ .list h1 {
  width: 100%;
}
.thumbMode.active ~ .list .btnPrev,
.thumbMode.active ~ .list .btnNext {
  display: none;
}
.thumbMode.active ~ .list > p {
  margin-bottom: 10px;
  width: 100%;
  color: #212121;
}
.thumbMode.active ~ .list .swiper-wrapper {
  display: block !important;
  transform: none !important;
}
.thumbMode.active ~ .list .swiper-button-prev,
.thumbMode.active ~ .list .swiper-button-next {
  display: none;
}
.thumbMode.active ~ .list > a, .thumbMode.active ~ .list .swiper-slide {
  vertical-align: top;
}
.thumbMode.active ~ .list > a > div, .thumbMode.active ~ .list > a .imgLink, .thumbMode.active ~ .list .swiper-slide > div, .thumbMode.active ~ .list .swiper-slide .imgLink {
  position: relative;
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 68.6274%;
  /*&.case {
    padding-bottom: 70.098%;
  }*/
  overflow: hidden;
}
.thumbMode.active ~ .list > a > div img, .thumbMode.active ~ .list > a .imgLink img, .thumbMode.active ~ .list .swiper-slide > div img, .thumbMode.active ~ .list .swiper-slide .imgLink img {
  display: block;
  width: 100%;
  transition: all 0.3s linear;
}
.thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em {
  display: block;
  color: #212121;
}
.thumbMode.active ~ .list > a span, .thumbMode.active ~ .list .swiper-slide span {
  display: inline;
  color: #666;
}
.thumbMode.active ~ .list > a span + span, .thumbMode.active ~ .list .swiper-slide span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
.thumbMode.active ~ .list > a span + span::before, .thumbMode.active ~ .list .swiper-slide span + span::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
.thumbMode.active ~ .list > a p, .thumbMode.active ~ .list > a .subjectLink, .thumbMode.active ~ .list .swiper-slide p, .thumbMode.active ~ .list .swiper-slide .subjectLink {
  display: block;
  word-break: keep-all;
}
.thumbMode.active ~ .list a:hover img,
.thumbMode.active ~ .list a:focus img {
  transform: scale(1.06);
}
.thumbMode.active ~ .list.caseFloat a div {
  padding-bottom: 68.6274%;
}
@media (min-width: 1025px) {
  .thumbMode.active ~ .list {
    margin-left: -30px;
  }
  .thumbMode.active ~ .list > a > div, .thumbMode.active ~ .list > a .imgLink, .thumbMode.active ~ .list .swiper-slide > div, .thumbMode.active ~ .list .swiper-slide .imgLink {
    margin-bottom: 20px;
  }
  .thumbMode.active ~ .list > a span + span::before, .thumbMode.active ~ .list .swiper-slide span + span::before {
    top: 9px;
  }
  .thumbMode.active ~ .list > a p, .thumbMode.active ~ .list > a .subjectLink, .thumbMode.active ~ .list .swiper-slide p, .thumbMode.active ~ .list .swiper-slide .subjectLink {
    margin: 8px 0 2px;
  }
  .thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em {
    margin-top: 20px;
  }
  .thumbMode.active ~ .list > a em + p, .thumbMode.active ~ .list .swiper-slide em + p {
    margin-top: 10px;
  }
  .thumbMode.active ~ .list:not(.caseFloat) > a, .thumbMode.active ~ .list:not(.caseFloat) .swiper-slide {
    width: calc(33.3333333333% - 30px);
    margin-left: 30px;
  }
  .thumbMode.active ~ .list:not(.caseFloat) > a + a + a + a, .thumbMode.active ~ .list:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, .thumbMode.active ~ .list:not(.caseFloat) .swiper-slide + a + a + a, .thumbMode.active ~ .list:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 55px;
  }
  .thumbMode.active ~ .list.caseFloat > a, .thumbMode.active ~ .list.caseFloat .swiper-slide {
    width: calc(50% - 20px);
  }
  .thumbMode.active ~ .list.caseFloat > a:nth-of-type(even), .thumbMode.active ~ .list.caseFloat .swiper-slide:nth-of-type(even) {
    margin-left: 40px;
  }
  .thumbMode.active ~ .list.caseFloat > a + a + a, .thumbMode.active ~ .list.caseFloat > a + .swiper-slide + .swiper-slide, .thumbMode.active ~ .list.caseFloat .swiper-slide + a + a, .thumbMode.active ~ .list.caseFloat .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  .thumbMode.active ~ .list {
    margin-left: -20px;
  }
  .thumbMode.active ~ .list > a, .thumbMode.active ~ .list .swiper-slide {
    width: calc(50% - 20px);
    margin-left: 20px;
  }
  .thumbMode.active ~ .list > a + a + a, .thumbMode.active ~ .list > a + .swiper-slide + .swiper-slide, .thumbMode.active ~ .list .swiper-slide + a + a, .thumbMode.active ~ .list .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 40px;
  }
  .thumbMode.active ~ .list > a > div, .thumbMode.active ~ .list > a .imgLink, .thumbMode.active ~ .list .swiper-slide > div, .thumbMode.active ~ .list .swiper-slide .imgLink {
    margin-bottom: 15px;
  }
  .thumbMode.active ~ .list > a span + span::before, .thumbMode.active ~ .list .swiper-slide span + span::before {
    top: 5px;
  }
  .thumbMode.active ~ .list > a p, .thumbMode.active ~ .list > a .subjectLink, .thumbMode.active ~ .list .swiper-slide p, .thumbMode.active ~ .list .swiper-slide .subjectLink {
    margin: 3px 0 2px;
  }
  .thumbMode.active ~ .list > a em, .thumbMode.active ~ .list .swiper-slide em {
    margin-top: 15px;
  }
  .thumbMode.active ~ .list > a em + p, .thumbMode.active ~ .list .swiper-slide em + p {
    margin-top: 10px;
  }
}
@media (max-width: 480px) {
  .thumbMode.active ~ .list {
    margin-left: 0;
  }
  .thumbMode.active ~ .list > a, .thumbMode.active ~ .list .swiper-slide {
    width: 100%;
    margin-left: 0;
  }
  .thumbMode.active ~ .list > a + a, .thumbMode.active ~ .list > a + .swiper-slide, .thumbMode.active ~ .list .swiper-slide + a, .thumbMode.active ~ .list .swiper-slide + .swiper-slide {
    margin-top: 40px;
  }
}

.mapMode {
  background: url("../images/icon/iconMapMode.svg") no-repeat center;
}
.mapMode.active {
  background-image: url("../images/icon/iconMapModeActive.svg");
}

#contents.groupBd .recommend, #detailContents.portfolioDetail .recommend, #detailContents.pressDetail .recommend {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .btnPrev, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev, #detailContents.pressDetail .recommend .swiperContainer .btnPrev,
  #contents.groupBd .recommend .swiperContainer .btnNext,
  #detailContents.portfolioDetail .recommend .swiperContainer .btnNext,
  #detailContents.pressDetail .recommend .swiperContainer .btnNext {
    display: none;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-wrapper, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-wrapper, #detailContents.pressDetail .recommend .swiperContainer .swiper-wrapper {
    margin-left: -30px;
    width: calc(100% + 30px);
    font-size: 0;
    letter-spacing: -4px;
    display: block !important;
    transform: none !important;
  }
  #contents.groupBd .recommend .swiperContainer a, #detailContents.portfolioDetail .recommend .swiperContainer a, #detailContents.pressDetail .recommend .swiperContainer a {
    display: inline-block;
    vertical-align: top;
    width: calc(33.3333333333% - 30px);
    margin-left: 30px;
  }
  #contents.groupBd .recommend .swiperContainer a + a + a + a, #detailContents.portfolioDetail .recommend .swiperContainer a + a + a + a, #detailContents.pressDetail .recommend .swiperContainer a + a + a + a {
    margin-top: 55px;
  }
  #contents.groupBd .recommend .swiperContainer a > div, #detailContents.portfolioDetail .recommend .swiperContainer a > div, #detailContents.pressDetail .recommend .swiperContainer a > div {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    height: 0;
    padding-bottom: 57.8125%;
    overflow: hidden;
  }
  #contents.groupBd .recommend .swiperContainer a > div.case, #detailContents.portfolioDetail .recommend .swiperContainer a > div.case, #detailContents.pressDetail .recommend .swiperContainer a > div.case {
    padding-bottom: 68.6274%;
  }
  #contents.groupBd .recommend .swiperContainer a > div img, #detailContents.portfolioDetail .recommend .swiperContainer a > div img, #detailContents.pressDetail .recommend .swiperContainer a > div img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: block;
    width: 100%;
    transition: all 0.3s linear;
  }
  #contents.groupBd .recommend .swiperContainer a:hover img, #detailContents.portfolioDetail .recommend .swiperContainer a:hover img, #detailContents.pressDetail .recommend .swiperContainer a:hover img, #contents.groupBd .recommend .swiperContainer a:focus img, #detailContents.portfolioDetail .recommend .swiperContainer a:focus img, #detailContents.pressDetail .recommend .swiperContainer a:focus img {
    transform: scale(1.06);
  }
  #contents.groupBd .recommend .swiperContainer a em, #detailContents.portfolioDetail .recommend .swiperContainer a em, #detailContents.pressDetail .recommend .swiperContainer a em {
    margin-top: 20px;
    display: block;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    color: #212121;
  }
  #contents.groupBd .recommend .swiperContainer a em + p, #detailContents.portfolioDetail .recommend .swiperContainer a em + p, #detailContents.pressDetail .recommend .swiperContainer a em + p {
    margin-top: 10px;
  }
  #contents.groupBd .recommend .swiperContainer a span, #detailContents.portfolioDetail .recommend .swiperContainer a span, #detailContents.pressDetail .recommend .swiperContainer a span {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    display: inline;
    color: #666;
  }
  #contents.groupBd .recommend .swiperContainer a span + span, #detailContents.portfolioDetail .recommend .swiperContainer a span + span, #detailContents.pressDetail .recommend .swiperContainer a span + span {
    position: relative;
    margin-left: 10px;
    padding-left: 10px;
  }
  #contents.groupBd .recommend .swiperContainer a span + span::before, #detailContents.portfolioDetail .recommend .swiperContainer a span + span::before, #detailContents.pressDetail .recommend .swiperContainer a span + span::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #c8c8c8;
  }
  #contents.groupBd .recommend .swiperContainer a p, #detailContents.portfolioDetail .recommend .swiperContainer a p, #detailContents.pressDetail .recommend .swiperContainer a p {
    margin: 8px 0 2px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    line-height: 32px;
    word-break: keep-all;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer, #detailContents.portfolioDetail .recommend .swiperContainer, #detailContents.pressDetail .recommend .swiperContainer {
    position: relative;
    margin-left: -20px;
    margin-right: -20px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper, #detailContents.portfolioDetail .recommend .swiperContainer .swiper, #detailContents.pressDetail .recommend .swiperContainer .swiper {
    margin-left: -10px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide {
    margin-left: 10px;
    width: 320px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide div, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide div, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide div {
    overflow: hidden;
    margin-bottom: 17px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide div img, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide div img, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide div img {
    display: block;
    width: 100%;
    transition: all 0.3s;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide em, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide em, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide em {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    color: #212121;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide em + p, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide em + p, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide em + p {
    margin-top: 13px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide p, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide p, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide p {
    margin-bottom: 4px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    word-break: keep-all;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide span, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide span {
    position: relative;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    color: #666;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span + span, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide span + span, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide span + span {
    position: relative;
    margin-left: 10px;
    padding-left: 10px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span + span::before, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide span + span::before, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide span + span::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #c8c8c8;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span + p, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide span + p, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide span + p {
    margin-top: 3px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide:hover img, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide:hover img, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide:hover img, #contents.groupBd .recommend .swiperContainer .swiper-slide:focus img, #detailContents.portfolioDetail .recommend .swiperContainer .swiper-slide:focus img, #detailContents.pressDetail .recommend .swiperContainer .swiper-slide:focus img {
    transform: scale(1.06);
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev, #detailContents.pressDetail .recommend .swiperContainer .btnPrev {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
    left: 10px;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev:not(:disabled):hover, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev:not(:disabled):hover, #detailContents.pressDetail .recommend .swiperContainer .btnPrev:not(:disabled):hover {
    border-color: #4415a0;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev:not(:disabled):hover::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev:not(:disabled):hover::after, #detailContents.pressDetail .recommend .swiperContainer .btnPrev:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev::after, #detailContents.pressDetail .recommend .swiperContainer .btnPrev::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext, #detailContents.pressDetail .recommend .swiperContainer .btnNext {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
    right: 10px;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext:not(:disabled):hover, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext:not(:disabled):hover, #detailContents.pressDetail .recommend .swiperContainer .btnNext:not(:disabled):hover {
    border-color: #4415a0;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext:not(:disabled):hover::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext:not(:disabled):hover::after, #detailContents.pressDetail .recommend .swiperContainer .btnNext:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext::after, #detailContents.pressDetail .recommend .swiperContainer .btnNext::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev, #detailContents.pressDetail .recommend .swiperContainer .btnPrev,
  #contents.groupBd .recommend .swiperContainer .btnNext,
  #detailContents.portfolioDetail .recommend .swiperContainer .btnNext,
  #detailContents.pressDetail .recommend .swiperContainer .btnNext {
    z-index: 1;
    position: absolute;
    top: 80px;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev:disabled, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev:disabled, #detailContents.pressDetail .recommend .swiperContainer .btnPrev:disabled,
  #contents.groupBd .recommend .swiperContainer .btnNext:disabled,
  #detailContents.portfolioDetail .recommend .swiperContainer .btnNext:disabled,
  #detailContents.pressDetail .recommend .swiperContainer .btnNext:disabled {
    opacity: 0;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev.case, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev.case, #detailContents.pressDetail .recommend .swiperContainer .btnPrev.case,
  #contents.groupBd .recommend .swiperContainer .btnNext.case,
  #detailContents.portfolioDetail .recommend .swiperContainer .btnNext.case,
  #detailContents.pressDetail .recommend .swiperContainer .btnNext.case {
    top: 98px;
  }
}
@media (max-width: 1024px) and (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .btnPrev, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev, #detailContents.pressDetail .recommend .swiperContainer .btnPrev {
    width: 37px;
    height: 37px;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev::after, #detailContents.pressDetail .recommend .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .btnPrev, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev, #detailContents.pressDetail .recommend .swiperContainer .btnPrev {
    width: 25px;
    height: 25px;
  }
  #contents.groupBd .recommend .swiperContainer .btnPrev::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnPrev::after, #detailContents.pressDetail .recommend .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
@media (max-width: 1024px) and (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .btnNext, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext, #detailContents.pressDetail .recommend .swiperContainer .btnNext {
    width: 37px;
    height: 37px;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext::after, #detailContents.pressDetail .recommend .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .btnNext, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext, #detailContents.pressDetail .recommend .swiperContainer .btnNext {
    width: 25px;
    height: 25px;
  }
  #contents.groupBd .recommend .swiperContainer .btnNext::after, #detailContents.portfolioDetail .recommend .swiperContainer .btnNext::after, #detailContents.pressDetail .recommend .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #contents.groupBd .recommend h1, #detailContents.portfolioDetail .recommend h1, #detailContents.pressDetail .recommend h1 {
    padding-left: 0;
  }
}

#recruit .container .board, .recruit .container .board, #contents.crList .tabTarget, #contents.pressList > .list, #contents.performanceList > .list, #contents.research .list {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#recruit .container .board .search, .recruit .container .board .search, #contents.crList .tabTarget .search, #contents.pressList > .list .search, #contents.performanceList > .list .search, #contents.research .list .search {
  position: relative;
  border-bottom: 1px solid #c8c8c8;
}
#recruit .container .board .search label, .recruit .container .board .search label, #contents.crList .tabTarget .search label, #contents.pressList > .list .search label, #contents.performanceList > .list .search label, #contents.research .list .search label {
  display: block;
  width: 100%;
}
#recruit .container .board .search label input, .recruit .container .board .search label input, #contents.crList .tabTarget .search label input, #contents.pressList > .list .search label input, #contents.performanceList > .list .search label input, #contents.research .list .search label input {
  width: 100%;
  padding-bottom: 10px;
  outline: 0;
  border: 0;
  line-height: 1.34;
}
#recruit .container .board .search label .reset, .recruit .container .board .search label .reset, #contents.crList .tabTarget .search label .reset, #contents.pressList > .list .search label .reset, #contents.performanceList > .list .search label .reset, #contents.research .list .search label .reset {
  bottom: 5px;
}
#recruit .container .board .search > button, .recruit .container .board .search > button, #contents.crList .tabTarget .search > button, #contents.pressList > .list .search > button, #contents.performanceList > .list .search > button, #contents.research .list .search > button {
  position: absolute;
  right: 0;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
#recruit .container .board .search > button::before, .recruit .container .board .search > button::before, #contents.crList .tabTarget .search > button::before, #contents.pressList > .list .search > button::before, #contents.performanceList > .list .search > button::before, #contents.research .list .search > button::before {
  z-index: 1;
  content: "";
  position: absolute;
  border: 2px solid #212121;
  border-radius: 50%;
  background: #fff;
}
#recruit .container .board .search > button::after, .recruit .container .board .search > button::after, #contents.crList .tabTarget .search > button::after, #contents.pressList > .list .search > button::after, #contents.performanceList > .list .search > button::after, #contents.research .list .search > button::after {
  content: "";
  position: absolute;
  width: 2px;
  background: #212121;
  transform: rotate(-45deg);
}
#recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p {
  color: #212121;
}
#recruit .container .board > p + .list, .recruit .container .board > p + .list, #contents.crList .tabTarget > p + .list, #contents.pressList > .list > p + .list, #contents.performanceList > .list > p + .list, #contents.research .list > p + .list, #recruit .container .board > p + .downloadList, .recruit .container .board > p + .downloadList, #contents.crList .tabTarget > p + .downloadList, #contents.pressList > .list > p + .downloadList, #contents.performanceList > .list > p + .downloadList, #contents.research .list > p + .downloadList {
  margin-top: 10px;
}
#recruit .container .board .thumbMode:not(.case), .recruit .container .board .thumbMode:not(.case), #contents.crList .tabTarget .thumbMode:not(.case), #contents.pressList > .list .thumbMode:not(.case), #contents.performanceList > .list .thumbMode:not(.case), #contents.research .list .thumbMode:not(.case),
#recruit .container .board .mapMode,
.recruit .container .board .mapMode,
#contents.crList .tabTarget .mapMode,
#contents.pressList > .list .mapMode,
#contents.performanceList > .list .mapMode,
#contents.research .list .mapMode {
  right: 20px;
}
#recruit .container .board .textMode, .recruit .container .board .textMode, #contents.crList .tabTarget .textMode, #contents.pressList > .list .textMode, #contents.performanceList > .list .textMode, #contents.research .list .textMode,
#recruit .container .board .thumbMode.case,
.recruit .container .board .thumbMode.case,
#contents.crList .tabTarget .thumbMode.case,
#contents.pressList > .list .thumbMode.case,
#contents.performanceList > .list .thumbMode.case,
#contents.research .list .thumbMode.case {
  right: 59px;
}
#recruit .container .board .map, .recruit .container .board .map, #contents.crList .tabTarget .map, #contents.pressList > .list .map, #contents.performanceList > .list .map, #contents.research .list .map {
  position: absolute;
  visibility: hidden;
  width: calc(100% - 40px);
  border: 1px solid #dcdcdc;
}
#recruit .container .board .map #map, .recruit .container .board .map #map, #contents.crList .tabTarget .map #map, #contents.pressList > .list .map #map, #contents.performanceList > .list .map #map, #contents.research .list .map #map {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#recruit .container .board .mapMode.active ~ .map, .recruit .container .board .mapMode.active ~ .map, #contents.crList .tabTarget .mapMode.active ~ .map, #contents.pressList > .list .mapMode.active ~ .map, #contents.performanceList > .list .mapMode.active ~ .map, #contents.research .list .mapMode.active ~ .map {
  position: relative;
  visibility: visible;
  width: unset;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
  position: relative;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide {
  width: 200px;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink {
  display: block;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 70%;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img {
  display: block;
  width: 100%;
  transition: all 0.3s;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
  display: block;
  color: #212121;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 1.4em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
  font-weight: 700;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide span {
  display: inline;
  color: #666;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide span + span, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer a:hover img, .recruit .container .board .mapMode.active ~ .list .swiperContainer a:hover img, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer a:hover img, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer a:hover img, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer a:hover img, #contents.research .list .mapMode.active ~ .list .swiperContainer a:hover img,
#recruit .container .board .mapMode.active ~ .list .swiperContainer a:focus img,
.recruit .container .board .mapMode.active ~ .list .swiperContainer a:focus img,
#contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer a:focus img,
#contents.pressList > .list .mapMode.active ~ .list .swiperContainer a:focus img,
#contents.performanceList > .list .mapMode.active ~ .list .swiperContainer a:focus img,
#contents.research .list .mapMode.active ~ .list .swiperContainer a:focus img {
  transform: scale(1.06);
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  right: 0;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  left: 0;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev::after, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev::after, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext,
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev,
.recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev,
#contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev,
#contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev,
#contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev,
#contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev {
  z-index: 1;
  position: absolute;
  top: 63px;
}
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:disabled, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext:disabled, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext:disabled, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext:disabled, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext:disabled, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext:disabled,
#recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:disabled,
.recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev:disabled,
#contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev:disabled,
#contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:disabled,
#contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev:disabled,
#contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev:disabled {
  opacity: 0;
}
@media (max-width: 1140px) {
  #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    margin-right: -20px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext {
    right: 10px;
  }
}
@media (min-width: 1025px) {
  #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    margin-left: -10px;
    margin-right: -10px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper {
    margin-left: -8px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide {
    margin-left: 18px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em {
    margin-top: 20px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink {
    margin: 7px 0;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span {
    font-size: 14px;
    line-height: 18px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before {
    top: 5px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink {
    margin-bottom: 15px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em + p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em + p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em + p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + p,
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink,
  .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink,
  #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink,
  #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink,
  #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink,
  #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink {
    margin-top: 7px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide p, #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
    margin-bottom: 5px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide span {
    font-size: 12px;
    line-height: 16px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before {
    top: 4px;
  }
}
@media (max-width: 1024px) and (min-width: 880px) {
  #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    margin-left: -10px;
    margin-right: -10px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper {
    margin-left: -6px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide {
    margin-left: 16px;
  }
}
@media (max-width: 1024px) and (max-width: 879px) {
  #recruit .container .board .mapMode.active ~ .list .swiperContainer, .recruit .container .board .mapMode.active ~ .list .swiperContainer, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer, #contents.research .list .mapMode.active ~ .list .swiperContainer {
    margin-left: -20px;
    margin-right: -20px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper {
    padding-left: 20px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide {
    width: 218px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide, .recruit .container .board .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide, #contents.research .list .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide {
    margin-left: 10px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev,
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext,
  .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnNext,
  #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnNext,
  #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnNext,
  #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnNext,
  #contents.research .list .mapMode.active ~ .list .swiperContainer .btnNext {
    top: 67px;
  }
  #recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, .recruit .container .board .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.crList .tabTarget .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.pressList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.performanceList > .list .mapMode.active ~ .list .swiperContainer .btnPrev, #contents.research .list .mapMode.active ~ .list .swiperContainer .btnPrev {
    left: 10px;
  }
}
#recruit .container .board .mapMode.active ~ .list.caseformap .swiper-slide, .recruit .container .board .mapMode.active ~ .list.caseformap .swiper-slide, #contents.crList .tabTarget .mapMode.active ~ .list.caseformap .swiper-slide, #contents.pressList > .list .mapMode.active ~ .list.caseformap .swiper-slide, #contents.performanceList > .list .mapMode.active ~ .list.caseformap .swiper-slide, #contents.research .list .mapMode.active ~ .list.caseformap .swiper-slide {
  width: 226px;
}
#recruit .container .board .mapMode.active ~ .pagination, .recruit .container .board .mapMode.active ~ .pagination, #contents.crList .tabTarget .mapMode.active ~ .pagination, #contents.pressList > .list .mapMode.active ~ .pagination, #contents.performanceList > .list .mapMode.active ~ .pagination, #contents.research .list .mapMode.active ~ .pagination {
  display: none;
}
#recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
#recruit .container .board .downloadList > li,
.recruit .container .board .downloadList > li,
#contents.crList .tabTarget .downloadList > li,
#contents.pressList > .list .downloadList > li,
#contents.performanceList > .list .downloadList > li,
#contents.research .list .downloadList > li,
#recruit .container .board .listTextMode > a,
.recruit .container .board .listTextMode > a,
#contents.crList .tabTarget .listTextMode > a,
#contents.pressList > .list .listTextMode > a,
#contents.performanceList > .list .listTextMode > a,
#contents.research .list .listTextMode > a,
#recruit .container .board .listTextMode > li,
.recruit .container .board .listTextMode > li,
#contents.crList .tabTarget .listTextMode > li,
#contents.pressList > .list .listTextMode > li,
#contents.performanceList > .list .listTextMode > li,
#contents.research .list .listTextMode > li {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #c8c8c8;
}
#recruit .container .board .downloadList > a:hover, .recruit .container .board .downloadList > a:hover, #contents.crList .tabTarget .downloadList > a:hover, #contents.pressList > .list .downloadList > a:hover, #contents.performanceList > .list .downloadList > a:hover, #contents.research .list .downloadList > a:hover, #recruit .container .board .downloadList > a:focus, .recruit .container .board .downloadList > a:focus, #contents.crList .tabTarget .downloadList > a:focus, #contents.pressList > .list .downloadList > a:focus, #contents.performanceList > .list .downloadList > a:focus, #contents.research .list .downloadList > a:focus,
#recruit .container .board .listTextMode > a:hover,
.recruit .container .board .listTextMode > a:hover,
#contents.crList .tabTarget .listTextMode > a:hover,
#contents.pressList > .list .listTextMode > a:hover,
#contents.performanceList > .list .listTextMode > a:hover,
#contents.research .list .listTextMode > a:hover,
#recruit .container .board .listTextMode > a:focus,
.recruit .container .board .listTextMode > a:focus,
#contents.crList .tabTarget .listTextMode > a:focus,
#contents.pressList > .list .listTextMode > a:focus,
#contents.performanceList > .list .listTextMode > a:focus,
#contents.research .list .listTextMode > a:focus {
  border-color: #4415a0;
}
#recruit .container .board .downloadList > a:hover::after, .recruit .container .board .downloadList > a:hover::after, #contents.crList .tabTarget .downloadList > a:hover::after, #contents.pressList > .list .downloadList > a:hover::after, #contents.performanceList > .list .downloadList > a:hover::after, #contents.research .list .downloadList > a:hover::after, #recruit .container .board .downloadList > a:focus::after, .recruit .container .board .downloadList > a:focus::after, #contents.crList .tabTarget .downloadList > a:focus::after, #contents.pressList > .list .downloadList > a:focus::after, #contents.performanceList > .list .downloadList > a:focus::after, #contents.research .list .downloadList > a:focus::after,
#recruit .container .board .listTextMode > a:hover::after,
.recruit .container .board .listTextMode > a:hover::after,
#contents.crList .tabTarget .listTextMode > a:hover::after,
#contents.pressList > .list .listTextMode > a:hover::after,
#contents.performanceList > .list .listTextMode > a:hover::after,
#contents.research .list .listTextMode > a:hover::after,
#recruit .container .board .listTextMode > a:focus::after,
.recruit .container .board .listTextMode > a:focus::after,
#contents.crList .tabTarget .listTextMode > a:focus::after,
#contents.pressList > .list .listTextMode > a:focus::after,
#contents.performanceList > .list .listTextMode > a:focus::after,
#contents.research .list .listTextMode > a:focus::after {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
#recruit .container .board .downloadList > a > div, .recruit .container .board .downloadList > a > div, #contents.crList .tabTarget .downloadList > a > div, #contents.pressList > .list .downloadList > a > div, #contents.performanceList > .list .downloadList > a > div, #contents.research .list .downloadList > a > div,
#recruit .container .board .listTextMode > a > div,
.recruit .container .board .listTextMode > a > div,
#contents.crList .tabTarget .listTextMode > a > div,
#contents.pressList > .list .listTextMode > a > div,
#contents.performanceList > .list .listTextMode > a > div,
#contents.research .list .listTextMode > a > div {
  display: none;
}
#recruit .container .board .downloadList > a span, .recruit .container .board .downloadList > a span, #contents.crList .tabTarget .downloadList > a span, #contents.pressList > .list .downloadList > a span, #contents.performanceList > .list .downloadList > a span, #contents.research .list .downloadList > a span,
#recruit .container .board .listTextMode > a span,
.recruit .container .board .listTextMode > a span,
#contents.crList .tabTarget .listTextMode > a span,
#contents.pressList > .list .listTextMode > a span,
#contents.performanceList > .list .listTextMode > a span,
#contents.research .list .listTextMode > a span {
  display: inline-block;
  color: #666;
}
#recruit .container .board .downloadList > a span + span, .recruit .container .board .downloadList > a span + span, #contents.crList .tabTarget .downloadList > a span + span, #contents.pressList > .list .downloadList > a span + span, #contents.performanceList > .list .downloadList > a span + span, #contents.research .list .downloadList > a span + span,
#recruit .container .board .listTextMode > a span + span,
.recruit .container .board .listTextMode > a span + span,
#contents.crList .tabTarget .listTextMode > a span + span,
#contents.pressList > .list .listTextMode > a span + span,
#contents.performanceList > .list .listTextMode > a span + span,
#contents.research .list .listTextMode > a span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
#recruit .container .board .downloadList > a span + span::before, .recruit .container .board .downloadList > a span + span::before, #contents.crList .tabTarget .downloadList > a span + span::before, #contents.pressList > .list .downloadList > a span + span::before, #contents.performanceList > .list .downloadList > a span + span::before, #contents.research .list .downloadList > a span + span::before,
#recruit .container .board .listTextMode > a span + span::before,
.recruit .container .board .listTextMode > a span + span::before,
#contents.crList .tabTarget .listTextMode > a span + span::before,
#contents.pressList > .list .listTextMode > a span + span::before,
#contents.performanceList > .list .listTextMode > a span + span::before,
#contents.research .list .listTextMode > a span + span::before {
  content: "";
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
#recruit .container .board .downloadList > a::after, .recruit .container .board .downloadList > a::after, #contents.crList .tabTarget .downloadList > a::after, #contents.pressList > .list .downloadList > a::after, #contents.performanceList > .list .downloadList > a::after, #contents.research .list .downloadList > a::after,
#recruit .container .board .listTextMode > a::after,
.recruit .container .board .listTextMode > a::after,
#contents.crList .tabTarget .listTextMode > a::after,
#contents.pressList > .list .listTextMode > a::after,
#contents.performanceList > .list .listTextMode > a::after,
#contents.research .list .listTextMode > a::after {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  background: url("../images/icon/iconArrow.svg") no-repeat center;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.3;
}
#recruit .container .board .downloadList > a.download::after, .recruit .container .board .downloadList > a.download::after, #contents.crList .tabTarget .downloadList > a.download::after, #contents.pressList > .list .downloadList > a.download::after, #contents.performanceList > .list .downloadList > a.download::after, #contents.research .list .downloadList > a.download::after,
#recruit .container .board .listTextMode > a.download::after,
.recruit .container .board .listTextMode > a.download::after,
#contents.crList .tabTarget .listTextMode > a.download::after,
#contents.pressList > .list .listTextMode > a.download::after,
#contents.performanceList > .list .listTextMode > a.download::after,
#contents.research .list .listTextMode > a.download::after {
  background-image: url("../images/icon/iconDownload3.svg");
  opacity: 1;
}
#recruit .container .board .downloadList > li, .recruit .container .board .downloadList > li, #contents.crList .tabTarget .downloadList > li, #contents.pressList > .list .downloadList > li, #contents.performanceList > .list .downloadList > li, #contents.research .list .downloadList > li,
#recruit .container .board .listTextMode > li,
.recruit .container .board .listTextMode > li,
#contents.crList .tabTarget .listTextMode > li,
#contents.pressList > .list .listTextMode > li,
#contents.performanceList > .list .listTextMode > li,
#contents.research .list .listTextMode > li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .container .board .downloadList > li p, .recruit .container .board .downloadList > li p, #contents.crList .tabTarget .downloadList > li p, #contents.pressList > .list .downloadList > li p, #contents.performanceList > .list .downloadList > li p, #contents.research .list .downloadList > li p,
#recruit .container .board .listTextMode > li p,
.recruit .container .board .listTextMode > li p,
#contents.crList .tabTarget .listTextMode > li p,
#contents.pressList > .list .listTextMode > li p,
#contents.performanceList > .list .listTextMode > li p,
#contents.research .list .listTextMode > li p {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 2.8em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
#recruit .container .board .downloadList > li .buttons, .recruit .container .board .downloadList > li .buttons, #contents.crList .tabTarget .downloadList > li .buttons, #contents.pressList > .list .downloadList > li .buttons, #contents.performanceList > .list .downloadList > li .buttons, #contents.research .list .downloadList > li .buttons,
#recruit .container .board .listTextMode > li .buttons,
.recruit .container .board .listTextMode > li .buttons,
#contents.crList .tabTarget .listTextMode > li .buttons,
#contents.pressList > .list .listTextMode > li .buttons,
#contents.performanceList > .list .listTextMode > li .buttons,
#contents.research .list .listTextMode > li .buttons {
  height: 30px;
}
#recruit .container .board .downloadList > li .buttons a, .recruit .container .board .downloadList > li .buttons a, #contents.crList .tabTarget .downloadList > li .buttons a, #contents.pressList > .list .downloadList > li .buttons a, #contents.performanceList > .list .downloadList > li .buttons a, #contents.research .list .downloadList > li .buttons a,
#recruit .container .board .listTextMode > li .buttons a,
.recruit .container .board .listTextMode > li .buttons a,
#contents.crList .tabTarget .listTextMode > li .buttons a,
#contents.pressList > .list .listTextMode > li .buttons a,
#contents.performanceList > .list .listTextMode > li .buttons a,
#contents.research .list .listTextMode > li .buttons a {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.9;
}
#recruit .container .board .downloadList > li .buttons a.download, .recruit .container .board .downloadList > li .buttons a.download, #contents.crList .tabTarget .downloadList > li .buttons a.download, #contents.pressList > .list .downloadList > li .buttons a.download, #contents.performanceList > .list .downloadList > li .buttons a.download, #contents.research .list .downloadList > li .buttons a.download,
#recruit .container .board .listTextMode > li .buttons a.download,
.recruit .container .board .listTextMode > li .buttons a.download,
#contents.crList .tabTarget .listTextMode > li .buttons a.download,
#contents.pressList > .list .listTextMode > li .buttons a.download,
#contents.performanceList > .list .listTextMode > li .buttons a.download,
#contents.research .list .listTextMode > li .buttons a.download {
  background-image: url("../images/icon/iconDownload3.svg");
}
#recruit .container .board .downloadList > li .buttons a.zoom, .recruit .container .board .downloadList > li .buttons a.zoom, #contents.crList .tabTarget .downloadList > li .buttons a.zoom, #contents.pressList > .list .downloadList > li .buttons a.zoom, #contents.performanceList > .list .downloadList > li .buttons a.zoom, #contents.research .list .downloadList > li .buttons a.zoom,
#recruit .container .board .listTextMode > li .buttons a.zoom,
.recruit .container .board .listTextMode > li .buttons a.zoom,
#contents.crList .tabTarget .listTextMode > li .buttons a.zoom,
#contents.pressList > .list .listTextMode > li .buttons a.zoom,
#contents.performanceList > .list .listTextMode > li .buttons a.zoom,
#contents.research .list .listTextMode > li .buttons a.zoom {
  background-image: url("../images/icon/iconZoom2.svg");
}
#recruit .container .board .downloadList > li .buttons a:hover, .recruit .container .board .downloadList > li .buttons a:hover, #contents.crList .tabTarget .downloadList > li .buttons a:hover, #contents.pressList > .list .downloadList > li .buttons a:hover, #contents.performanceList > .list .downloadList > li .buttons a:hover, #contents.research .list .downloadList > li .buttons a:hover, #recruit .container .board .downloadList > li .buttons a:focus, .recruit .container .board .downloadList > li .buttons a:focus, #contents.crList .tabTarget .downloadList > li .buttons a:focus, #contents.pressList > .list .downloadList > li .buttons a:focus, #contents.performanceList > .list .downloadList > li .buttons a:focus, #contents.research .list .downloadList > li .buttons a:focus,
#recruit .container .board .listTextMode > li .buttons a:hover,
.recruit .container .board .listTextMode > li .buttons a:hover,
#contents.crList .tabTarget .listTextMode > li .buttons a:hover,
#contents.pressList > .list .listTextMode > li .buttons a:hover,
#contents.performanceList > .list .listTextMode > li .buttons a:hover,
#contents.research .list .listTextMode > li .buttons a:hover,
#recruit .container .board .listTextMode > li .buttons a:focus,
.recruit .container .board .listTextMode > li .buttons a:focus,
#contents.crList .tabTarget .listTextMode > li .buttons a:focus,
#contents.pressList > .list .listTextMode > li .buttons a:focus,
#contents.performanceList > .list .listTextMode > li .buttons a:focus,
#contents.research .list .listTextMode > li .buttons a:focus {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
@media (min-width: 1025px) {
  #recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
  #recruit .container .board .downloadList > li,
  .recruit .container .board .downloadList > li,
  #contents.crList .tabTarget .downloadList > li,
  #contents.pressList > .list .downloadList > li,
  #contents.performanceList > .list .downloadList > li,
  #contents.research .list .downloadList > li,
  #recruit .container .board .listTextMode > a,
  .recruit .container .board .listTextMode > a,
  #contents.crList .tabTarget .listTextMode > a,
  #contents.pressList > .list .listTextMode > a,
  #contents.performanceList > .list .listTextMode > a,
  #contents.research .list .listTextMode > a,
  #recruit .container .board .listTextMode > li,
  .recruit .container .board .listTextMode > li,
  #contents.crList .tabTarget .listTextMode > li,
  #contents.pressList > .list .listTextMode > li,
  #contents.performanceList > .list .listTextMode > li,
  #contents.research .list .listTextMode > li {
    padding-left: 70px;
  }
  #recruit .container .board .downloadList > a + a, .recruit .container .board .downloadList > a + a, #contents.crList .tabTarget .downloadList > a + a, #contents.pressList > .list .downloadList > a + a, #contents.performanceList > .list .downloadList > a + a, #contents.research .list .downloadList > a + a, #recruit .container .board .downloadList > a + li, .recruit .container .board .downloadList > a + li, #contents.crList .tabTarget .downloadList > a + li, #contents.pressList > .list .downloadList > a + li, #contents.performanceList > .list .downloadList > a + li, #contents.research .list .downloadList > a + li,
  #recruit .container .board .downloadList > li + a,
  .recruit .container .board .downloadList > li + a,
  #contents.crList .tabTarget .downloadList > li + a,
  #contents.pressList > .list .downloadList > li + a,
  #contents.performanceList > .list .downloadList > li + a,
  #contents.research .list .downloadList > li + a,
  #recruit .container .board .downloadList > li + li,
  .recruit .container .board .downloadList > li + li,
  #contents.crList .tabTarget .downloadList > li + li,
  #contents.pressList > .list .downloadList > li + li,
  #contents.performanceList > .list .downloadList > li + li,
  #contents.research .list .downloadList > li + li,
  #recruit .container .board .listTextMode > a + a,
  .recruit .container .board .listTextMode > a + a,
  #contents.crList .tabTarget .listTextMode > a + a,
  #contents.pressList > .list .listTextMode > a + a,
  #contents.performanceList > .list .listTextMode > a + a,
  #contents.research .list .listTextMode > a + a,
  #recruit .container .board .listTextMode > a + li,
  .recruit .container .board .listTextMode > a + li,
  #contents.crList .tabTarget .listTextMode > a + li,
  #contents.pressList > .list .listTextMode > a + li,
  #contents.performanceList > .list .listTextMode > a + li,
  #contents.research .list .listTextMode > a + li,
  #recruit .container .board .listTextMode > li + a,
  .recruit .container .board .listTextMode > li + a,
  #contents.crList .tabTarget .listTextMode > li + a,
  #contents.pressList > .list .listTextMode > li + a,
  #contents.performanceList > .list .listTextMode > li + a,
  #contents.research .list .listTextMode > li + a,
  #recruit .container .board .listTextMode > li + li,
  .recruit .container .board .listTextMode > li + li,
  #contents.crList .tabTarget .listTextMode > li + li,
  #contents.pressList > .list .listTextMode > li + li,
  #contents.performanceList > .list .listTextMode > li + li,
  #contents.research .list .listTextMode > li + li {
    margin-top: 20px;
  }
  #recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
  #recruit .container .board .listTextMode > a,
  .recruit .container .board .listTextMode > a,
  #contents.crList .tabTarget .listTextMode > a,
  #contents.pressList > .list .listTextMode > a,
  #contents.performanceList > .list .listTextMode > a,
  #contents.research .list .listTextMode > a {
    min-height: 170px;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-right: 150px;
  }
  #recruit .container .board .downloadList > a p, .recruit .container .board .downloadList > a p, #contents.crList .tabTarget .downloadList > a p, #contents.pressList > .list .downloadList > a p, #contents.performanceList > .list .downloadList > a p, #contents.research .list .downloadList > a p,
  #recruit .container .board .listTextMode > a p,
  .recruit .container .board .listTextMode > a p,
  #contents.crList .tabTarget .listTextMode > a p,
  #contents.pressList > .list .listTextMode > a p,
  #contents.performanceList > .list .listTextMode > a p,
  #contents.research .list .listTextMode > a p {
    margin-top: 10px;
  }
  #recruit .container .board .downloadList > a::after, .recruit .container .board .downloadList > a::after, #contents.crList .tabTarget .downloadList > a::after, #contents.pressList > .list .downloadList > a::after, #contents.performanceList > .list .downloadList > a::after, #contents.research .list .downloadList > a::after,
  #recruit .container .board .listTextMode > a::after,
  .recruit .container .board .listTextMode > a::after,
  #contents.crList .tabTarget .listTextMode > a::after,
  #contents.pressList > .list .listTextMode > a::after,
  #contents.performanceList > .list .listTextMode > a::after,
  #contents.research .list .listTextMode > a::after {
    top: 80px;
    right: 48px;
  }
  #recruit .container .board .downloadList > li, .recruit .container .board .downloadList > li, #contents.crList .tabTarget .downloadList > li, #contents.pressList > .list .downloadList > li, #contents.performanceList > .list .downloadList > li, #contents.research .list .downloadList > li,
  #recruit .container .board .listTextMode > li,
  .recruit .container .board .listTextMode > li,
  #contents.crList .tabTarget .listTextMode > li,
  #contents.pressList > .list .listTextMode > li,
  #contents.performanceList > .list .listTextMode > li,
  #contents.research .list .listTextMode > li {
    height: 164px;
    padding-right: 180px;
  }
  #recruit .container .board .downloadList > li .buttons, .recruit .container .board .downloadList > li .buttons, #contents.crList .tabTarget .downloadList > li .buttons, #contents.pressList > .list .downloadList > li .buttons, #contents.performanceList > .list .downloadList > li .buttons, #contents.research .list .downloadList > li .buttons,
  #recruit .container .board .listTextMode > li .buttons,
  .recruit .container .board .listTextMode > li .buttons,
  #contents.crList .tabTarget .listTextMode > li .buttons,
  #contents.pressList > .list .listTextMode > li .buttons,
  #contents.performanceList > .list .listTextMode > li .buttons,
  #contents.research .list .listTextMode > li .buttons {
    right: 50px;
  }
  #recruit .container .board .downloadList > li .buttons a + a, .recruit .container .board .downloadList > li .buttons a + a, #contents.crList .tabTarget .downloadList > li .buttons a + a, #contents.pressList > .list .downloadList > li .buttons a + a, #contents.performanceList > .list .downloadList > li .buttons a + a, #contents.research .list .downloadList > li .buttons a + a,
  #recruit .container .board .listTextMode > li .buttons a + a,
  .recruit .container .board .listTextMode > li .buttons a + a,
  #contents.crList .tabTarget .listTextMode > li .buttons a + a,
  #contents.pressList > .list .listTextMode > li .buttons a + a,
  #contents.performanceList > .list .listTextMode > li .buttons a + a,
  #contents.research .list .listTextMode > li .buttons a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
  #recruit .container .board .downloadList > li,
  .recruit .container .board .downloadList > li,
  #contents.crList .tabTarget .downloadList > li,
  #contents.pressList > .list .downloadList > li,
  #contents.performanceList > .list .downloadList > li,
  #contents.research .list .downloadList > li,
  #recruit .container .board .listTextMode > a,
  .recruit .container .board .listTextMode > a,
  #contents.crList .tabTarget .listTextMode > a,
  #contents.pressList > .list .listTextMode > a,
  #contents.performanceList > .list .listTextMode > a,
  #contents.research .list .listTextMode > a,
  #recruit .container .board .listTextMode > li,
  .recruit .container .board .listTextMode > li,
  #contents.crList .tabTarget .listTextMode > li,
  #contents.pressList > .list .listTextMode > li,
  #contents.performanceList > .list .listTextMode > li,
  #contents.research .list .listTextMode > li {
    padding-left: 25px;
  }
  #recruit .container .board .downloadList > a + a, .recruit .container .board .downloadList > a + a, #contents.crList .tabTarget .downloadList > a + a, #contents.pressList > .list .downloadList > a + a, #contents.performanceList > .list .downloadList > a + a, #contents.research .list .downloadList > a + a, #recruit .container .board .downloadList > a + li, .recruit .container .board .downloadList > a + li, #contents.crList .tabTarget .downloadList > a + li, #contents.pressList > .list .downloadList > a + li, #contents.performanceList > .list .downloadList > a + li, #contents.research .list .downloadList > a + li,
  #recruit .container .board .downloadList > li + a,
  .recruit .container .board .downloadList > li + a,
  #contents.crList .tabTarget .downloadList > li + a,
  #contents.pressList > .list .downloadList > li + a,
  #contents.performanceList > .list .downloadList > li + a,
  #contents.research .list .downloadList > li + a,
  #recruit .container .board .downloadList > li + li,
  .recruit .container .board .downloadList > li + li,
  #contents.crList .tabTarget .downloadList > li + li,
  #contents.pressList > .list .downloadList > li + li,
  #contents.performanceList > .list .downloadList > li + li,
  #contents.research .list .downloadList > li + li,
  #recruit .container .board .listTextMode > a + a,
  .recruit .container .board .listTextMode > a + a,
  #contents.crList .tabTarget .listTextMode > a + a,
  #contents.pressList > .list .listTextMode > a + a,
  #contents.performanceList > .list .listTextMode > a + a,
  #contents.research .list .listTextMode > a + a,
  #recruit .container .board .listTextMode > a + li,
  .recruit .container .board .listTextMode > a + li,
  #contents.crList .tabTarget .listTextMode > a + li,
  #contents.pressList > .list .listTextMode > a + li,
  #contents.performanceList > .list .listTextMode > a + li,
  #contents.research .list .listTextMode > a + li,
  #recruit .container .board .listTextMode > li + a,
  .recruit .container .board .listTextMode > li + a,
  #contents.crList .tabTarget .listTextMode > li + a,
  #contents.pressList > .list .listTextMode > li + a,
  #contents.performanceList > .list .listTextMode > li + a,
  #contents.research .list .listTextMode > li + a,
  #recruit .container .board .listTextMode > li + li,
  .recruit .container .board .listTextMode > li + li,
  #contents.crList .tabTarget .listTextMode > li + li,
  #contents.pressList > .list .listTextMode > li + li,
  #contents.performanceList > .list .listTextMode > li + li,
  #contents.research .list .listTextMode > li + li {
    margin-top: 15px;
  }
  #recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
  #recruit .container .board .listTextMode > a,
  .recruit .container .board .listTextMode > a,
  #contents.crList .tabTarget .listTextMode > a,
  #contents.pressList > .list .listTextMode > a,
  #contents.performanceList > .list .listTextMode > a,
  #contents.research .list .listTextMode > a {
    height: 130px;
    padding-top: 33px;
    padding-right: 25px;
  }
  #recruit .container .board .downloadList > a p, .recruit .container .board .downloadList > a p, #contents.crList .tabTarget .downloadList > a p, #contents.pressList > .list .downloadList > a p, #contents.performanceList > .list .downloadList > a p, #contents.research .list .downloadList > a p,
  #recruit .container .board .listTextMode > a p,
  .recruit .container .board .listTextMode > a p,
  #contents.crList .tabTarget .listTextMode > a p,
  #contents.pressList > .list .listTextMode > a p,
  #contents.performanceList > .list .listTextMode > a p,
  #contents.research .list .listTextMode > a p {
    margin-top: 5px;
    padding-right: 50px;
    font-weight: 300;
  }
  #recruit .container .board .downloadList > a::after, .recruit .container .board .downloadList > a::after, #contents.crList .tabTarget .downloadList > a::after, #contents.pressList > .list .downloadList > a::after, #contents.performanceList > .list .downloadList > a::after, #contents.research .list .downloadList > a::after,
  #recruit .container .board .listTextMode > a::after,
  .recruit .container .board .listTextMode > a::after,
  #contents.crList .tabTarget .listTextMode > a::after,
  #contents.pressList > .list .listTextMode > a::after,
  #contents.performanceList > .list .listTextMode > a::after,
  #contents.research .list .listTextMode > a::after {
    bottom: 37px;
    right: 25px;
  }
  #recruit .container .board .downloadList li, .recruit .container .board .downloadList li, #contents.crList .tabTarget .downloadList li, #contents.pressList > .list .downloadList li, #contents.performanceList > .list .downloadList li, #contents.research .list .downloadList li,
  #recruit .container .board .listTextMode li,
  .recruit .container .board .listTextMode li,
  #contents.crList .tabTarget .listTextMode li,
  #contents.pressList > .list .listTextMode li,
  #contents.performanceList > .list .listTextMode li,
  #contents.research .list .listTextMode li {
    height: 95px;
    padding-right: 25px;
  }
  #recruit .container .board .downloadList li p, .recruit .container .board .downloadList li p, #contents.crList .tabTarget .downloadList li p, #contents.pressList > .list .downloadList li p, #contents.performanceList > .list .downloadList li p, #contents.research .list .downloadList li p,
  #recruit .container .board .listTextMode li p,
  .recruit .container .board .listTextMode li p,
  #contents.crList .tabTarget .listTextMode li p,
  #contents.pressList > .list .listTextMode li p,
  #contents.performanceList > .list .listTextMode li p,
  #contents.research .list .listTextMode li p {
    padding-right: 100px;
  }
  #recruit .container .board .downloadList li .buttons, .recruit .container .board .downloadList li .buttons, #contents.crList .tabTarget .downloadList li .buttons, #contents.pressList > .list .downloadList li .buttons, #contents.performanceList > .list .downloadList li .buttons, #contents.research .list .downloadList li .buttons,
  #recruit .container .board .listTextMode li .buttons,
  .recruit .container .board .listTextMode li .buttons,
  #contents.crList .tabTarget .listTextMode li .buttons,
  #contents.pressList > .list .listTextMode li .buttons,
  #contents.performanceList > .list .listTextMode li .buttons,
  #contents.research .list .listTextMode li .buttons {
    position: absolute;
    right: 30px;
  }
  #recruit .container .board .downloadList li .buttons a + a, .recruit .container .board .downloadList li .buttons a + a, #contents.crList .tabTarget .downloadList li .buttons a + a, #contents.pressList > .list .downloadList li .buttons a + a, #contents.performanceList > .list .downloadList li .buttons a + a, #contents.research .list .downloadList li .buttons a + a,
  #recruit .container .board .listTextMode li .buttons a + a,
  .recruit .container .board .listTextMode li .buttons a + a,
  #contents.crList .tabTarget .listTextMode li .buttons a + a,
  #contents.pressList > .list .listTextMode li .buttons a + a,
  #contents.performanceList > .list .listTextMode li .buttons a + a,
  #contents.research .list .listTextMode li .buttons a + a {
    margin-left: 10px;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #recruit .container .board .downloadList > a, .recruit .container .board .downloadList > a, #contents.crList .tabTarget .downloadList > a, #contents.pressList > .list .downloadList > a, #contents.performanceList > .list .downloadList > a, #contents.research .list .downloadList > a,
  #recruit .container .board .listTextMode > a,
  .recruit .container .board .listTextMode > a,
  #contents.crList .tabTarget .listTextMode > a,
  #contents.pressList > .list .listTextMode > a,
  #contents.performanceList > .list .listTextMode > a,
  #contents.research .list .listTextMode > a {
    height: 145px;
  }
  #recruit .container .board .downloadList > a:not(.download)::after, .recruit .container .board .downloadList > a:not(.download)::after, #contents.crList .tabTarget .downloadList > a:not(.download)::after, #contents.pressList > .list .downloadList > a:not(.download)::after, #contents.performanceList > .list .downloadList > a:not(.download)::after, #contents.research .list .downloadList > a:not(.download)::after,
  #recruit .container .board .listTextMode > a:not(.download)::after,
  .recruit .container .board .listTextMode > a:not(.download)::after,
  #contents.crList .tabTarget .listTextMode > a:not(.download)::after,
  #contents.pressList > .list .listTextMode > a:not(.download)::after,
  #contents.performanceList > .list .listTextMode > a:not(.download)::after,
  #contents.research .list .listTextMode > a:not(.download)::after {
    display: none;
  }
  #recruit .container .board .downloadList > a:not(.download) p, .recruit .container .board .downloadList > a:not(.download) p, #contents.crList .tabTarget .downloadList > a:not(.download) p, #contents.pressList > .list .downloadList > a:not(.download) p, #contents.performanceList > .list .downloadList > a:not(.download) p, #contents.research .list .downloadList > a:not(.download) p,
  #recruit .container .board .listTextMode > a:not(.download) p,
  .recruit .container .board .listTextMode > a:not(.download) p,
  #contents.crList .tabTarget .listTextMode > a:not(.download) p,
  #contents.pressList > .list .listTextMode > a:not(.download) p,
  #contents.performanceList > .list .listTextMode > a:not(.download) p,
  #contents.research .list .listTextMode > a:not(.download) p {
    padding-right: 0;
  }
  #recruit .container .board .downloadList > a p, .recruit .container .board .downloadList > a p, #contents.crList .tabTarget .downloadList > a p, #contents.pressList > .list .downloadList > a p, #contents.performanceList > .list .downloadList > a p, #contents.research .list .downloadList > a p,
  #recruit .container .board .listTextMode > a p,
  .recruit .container .board .listTextMode > a p,
  #contents.crList .tabTarget .listTextMode > a p,
  #contents.pressList > .list .listTextMode > a p,
  #contents.performanceList > .list .listTextMode > a p,
  #contents.research .list .listTextMode > a p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 2.8em;
    line-height: 1.4 !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  #recruit .container .board .downloadList > a::after, .recruit .container .board .downloadList > a::after, #contents.crList .tabTarget .downloadList > a::after, #contents.pressList > .list .downloadList > a::after, #contents.performanceList > .list .downloadList > a::after, #contents.research .list .downloadList > a::after,
  #recruit .container .board .listTextMode > a::after,
  .recruit .container .board .listTextMode > a::after,
  #contents.crList .tabTarget .listTextMode > a::after,
  #contents.pressList > .list .listTextMode > a::after,
  #contents.performanceList > .list .listTextMode > a::after,
  #contents.research .list .listTextMode > a::after {
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
#recruit .container .board .jobOpeningList li, .recruit .container .board .jobOpeningList li, #contents.crList .tabTarget .jobOpeningList li, #contents.pressList > .list .jobOpeningList li, #contents.performanceList > .list .jobOpeningList li, #contents.research .list .jobOpeningList li {
  position: relative;
}
#recruit .container .board .jobOpeningList a, .recruit .container .board .jobOpeningList a, #contents.crList .tabTarget .jobOpeningList a, #contents.pressList > .list .jobOpeningList a, #contents.performanceList > .list .jobOpeningList a, #contents.research .list .jobOpeningList a {
  display: block;
  border: 1px solid #c8c8c8;
}
#recruit .container .board .jobOpeningList a:hover, .recruit .container .board .jobOpeningList a:hover, #contents.crList .tabTarget .jobOpeningList a:hover, #contents.pressList > .list .jobOpeningList a:hover, #contents.performanceList > .list .jobOpeningList a:hover, #contents.research .list .jobOpeningList a:hover, #recruit .container .board .jobOpeningList a:focus, .recruit .container .board .jobOpeningList a:focus, #contents.crList .tabTarget .jobOpeningList a:focus, #contents.pressList > .list .jobOpeningList a:focus, #contents.performanceList > .list .jobOpeningList a:focus, #contents.research .list .jobOpeningList a:focus {
  border-color: #4415a0;
}
#recruit .container .board .jobOpeningList a:hover > strong, .recruit .container .board .jobOpeningList a:hover > strong, #contents.crList .tabTarget .jobOpeningList a:hover > strong, #contents.pressList > .list .jobOpeningList a:hover > strong, #contents.performanceList > .list .jobOpeningList a:hover > strong, #contents.research .list .jobOpeningList a:hover > strong, #recruit .container .board .jobOpeningList a:focus > strong, .recruit .container .board .jobOpeningList a:focus > strong, #contents.crList .tabTarget .jobOpeningList a:focus > strong, #contents.pressList > .list .jobOpeningList a:focus > strong, #contents.performanceList > .list .jobOpeningList a:focus > strong, #contents.research .list .jobOpeningList a:focus > strong {
  color: #643ce0;
}
#recruit .container .board .jobOpeningList a em, .recruit .container .board .jobOpeningList a em, #contents.crList .tabTarget .jobOpeningList a em, #contents.pressList > .list .jobOpeningList a em, #contents.performanceList > .list .jobOpeningList a em, #contents.research .list .jobOpeningList a em {
  display: block;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
  color: #4415a0;
}
#recruit .container .board .jobOpeningList a .info, .recruit .container .board .jobOpeningList a .info, #contents.crList .tabTarget .jobOpeningList a .info, #contents.pressList > .list .jobOpeningList a .info, #contents.performanceList > .list .jobOpeningList a .info, #contents.research .list .jobOpeningList a .info {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 15px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #666;
}
#recruit .container .board .jobOpeningList a .info span:not(:last-child), .recruit .container .board .jobOpeningList a .info span:not(:last-child), #contents.crList .tabTarget .jobOpeningList a .info span:not(:last-child), #contents.pressList > .list .jobOpeningList a .info span:not(:last-child), #contents.performanceList > .list .jobOpeningList a .info span:not(:last-child), #contents.research .list .jobOpeningList a .info span:not(:last-child) {
  position: relative;
}
#recruit .container .board .jobOpeningList a .info span:not(:last-child)::after, .recruit .container .board .jobOpeningList a .info span:not(:last-child)::after, #contents.crList .tabTarget .jobOpeningList a .info span:not(:last-child)::after, #contents.pressList > .list .jobOpeningList a .info span:not(:last-child)::after, #contents.performanceList > .list .jobOpeningList a .info span:not(:last-child)::after, #contents.research .list .jobOpeningList a .info span:not(:last-child)::after {
  content: "";
  right: 0;
  width: 1px;
  height: 14px;
  background: #c8c8c8;
}
#recruit .container .board .jobOpeningList a > strong, .recruit .container .board .jobOpeningList a > strong, #contents.crList .tabTarget .jobOpeningList a > strong, #contents.pressList > .list .jobOpeningList a > strong, #contents.performanceList > .list .jobOpeningList a > strong, #contents.research .list .jobOpeningList a > strong {
  display: block;
  font-family: "Sans-serif", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Apple SD Gothic Neo", Arial, sans-serif;
  font-weight: 500;
  color: #aaa;
}
#recruit .container .board .jobOpeningList a > span, .recruit .container .board .jobOpeningList a > span, #contents.crList .tabTarget .jobOpeningList a > span, #contents.pressList > .list .jobOpeningList a > span, #contents.performanceList > .list .jobOpeningList a > span, #contents.research .list .jobOpeningList a > span {
  display: block;
  color: #666;
}
#recruit .container .board .jobOpeningList li > button, .recruit .container .board .jobOpeningList li > button, #contents.crList .tabTarget .jobOpeningList li > button, #contents.pressList > .list .jobOpeningList li > button, #contents.performanceList > .list .jobOpeningList li > button, #contents.research .list .jobOpeningList li > button {
  position: absolute;
  width: 35px;
  height: 35px;
  background: url("../images/icon/iconShare2.svg") no-repeat center;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
#recruit .container .board .jobOpeningList li > button:hover, .recruit .container .board .jobOpeningList li > button:hover, #contents.crList .tabTarget .jobOpeningList li > button:hover, #contents.pressList > .list .jobOpeningList li > button:hover, #contents.performanceList > .list .jobOpeningList li > button:hover, #contents.research .list .jobOpeningList li > button:hover, #recruit .container .board .jobOpeningList li > button.active, .recruit .container .board .jobOpeningList li > button.active, #contents.crList .tabTarget .jobOpeningList li > button.active, #contents.pressList > .list .jobOpeningList li > button.active, #contents.performanceList > .list .jobOpeningList li > button.active, #contents.research .list .jobOpeningList li > button.active {
  background-image: url("../images/icon/iconShare2On.svg");
}
@media (min-width: 1025px) {
  #recruit .container .board .jobOpeningList li + li, .recruit .container .board .jobOpeningList li + li, #contents.crList .tabTarget .jobOpeningList li + li, #contents.pressList > .list .jobOpeningList li + li, #contents.performanceList > .list .jobOpeningList li + li, #contents.research .list .jobOpeningList li + li {
    margin-top: 20px;
  }
  #recruit .container .board .jobOpeningList a, .recruit .container .board .jobOpeningList a, #contents.crList .tabTarget .jobOpeningList a, #contents.pressList > .list .jobOpeningList a, #contents.performanceList > .list .jobOpeningList a, #contents.research .list .jobOpeningList a {
    padding: 40px 100px;
  }
  #recruit .container .board .jobOpeningList a .info span:not(:last-child), .recruit .container .board .jobOpeningList a .info span:not(:last-child), #contents.crList .tabTarget .jobOpeningList a .info span:not(:last-child), #contents.pressList > .list .jobOpeningList a .info span:not(:last-child), #contents.performanceList > .list .jobOpeningList a .info span:not(:last-child), #contents.research .list .jobOpeningList a .info span:not(:last-child) {
    margin-right: 14px;
    padding-right: 14px;
  }
  #recruit .container .board .jobOpeningList a p, .recruit .container .board .jobOpeningList a p, #contents.crList .tabTarget .jobOpeningList a p, #contents.pressList > .list .jobOpeningList a p, #contents.performanceList > .list .jobOpeningList a p, #contents.research .list .jobOpeningList a p {
    margin-top: 12px;
  }
  #recruit .container .board .jobOpeningList a > strong, .recruit .container .board .jobOpeningList a > strong, #contents.crList .tabTarget .jobOpeningList a > strong, #contents.pressList > .list .jobOpeningList a > strong, #contents.performanceList > .list .jobOpeningList a > strong, #contents.research .list .jobOpeningList a > strong {
    position: absolute;
    top: 70px;
    right: 100px;
    font-size: 50px;
    line-height: 62px;
    letter-spacing: -0.035em;
  }
  #recruit .container .board .jobOpeningList a > span, .recruit .container .board .jobOpeningList a > span, #contents.crList .tabTarget .jobOpeningList a > span, #contents.pressList > .list .jobOpeningList a > span, #contents.performanceList > .list .jobOpeningList a > span, #contents.research .list .jobOpeningList a > span {
    margin-top: 45px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #recruit .container .board .jobOpeningList li > button, .recruit .container .board .jobOpeningList li > button, #contents.crList .tabTarget .jobOpeningList li > button, #contents.pressList > .list .jobOpeningList li > button, #contents.performanceList > .list .jobOpeningList li > button, #contents.research .list .jobOpeningList li > button {
    bottom: 47px;
    right: 94px;
  }
  #recruit .container .board .jobOpeningList .share, .recruit .container .board .jobOpeningList .share, #contents.crList .tabTarget .jobOpeningList .share, #contents.pressList > .list .jobOpeningList .share, #contents.performanceList > .list .jobOpeningList .share, #contents.research .list .jobOpeningList .share {
    bottom: 29px;
    right: 140px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .jobOpeningList li + li, .recruit .container .board .jobOpeningList li + li, #contents.crList .tabTarget .jobOpeningList li + li, #contents.pressList > .list .jobOpeningList li + li, #contents.performanceList > .list .jobOpeningList li + li, #contents.research .list .jobOpeningList li + li {
    margin-top: 15px;
  }
  #recruit .container .board .jobOpeningList a, .recruit .container .board .jobOpeningList a, #contents.crList .tabTarget .jobOpeningList a, #contents.pressList > .list .jobOpeningList a, #contents.performanceList > .list .jobOpeningList a, #contents.research .list .jobOpeningList a {
    padding: 30px 20px;
  }
  #recruit .container .board .jobOpeningList a .info span:not(:last-child), .recruit .container .board .jobOpeningList a .info span:not(:last-child), #contents.crList .tabTarget .jobOpeningList a .info span:not(:last-child), #contents.pressList > .list .jobOpeningList a .info span:not(:last-child), #contents.performanceList > .list .jobOpeningList a .info span:not(:last-child), #contents.research .list .jobOpeningList a .info span:not(:last-child) {
    margin-right: 7px;
    padding-right: 7px;
  }
  #recruit .container .board .jobOpeningList a p, .recruit .container .board .jobOpeningList a p, #contents.crList .tabTarget .jobOpeningList a p, #contents.pressList > .list .jobOpeningList a p, #contents.performanceList > .list .jobOpeningList a p, #contents.research .list .jobOpeningList a p {
    margin-top: 7px;
  }
  #recruit .container .board .jobOpeningList a > strong, .recruit .container .board .jobOpeningList a > strong, #contents.crList .tabTarget .jobOpeningList a > strong, #contents.pressList > .list .jobOpeningList a > strong, #contents.performanceList > .list .jobOpeningList a > strong, #contents.research .list .jobOpeningList a > strong {
    margin-top: 15px;
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
  #recruit .container .board .jobOpeningList a > span, .recruit .container .board .jobOpeningList a > span, #contents.crList .tabTarget .jobOpeningList a > span, #contents.pressList > .list .jobOpeningList a > span, #contents.performanceList > .list .jobOpeningList a > span, #contents.research .list .jobOpeningList a > span {
    margin-top: 2px;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #recruit .container .board .jobOpeningList li > button, .recruit .container .board .jobOpeningList li > button, #contents.crList .tabTarget .jobOpeningList li > button, #contents.pressList > .list .jobOpeningList li > button, #contents.performanceList > .list .jobOpeningList li > button, #contents.research .list .jobOpeningList li > button {
    bottom: 24px;
    right: 24px;
  }
  #recruit .container .board .jobOpeningList li > button.active + .share, .recruit .container .board .jobOpeningList li > button.active + .share, #contents.crList .tabTarget .jobOpeningList li > button.active + .share, #contents.pressList > .list .jobOpeningList li > button.active + .share, #contents.performanceList > .list .jobOpeningList li > button.active + .share, #contents.research .list .jobOpeningList li > button.active + .share {
    -ms-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
  }
  #recruit .container .board .jobOpeningList .share, .recruit .container .board .jobOpeningList .share, #contents.crList .tabTarget .jobOpeningList .share, #contents.pressList > .list .jobOpeningList .share, #contents.performanceList > .list .jobOpeningList .share, #contents.research .list .jobOpeningList .share {
    bottom: 65px;
    right: 15px;
  }
}
#recruit .container .board .empty, .recruit .container .board .empty, #contents.crList .tabTarget .empty, #contents.pressList > .list .empty, #contents.performanceList > .list .empty, #contents.research .list .empty {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 390px;
  padding-bottom: 40px;
  border-bottom: 1px solid #c8c8c8;
  text-align: center;
}
#recruit .container .board .empty::before, .recruit .container .board .empty::before, #contents.crList .tabTarget .empty::before, #contents.pressList > .list .empty::before, #contents.performanceList > .list .empty::before, #contents.research .list .empty::before {
  content: "";
  width: 100px;
  height: 100px;
  background: url("../images/board/imgNoResult.svg") no-repeat center;
}
#recruit .container .board .empty p, .recruit .container .board .empty p, #contents.crList .tabTarget .empty p, #contents.pressList > .list .empty p, #contents.performanceList > .list .empty p, #contents.research .list .empty p {
  margin-top: 30px;
  margin-bottom: 20px;
}
#recruit .container .board .empty p em, .recruit .container .board .empty p em, #contents.crList .tabTarget .empty p em, #contents.pressList > .list .empty p em, #contents.performanceList > .list .empty p em, #contents.research .list .empty p em {
  font-weight: 700;
  color: #4415a0;
}
#recruit .container .board .empty span, .recruit .container .board .empty span, #contents.crList .tabTarget .empty span, #contents.pressList > .list .empty span, #contents.performanceList > .list .empty span, #contents.research .list .empty span {
  color: #666;
}
#recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1 {
  width: 100%;
}
#recruit .container .board .recommend .btnPrev, .recruit .container .board .recommend .btnPrev, #contents.crList .tabTarget .recommend .btnPrev, #contents.pressList > .list .recommend .btnPrev, #contents.performanceList > .list .recommend .btnPrev, #contents.research .list .recommend .btnPrev,
#recruit .container .board .recommend .btnNext,
.recruit .container .board .recommend .btnNext,
#contents.crList .tabTarget .recommend .btnNext,
#contents.pressList > .list .recommend .btnNext,
#contents.performanceList > .list .recommend .btnNext,
#contents.research .list .recommend .btnNext {
  display: none;
}
#recruit .container .board .recommend > p, .recruit .container .board .recommend > p, #contents.crList .tabTarget .recommend > p, #contents.pressList > .list .recommend > p, #contents.performanceList > .list .recommend > p, #contents.research .list .recommend > p {
  margin-bottom: 10px;
  width: 100%;
  color: #212121;
}
#recruit .container .board .recommend .swiper-wrapper, .recruit .container .board .recommend .swiper-wrapper, #contents.crList .tabTarget .recommend .swiper-wrapper, #contents.pressList > .list .recommend .swiper-wrapper, #contents.performanceList > .list .recommend .swiper-wrapper, #contents.research .list .recommend .swiper-wrapper {
  display: block !important;
  transform: none !important;
}
#recruit .container .board .recommend .swiper-button-prev, .recruit .container .board .recommend .swiper-button-prev, #contents.crList .tabTarget .recommend .swiper-button-prev, #contents.pressList > .list .recommend .swiper-button-prev, #contents.performanceList > .list .recommend .swiper-button-prev, #contents.research .list .recommend .swiper-button-prev,
#recruit .container .board .recommend .swiper-button-next,
.recruit .container .board .recommend .swiper-button-next,
#contents.crList .tabTarget .recommend .swiper-button-next,
#contents.pressList > .list .recommend .swiper-button-next,
#contents.performanceList > .list .recommend .swiper-button-next,
#contents.research .list .recommend .swiper-button-next {
  display: none;
}
#recruit .container .board .recommend > a, .recruit .container .board .recommend > a, #contents.crList .tabTarget .recommend > a, #contents.pressList > .list .recommend > a, #contents.performanceList > .list .recommend > a, #contents.research .list .recommend > a, #recruit .container .board .recommend .swiper-slide, .recruit .container .board .recommend .swiper-slide, #contents.crList .tabTarget .recommend .swiper-slide, #contents.pressList > .list .recommend .swiper-slide, #contents.performanceList > .list .recommend .swiper-slide, #contents.research .list .recommend .swiper-slide {
  vertical-align: top;
}
#recruit .container .board .recommend > a > div, .recruit .container .board .recommend > a > div, #contents.crList .tabTarget .recommend > a > div, #contents.pressList > .list .recommend > a > div, #contents.performanceList > .list .recommend > a > div, #contents.research .list .recommend > a > div, #recruit .container .board .recommend > a .imgLink, .recruit .container .board .recommend > a .imgLink, #contents.crList .tabTarget .recommend > a .imgLink, #contents.pressList > .list .recommend > a .imgLink, #contents.performanceList > .list .recommend > a .imgLink, #contents.research .list .recommend > a .imgLink, #recruit .container .board .recommend .swiper-slide > div, .recruit .container .board .recommend .swiper-slide > div, #contents.crList .tabTarget .recommend .swiper-slide > div, #contents.pressList > .list .recommend .swiper-slide > div, #contents.performanceList > .list .recommend .swiper-slide > div, #contents.research .list .recommend .swiper-slide > div, #recruit .container .board .recommend .swiper-slide .imgLink, .recruit .container .board .recommend .swiper-slide .imgLink, #contents.crList .tabTarget .recommend .swiper-slide .imgLink, #contents.pressList > .list .recommend .swiper-slide .imgLink, #contents.performanceList > .list .recommend .swiper-slide .imgLink, #contents.research .list .recommend .swiper-slide .imgLink {
  position: relative;
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 68.6274%;
  /*&.case {
    padding-bottom: 70.098%;
  }*/
  overflow: hidden;
}
#recruit .container .board .recommend > a > div img, .recruit .container .board .recommend > a > div img, #contents.crList .tabTarget .recommend > a > div img, #contents.pressList > .list .recommend > a > div img, #contents.performanceList > .list .recommend > a > div img, #contents.research .list .recommend > a > div img, #recruit .container .board .recommend > a .imgLink img, .recruit .container .board .recommend > a .imgLink img, #contents.crList .tabTarget .recommend > a .imgLink img, #contents.pressList > .list .recommend > a .imgLink img, #contents.performanceList > .list .recommend > a .imgLink img, #contents.research .list .recommend > a .imgLink img, #recruit .container .board .recommend .swiper-slide > div img, .recruit .container .board .recommend .swiper-slide > div img, #contents.crList .tabTarget .recommend .swiper-slide > div img, #contents.pressList > .list .recommend .swiper-slide > div img, #contents.performanceList > .list .recommend .swiper-slide > div img, #contents.research .list .recommend .swiper-slide > div img, #recruit .container .board .recommend .swiper-slide .imgLink img, .recruit .container .board .recommend .swiper-slide .imgLink img, #contents.crList .tabTarget .recommend .swiper-slide .imgLink img, #contents.pressList > .list .recommend .swiper-slide .imgLink img, #contents.performanceList > .list .recommend .swiper-slide .imgLink img, #contents.research .list .recommend .swiper-slide .imgLink img {
  display: block;
  width: 100%;
  transition: all 0.3s linear;
}
#recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em {
  display: block;
  color: #212121;
}
#recruit .container .board .recommend > a span, .recruit .container .board .recommend > a span, #contents.crList .tabTarget .recommend > a span, #contents.pressList > .list .recommend > a span, #contents.performanceList > .list .recommend > a span, #contents.research .list .recommend > a span, #recruit .container .board .recommend .swiper-slide span, .recruit .container .board .recommend .swiper-slide span, #contents.crList .tabTarget .recommend .swiper-slide span, #contents.pressList > .list .recommend .swiper-slide span, #contents.performanceList > .list .recommend .swiper-slide span, #contents.research .list .recommend .swiper-slide span {
  display: inline;
  color: #666;
}
#recruit .container .board .recommend > a span + span, .recruit .container .board .recommend > a span + span, #contents.crList .tabTarget .recommend > a span + span, #contents.pressList > .list .recommend > a span + span, #contents.performanceList > .list .recommend > a span + span, #contents.research .list .recommend > a span + span, #recruit .container .board .recommend .swiper-slide span + span, .recruit .container .board .recommend .swiper-slide span + span, #contents.crList .tabTarget .recommend .swiper-slide span + span, #contents.pressList > .list .recommend .swiper-slide span + span, #contents.performanceList > .list .recommend .swiper-slide span + span, #contents.research .list .recommend .swiper-slide span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
#recruit .container .board .recommend > a span + span::before, .recruit .container .board .recommend > a span + span::before, #contents.crList .tabTarget .recommend > a span + span::before, #contents.pressList > .list .recommend > a span + span::before, #contents.performanceList > .list .recommend > a span + span::before, #contents.research .list .recommend > a span + span::before, #recruit .container .board .recommend .swiper-slide span + span::before, .recruit .container .board .recommend .swiper-slide span + span::before, #contents.crList .tabTarget .recommend .swiper-slide span + span::before, #contents.pressList > .list .recommend .swiper-slide span + span::before, #contents.performanceList > .list .recommend .swiper-slide span + span::before, #contents.research .list .recommend .swiper-slide span + span::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
#recruit .container .board .recommend > a p, .recruit .container .board .recommend > a p, #contents.crList .tabTarget .recommend > a p, #contents.pressList > .list .recommend > a p, #contents.performanceList > .list .recommend > a p, #contents.research .list .recommend > a p, #recruit .container .board .recommend > a .subjectLink, .recruit .container .board .recommend > a .subjectLink, #contents.crList .tabTarget .recommend > a .subjectLink, #contents.pressList > .list .recommend > a .subjectLink, #contents.performanceList > .list .recommend > a .subjectLink, #contents.research .list .recommend > a .subjectLink, #recruit .container .board .recommend .swiper-slide p, .recruit .container .board .recommend .swiper-slide p, #contents.crList .tabTarget .recommend .swiper-slide p, #contents.pressList > .list .recommend .swiper-slide p, #contents.performanceList > .list .recommend .swiper-slide p, #contents.research .list .recommend .swiper-slide p, #recruit .container .board .recommend .swiper-slide .subjectLink, .recruit .container .board .recommend .swiper-slide .subjectLink, #contents.crList .tabTarget .recommend .swiper-slide .subjectLink, #contents.pressList > .list .recommend .swiper-slide .subjectLink, #contents.performanceList > .list .recommend .swiper-slide .subjectLink, #contents.research .list .recommend .swiper-slide .subjectLink {
  display: block;
  word-break: keep-all;
}
#recruit .container .board .recommend a:hover img, .recruit .container .board .recommend a:hover img, #contents.crList .tabTarget .recommend a:hover img, #contents.pressList > .list .recommend a:hover img, #contents.performanceList > .list .recommend a:hover img, #contents.research .list .recommend a:hover img,
#recruit .container .board .recommend a:focus img,
.recruit .container .board .recommend a:focus img,
#contents.crList .tabTarget .recommend a:focus img,
#contents.pressList > .list .recommend a:focus img,
#contents.performanceList > .list .recommend a:focus img,
#contents.research .list .recommend a:focus img {
  transform: scale(1.06);
}
#recruit .container .board .recommend.caseFloat a div, .recruit .container .board .recommend.caseFloat a div, #contents.crList .tabTarget .recommend.caseFloat a div, #contents.pressList > .list .recommend.caseFloat a div, #contents.performanceList > .list .recommend.caseFloat a div, #contents.research .list .recommend.caseFloat a div {
  padding-bottom: 68.6274%;
}
@media (min-width: 1025px) {
  #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend {
    margin-left: -30px;
  }
  #recruit .container .board .recommend > a > div, .recruit .container .board .recommend > a > div, #contents.crList .tabTarget .recommend > a > div, #contents.pressList > .list .recommend > a > div, #contents.performanceList > .list .recommend > a > div, #contents.research .list .recommend > a > div, #recruit .container .board .recommend > a .imgLink, .recruit .container .board .recommend > a .imgLink, #contents.crList .tabTarget .recommend > a .imgLink, #contents.pressList > .list .recommend > a .imgLink, #contents.performanceList > .list .recommend > a .imgLink, #contents.research .list .recommend > a .imgLink, #recruit .container .board .recommend .swiper-slide > div, .recruit .container .board .recommend .swiper-slide > div, #contents.crList .tabTarget .recommend .swiper-slide > div, #contents.pressList > .list .recommend .swiper-slide > div, #contents.performanceList > .list .recommend .swiper-slide > div, #contents.research .list .recommend .swiper-slide > div, #recruit .container .board .recommend .swiper-slide .imgLink, .recruit .container .board .recommend .swiper-slide .imgLink, #contents.crList .tabTarget .recommend .swiper-slide .imgLink, #contents.pressList > .list .recommend .swiper-slide .imgLink, #contents.performanceList > .list .recommend .swiper-slide .imgLink, #contents.research .list .recommend .swiper-slide .imgLink {
    margin-bottom: 20px;
  }
  #recruit .container .board .recommend > a span + span::before, .recruit .container .board .recommend > a span + span::before, #contents.crList .tabTarget .recommend > a span + span::before, #contents.pressList > .list .recommend > a span + span::before, #contents.performanceList > .list .recommend > a span + span::before, #contents.research .list .recommend > a span + span::before, #recruit .container .board .recommend .swiper-slide span + span::before, .recruit .container .board .recommend .swiper-slide span + span::before, #contents.crList .tabTarget .recommend .swiper-slide span + span::before, #contents.pressList > .list .recommend .swiper-slide span + span::before, #contents.performanceList > .list .recommend .swiper-slide span + span::before, #contents.research .list .recommend .swiper-slide span + span::before {
    top: 9px;
  }
  #recruit .container .board .recommend > a p, .recruit .container .board .recommend > a p, #contents.crList .tabTarget .recommend > a p, #contents.pressList > .list .recommend > a p, #contents.performanceList > .list .recommend > a p, #contents.research .list .recommend > a p, #recruit .container .board .recommend > a .subjectLink, .recruit .container .board .recommend > a .subjectLink, #contents.crList .tabTarget .recommend > a .subjectLink, #contents.pressList > .list .recommend > a .subjectLink, #contents.performanceList > .list .recommend > a .subjectLink, #contents.research .list .recommend > a .subjectLink, #recruit .container .board .recommend .swiper-slide p, .recruit .container .board .recommend .swiper-slide p, #contents.crList .tabTarget .recommend .swiper-slide p, #contents.pressList > .list .recommend .swiper-slide p, #contents.performanceList > .list .recommend .swiper-slide p, #contents.research .list .recommend .swiper-slide p, #recruit .container .board .recommend .swiper-slide .subjectLink, .recruit .container .board .recommend .swiper-slide .subjectLink, #contents.crList .tabTarget .recommend .swiper-slide .subjectLink, #contents.pressList > .list .recommend .swiper-slide .subjectLink, #contents.performanceList > .list .recommend .swiper-slide .subjectLink, #contents.research .list .recommend .swiper-slide .subjectLink {
    margin: 8px 0 2px;
  }
  #recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em {
    margin-top: 20px;
  }
  #recruit .container .board .recommend > a em + p, .recruit .container .board .recommend > a em + p, #contents.crList .tabTarget .recommend > a em + p, #contents.pressList > .list .recommend > a em + p, #contents.performanceList > .list .recommend > a em + p, #contents.research .list .recommend > a em + p, #recruit .container .board .recommend .swiper-slide em + p, .recruit .container .board .recommend .swiper-slide em + p, #contents.crList .tabTarget .recommend .swiper-slide em + p, #contents.pressList > .list .recommend .swiper-slide em + p, #contents.performanceList > .list .recommend .swiper-slide em + p, #contents.research .list .recommend .swiper-slide em + p {
    margin-top: 10px;
  }
  #recruit .container .board .recommend:not(.caseFloat) > a, .recruit .container .board .recommend:not(.caseFloat) > a, #contents.crList .tabTarget .recommend:not(.caseFloat) > a, #contents.pressList > .list .recommend:not(.caseFloat) > a, #contents.performanceList > .list .recommend:not(.caseFloat) > a, #contents.research .list .recommend:not(.caseFloat) > a, #recruit .container .board .recommend:not(.caseFloat) .swiper-slide, .recruit .container .board .recommend:not(.caseFloat) .swiper-slide, #contents.crList .tabTarget .recommend:not(.caseFloat) .swiper-slide, #contents.pressList > .list .recommend:not(.caseFloat) .swiper-slide, #contents.performanceList > .list .recommend:not(.caseFloat) .swiper-slide, #contents.research .list .recommend:not(.caseFloat) .swiper-slide {
    width: calc(33.3333333333% - 30px);
    margin-left: 30px;
  }
  #recruit .container .board .recommend:not(.caseFloat) > a + a + a + a, .recruit .container .board .recommend:not(.caseFloat) > a + a + a + a, #contents.crList .tabTarget .recommend:not(.caseFloat) > a + a + a + a, #contents.pressList > .list .recommend:not(.caseFloat) > a + a + a + a, #contents.performanceList > .list .recommend:not(.caseFloat) > a + a + a + a, #contents.research .list .recommend:not(.caseFloat) > a + a + a + a, #recruit .container .board .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, .recruit .container .board .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, #contents.research .list .recommend:not(.caseFloat) > a + .swiper-slide + .swiper-slide + .swiper-slide, #recruit .container .board .recommend:not(.caseFloat) .swiper-slide + a + a + a, .recruit .container .board .recommend:not(.caseFloat) .swiper-slide + a + a + a, #contents.crList .tabTarget .recommend:not(.caseFloat) .swiper-slide + a + a + a, #contents.pressList > .list .recommend:not(.caseFloat) .swiper-slide + a + a + a, #contents.performanceList > .list .recommend:not(.caseFloat) .swiper-slide + a + a + a, #contents.research .list .recommend:not(.caseFloat) .swiper-slide + a + a + a, #recruit .container .board .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide, .recruit .container .board .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide, #contents.research .list .recommend:not(.caseFloat) .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 55px;
  }
  #recruit .container .board .recommend.caseFloat > a, .recruit .container .board .recommend.caseFloat > a, #contents.crList .tabTarget .recommend.caseFloat > a, #contents.pressList > .list .recommend.caseFloat > a, #contents.performanceList > .list .recommend.caseFloat > a, #contents.research .list .recommend.caseFloat > a, #recruit .container .board .recommend.caseFloat .swiper-slide, .recruit .container .board .recommend.caseFloat .swiper-slide, #contents.crList .tabTarget .recommend.caseFloat .swiper-slide, #contents.pressList > .list .recommend.caseFloat .swiper-slide, #contents.performanceList > .list .recommend.caseFloat .swiper-slide, #contents.research .list .recommend.caseFloat .swiper-slide {
    width: calc(50% - 20px);
  }
  #recruit .container .board .recommend.caseFloat > a:nth-of-type(even), .recruit .container .board .recommend.caseFloat > a:nth-of-type(even), #contents.crList .tabTarget .recommend.caseFloat > a:nth-of-type(even), #contents.pressList > .list .recommend.caseFloat > a:nth-of-type(even), #contents.performanceList > .list .recommend.caseFloat > a:nth-of-type(even), #contents.research .list .recommend.caseFloat > a:nth-of-type(even), #recruit .container .board .recommend.caseFloat .swiper-slide:nth-of-type(even), .recruit .container .board .recommend.caseFloat .swiper-slide:nth-of-type(even), #contents.crList .tabTarget .recommend.caseFloat .swiper-slide:nth-of-type(even), #contents.pressList > .list .recommend.caseFloat .swiper-slide:nth-of-type(even), #contents.performanceList > .list .recommend.caseFloat .swiper-slide:nth-of-type(even), #contents.research .list .recommend.caseFloat .swiper-slide:nth-of-type(even) {
    margin-left: 40px;
  }
  #recruit .container .board .recommend.caseFloat > a + a + a, .recruit .container .board .recommend.caseFloat > a + a + a, #contents.crList .tabTarget .recommend.caseFloat > a + a + a, #contents.pressList > .list .recommend.caseFloat > a + a + a, #contents.performanceList > .list .recommend.caseFloat > a + a + a, #contents.research .list .recommend.caseFloat > a + a + a, #recruit .container .board .recommend.caseFloat > a + .swiper-slide + .swiper-slide, .recruit .container .board .recommend.caseFloat > a + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend.caseFloat > a + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend.caseFloat > a + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend.caseFloat > a + .swiper-slide + .swiper-slide, #contents.research .list .recommend.caseFloat > a + .swiper-slide + .swiper-slide, #recruit .container .board .recommend.caseFloat .swiper-slide + a + a, .recruit .container .board .recommend.caseFloat .swiper-slide + a + a, #contents.crList .tabTarget .recommend.caseFloat .swiper-slide + a + a, #contents.pressList > .list .recommend.caseFloat .swiper-slide + a + a, #contents.performanceList > .list .recommend.caseFloat .swiper-slide + a + a, #contents.research .list .recommend.caseFloat .swiper-slide + a + a, #recruit .container .board .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide, .recruit .container .board .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide, #contents.research .list .recommend.caseFloat .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend {
    margin-left: -20px;
  }
  #recruit .container .board .recommend > a, .recruit .container .board .recommend > a, #contents.crList .tabTarget .recommend > a, #contents.pressList > .list .recommend > a, #contents.performanceList > .list .recommend > a, #contents.research .list .recommend > a, #recruit .container .board .recommend .swiper-slide, .recruit .container .board .recommend .swiper-slide, #contents.crList .tabTarget .recommend .swiper-slide, #contents.pressList > .list .recommend .swiper-slide, #contents.performanceList > .list .recommend .swiper-slide, #contents.research .list .recommend .swiper-slide {
    width: calc(50% - 20px);
    margin-left: 20px;
  }
  #recruit .container .board .recommend > a + a + a, .recruit .container .board .recommend > a + a + a, #contents.crList .tabTarget .recommend > a + a + a, #contents.pressList > .list .recommend > a + a + a, #contents.performanceList > .list .recommend > a + a + a, #contents.research .list .recommend > a + a + a, #recruit .container .board .recommend > a + .swiper-slide + .swiper-slide, .recruit .container .board .recommend > a + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend > a + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend > a + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend > a + .swiper-slide + .swiper-slide, #contents.research .list .recommend > a + .swiper-slide + .swiper-slide, #recruit .container .board .recommend .swiper-slide + a + a, .recruit .container .board .recommend .swiper-slide + a + a, #contents.crList .tabTarget .recommend .swiper-slide + a + a, #contents.pressList > .list .recommend .swiper-slide + a + a, #contents.performanceList > .list .recommend .swiper-slide + a + a, #contents.research .list .recommend .swiper-slide + a + a, #recruit .container .board .recommend .swiper-slide + .swiper-slide + .swiper-slide, .recruit .container .board .recommend .swiper-slide + .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend .swiper-slide + .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend .swiper-slide + .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend .swiper-slide + .swiper-slide + .swiper-slide, #contents.research .list .recommend .swiper-slide + .swiper-slide + .swiper-slide {
    margin-top: 40px;
  }
  #recruit .container .board .recommend > a > div, .recruit .container .board .recommend > a > div, #contents.crList .tabTarget .recommend > a > div, #contents.pressList > .list .recommend > a > div, #contents.performanceList > .list .recommend > a > div, #contents.research .list .recommend > a > div, #recruit .container .board .recommend > a .imgLink, .recruit .container .board .recommend > a .imgLink, #contents.crList .tabTarget .recommend > a .imgLink, #contents.pressList > .list .recommend > a .imgLink, #contents.performanceList > .list .recommend > a .imgLink, #contents.research .list .recommend > a .imgLink, #recruit .container .board .recommend .swiper-slide > div, .recruit .container .board .recommend .swiper-slide > div, #contents.crList .tabTarget .recommend .swiper-slide > div, #contents.pressList > .list .recommend .swiper-slide > div, #contents.performanceList > .list .recommend .swiper-slide > div, #contents.research .list .recommend .swiper-slide > div, #recruit .container .board .recommend .swiper-slide .imgLink, .recruit .container .board .recommend .swiper-slide .imgLink, #contents.crList .tabTarget .recommend .swiper-slide .imgLink, #contents.pressList > .list .recommend .swiper-slide .imgLink, #contents.performanceList > .list .recommend .swiper-slide .imgLink, #contents.research .list .recommend .swiper-slide .imgLink {
    margin-bottom: 15px;
  }
  #recruit .container .board .recommend > a span + span::before, .recruit .container .board .recommend > a span + span::before, #contents.crList .tabTarget .recommend > a span + span::before, #contents.pressList > .list .recommend > a span + span::before, #contents.performanceList > .list .recommend > a span + span::before, #contents.research .list .recommend > a span + span::before, #recruit .container .board .recommend .swiper-slide span + span::before, .recruit .container .board .recommend .swiper-slide span + span::before, #contents.crList .tabTarget .recommend .swiper-slide span + span::before, #contents.pressList > .list .recommend .swiper-slide span + span::before, #contents.performanceList > .list .recommend .swiper-slide span + span::before, #contents.research .list .recommend .swiper-slide span + span::before {
    top: 5px;
  }
  #recruit .container .board .recommend > a p, .recruit .container .board .recommend > a p, #contents.crList .tabTarget .recommend > a p, #contents.pressList > .list .recommend > a p, #contents.performanceList > .list .recommend > a p, #contents.research .list .recommend > a p, #recruit .container .board .recommend > a .subjectLink, .recruit .container .board .recommend > a .subjectLink, #contents.crList .tabTarget .recommend > a .subjectLink, #contents.pressList > .list .recommend > a .subjectLink, #contents.performanceList > .list .recommend > a .subjectLink, #contents.research .list .recommend > a .subjectLink, #recruit .container .board .recommend .swiper-slide p, .recruit .container .board .recommend .swiper-slide p, #contents.crList .tabTarget .recommend .swiper-slide p, #contents.pressList > .list .recommend .swiper-slide p, #contents.performanceList > .list .recommend .swiper-slide p, #contents.research .list .recommend .swiper-slide p, #recruit .container .board .recommend .swiper-slide .subjectLink, .recruit .container .board .recommend .swiper-slide .subjectLink, #contents.crList .tabTarget .recommend .swiper-slide .subjectLink, #contents.pressList > .list .recommend .swiper-slide .subjectLink, #contents.performanceList > .list .recommend .swiper-slide .subjectLink, #contents.research .list .recommend .swiper-slide .subjectLink {
    margin: 3px 0 2px;
  }
  #recruit .container .board .recommend > a em, .recruit .container .board .recommend > a em, #contents.crList .tabTarget .recommend > a em, #contents.pressList > .list .recommend > a em, #contents.performanceList > .list .recommend > a em, #contents.research .list .recommend > a em, #recruit .container .board .recommend .swiper-slide em, .recruit .container .board .recommend .swiper-slide em, #contents.crList .tabTarget .recommend .swiper-slide em, #contents.pressList > .list .recommend .swiper-slide em, #contents.performanceList > .list .recommend .swiper-slide em, #contents.research .list .recommend .swiper-slide em {
    margin-top: 15px;
  }
  #recruit .container .board .recommend > a em + p, .recruit .container .board .recommend > a em + p, #contents.crList .tabTarget .recommend > a em + p, #contents.pressList > .list .recommend > a em + p, #contents.performanceList > .list .recommend > a em + p, #contents.research .list .recommend > a em + p, #recruit .container .board .recommend .swiper-slide em + p, .recruit .container .board .recommend .swiper-slide em + p, #contents.crList .tabTarget .recommend .swiper-slide em + p, #contents.pressList > .list .recommend .swiper-slide em + p, #contents.performanceList > .list .recommend .swiper-slide em + p, #contents.research .list .recommend .swiper-slide em + p {
    margin-top: 10px;
  }
}
@media (max-width: 480px) {
  #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend {
    margin-left: 0;
  }
  #recruit .container .board .recommend > a, .recruit .container .board .recommend > a, #contents.crList .tabTarget .recommend > a, #contents.pressList > .list .recommend > a, #contents.performanceList > .list .recommend > a, #contents.research .list .recommend > a, #recruit .container .board .recommend .swiper-slide, .recruit .container .board .recommend .swiper-slide, #contents.crList .tabTarget .recommend .swiper-slide, #contents.pressList > .list .recommend .swiper-slide, #contents.performanceList > .list .recommend .swiper-slide, #contents.research .list .recommend .swiper-slide {
    width: 100%;
    margin-left: 0;
  }
  #recruit .container .board .recommend > a + a, .recruit .container .board .recommend > a + a, #contents.crList .tabTarget .recommend > a + a, #contents.pressList > .list .recommend > a + a, #contents.performanceList > .list .recommend > a + a, #contents.research .list .recommend > a + a, #recruit .container .board .recommend > a + .swiper-slide, .recruit .container .board .recommend > a + .swiper-slide, #contents.crList .tabTarget .recommend > a + .swiper-slide, #contents.pressList > .list .recommend > a + .swiper-slide, #contents.performanceList > .list .recommend > a + .swiper-slide, #contents.research .list .recommend > a + .swiper-slide, #recruit .container .board .recommend .swiper-slide + a, .recruit .container .board .recommend .swiper-slide + a, #contents.crList .tabTarget .recommend .swiper-slide + a, #contents.pressList > .list .recommend .swiper-slide + a, #contents.performanceList > .list .recommend .swiper-slide + a, #contents.research .list .recommend .swiper-slide + a, #recruit .container .board .recommend .swiper-slide + .swiper-slide, .recruit .container .board .recommend .swiper-slide + .swiper-slide, #contents.crList .tabTarget .recommend .swiper-slide + .swiper-slide, #contents.pressList > .list .recommend .swiper-slide + .swiper-slide, #contents.performanceList > .list .recommend .swiper-slide + .swiper-slide, #contents.research .list .recommend .swiper-slide + .swiper-slide {
    margin-top: 40px;
  }
}
#recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#recruit .container .board .pagination .button, .recruit .container .board .pagination .button, #contents.crList .tabTarget .pagination .button, #contents.pressList > .list .pagination .button, #contents.performanceList > .list .pagination .button, #contents.research .list .pagination .button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 32px;
  height: 32px;
  overflow: hidden;
  border-radius: 50%;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.45;
}
#recruit .container .board .pagination .button.next, .recruit .container .board .pagination .button.next, #contents.crList .tabTarget .pagination .button.next, #contents.pressList > .list .pagination .button.next, #contents.performanceList > .list .pagination .button.next, #contents.research .list .pagination .button.next, #recruit .container .board .pagination .button.prev, .recruit .container .board .pagination .button.prev, #contents.crList .tabTarget .pagination .button.prev, #contents.pressList > .list .pagination .button.prev, #contents.performanceList > .list .pagination .button.prev, #contents.research .list .pagination .button.prev {
  background: url("../images/icon/iconNext.svg") no-repeat center;
}
#recruit .container .board .pagination .button.last, .recruit .container .board .pagination .button.last, #contents.crList .tabTarget .pagination .button.last, #contents.pressList > .list .pagination .button.last, #contents.performanceList > .list .pagination .button.last, #contents.research .list .pagination .button.last, #recruit .container .board .pagination .button.first, .recruit .container .board .pagination .button.first, #contents.crList .tabTarget .pagination .button.first, #contents.pressList > .list .pagination .button.first, #contents.performanceList > .list .pagination .button.first, #contents.research .list .pagination .button.first {
  background: url("../images/icon/iconLast.svg") no-repeat center;
}
#recruit .container .board .pagination .button.prev, .recruit .container .board .pagination .button.prev, #contents.crList .tabTarget .pagination .button.prev, #contents.pressList > .list .pagination .button.prev, #contents.performanceList > .list .pagination .button.prev, #contents.research .list .pagination .button.prev, #recruit .container .board .pagination .button.first, .recruit .container .board .pagination .button.first, #contents.crList .tabTarget .pagination .button.first, #contents.pressList > .list .pagination .button.first, #contents.performanceList > .list .pagination .button.first, #contents.research .list .pagination .button.first {
  transform: rotate(180deg);
}
#recruit .container .board .pagination .button:disabled, .recruit .container .board .pagination .button:disabled, #contents.crList .tabTarget .pagination .button:disabled, #contents.pressList > .list .pagination .button:disabled, #contents.performanceList > .list .pagination .button:disabled, #contents.research .list .pagination .button:disabled {
  opacity: 0.2;
}
#recruit .container .board .pagination .button:not(:disabled):hover, .recruit .container .board .pagination .button:not(:disabled):hover, #contents.crList .tabTarget .pagination .button:not(:disabled):hover, #contents.pressList > .list .pagination .button:not(:disabled):hover, #contents.performanceList > .list .pagination .button:not(:disabled):hover, #contents.research .list .pagination .button:not(:disabled):hover, #recruit .container .board .pagination .button:not(:disabled):focus, .recruit .container .board .pagination .button:not(:disabled):focus, #contents.crList .tabTarget .pagination .button:not(:disabled):focus, #contents.pressList > .list .pagination .button:not(:disabled):focus, #contents.performanceList > .list .pagination .button:not(:disabled):focus, #contents.research .list .pagination .button:not(:disabled):focus {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
#recruit .container .board .pagination .current, .recruit .container .board .pagination .current, #contents.crList .tabTarget .pagination .current, #contents.pressList > .list .pagination .current, #contents.performanceList > .list .pagination .current, #contents.research .list .pagination .current {
  font-weight: 700;
  color: #4415a0;
}
#recruit .container .board .pagination button:not(.button):hover, .recruit .container .board .pagination button:not(.button):hover, #contents.crList .tabTarget .pagination button:not(.button):hover, #contents.pressList > .list .pagination button:not(.button):hover, #contents.performanceList > .list .pagination button:not(.button):hover, #contents.research .list .pagination button:not(.button):hover, #recruit .container .board .pagination button:not(.button):focus, .recruit .container .board .pagination button:not(.button):focus, #contents.crList .tabTarget .pagination button:not(.button):focus, #contents.pressList > .list .pagination button:not(.button):focus, #contents.performanceList > .list .pagination button:not(.button):focus, #contents.research .list .pagination button:not(.button):focus {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .container .board .search, .recruit .container .board .search, #contents.crList .tabTarget .search, #contents.pressList > .list .search, #contents.performanceList > .list .search, #contents.research .list .search {
    padding-right: 50px;
  }
  #recruit .container .board .search input, .recruit .container .board .search input, #contents.crList .tabTarget .search input, #contents.pressList > .list .search input, #contents.performanceList > .list .search input, #contents.research .list .search input {
    font-size: 30px;
    letter-spacing: -0.025em;
  }
  #recruit .container .board .search > button, .recruit .container .board .search > button, #contents.crList .tabTarget .search > button, #contents.pressList > .list .search > button, #contents.performanceList > .list .search > button, #contents.research .list .search > button {
    top: 7px;
    width: 34px;
    height: 34px;
  }
  #recruit .container .board .search > button::before, .recruit .container .board .search > button::before, #contents.crList .tabTarget .search > button::before, #contents.pressList > .list .search > button::before, #contents.performanceList > .list .search > button::before, #contents.research .list .search > button::before {
    left: 3px;
    top: 3px;
    width: 25px;
    height: 25px;
  }
  #recruit .container .board .search > button::after, .recruit .container .board .search > button::after, #contents.crList .tabTarget .search > button::after, #contents.pressList > .list .search > button::after, #contents.performanceList > .list .search > button::after, #contents.research .list .search > button::after {
    left: 22px;
    top: 15px;
    height: 17px;
  }
  #recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p {
    padding-top: 40px;
  }
  #recruit .container .board .textMode, .recruit .container .board .textMode, #contents.crList .tabTarget .textMode, #contents.pressList > .list .textMode, #contents.performanceList > .list .textMode, #contents.research .list .textMode,
  #recruit .container .board .thumbMode,
  .recruit .container .board .thumbMode,
  #contents.crList .tabTarget .thumbMode,
  #contents.pressList > .list .thumbMode,
  #contents.performanceList > .list .thumbMode,
  #contents.research .list .thumbMode,
  #recruit .container .board .mapMode,
  .recruit .container .board .mapMode,
  #contents.crList .tabTarget .mapMode,
  #contents.pressList > .list .mapMode,
  #contents.performanceList > .list .mapMode,
  #contents.research .list .mapMode {
    top: 91px;
  }
  #recruit .container .board .map, .recruit .container .board .map, #contents.crList .tabTarget .map, #contents.pressList > .list .map, #contents.performanceList > .list .map, #contents.research .list .map {
    margin-top: 78px;
    height: 500px;
  }
  #recruit .container .board .list, .recruit .container .board .list, #contents.crList .tabTarget .list, #contents.pressList > .list .list, #contents.performanceList > .list .list, #contents.research .list .list {
    margin-top: 20px;
  }
  #recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination {
    margin-top: 80px;
  }
  #recruit .container .board .pagination .button, .recruit .container .board .pagination .button, #contents.crList .tabTarget .pagination .button, #contents.pressList > .list .pagination .button, #contents.performanceList > .list .pagination .button, #contents.research .list .pagination .button {
    margin: 0 7.5px;
  }
  #recruit .container .board .pagination button:not(.button) + button:not(.button), .recruit .container .board .pagination button:not(.button) + button:not(.button), #contents.crList .tabTarget .pagination button:not(.button) + button:not(.button), #contents.pressList > .list .pagination button:not(.button) + button:not(.button), #contents.performanceList > .list .pagination button:not(.button) + button:not(.button), #contents.research .list .pagination button:not(.button) + button:not(.button) {
    margin-left: 47px;
  }
  #recruit .container .board .pagination .prev, .recruit .container .board .pagination .prev, #contents.crList .tabTarget .pagination .prev, #contents.pressList > .list .pagination .prev, #contents.performanceList > .list .pagination .prev, #contents.research .list .pagination .prev {
    margin-right: 32px;
  }
  #recruit .container .board .pagination .next, .recruit .container .board .pagination .next, #contents.crList .tabTarget .pagination .next, #contents.pressList > .list .pagination .next, #contents.performanceList > .list .pagination .next, #contents.research .list .pagination .next {
    margin-left: 32px;
  }
  #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend {
    padding-top: 68px;
  }
  #recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1 {
    padding-left: 30px;
    padding-bottom: 20px;
  }
  #recruit .container .board .recommend a + a + a + a, .recruit .container .board .recommend a + a + a + a, #contents.crList .tabTarget .recommend a + a + a + a, #contents.pressList > .list .recommend a + a + a + a, #contents.performanceList > .list .recommend a + a + a + a, #contents.research .list .recommend a + a + a + a {
    display: none;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .search, .recruit .container .board .search, #contents.crList .tabTarget .search, #contents.pressList > .list .search, #contents.performanceList > .list .search, #contents.research .list .search {
    padding-right: 40px;
  }
  #recruit .container .board .search input, .recruit .container .board .search input, #contents.crList .tabTarget .search input, #contents.pressList > .list .search input, #contents.performanceList > .list .search input, #contents.research .list .search input {
    font-size: 18px;
    letter-spacing: -0.02em;
  }
  #recruit .container .board .search > button, .recruit .container .board .search > button, #contents.crList .tabTarget .search > button, #contents.pressList > .list .search > button, #contents.performanceList > .list .search > button, #contents.research .list .search > button {
    width: 30px;
    height: 30px;
    top: 0;
  }
  #recruit .container .board .search > button::before, .recruit .container .board .search > button::before, #contents.crList .tabTarget .search > button::before, #contents.pressList > .list .search > button::before, #contents.performanceList > .list .search > button::before, #contents.research .list .search > button::before {
    left: 3px;
    top: 3px;
    width: 20px;
    height: 20px;
  }
  #recruit .container .board .search > button::after, .recruit .container .board .search > button::after, #contents.crList .tabTarget .search > button::after, #contents.pressList > .list .search > button::after, #contents.performanceList > .list .search > button::after, #contents.research .list .search > button::after {
    left: 20px;
    top: 18px;
    height: 8px;
  }
  #recruit .container .board > p, .recruit .container .board > p, #contents.crList .tabTarget > p, #contents.pressList > .list > p, #contents.performanceList > .list > p, #contents.research .list > p {
    padding-top: 30px;
  }
  #recruit .container .board .textMode, .recruit .container .board .textMode, #contents.crList .tabTarget .textMode, #contents.pressList > .list .textMode, #contents.performanceList > .list .textMode, #contents.research .list .textMode,
  #recruit .container .board .thumbMode,
  .recruit .container .board .thumbMode,
  #contents.crList .tabTarget .thumbMode,
  #contents.pressList > .list .thumbMode,
  #contents.performanceList > .list .thumbMode,
  #contents.research .list .thumbMode,
  #recruit .container .board .mapMode,
  .recruit .container .board .mapMode,
  #contents.crList .tabTarget .mapMode,
  #contents.pressList > .list .mapMode,
  #contents.performanceList > .list .mapMode,
  #contents.research .list .mapMode {
    top: 65px;
  }
  #recruit .container .board .map, .recruit .container .board .map, #contents.crList .tabTarget .map, #contents.pressList > .list .map, #contents.performanceList > .list .map, #contents.research .list .map {
    margin-top: 65px;
    height: 200px;
  }
  #recruit .container .board .list, .recruit .container .board .list, #contents.crList .tabTarget .list, #contents.pressList > .list .list, #contents.performanceList > .list .list, #contents.research .list .list {
    margin-top: 15px;
  }
  #recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination {
    justify-content: space-evenly;
    width: calc(100% - 140px);
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
  }
  #recruit .container .board .pagination .button, .recruit .container .board .pagination .button, #contents.crList .tabTarget .pagination .button, #contents.pressList > .list .pagination .button, #contents.performanceList > .list .pagination .button, #contents.research .list .pagination .button {
    position: absolute;
  }
  #recruit .container .board .pagination .button.first, .recruit .container .board .pagination .button.first, #contents.crList .tabTarget .pagination .button.first, #contents.pressList > .list .pagination .button.first, #contents.performanceList > .list .pagination .button.first, #contents.research .list .pagination .button.first {
    left: 20px;
  }
  #recruit .container .board .pagination .button.last, .recruit .container .board .pagination .button.last, #contents.crList .tabTarget .pagination .button.last, #contents.pressList > .list .pagination .button.last, #contents.performanceList > .list .pagination .button.last, #contents.research .list .pagination .button.last {
    right: 20px;
  }
  #recruit .container .board .pagination .button.prev, .recruit .container .board .pagination .button.prev, #contents.crList .tabTarget .pagination .button.prev, #contents.pressList > .list .pagination .button.prev, #contents.performanceList > .list .pagination .button.prev, #contents.research .list .pagination .button.prev {
    left: 60px;
  }
  #recruit .container .board .pagination .button.next, .recruit .container .board .pagination .button.next, #contents.crList .tabTarget .pagination .button.next, #contents.pressList > .list .pagination .button.next, #contents.performanceList > .list .pagination .button.next, #contents.research .list .pagination .button.next {
    right: 60px;
  }
  #recruit .container .board .recommend, .recruit .container .board .recommend, #contents.crList .tabTarget .recommend, #contents.pressList > .list .recommend, #contents.performanceList > .list .recommend, #contents.research .list .recommend {
    padding-top: 40px;
  }
  #recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1 {
    padding-left: 20px;
    padding-bottom: 20px;
  }
  #recruit .container .board .recommend a + a + a + a + a, .recruit .container .board .recommend a + a + a + a + a, #contents.crList .tabTarget .recommend a + a + a + a + a, #contents.pressList > .list .recommend a + a + a + a + a, #contents.performanceList > .list .recommend a + a + a + a + a, #contents.research .list .recommend a + a + a + a + a {
    display: none;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #recruit .container .board .recommend h1, .recruit .container .board .recommend h1, #contents.crList .tabTarget .recommend h1, #contents.pressList > .list .recommend h1, #contents.performanceList > .list .recommend h1, #contents.research .list .recommend h1 {
    padding-left: 0;
  }
  #recruit .container .board .recommend a + a + a + a, .recruit .container .board .recommend a + a + a + a, #contents.crList .tabTarget .recommend a + a + a + a, #contents.pressList > .list .recommend a + a + a + a, #contents.performanceList > .list .recommend a + a + a + a, #contents.research .list .recommend a + a + a + a {
    display: none;
  }
}
@media (max-width: 640px) {
  #recruit .container .board .pagination, .recruit .container .board .pagination, #contents.crList .tabTarget .pagination, #contents.pressList > .list .pagination, #contents.performanceList > .list .pagination, #contents.research .list .pagination {
    justify-content: center;
  }
  #recruit .container .board .pagination button:not(.button), .recruit .container .board .pagination button:not(.button), #contents.crList .tabTarget .pagination button:not(.button), #contents.pressList > .list .pagination button:not(.button), #contents.performanceList > .list .pagination button:not(.button), #contents.research .list .pagination button:not(.button) {
    display: none;
  }
  #recruit .container .board .pagination .button, .recruit .container .board .pagination .button, #contents.crList .tabTarget .pagination .button, #contents.pressList > .list .pagination .button, #contents.performanceList > .list .pagination .button, #contents.research .list .pagination .button {
    position: unset;
    margin: 0 5px;
  }
}

#contents.performance .portfolio {
  background: #f6f6f6;
}
#contents.performance .portfolio::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
#contents.performance .portfolio > div {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.performance .portfolio header h1 {
  font-weight: 400;
  color: #212121;
}
#contents.performance .portfolio header .selectBox {
  position: relative;
}
#contents.performance .portfolio header .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  padding-bottom: 7px;
}
#contents.performance .portfolio header .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
  top: 7px;
  right: 8px;
}
#contents.performance .portfolio header .selectBox > button.placeholder {
  color: #a5a5a5;
}
#contents.performance .portfolio header .selectBox > button.active {
  color: #4415a0;
}
#contents.performance .portfolio header .selectBox > button.active::after {
  border-color: #4415a0;
}
#contents.performance .portfolio header .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#contents.performance .portfolio header .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
}
#contents.performance .portfolio header .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
#contents.performance .portfolio header .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio header .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  #contents.performance .portfolio header .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  #contents.performance .portfolio header .selectBox > button,
  #contents.performance .portfolio header .selectBox > div button {
    padding-left: 12px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio header .selectBox > div > button {
    padding-left: 10px;
  }
  #contents.performance .portfolio header .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  #contents.performance .portfolio header .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
}
#contents.performance .portfolio header .selectBox > div {
  max-height: 300px;
}
#contents.performance .portfolio header .download {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  display: flex;
}
#contents.performance .portfolio header .download::before, #contents.performance .portfolio header .download::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.performance .portfolio header .download::after {
  content: "";
  margin-top: -2px !important;
  background-image: url("../images/icon/iconDownload2.svg");
}
#contents.performance .portfolio header .download:not(:disabled):hover, #contents.performance .portfolio header .download:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.performance .portfolio header .download:not(:disabled):hover::before, #contents.performance .portfolio header .download:not(:disabled):hover::after, #contents.performance .portfolio header .download:not(:disabled):focus::before, #contents.performance .portfolio header .download:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio header .download {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.performance .portfolio header .download::before {
    margin-right: 10px;
  }
  #contents.performance .portfolio header .download::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio header .download {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.performance .portfolio header .download::before {
    margin-right: 14px;
  }
  #contents.performance .portfolio header .download::after {
    margin-left: 18px;
  }
}
#contents.performance .portfolio header .jump {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.performance .portfolio header .jump::before, #contents.performance .portfolio header .jump::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.performance .portfolio header .jump::after {
  content: "";
  background-image: url("../images/icon/iconArrow.svg");
}
#contents.performance .portfolio header .jump:not(:disabled):hover, #contents.performance .portfolio header .jump:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.performance .portfolio header .jump:not(:disabled):hover::before, #contents.performance .portfolio header .jump:not(:disabled):hover::after, #contents.performance .portfolio header .jump:not(:disabled):focus::before, #contents.performance .portfolio header .jump:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio header .jump {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.performance .portfolio header .jump::before {
    margin-right: 10px;
  }
  #contents.performance .portfolio header .jump::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio header .jump {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.performance .portfolio header .jump::before {
    margin-right: 14px;
  }
  #contents.performance .portfolio header .jump::after {
    margin-left: 18px;
  }
}
#contents.performance .portfolio .mapMode {
  right: 20px;
}
#contents.performance .portfolio .thumbMode {
  right: 59px;
}
#contents.performance .portfolio .map {
  position: absolute;
  visibility: hidden;
  border: 1px solid #dcdcdc;
}
#contents.performance .portfolio .map #map {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#contents.performance .portfolio .mapMode.active ~ .map {
  position: relative;
  visibility: visible;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer {
  position: relative;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide {
  width: 200px;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink {
  display: block;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 70%;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide > div img, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink img {
  display: block;
  width: 100%;
  transition: all 0.3s;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
  display: block;
  color: #212121;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 1.4em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
  font-weight: 700;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide span {
  display: inline;
  color: #666;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide span + span {
  position: relative;
  margin-left: 10px;
  padding-left: 10px;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before {
  content: "";
  position: absolute;
  left: 0;
  width: 1px;
  height: 10px;
  background: #c8c8c8;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer a:hover img,
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer a:focus img {
  transform: scale(1.06);
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  right: 0;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  left: 0;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext,
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev {
  z-index: 1;
  position: absolute;
  top: 63px;
}
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext:disabled,
#contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev:disabled {
  opacity: 0;
}
@media (max-width: 1140px) {
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer {
    margin-right: -20px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext {
    right: 10px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer {
    margin-left: -10px;
    margin-right: -10px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper {
    margin-left: -8px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide {
    margin-left: 18px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide em {
    margin-top: 20px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide .subjectLink {
    margin: 7px 0;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span {
    font-size: 14px;
    line-height: 18px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide span + span::before {
    top: 5px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide > div, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .imgLink {
    margin-bottom: 15px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em + p,
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide em + .subjectLink {
    margin-top: 7px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide p, #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide .subjectLink {
    margin-bottom: 5px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide span {
    font-size: 12px;
    line-height: 16px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide span + span::before {
    top: 4px;
  }
}
@media (max-width: 1024px) and (min-width: 880px) {
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer {
    margin-left: -10px;
    margin-right: -10px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper {
    margin-left: -6px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-wrapper .swiper-slide {
    margin-left: 16px;
  }
}
@media (max-width: 1024px) and (max-width: 879px) {
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer {
    margin-left: -20px;
    margin-right: -20px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper {
    padding-left: 20px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide {
    width: 218px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .swiper-slide + .swiper-slide {
    margin-left: 10px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev,
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnNext {
    top: 67px;
  }
  #contents.performance .portfolio .mapMode.active ~ .list .swiperContainer .btnPrev {
    left: 10px;
  }
}
#contents.performance .portfolio .mapMode.active ~ .more {
  display: none;
}
#contents.performance .portfolio > div > p {
  color: #212121;
}
#contents.performance .portfolio > div > p + .list, #contents.performance .portfolio > div > p + .downloadList {
  margin-top: 10px;
}
#contents.performance .portfolio .more {
  text-align: center;
}
#contents.performance .portfolio .more > button {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.performance .portfolio .more > button::before, #contents.performance .portfolio .more > button::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.performance .portfolio .more > button:not(:disabled):hover, #contents.performance .portfolio .more > button:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.performance .portfolio .more > button:not(:disabled):hover::before, #contents.performance .portfolio .more > button:not(:disabled):hover::after, #contents.performance .portfolio .more > button:not(:disabled):focus::before, #contents.performance .portfolio .more > button:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio .more > button {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #contents.performance .portfolio .more > button::before {
    margin-right: 10px;
  }
  #contents.performance .portfolio .more > button::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio .more > button {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #contents.performance .portfolio .more > button::before {
    margin-right: 14px;
  }
  #contents.performance .portfolio .more > button::after {
    margin-left: 18px;
  }
}
#contents.performance .portfolio .thumbMode.active ~ p {
  visibility: hidden;
}
@media (min-width: 1025px) {
  #contents.performance .portfolio header {
    float: left;
    width: 190px;
    padding-top: 90px;
    padding-bottom: 100px;
  }
  #contents.performance .portfolio header p {
    margin-top: 15px;
    white-space: nowrap;
  }
  #contents.performance .portfolio header .selectBox {
    margin-top: 45px;
  }
  #contents.performance .portfolio header > a {
    white-space: nowrap;
  }
  #contents.performance .portfolio header > a::after {
    margin-left: 10px !important;
  }
  #contents.performance .portfolio header > a.download {
    margin-top: 30px;
  }
  #contents.performance .portfolio header > a.jump {
    margin-top: 15px;
  }
  #contents.performance .portfolio .thumbMode,
  #contents.performance .portfolio .mapMode {
    top: 52px;
  }
  #contents.performance .portfolio .map,
  #contents.performance .portfolio .list,
  #contents.performance .portfolio > div > p {
    float: right;
    width: calc(100% - 230px);
    max-width: 855px;
  }
  #contents.performance .portfolio .thumbMode.active ~ p {
    margin-top: 53px;
  }
  #contents.performance .portfolio .mapMode.active ~ p {
    margin-top: 45px;
  }
  #contents.performance .portfolio .thumbMode.active ~ .list {
    margin-top: 15px !important;
  }
  #contents.performance .portfolio .map {
    margin-top: 96px;
    height: 350px;
  }
  #contents.performance .portfolio .more {
    clear: both;
    padding-top: 75px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .portfolio {
    text-align: right;
  }
  #contents.performance .portfolio header {
    padding-top: 43px;
    text-align: left;
  }
  #contents.performance .portfolio header p {
    margin-top: 12px;
    font-weight: 500;
  }
  #contents.performance .portfolio header .selectBox {
    margin-top: 30px;
  }
  #contents.performance .portfolio header > a {
    width: 100%;
  }
  #contents.performance .portfolio header > a.download {
    margin-top: 20px;
  }
  #contents.performance .portfolio header > a.jump {
    margin-top: 10px;
  }
  #contents.performance .portfolio .thumbMode,
  #contents.performance .portfolio .mapMode {
    position: static;
    margin-top: 30px !important;
  }
  #contents.performance .portfolio .thumbMode {
    margin-right: 15px;
  }
  #contents.performance .portfolio .map {
    margin-top: 15px;
    height: 200px;
  }
  #contents.performance .portfolio > div > p {
    text-align: left;
  }
  #contents.performance .portfolio .mapMode.active ~ p {
    margin-top: 20px;
  }
  #contents.performance .portfolio .list {
    text-align: left;
  }
  #contents.performance .portfolio .more {
    padding-top: 40px;
  }
}
@media (max-width: 1024px) and (min-width: 880px) {
  #contents.performance .portfolio header {
    float: left;
    width: 190px;
    padding-bottom: 50px;
  }
  #contents.performance .portfolio header br.wideOnly {
    display: unset;
  }
  #contents.performance .portfolio .map,
  #contents.performance .portfolio > div > p,
  #contents.performance .portfolio .list {
    float: right;
    width: calc(100% - 240px);
  }
  #contents.performance .portfolio .more {
    clear: both;
  }
}
@media (max-width: 1024px) and (min-width: 768px) and (max-width: 879px) {
  #contents.performance .portfolio header {
    position: relative;
    padding-left: 200px;
  }
  #contents.performance .portfolio header br.wideOnly {
    display: unset;
  }
  #contents.performance .portfolio header h1,
  #contents.performance .portfolio header p {
    position: absolute;
    left: 0;
  }
  #contents.performance .portfolio header h1 {
    top: 43px;
  }
  #contents.performance .portfolio header p {
    top: 65px;
  }
  #contents.performance .portfolio header .selectBox {
    margin-top: 30px;
  }
  #contents.performance .portfolio header .selectBox,
  #contents.performance .portfolio header > a {
    max-width: 300px;
    margin-left: auto;
  }
  #contents.performance .portfolio header > a.jump {
    display: flex;
  }
}

#contents.performance .clients {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.performance .clients ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.performance .clients ul > li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  width: calc(20% - 8px);
  -moz-filter: grayscale(1);
  -ms-filter: grayscale(1);
  -o-filter: grayscale(1);
  filter: grayscale(1);
  opacity: 0.5;
  transition: all 0.3s;
}
#contents.performance .clients ul > li:hover {
  -moz-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -o-filter: grayscale(0);
  filter: grayscale(0);
  opacity: 1;
}
#contents.performance .clients ul > li:not(:nth-child(5n-4)) {
  margin-left: 10px;
}
#contents.performance .clients ul > li + li + li + li {
  margin-top: 20px;
}
#contents.performance .clients ul > li img {
  max-width: 100%;
}
@media (min-width: 1025px) {
  #contents.performance .clients ul > li {
    height: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .clients ul > li {
    height: 45px;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #contents.performance .clients ul > li {
    width: calc(33.3333333333% - 6px);
    margin-left: 9px !important;
  }
  #contents.performance .clients ul > li:nth-child(3n-2) {
    margin-left: 0 !important;
  }
  #contents.performance .clients ul > li + li + li + li {
    margin-top: 10px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .clients > section:not(:first-of-type) {
    margin-top: 80px;
    padding-top: 85px;
  }
  #contents.performance .clients > section h1 {
    padding-bottom: 50px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .clients > section:not(:first-of-type) {
    margin-top: 30px;
    padding-top: 40px;
  }
  #contents.performance .clients > section h1 {
    padding-bottom: 20px;
  }
}

#detailContents.pressDetail > header .utility {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents.pressDetail > header .utility::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 1px;
  background: #c8c8c8;
}
#detailContents.pressDetail > header .utility > span {
  color: #212121;
}
#detailContents.pressDetail .detail {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #detailContents.pressDetail > header .utility {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 80px;
    padding-bottom: 20px;
  }
  #detailContents.pressDetail .detail {
    margin-top: 85px;
  }
}
@media (max-width: 1024px) {
  #detailContents.pressDetail > header .title {
    margin-top: -10px;
  }
  #detailContents.pressDetail > header .utility {
    padding-top: 40px;
    padding-bottom: 15px;
  }
  #detailContents.pressDetail > header .utility > span {
    display: block;
    margin-bottom: 10px;
  }
  #detailContents.pressDetail .detail {
    margin-top: 30px;
  }
}

#contents.brochure .downloadInfo, #contents.research .downloadInfo {
  background: #f9f9f9;
}
#contents.brochure .downloadInfo > div, #contents.research .downloadInfo > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#contents.brochure .downloadInfo > div img, #contents.research .downloadInfo > div img {
  display: block;
}
#contents.brochure .downloadInfo > div > p, #contents.research .downloadInfo > div > p,
#contents.brochure .downloadInfo > div > div,
#contents.research .downloadInfo > div > div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#contents.brochure .downloadInfo > div > p em, #contents.research .downloadInfo > div > p em,
#contents.brochure .downloadInfo > div > p strong,
#contents.research .downloadInfo > div > p strong,
#contents.brochure .downloadInfo > div > p span,
#contents.research .downloadInfo > div > p span,
#contents.brochure .downloadInfo > div > div em,
#contents.research .downloadInfo > div > div em,
#contents.brochure .downloadInfo > div > div strong,
#contents.research .downloadInfo > div > div strong,
#contents.brochure .downloadInfo > div > div span,
#contents.research .downloadInfo > div > div span {
  width: 100%;
}
#contents.brochure .downloadInfo > div > p span, #contents.research .downloadInfo > div > p span,
#contents.brochure .downloadInfo > div > div span,
#contents.research .downloadInfo > div > div span {
  font-weight: 500;
  color: #4415a0;
}
#contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
#contents.brochure .downloadInfo > div > div p,
#contents.research .downloadInfo > div > div p {
  width: 100%;
}
#contents.brochure .downloadInfo > div > p .choose, #contents.research .downloadInfo > div > p .choose,
#contents.brochure .downloadInfo > div > div .choose,
#contents.research .downloadInfo > div > div .choose {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  color: #c8c8c8;
}
#contents.brochure .downloadInfo > div > p .choose button + button, #contents.research .downloadInfo > div > p .choose button + button,
#contents.brochure .downloadInfo > div > div .choose button + button,
#contents.research .downloadInfo > div > div .choose button + button {
  position: relative;
  margin-left: 1.3em;
  padding-left: 1.3em;
}
#contents.brochure .downloadInfo > div > p .choose button + button::before, #contents.research .downloadInfo > div > p .choose button + button::before,
#contents.brochure .downloadInfo > div > div .choose button + button::before,
#contents.research .downloadInfo > div > div .choose button + button::before {
  content: "";
  left: 0;
  width: 0.15em;
  height: 0.75em;
  background: #212121;
}
#contents.brochure .downloadInfo > div > p .download, #contents.research .downloadInfo > div > p .download,
#contents.brochure .downloadInfo > div > div .download,
#contents.research .downloadInfo > div > div .download {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.brochure .downloadInfo > div > p .download::before, #contents.research .downloadInfo > div > p .download::before, #contents.brochure .downloadInfo > div > p .download::after, #contents.research .downloadInfo > div > p .download::after,
#contents.brochure .downloadInfo > div > div .download::before,
#contents.research .downloadInfo > div > div .download::before,
#contents.brochure .downloadInfo > div > div .download::after,
#contents.research .downloadInfo > div > div .download::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.brochure .downloadInfo > div > p .download::after, #contents.research .downloadInfo > div > p .download::after,
#contents.brochure .downloadInfo > div > div .download::after,
#contents.research .downloadInfo > div > div .download::after {
  content: "";
  margin-top: -2px !important;
  background-image: url("../images/icon/iconDownload2.svg");
}
#contents.brochure .downloadInfo > div > p .download:not(:disabled):hover, #contents.research .downloadInfo > div > p .download:not(:disabled):hover, #contents.brochure .downloadInfo > div > p .download:not(:disabled):focus, #contents.research .downloadInfo > div > p .download:not(:disabled):focus,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):hover,
#contents.research .downloadInfo > div > div .download:not(:disabled):hover,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):focus,
#contents.research .downloadInfo > div > div .download:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.brochure .downloadInfo > div > p .download:not(:disabled):hover::before, #contents.research .downloadInfo > div > p .download:not(:disabled):hover::before, #contents.brochure .downloadInfo > div > p .download:not(:disabled):hover::after, #contents.research .downloadInfo > div > p .download:not(:disabled):hover::after, #contents.brochure .downloadInfo > div > p .download:not(:disabled):focus::before, #contents.research .downloadInfo > div > p .download:not(:disabled):focus::before, #contents.brochure .downloadInfo > div > p .download:not(:disabled):focus::after, #contents.research .downloadInfo > div > p .download:not(:disabled):focus::after,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):hover::before,
#contents.research .downloadInfo > div > div .download:not(:disabled):hover::before,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):hover::after,
#contents.research .downloadInfo > div > div .download:not(:disabled):hover::after,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):focus::before,
#contents.research .downloadInfo > div > div .download:not(:disabled):focus::before,
#contents.brochure .downloadInfo > div > div .download:not(:disabled):focus::after,
#contents.research .downloadInfo > div > div .download:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.brochure .downloadInfo > div > p .download, #contents.research .downloadInfo > div > p .download,
  #contents.brochure .downloadInfo > div > div .download,
  #contents.research .downloadInfo > div > div .download {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.brochure .downloadInfo > div > p .download::before, #contents.research .downloadInfo > div > p .download::before,
  #contents.brochure .downloadInfo > div > div .download::before,
  #contents.research .downloadInfo > div > div .download::before {
    margin-right: 10px;
  }
  #contents.brochure .downloadInfo > div > p .download::after, #contents.research .downloadInfo > div > p .download::after,
  #contents.brochure .downloadInfo > div > div .download::after,
  #contents.research .downloadInfo > div > div .download::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.brochure .downloadInfo > div > p .download, #contents.research .downloadInfo > div > p .download,
  #contents.brochure .downloadInfo > div > div .download,
  #contents.research .downloadInfo > div > div .download {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.brochure .downloadInfo > div > p .download::before, #contents.research .downloadInfo > div > p .download::before,
  #contents.brochure .downloadInfo > div > div .download::before,
  #contents.research .downloadInfo > div > div .download::before {
    margin-right: 14px;
  }
  #contents.brochure .downloadInfo > div > p .download::after, #contents.research .downloadInfo > div > p .download::after,
  #contents.brochure .downloadInfo > div > div .download::after,
  #contents.research .downloadInfo > div > div .download::after {
    margin-left: 18px;
  }
}
#contents.brochure .downloadInfo > div > p .zoom, #contents.research .downloadInfo > div > p .zoom,
#contents.brochure .downloadInfo > div > div .zoom,
#contents.research .downloadInfo > div > div .zoom {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.brochure .downloadInfo > div > p .zoom::before, #contents.research .downloadInfo > div > p .zoom::before, #contents.brochure .downloadInfo > div > p .zoom::after, #contents.research .downloadInfo > div > p .zoom::after,
#contents.brochure .downloadInfo > div > div .zoom::before,
#contents.research .downloadInfo > div > div .zoom::before,
#contents.brochure .downloadInfo > div > div .zoom::after,
#contents.research .downloadInfo > div > div .zoom::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.brochure .downloadInfo > div > p .zoom::after, #contents.research .downloadInfo > div > p .zoom::after,
#contents.brochure .downloadInfo > div > div .zoom::after,
#contents.research .downloadInfo > div > div .zoom::after {
  content: "";
  background-image: url("../images/icon/iconZoom.svg");
}
#contents.brochure .downloadInfo > div > p .zoom:not(:disabled):hover, #contents.research .downloadInfo > div > p .zoom:not(:disabled):hover, #contents.brochure .downloadInfo > div > p .zoom:not(:disabled):focus, #contents.research .downloadInfo > div > p .zoom:not(:disabled):focus,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):hover,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):hover,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):focus,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.brochure .downloadInfo > div > p .zoom:not(:disabled):hover::before, #contents.research .downloadInfo > div > p .zoom:not(:disabled):hover::before, #contents.brochure .downloadInfo > div > p .zoom:not(:disabled):hover::after, #contents.research .downloadInfo > div > p .zoom:not(:disabled):hover::after, #contents.brochure .downloadInfo > div > p .zoom:not(:disabled):focus::before, #contents.research .downloadInfo > div > p .zoom:not(:disabled):focus::before, #contents.brochure .downloadInfo > div > p .zoom:not(:disabled):focus::after, #contents.research .downloadInfo > div > p .zoom:not(:disabled):focus::after,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):hover::before,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):hover::before,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):hover::after,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):hover::after,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):focus::before,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):focus::before,
#contents.brochure .downloadInfo > div > div .zoom:not(:disabled):focus::after,
#contents.research .downloadInfo > div > div .zoom:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.brochure .downloadInfo > div > p .zoom, #contents.research .downloadInfo > div > p .zoom,
  #contents.brochure .downloadInfo > div > div .zoom,
  #contents.research .downloadInfo > div > div .zoom {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.brochure .downloadInfo > div > p .zoom::before, #contents.research .downloadInfo > div > p .zoom::before,
  #contents.brochure .downloadInfo > div > div .zoom::before,
  #contents.research .downloadInfo > div > div .zoom::before {
    margin-right: 10px;
  }
  #contents.brochure .downloadInfo > div > p .zoom::after, #contents.research .downloadInfo > div > p .zoom::after,
  #contents.brochure .downloadInfo > div > div .zoom::after,
  #contents.research .downloadInfo > div > div .zoom::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.brochure .downloadInfo > div > p .zoom, #contents.research .downloadInfo > div > p .zoom,
  #contents.brochure .downloadInfo > div > div .zoom,
  #contents.research .downloadInfo > div > div .zoom {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.brochure .downloadInfo > div > p .zoom::before, #contents.research .downloadInfo > div > p .zoom::before,
  #contents.brochure .downloadInfo > div > div .zoom::before,
  #contents.research .downloadInfo > div > div .zoom::before {
    margin-right: 14px;
  }
  #contents.brochure .downloadInfo > div > p .zoom::after, #contents.research .downloadInfo > div > p .zoom::after,
  #contents.brochure .downloadInfo > div > div .zoom::after,
  #contents.research .downloadInfo > div > div .zoom::after {
    margin-left: 18px;
  }
}
#contents.brochure .kor.downloadInfo .eng, #contents.research .kor.downloadInfo .eng {
  display: none;
}
#contents.brochure .kor.downloadInfo .choose button:first-child, #contents.research .kor.downloadInfo .choose button:first-child {
  font-weight: 700;
  color: #4415a0;
}
#contents.brochure .eng.downloadInfo .kor, #contents.research .eng.downloadInfo .kor {
  display: none;
}
#contents.brochure .eng.downloadInfo .choose button:last-child, #contents.research .eng.downloadInfo .choose button:last-child {
  font-weight: 700;
  color: #4415a0;
}
#contents.brochure .eng.downloadInfo a:nth-of-type(3), #contents.research .eng.downloadInfo a:nth-of-type(3) {
  margin-left: 0;
}
@media (min-width: 1025px) {
  #contents.brochure .downloadInfo > div, #contents.research .downloadInfo > div {
    padding-top: 85px;
    padding-bottom: 100px;
  }
  #contents.brochure .downloadInfo > div img, #contents.research .downloadInfo > div img {
    width: calc(100% - 687px);
  }
  #contents.brochure .downloadInfo > div > p, #contents.research .downloadInfo > div > p,
  #contents.brochure .downloadInfo > div > div,
  #contents.research .downloadInfo > div > div {
    width: 687px;
    padding-left: 110px;
  }
  #contents.brochure .downloadInfo > div > p em, #contents.research .downloadInfo > div > p em,
  #contents.brochure .downloadInfo > div > p strong,
  #contents.research .downloadInfo > div > p strong,
  #contents.brochure .downloadInfo > div > div em,
  #contents.research .downloadInfo > div > div em,
  #contents.brochure .downloadInfo > div > div strong,
  #contents.research .downloadInfo > div > div strong {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  #contents.brochure .downloadInfo > div > p span, #contents.research .downloadInfo > div > p span,
  #contents.brochure .downloadInfo > div > div span,
  #contents.research .downloadInfo > div > div span {
    margin-top: 35px;
  }
  #contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
  #contents.brochure .downloadInfo > div > div p,
  #contents.research .downloadInfo > div > div p {
    margin-top: 30px;
  }
  #contents.brochure .downloadInfo > div > p a, #contents.research .downloadInfo > div > p a,
  #contents.brochure .downloadInfo > div > div a,
  #contents.research .downloadInfo > div > div a {
    margin-top: 40px;
    width: 158px;
  }
  #contents.brochure .downloadInfo > div > p a + a, #contents.research .downloadInfo > div > p a + a,
  #contents.brochure .downloadInfo > div > div a + a,
  #contents.research .downloadInfo > div > div a + a {
    margin-left: 15px;
  }
  #contents.brochure .downloadInfo > div > p .choose, #contents.research .downloadInfo > div > p .choose,
  #contents.brochure .downloadInfo > div > div .choose,
  #contents.research .downloadInfo > div > div .choose {
    margin-top: 35px;
  }
}
@media (max-width: 1024px) {
  #contents.brochure .downloadInfo, #contents.research .downloadInfo {
    padding-bottom: 30px;
  }
  #contents.brochure .downloadInfo > div, #contents.research .downloadInfo > div {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  #contents.brochure .downloadInfo > div img, #contents.research .downloadInfo > div img,
  #contents.brochure .downloadInfo > div > p,
  #contents.research .downloadInfo > div > p {
    width: 50%;
  }
  #contents.brochure .downloadInfo > div > p, #contents.research .downloadInfo > div > p,
  #contents.brochure .downloadInfo > div > div,
  #contents.research .downloadInfo > div > div {
    padding-top: 20px;
    padding-left: 30px;
    word-break: keep-all;
  }
  #contents.brochure .downloadInfo > div > p em, #contents.research .downloadInfo > div > p em,
  #contents.brochure .downloadInfo > div > p strong,
  #contents.research .downloadInfo > div > p strong,
  #contents.brochure .downloadInfo > div > div em,
  #contents.research .downloadInfo > div > div em,
  #contents.brochure .downloadInfo > div > div strong,
  #contents.research .downloadInfo > div > div strong {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.brochure .downloadInfo > div > p span, #contents.research .downloadInfo > div > p span,
  #contents.brochure .downloadInfo > div > div span,
  #contents.research .downloadInfo > div > div span {
    margin-top: 25px;
  }
  #contents.brochure .downloadInfo > div > p p, #contents.research .downloadInfo > div > p p,
  #contents.brochure .downloadInfo > div > div p,
  #contents.research .downloadInfo > div > div p {
    margin-top: 20px;
  }
  #contents.brochure .downloadInfo > div > p a, #contents.research .downloadInfo > div > p a,
  #contents.brochure .downloadInfo > div > div a,
  #contents.research .downloadInfo > div > div a {
    margin-top: 30px;
    width: 140px;
  }
  #contents.brochure .downloadInfo > div > p a + a, #contents.research .downloadInfo > div > p a + a,
  #contents.brochure .downloadInfo > div > div a + a,
  #contents.research .downloadInfo > div > div a + a {
    margin-left: 10px;
  }
  #contents.brochure .downloadInfo > div > p .choose, #contents.research .downloadInfo > div > p .choose,
  #contents.brochure .downloadInfo > div > div .choose,
  #contents.research .downloadInfo > div > div .choose {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) and (min-width: 481px) {
  #contents.brochure .downloadInfo > div img, #contents.research .downloadInfo > div img {
    margin-right: 110px;
    width: 350px;
  }
  #contents.brochure .downloadInfo > div > p, #contents.research .downloadInfo > div > p,
  #contents.brochure .downloadInfo > div > div,
  #contents.research .downloadInfo > div > div {
    display: block;
    width: 100%;
    padding-left: 0;
    text-align: center;
  }
  #contents.brochure .downloadInfo > div > p em, #contents.research .downloadInfo > div > p em,
  #contents.brochure .downloadInfo > div > p span,
  #contents.research .downloadInfo > div > p span,
  #contents.brochure .downloadInfo > div > div em,
  #contents.research .downloadInfo > div > div em,
  #contents.brochure .downloadInfo > div > div span,
  #contents.research .downloadInfo > div > div span {
    display: block;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #contents.brochure .downloadInfo > div img, #contents.research .downloadInfo > div img {
    margin-right: 110px;
    width: calc(100% - 50px);
  }
  #contents.brochure .downloadInfo > div > p, #contents.research .downloadInfo > div > p,
  #contents.brochure .downloadInfo > div > div,
  #contents.research .downloadInfo > div > div {
    width: 100%;
    padding-left: 0;
  }
  #contents.brochure .downloadInfo > div > p a, #contents.research .downloadInfo > div > p a,
  #contents.brochure .downloadInfo > div > div a,
  #contents.research .downloadInfo > div > div a {
    width: calc(50% - 5px);
  }
}

#recruit .container .myinfoInfo, .recruit .container .myinfoInfo, #contents.contact .info, #detailContents.pressDetail .info {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#recruit .container .myinfoInfo > ul, .recruit .container .myinfoInfo > ul, #contents.contact .info > ul, #detailContents.pressDetail .info > ul,
#recruit .container .myinfoInfo > div,
.recruit .container .myinfoInfo > div,
#contents.contact .info > div,
#detailContents.pressDetail .info > div {
  border: 1px solid #3d3a89;
  border-radius: 8px;
  background: #f9f9f9;
}
#recruit .container .myinfoInfo p, .recruit .container .myinfoInfo p, #contents.contact .info p, #detailContents.pressDetail .info p {
  font-weight: 700;
  word-break: keep-all;
}
#recruit .container .myinfoInfo > ul, .recruit .container .myinfoInfo > ul, #contents.contact .info > ul, #detailContents.pressDetail .info > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  border: 1px solid #3d3a89;
}
#recruit .container .myinfoInfo > ul li, .recruit .container .myinfoInfo > ul li, #contents.contact .info > ul li, #detailContents.pressDetail .info > ul li {
  position: relative;
  width: 50%;
}
#recruit .container .myinfoInfo > ul li + li, .recruit .container .myinfoInfo > ul li + li, #contents.contact .info > ul li + li, #detailContents.pressDetail .info > ul li + li {
  border-left: 2px dashed rgba(102, 102, 102, 0.5);
}
#recruit .container .myinfoInfo > ul li a, .recruit .container .myinfoInfo > ul li a, #contents.contact .info > ul li a, #detailContents.pressDetail .info > ul li a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#recruit .container .myinfoInfo > ul li a::before, .recruit .container .myinfoInfo > ul li a::before, #contents.contact .info > ul li a::before, #detailContents.pressDetail .info > ul li a::before, #recruit .container .myinfoInfo > ul li a::after, .recruit .container .myinfoInfo > ul li a::after, #contents.contact .info > ul li a::after, #detailContents.pressDetail .info > ul li a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#recruit .container .myinfoInfo > ul li a:not(:disabled):hover, .recruit .container .myinfoInfo > ul li a:not(:disabled):hover, #contents.contact .info > ul li a:not(:disabled):hover, #detailContents.pressDetail .info > ul li a:not(:disabled):hover, #recruit .container .myinfoInfo > ul li a:not(:disabled):focus, .recruit .container .myinfoInfo > ul li a:not(:disabled):focus, #contents.contact .info > ul li a:not(:disabled):focus, #detailContents.pressDetail .info > ul li a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#recruit .container .myinfoInfo > ul li a:not(:disabled):hover::before, .recruit .container .myinfoInfo > ul li a:not(:disabled):hover::before, #contents.contact .info > ul li a:not(:disabled):hover::before, #detailContents.pressDetail .info > ul li a:not(:disabled):hover::before, #recruit .container .myinfoInfo > ul li a:not(:disabled):hover::after, .recruit .container .myinfoInfo > ul li a:not(:disabled):hover::after, #contents.contact .info > ul li a:not(:disabled):hover::after, #detailContents.pressDetail .info > ul li a:not(:disabled):hover::after, #recruit .container .myinfoInfo > ul li a:not(:disabled):focus::before, .recruit .container .myinfoInfo > ul li a:not(:disabled):focus::before, #contents.contact .info > ul li a:not(:disabled):focus::before, #detailContents.pressDetail .info > ul li a:not(:disabled):focus::before, #recruit .container .myinfoInfo > ul li a:not(:disabled):focus::after, .recruit .container .myinfoInfo > ul li a:not(:disabled):focus::after, #contents.contact .info > ul li a:not(:disabled):focus::after, #detailContents.pressDetail .info > ul li a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #recruit .container .myinfoInfo > ul li a, .recruit .container .myinfoInfo > ul li a, #contents.contact .info > ul li a, #detailContents.pressDetail .info > ul li a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #recruit .container .myinfoInfo > ul li a::before, .recruit .container .myinfoInfo > ul li a::before, #contents.contact .info > ul li a::before, #detailContents.pressDetail .info > ul li a::before {
    margin-right: 10px;
  }
  #recruit .container .myinfoInfo > ul li a::after, .recruit .container .myinfoInfo > ul li a::after, #contents.contact .info > ul li a::after, #detailContents.pressDetail .info > ul li a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .myinfoInfo > ul li a, .recruit .container .myinfoInfo > ul li a, #contents.contact .info > ul li a, #detailContents.pressDetail .info > ul li a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #recruit .container .myinfoInfo > ul li a::before, .recruit .container .myinfoInfo > ul li a::before, #contents.contact .info > ul li a::before, #detailContents.pressDetail .info > ul li a::before {
    margin-right: 14px;
  }
  #recruit .container .myinfoInfo > ul li a::after, .recruit .container .myinfoInfo > ul li a::after, #contents.contact .info > ul li a::after, #detailContents.pressDetail .info > ul li a::after {
    margin-left: 18px;
  }
}
@media (min-width: 769px) {
  #recruit .container .myinfoInfo > ul li.tel a, .recruit .container .myinfoInfo > ul li.tel a, #contents.contact .info > ul li.tel a, #detailContents.pressDetail .info > ul li.tel a {
    display: none;
  }
}
#recruit .container .myinfoInfo > ul li small, .recruit .container .myinfoInfo > ul li small, #contents.contact .info > ul li small, #detailContents.pressDetail .info > ul li small {
  display: block;
  margin-top: 1em;
}
#recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img, #contents.contact .info > ul li img, #detailContents.pressDetail .info > ul li img {
  position: absolute;
  top: 5px;
  display: block;
}
#recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span {
  display: block;
  color: #212121;
}
#recruit .container .myinfoInfo > ul li span em, .recruit .container .myinfoInfo > ul li span em, #contents.contact .info > ul li span em, #detailContents.pressDetail .info > ul li span em {
  display: inline-block;
  padding-right: 10px;
  color: #4415a0;
}
#recruit .container .myinfoInfo > div, .recruit .container .myinfoInfo > div, #contents.contact .info > div, #detailContents.pressDetail .info > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#recruit .container .myinfoInfo > div > div, .recruit .container .myinfoInfo > div > div, #contents.contact .info > div > div, #detailContents.pressDetail .info > div > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  padding-right: 40px;
}
#recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
}
#recruit .container .myinfoInfo > div > dl dt, .recruit .container .myinfoInfo > div > dl dt, #contents.contact .info > div > dl dt, #detailContents.pressDetail .info > div > dl dt {
  color: #4415a0;
}
#recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), #contents.contact .info > div > dl dt:not(:last-of-type), #detailContents.pressDetail .info > div > dl dt:not(:last-of-type) {
  border-right: 1px solid #c8c8c8;
}
#recruit .container .myinfoInfo > div > dl dd, .recruit .container .myinfoInfo > div > dl dd, #contents.contact .info > div > dl dd, #detailContents.pressDetail .info > div > dl dd {
  position: absolute;
  bottom: 0;
  color: #212121;
}
@media (min-width: 1025px) {
  #recruit .container .myinfoInfo, .recruit .container .myinfoInfo, #contents.contact .info, #detailContents.pressDetail .info {
    padding-top: 130px;
  }
  #recruit .container .myinfoInfo > ul, .recruit .container .myinfoInfo > ul, #contents.contact .info > ul, #detailContents.pressDetail .info > ul,
  #recruit .container .myinfoInfo > div,
  .recruit .container .myinfoInfo > div,
  #contents.contact .info > div,
  #detailContents.pressDetail .info > div {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  #recruit .container .myinfoInfo > ul li, .recruit .container .myinfoInfo > ul li, #contents.contact .info > ul li, #detailContents.pressDetail .info > ul li {
    min-height: 103px;
    padding-right: 30px;
    padding-left: 215px;
  }
  #recruit .container .myinfoInfo > ul li a, .recruit .container .myinfoInfo > ul li a, #contents.contact .info > ul li a, #detailContents.pressDetail .info > ul li a {
    margin-top: 25px;
  }
  #recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img, #contents.contact .info > ul li img, #detailContents.pressDetail .info > ul li img {
    left: 65px;
    width: 100px;
    height: 100px;
  }
  #recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span {
    margin-top: 20px;
  }
  #recruit .container .myinfoInfo > div, .recruit .container .myinfoInfo > div, #contents.contact .info > div, #detailContents.pressDetail .info > div {
    padding-left: 60px;
    padding-right: 60px;
  }
  #recruit .container .myinfoInfo > div > div img, .recruit .container .myinfoInfo > div > div img, #contents.contact .info > div > div img, #detailContents.pressDetail .info > div > div img {
    width: 100px;
    height: 100px;
  }
  #recruit .container .myinfoInfo > div > div p, .recruit .container .myinfoInfo > div > div p, #contents.contact .info > div > div p, #detailContents.pressDetail .info > div > div p {
    margin-left: 50px;
  }
  #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl {
    height: 60px;
  }
  #recruit .container .myinfoInfo > div > dl dt, .recruit .container .myinfoInfo > div > dl dt, #contents.contact .info > div > dl dt, #detailContents.pressDetail .info > div > dl dt {
    height: 60px;
  }
  #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), #contents.contact .info > div > dl dt:not(:last-of-type), #detailContents.pressDetail .info > div > dl dt:not(:last-of-type) {
    margin-right: 35px;
    width: 145px;
    border-right: 1px solid #c8c8c8;
  }
  #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide, .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide, #contents.contact .info > div > dl dt:not(:last-of-type).caseWide, #detailContents.pressDetail .info > div > dl dt:not(:last-of-type).caseWide, #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide + dd, .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide + dd, #contents.contact .info > div > dl dt:not(:last-of-type).caseWide + dd, #detailContents.pressDetail .info > div > dl dt:not(:last-of-type).caseWide + dd {
    width: 180px;
  }
  #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide + dd + dt + dd, .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type).caseWide + dd + dt + dd, #contents.contact .info > div > dl dt:not(:last-of-type).caseWide + dd + dt + dd, #detailContents.pressDetail .info > div > dl dt:not(:last-of-type).caseWide + dd + dt + dd {
    left: 215px !important;
  }
  #recruit .container .myinfoInfo > div > dl dt:last-of-type, .recruit .container .myinfoInfo > div > dl dt:last-of-type, #contents.contact .info > div > dl dt:last-of-type, #detailContents.pressDetail .info > div > dl dt:last-of-type {
    width: 110px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), #contents.contact .info > div > dl dd:nth-of-type(1), #detailContents.pressDetail .info > div > dl dd:nth-of-type(1) {
    left: 0px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), #contents.contact .info > div > dl dd:nth-of-type(2), #detailContents.pressDetail .info > div > dl dd:nth-of-type(2) {
    left: 180px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), #contents.contact .info > div > dl dd:nth-of-type(3), #detailContents.pressDetail .info > div > dl dd:nth-of-type(3) {
    left: 360px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .myinfoInfo, .recruit .container .myinfoInfo, #contents.contact .info, #detailContents.pressDetail .info {
    padding-top: 50px;
  }
  #recruit .container .myinfoInfo > ul, .recruit .container .myinfoInfo > ul, #contents.contact .info > ul, #detailContents.pressDetail .info > ul,
  #recruit .container .myinfoInfo > div,
  .recruit .container .myinfoInfo > div,
  #contents.contact .info > div,
  #detailContents.pressDetail .info > div {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  #recruit .container .myinfoInfo > ul li, .recruit .container .myinfoInfo > ul li, #contents.contact .info > ul li, #detailContents.pressDetail .info > ul li {
    padding-left: 140px;
    padding-right: 20px;
    background-size: 80px auto;
    background-position: 40px center;
  }
  #recruit .container .myinfoInfo > ul li a, .recruit .container .myinfoInfo > ul li a, #contents.contact .info > ul li a, #detailContents.pressDetail .info > ul li a {
    margin-top: 12px;
  }
  #recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img, #contents.contact .info > ul li img, #detailContents.pressDetail .info > ul li img {
    left: 40px;
    width: 70px;
    height: 70px;
  }
  #recruit .container .myinfoInfo > ul li span, .recruit .container .myinfoInfo > ul li span, #contents.contact .info > ul li span, #detailContents.pressDetail .info > ul li span {
    margin-top: 20px;
  }
  #recruit .container .myinfoInfo > div, .recruit .container .myinfoInfo > div, #contents.contact .info > div, #detailContents.pressDetail .info > div {
    padding-left: 40px;
    padding-right: 40px;
  }
  #recruit .container .myinfoInfo > div > div img, .recruit .container .myinfoInfo > div > div img, #contents.contact .info > div > div img, #detailContents.pressDetail .info > div > div img {
    width: 70px;
    height: 70px;
  }
  #recruit .container .myinfoInfo > div > div p, .recruit .container .myinfoInfo > div > div p, #contents.contact .info > div > div p, #detailContents.pressDetail .info > div > div p {
    margin-left: 30px;
  }
  #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl {
    height: 50px;
  }
  #recruit .container .myinfoInfo > div > dl dt, .recruit .container .myinfoInfo > div > dl dt, #contents.contact .info > div > dl dt, #detailContents.pressDetail .info > div > dl dt {
    height: 50px;
  }
  #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), #contents.contact .info > div > dl dt:not(:last-of-type), #detailContents.pressDetail .info > div > dl dt:not(:last-of-type) {
    margin-right: 30px;
    width: 125px;
  }
  #recruit .container .myinfoInfo > div > dl dt.caseWide, .recruit .container .myinfoInfo > div > dl dt.caseWide, #contents.contact .info > div > dl dt.caseWide, #detailContents.pressDetail .info > div > dl dt.caseWide, #recruit .container .myinfoInfo > div > dl dt.caseWide + dd, .recruit .container .myinfoInfo > div > dl dt.caseWide + dd, #contents.contact .info > div > dl dt.caseWide + dd, #detailContents.pressDetail .info > div > dl dt.caseWide + dd {
    width: 155px;
  }
  #recruit .container .myinfoInfo > div > dl dt.caseWide + dd + dt + dd, .recruit .container .myinfoInfo > div > dl dt.caseWide + dd + dt + dd, #contents.contact .info > div > dl dt.caseWide + dd + dt + dd, #detailContents.pressDetail .info > div > dl dt.caseWide + dd + dt + dd {
    left: 185px !important;
  }
  #recruit .container .myinfoInfo > div > dl dt:last-of-type, .recruit .container .myinfoInfo > div > dl dt:last-of-type, #contents.contact .info > div > dl dt:last-of-type, #detailContents.pressDetail .info > div > dl dt:last-of-type {
    width: 95px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), #contents.contact .info > div > dl dd:nth-of-type(1), #detailContents.pressDetail .info > div > dl dd:nth-of-type(1) {
    left: 0px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), #contents.contact .info > div > dl dd:nth-of-type(2), #detailContents.pressDetail .info > div > dl dd:nth-of-type(2) {
    left: 155px;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), #contents.contact .info > div > dl dd:nth-of-type(3), #detailContents.pressDetail .info > div > dl dd:nth-of-type(3) {
    left: 310px;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #recruit .container .myinfoInfo > ul li, .recruit .container .myinfoInfo > ul li, #contents.contact .info > ul li, #detailContents.pressDetail .info > ul li {
    padding-left: 0 !important;
    background-image: none !important;
  }
  #recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img, #contents.contact .info > ul li img, #detailContents.pressDetail .info > ul li img {
    display: none;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #recruit .container .myinfoInfo > ul, .recruit .container .myinfoInfo > ul, #contents.contact .info > ul, #detailContents.pressDetail .info > ul {
    padding: 0 30px 5px;
    border-radius: 11px;
  }
  #recruit .container .myinfoInfo > ul li, .recruit .container .myinfoInfo > ul li, #contents.contact .info > ul li, #detailContents.pressDetail .info > ul li {
    width: 100%;
    padding-top: 35px;
    padding-bottom: 35px;
    padding-left: 95px;
    padding-right: 0;
    border-left: 0 !important;
  }
  #recruit .container .myinfoInfo > ul li + li, .recruit .container .myinfoInfo > ul li + li, #contents.contact .info > ul li + li, #detailContents.pressDetail .info > ul li + li {
    border-top: 2px dashed rgba(102, 102, 102, 0.5);
  }
  #recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img, #contents.contact .info > ul li img, #detailContents.pressDetail .info > ul li img {
    top: 35px;
    left: 0;
  }
  #recruit .container .myinfoInfo > ul li > span, .recruit .container .myinfoInfo > ul li > span, #contents.contact .info > ul li > span, #detailContents.pressDetail .info > ul li > span {
    display: none;
    margin-top: 0;
  }
  #recruit .container .myinfoInfo > ul li > span em, .recruit .container .myinfoInfo > ul li > span em, #contents.contact .info > ul li > span em, #detailContents.pressDetail .info > ul li > span em {
    display: none;
  }
}
@media (max-width: 1024px) and (max-width: 880px) {
  #recruit .container .myinfoInfo > div, .recruit .container .myinfoInfo > div, #contents.contact .info > div, #detailContents.pressDetail .info > div {
    flex-wrap: wrap;
  }
  #recruit .container .myinfoInfo > div > div, .recruit .container .myinfoInfo > div > div, #contents.contact .info > div > div, #detailContents.pressDetail .info > div > div {
    padding-right: 0;
  }
  #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl {
    justify-content: space-between;
    margin-top: 30px;
    width: 100%;
  }
  #recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), .recruit .container .myinfoInfo > div > dl dt:not(:last-of-type), #contents.contact .info > div > dl dt:not(:last-of-type), #detailContents.pressDetail .info > div > dl dt:not(:last-of-type) {
    width: calc(33.3333333333% + 30px);
  }
  #recruit .container .myinfoInfo > div > dl dt:last-of-type, .recruit .container .myinfoInfo > div > dl dt:last-of-type, #contents.contact .info > div > dl dt:last-of-type, #detailContents.pressDetail .info > div > dl dt:last-of-type {
    width: 33.3333333333%;
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(1), #contents.contact .info > div > dl dd:nth-of-type(1), #detailContents.pressDetail .info > div > dl dd:nth-of-type(1) {
    left: calc((33.3333333333% + 18px) * 1 - (33.3333333333% + 18px));
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(2), #contents.contact .info > div > dl dd:nth-of-type(2), #detailContents.pressDetail .info > div > dl dd:nth-of-type(2) {
    left: calc((33.3333333333% + 18px) * 2 - (33.3333333333% + 18px));
  }
  #recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), .recruit .container .myinfoInfo > div > dl dd:nth-of-type(3), #contents.contact .info > div > dl dd:nth-of-type(3), #detailContents.pressDetail .info > div > dl dd:nth-of-type(3) {
    left: calc((33.3333333333% + 18px) * 3 - (33.3333333333% + 18px));
  }
  #recruit .container .myinfoInfo > div > dl.case dt, .recruit .container .myinfoInfo > div > dl.case dt, #contents.contact .info > div > dl.case dt, #detailContents.pressDetail .info > div > dl.case dt,
  #recruit .container .myinfoInfo > div > dl.case dd,
  .recruit .container .myinfoInfo > div > dl.case dd,
  #contents.contact .info > div > dl.case dd,
  #detailContents.pressDetail .info > div > dl.case dd {
    width: 50% !important;
  }
  #recruit .container .myinfoInfo > div > dl.case dd:nth-of-type(2), .recruit .container .myinfoInfo > div > dl.case dd:nth-of-type(2), #contents.contact .info > div > dl.case dd:nth-of-type(2), #detailContents.pressDetail .info > div > dl.case dd:nth-of-type(2),
  #recruit .container .myinfoInfo > div > dl.case dt.caseWide + dd + dt + dd,
  .recruit .container .myinfoInfo > div > dl.case dt.caseWide + dd + dt + dd,
  #contents.contact .info > div > dl.case dt.caseWide + dd + dt + dd,
  #detailContents.pressDetail .info > div > dl.case dt.caseWide + dd + dt + dd {
    left: calc(50% + 15px) !important;
  }
}
@media (max-width: 1024px) and (max-width: 880px) and (max-width: 560px) {
  #recruit .container .myinfoInfo > div > dl, .recruit .container .myinfoInfo > div > dl, #contents.contact .info > div > dl, #detailContents.pressDetail .info > div > dl {
    display: block;
    height: unset;
  }
  #recruit .container .myinfoInfo > div > dl dt, .recruit .container .myinfoInfo > div > dl dt, #contents.contact .info > div > dl dt, #detailContents.pressDetail .info > div > dl dt {
    float: left;
    margin-right: 0 !important;
    width: 120px !important;
    height: unset;
    border-right: 0 !important;
  }
  #recruit .container .myinfoInfo > div > dl dt.caseWide, .recruit .container .myinfoInfo > div > dl dt.caseWide, #contents.contact .info > div > dl dt.caseWide, #detailContents.pressDetail .info > div > dl dt.caseWide, #recruit .container .myinfoInfo > div > dl dt.caseWide + dd + dt, .recruit .container .myinfoInfo > div > dl dt.caseWide + dd + dt, #contents.contact .info > div > dl dt.caseWide + dd + dt, #detailContents.pressDetail .info > div > dl dt.caseWide + dd + dt {
    width: 60% !important;
  }
  #recruit .container .myinfoInfo > div > dl dt.caseWide ~ dd, .recruit .container .myinfoInfo > div > dl dt.caseWide ~ dd, #contents.contact .info > div > dl dt.caseWide ~ dd, #detailContents.pressDetail .info > div > dl dt.caseWide ~ dd {
    width: 40% !important;
  }
  #recruit .container .myinfoInfo > div > dl dd, .recruit .container .myinfoInfo > div > dl dd, #contents.contact .info > div > dl dd, #detailContents.pressDetail .info > div > dl dd {
    position: static;
    float: right;
    width: calc(100% - 120px);
    text-align: right;
  }
  #recruit .container .myinfoInfo > div > dl dd:not(:first-of-type), .recruit .container .myinfoInfo > div > dl dd:not(:first-of-type), #contents.contact .info > div > dl dd:not(:first-of-type), #detailContents.pressDetail .info > div > dl dd:not(:first-of-type),
  #recruit .container .myinfoInfo > div > dl dt:not(:first-of-type),
  .recruit .container .myinfoInfo > div > dl dt:not(:first-of-type),
  #contents.contact .info > div > dl dt:not(:first-of-type),
  #detailContents.pressDetail .info > div > dl dt:not(:first-of-type) {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #c8c8c8;
  }
}

.inquiry.groupCr, #detailContents.portfolioDetail .inquiry, #contents.contact .contactInfo {
  z-index: 1;
  position: relative;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.shinyoung.inquiry.groupCr, #detailContents.portfolioDetail .shinyoung.inquiry, #contents.contact .shinyoung.contactInfo {
  background-image: url("../images/shinyoung/page/bgBannerInquiry.png");
}
.enc.inquiry.groupCr, #detailContents.portfolioDetail .enc.inquiry, #contents.contact .enc.contactInfo {
  background-image: url("../images/shinyoungEnc/page/bgBannerInquiry.png");
}
.groupCr.inquiry, #detailContents.portfolioDetail .groupCr.inquiry, #contents.contact .groupCr.contactInfo {
  background-image: url("../images/shinyoungGroup/page/bgBannerInquiry.png");
}
.inquiry.groupCr > div, #detailContents.portfolioDetail .inquiry > div, #contents.contact .contactInfo > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 481px) {
  .inquiry.groupCr > div, #detailContents.portfolioDetail .inquiry > div, #contents.contact .contactInfo > div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
}
.inquiry.groupCr p, #detailContents.portfolioDetail .inquiry p, #contents.contact .contactInfo p {
  color: #fff;
  font-weight: 300;
}
.inquiry.groupCr p em, #detailContents.portfolioDetail .inquiry p em, #contents.contact .contactInfo p em {
  font-weight: 700;
}
.inquiry.groupCr > div > a, #detailContents.portfolioDetail .inquiry > div > a, #contents.contact .contactInfo > div > a {
  padding: 0 22px;
  line-height: 40px;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 21px;
}
.inquiry.groupCr > div > a:hover, #detailContents.portfolioDetail .inquiry > div > a:hover, #contents.contact .contactInfo > div > a:hover, .inquiry.groupCr > div > a:focus, #detailContents.portfolioDetail .inquiry > div > a:focus, #contents.contact .contactInfo > div > a:focus {
  border-color: #0097e0;
  color: #0097e0;
}
.inquiry.groupCr > div > div > a, #detailContents.portfolioDetail .inquiry > div > div > a, #contents.contact .contactInfo > div > div > a {
  color: #fff;
  text-decoration: underline;
}
@media (min-width: 1025px) {
  .inquiry.groupCr > div, #detailContents.portfolioDetail .inquiry > div, #contents.contact .contactInfo > div {
    height: 200px;
  }
  .inquiry.groupCr > div p, #detailContents.portfolioDetail .inquiry > div p, #contents.contact .contactInfo > div p {
    width: 500px;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  .inquiry.groupCr > div > div > a + a, #detailContents.portfolioDetail .inquiry > div > div > a + a, #contents.contact .contactInfo > div > div > a + a {
    margin-left: 70px;
  }
}
@media (max-width: 1024px) {
  .inquiry.groupCr > div, #detailContents.portfolioDetail .inquiry > div, #contents.contact .contactInfo > div {
    height: 150px;
  }
  .inquiry.groupCr > div p, #detailContents.portfolioDetail .inquiry > div p, #contents.contact .contactInfo > div p {
    max-width: 350px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
  .inquiry.groupCr > div > div a + a, #detailContents.portfolioDetail .inquiry > div > div a + a, #contents.contact .contactInfo > div > div a + a {
    margin-left: 40px;
  }
}
@media (max-width: 1024px) and (max-width: 820px) {
  .inquiry.groupCr > div > div a + a, #detailContents.portfolioDetail .inquiry > div > div a + a, #contents.contact .contactInfo > div > div a + a {
    display: block;
    margin-top: 2px;
    margin-left: 0;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  .inquiry.groupCr > div > div, #detailContents.portfolioDetail .inquiry > div > div, #contents.contact .contactInfo > div > div {
    margin-top: 20px;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  .shinyoung.inquiry.groupCr, #detailContents.portfolioDetail .shinyoung.inquiry, #contents.contact .shinyoung.contactInfo {
    background-image: url("../images/shinyoung/page/bgBannerInquiryMobile.png");
  }
  .inquiry.groupCr > div, #detailContents.portfolioDetail .inquiry > div, #contents.contact .contactInfo > div {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    height: 195px;
  }
  .inquiry.groupCr > div > a, #detailContents.portfolioDetail .inquiry > div > a, #contents.contact .contactInfo > div > a {
    margin-top: 20px;
  }
}

#recruit .selectjob .form .application, .recruit .selectjob .form .application, #recruit .form, .recruit .form, #recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry, #contents.contact .inquiry, #contents.research .application {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#recruit .selectjob .form .application > section, .recruit .selectjob .form .application > section, #recruit .form > section, .recruit .form > section, #recruit .container #inquiry form.inquiry > section, .recruit .container #inquiry form.inquiry > section, #contents.contact .inquiry > section, #contents.research .application > section {
  border-bottom: 1px solid #c8c8c8;
}
#recruit .selectjob .form .application > section > header h1, .recruit .selectjob .form .application > section > header h1, #recruit .form > section > header h1, .recruit .form > section > header h1, #recruit .container #inquiry form.inquiry > section > header h1, .recruit .container #inquiry form.inquiry > section > header h1, #contents.contact .inquiry > section > header h1, #contents.research .application > section > header h1,
#recruit .selectjob .form .application > section > h1,
.recruit .selectjob .form .application > section > h1,
#recruit .form > section > h1,
.recruit .form > section > h1,
#recruit .container #inquiry form.inquiry > section > h1,
.recruit .container #inquiry form.inquiry > section > h1,
#contents.contact .inquiry > section > h1,
#contents.research .application > section > h1,
#recruit .selectjob .form .application > section > header h2,
.recruit .selectjob .form .application > section > header h2,
#recruit .form > section > header h2,
.recruit .form > section > header h2,
#recruit .container #inquiry form.inquiry > section > header h2,
.recruit .container #inquiry form.inquiry > section > header h2,
#contents.contact .inquiry > section > header h2,
#contents.research .application > section > header h2,
#recruit .selectjob .form .application > section > h2,
.recruit .selectjob .form .application > section > h2,
#recruit .form > section > h2,
.recruit .form > section > h2,
#recruit .container #inquiry form.inquiry > section > h2,
.recruit .container #inquiry form.inquiry > section > h2,
#contents.contact .inquiry > section > h2,
#contents.research .application > section > h2 {
  font-weight: 400;
  word-break: keep-all;
}
#recruit .selectjob .form .application > section > header h1 em, .recruit .selectjob .form .application > section > header h1 em, #recruit .form > section > header h1 em, .recruit .form > section > header h1 em, #recruit .container #inquiry form.inquiry > section > header h1 em, .recruit .container #inquiry form.inquiry > section > header h1 em, #contents.contact .inquiry > section > header h1 em, #contents.research .application > section > header h1 em {
  color: #4415a0;
}
#recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p {
  position: relative;
  padding-left: 15px;
  color: #4415a0;
}
#recruit .selectjob .form .application > section > header p::before, .recruit .selectjob .form .application > section > header p::before, #recruit .form > section > header p::before, .recruit .form > section > header p::before, #recruit .container #inquiry form.inquiry > section > header p::before, .recruit .container #inquiry form.inquiry > section > header p::before, #contents.contact .inquiry > section > header p::before, #contents.research .application > section > header p::before {
  left: 0;
}
#recruit .selectjob .form .application > section > header p::before, .recruit .selectjob .form .application > section > header p::before, #recruit .form > section > header p::before, .recruit .form > section > header p::before, #recruit .container #inquiry form.inquiry > section > header p::before, .recruit .container #inquiry form.inquiry > section > header p::before, #contents.contact .inquiry > section > header p::before, #contents.research .application > section > header p::before,
#recruit .selectjob .form .application > section label.required::after,
.recruit .selectjob .form .application > section label.required::after,
#recruit .form > section label.required::after,
.recruit .form > section label.required::after,
#recruit .container #inquiry form.inquiry > section label.required::after,
.recruit .container #inquiry form.inquiry > section label.required::after,
#contents.contact .inquiry > section label.required::after,
#contents.research .application > section label.required::after {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #4415a0;
}
#recruit .selectjob .form .application > section > label, .recruit .selectjob .form .application > section > label, #recruit .form > section > label, .recruit .form > section > label, #recruit .container #inquiry form.inquiry > section > label, .recruit .container #inquiry form.inquiry > section > label, #contents.contact .inquiry > section > label, #contents.research .application > section > label, #recruit .selectjob .form .application > section > .label, .recruit .selectjob .form .application > section > .label, #recruit .form > section > .label, .recruit .form > section > .label, #recruit .container #inquiry form.inquiry > section > .label, .recruit .container #inquiry form.inquiry > section > .label, #contents.contact .inquiry > section > .label, #contents.research .application > section > .label,
#recruit .selectjob .form .application > section .half > label,
.recruit .selectjob .form .application > section .half > label,
#recruit .form > section .half > label,
.recruit .form > section .half > label,
#recruit .container #inquiry form.inquiry > section .half > label,
.recruit .container #inquiry form.inquiry > section .half > label,
#contents.contact .inquiry > section .half > label,
#contents.research .application > section .half > label, #recruit .selectjob .form .application > section .half > .label, .recruit .selectjob .form .application > section .half > .label, #recruit .form > section .half > .label, .recruit .form > section .half > .label, #recruit .container #inquiry form.inquiry > section .half > .label, .recruit .container #inquiry form.inquiry > section .half > .label, #contents.contact .inquiry > section .half > .label, #contents.research .application > section .half > .label,
#recruit .selectjob .form .application > section .clear > label,
.recruit .selectjob .form .application > section .clear > label,
#recruit .form > section .clear > label,
.recruit .form > section .clear > label,
#recruit .container #inquiry form.inquiry > section .clear > label,
.recruit .container #inquiry form.inquiry > section .clear > label,
#contents.contact .inquiry > section .clear > label,
#contents.research .application > section .clear > label, #recruit .selectjob .form .application > section .clear > .label, .recruit .selectjob .form .application > section .clear > .label, #recruit .form > section .clear > .label, .recruit .form > section .clear > .label, #recruit .container #inquiry form.inquiry > section .clear > .label, .recruit .container #inquiry form.inquiry > section .clear > .label, #contents.contact .inquiry > section .clear > .label, #contents.research .application > section .clear > .label {
  position: relative;
  display: inline-block;
  color: #212121;
}
#recruit .selectjob .form .application > section > label.required::after, .recruit .selectjob .form .application > section > label.required::after, #recruit .form > section > label.required::after, .recruit .form > section > label.required::after, #recruit .container #inquiry form.inquiry > section > label.required::after, .recruit .container #inquiry form.inquiry > section > label.required::after, #contents.contact .inquiry > section > label.required::after, #contents.research .application > section > label.required::after, #recruit .selectjob .form .application > section > .label.required::after, .recruit .selectjob .form .application > section > .label.required::after, #recruit .form > section > .label.required::after, .recruit .form > section > .label.required::after, #recruit .container #inquiry form.inquiry > section > .label.required::after, .recruit .container #inquiry form.inquiry > section > .label.required::after, #contents.contact .inquiry > section > .label.required::after, #contents.research .application > section > .label.required::after,
#recruit .selectjob .form .application > section .half > label.required::after,
.recruit .selectjob .form .application > section .half > label.required::after,
#recruit .form > section .half > label.required::after,
.recruit .form > section .half > label.required::after,
#recruit .container #inquiry form.inquiry > section .half > label.required::after,
.recruit .container #inquiry form.inquiry > section .half > label.required::after,
#contents.contact .inquiry > section .half > label.required::after,
#contents.research .application > section .half > label.required::after, #recruit .selectjob .form .application > section .half > .label.required::after, .recruit .selectjob .form .application > section .half > .label.required::after, #recruit .form > section .half > .label.required::after, .recruit .form > section .half > .label.required::after, #recruit .container #inquiry form.inquiry > section .half > .label.required::after, .recruit .container #inquiry form.inquiry > section .half > .label.required::after, #contents.contact .inquiry > section .half > .label.required::after, #contents.research .application > section .half > .label.required::after,
#recruit .selectjob .form .application > section .clear > label.required::after,
.recruit .selectjob .form .application > section .clear > label.required::after,
#recruit .form > section .clear > label.required::after,
.recruit .form > section .clear > label.required::after,
#recruit .container #inquiry form.inquiry > section .clear > label.required::after,
.recruit .container #inquiry form.inquiry > section .clear > label.required::after,
#contents.contact .inquiry > section .clear > label.required::after,
#contents.research .application > section .clear > label.required::after, #recruit .selectjob .form .application > section .clear > .label.required::after, .recruit .selectjob .form .application > section .clear > .label.required::after, #recruit .form > section .clear > .label.required::after, .recruit .form > section .clear > .label.required::after, #recruit .container #inquiry form.inquiry > section .clear > .label.required::after, .recruit .container #inquiry form.inquiry > section .clear > .label.required::after, #contents.contact .inquiry > section .clear > .label.required::after, #contents.research .application > section .clear > .label.required::after {
  right: -17px;
}
#recruit .selectjob .form .application > section .input input:-moz-read-only, .recruit .selectjob .form .application > section .input input:-moz-read-only, #recruit .form > section .input input:-moz-read-only, .recruit .form > section .input input:-moz-read-only, #recruit .container #inquiry form.inquiry > section .input input:-moz-read-only, .recruit .container #inquiry form.inquiry > section .input input:-moz-read-only, #contents.contact .inquiry > section .input input:-moz-read-only, #contents.research .application > section .input input:-moz-read-only {
  border-color: #c8c8c8;
  background-color: #f9f9f9;
}
#recruit .selectjob .form .application > section .input input:disabled, .recruit .selectjob .form .application > section .input input:disabled, #recruit .form > section .input input:disabled, .recruit .form > section .input input:disabled, #recruit .container #inquiry form.inquiry > section .input input:disabled, .recruit .container #inquiry form.inquiry > section .input input:disabled, #contents.contact .inquiry > section .input input:disabled, #contents.research .application > section .input input:disabled,
#recruit .selectjob .form .application > section .input input:read-only,
.recruit .selectjob .form .application > section .input input:read-only,
#recruit .form > section .input input:read-only,
.recruit .form > section .input input:read-only,
#recruit .container #inquiry form.inquiry > section .input input:read-only,
.recruit .container #inquiry form.inquiry > section .input input:read-only,
#contents.contact .inquiry > section .input input:read-only,
#contents.research .application > section .input input:read-only {
  border-color: #c8c8c8;
  background-color: #f9f9f9;
}
#recruit .selectjob .form .application > section .input input.zoom, .recruit .selectjob .form .application > section .input input.zoom, #recruit .form > section .input input.zoom, .recruit .form > section .input input.zoom, #recruit .container #inquiry form.inquiry > section .input input.zoom, .recruit .container #inquiry form.inquiry > section .input input.zoom, #contents.contact .inquiry > section .input input.zoom, #contents.research .application > section .input input.zoom {
  background-color: #fff !important;
}
#recruit .selectjob .form .application > section .textarea textarea:-moz-read-only, .recruit .selectjob .form .application > section .textarea textarea:-moz-read-only, #recruit .form > section .textarea textarea:-moz-read-only, .recruit .form > section .textarea textarea:-moz-read-only, #recruit .container #inquiry form.inquiry > section .textarea textarea:-moz-read-only, .recruit .container #inquiry form.inquiry > section .textarea textarea:-moz-read-only, #contents.contact .inquiry > section .textarea textarea:-moz-read-only, #contents.research .application > section .textarea textarea:-moz-read-only {
  border-color: #c8c8c8;
  background-color: #f9f9f9;
}
#recruit .selectjob .form .application > section .textarea textarea:disabled, .recruit .selectjob .form .application > section .textarea textarea:disabled, #recruit .form > section .textarea textarea:disabled, .recruit .form > section .textarea textarea:disabled, #recruit .container #inquiry form.inquiry > section .textarea textarea:disabled, .recruit .container #inquiry form.inquiry > section .textarea textarea:disabled, #contents.contact .inquiry > section .textarea textarea:disabled, #contents.research .application > section .textarea textarea:disabled,
#recruit .selectjob .form .application > section .textarea textarea:read-only,
.recruit .selectjob .form .application > section .textarea textarea:read-only,
#recruit .form > section .textarea textarea:read-only,
.recruit .form > section .textarea textarea:read-only,
#recruit .container #inquiry form.inquiry > section .textarea textarea:read-only,
.recruit .container #inquiry form.inquiry > section .textarea textarea:read-only,
#contents.contact .inquiry > section .textarea textarea:read-only,
#contents.research .application > section .textarea textarea:read-only {
  border-color: #c8c8c8;
  background-color: #f9f9f9;
}
#recruit .selectjob .form .application > section div.textarea, .recruit .selectjob .form .application > section div.textarea, #recruit .form > section div.textarea, .recruit .form > section div.textarea, #recruit .container #inquiry form.inquiry > section div.textarea, .recruit .container #inquiry form.inquiry > section div.textarea, #contents.contact .inquiry > section div.textarea, #contents.research .application > section div.textarea {
  line-height: 1.35;
}
#recruit .selectjob .form .application > section .period, .recruit .selectjob .form .application > section .period, #recruit .form > section .period, .recruit .form > section .period, #recruit .container #inquiry form.inquiry > section .period, .recruit .container #inquiry form.inquiry > section .period, #contents.contact .inquiry > section .period, #contents.research .application > section .period {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .selectjob .form .application > section .period label, .recruit .selectjob .form .application > section .period label, #recruit .form > section .period label, .recruit .form > section .period label, #recruit .container #inquiry form.inquiry > section .period label, .recruit .container #inquiry form.inquiry > section .period label, #contents.contact .inquiry > section .period label, #contents.research .application > section .period label, #recruit .selectjob .form .application > section .period .label, .recruit .selectjob .form .application > section .period .label, #recruit .form > section .period .label, .recruit .form > section .period .label, #recruit .container #inquiry form.inquiry > section .period .label, .recruit .container #inquiry form.inquiry > section .period .label, #contents.contact .inquiry > section .period .label, #contents.research .application > section .period .label {
  width: 100%;
  text-align: left;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section .period .input, .recruit .selectjob .form .application > section .period .input, #recruit .form > section .period .input, .recruit .form > section .period .input, #recruit .container #inquiry form.inquiry > section .period .input, .recruit .container #inquiry form.inquiry > section .period .input, #contents.contact .inquiry > section .period .input, #contents.research .application > section .period .input {
    width: calc(50% - 15px);
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section .period .input, .recruit .selectjob .form .application > section .period .input, #recruit .form > section .period .input, .recruit .form > section .period .input, #recruit .container #inquiry form.inquiry > section .period .input, .recruit .container #inquiry form.inquiry > section .period .input, #contents.contact .inquiry > section .period .input, #contents.research .application > section .period .input {
    width: calc(50% - 10px);
  }
}
#recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span {
  text-align: center;
  color: #212121;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span {
    width: 30px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section .period span, .recruit .selectjob .form .application > section .period span, #recruit .form > section .period span, .recruit .form > section .period span, #recruit .container #inquiry form.inquiry > section .period span, .recruit .container #inquiry form.inquiry > section .period span, #contents.contact .inquiry > section .period span, #contents.research .application > section .period span {
    width: 20px;
  }
}
#recruit .selectjob .form .application > section .textarea p, .recruit .selectjob .form .application > section .textarea p, #recruit .form > section .textarea p, .recruit .form > section .textarea p, #recruit .container #inquiry form.inquiry > section .textarea p, .recruit .container #inquiry form.inquiry > section .textarea p, #contents.contact .inquiry > section .textarea p, #contents.research .application > section .textarea p {
  position: absolute;
  bottom: -30px;
  left: 0;
  width: 100%;
}
#recruit .selectjob .form .application > section .file > p, .recruit .selectjob .form .application > section .file > p, #recruit .form > section .file > p, .recruit .form > section .file > p, #recruit .container #inquiry form.inquiry > section .file > p, .recruit .container #inquiry form.inquiry > section .file > p, #contents.contact .inquiry > section .file > p, #contents.research .application > section .file > p {
  margin-top: 10px;
}
#recruit .selectjob .form .application > section .file > p::before, .recruit .selectjob .form .application > section .file > p::before, #recruit .form > section .file > p::before, .recruit .form > section .file > p::before, #recruit .container #inquiry form.inquiry > section .file > p::before, .recruit .container #inquiry form.inquiry > section .file > p::before, #contents.contact .inquiry > section .file > p::before, #contents.research .application > section .file > p::before {
  content: "※";
  padding-right: 4px;
  font-size: 14px;
  font-weight: 300;
}
#recruit .selectjob .form .application > section .selectBox, .recruit .selectjob .form .application > section .selectBox, #recruit .form > section .selectBox, .recruit .form > section .selectBox, #recruit .container #inquiry form.inquiry > section .selectBox, .recruit .container #inquiry form.inquiry > section .selectBox, #contents.contact .inquiry > section .selectBox, #contents.research .application > section .selectBox {
  position: relative;
}
#recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
}
#recruit .selectjob .form .application > section .selectBox > button::after, .recruit .selectjob .form .application > section .selectBox > button::after, #recruit .form > section .selectBox > button::after, .recruit .form > section .selectBox > button::after, #recruit .container #inquiry form.inquiry > section .selectBox > button::after, .recruit .container #inquiry form.inquiry > section .selectBox > button::after, #contents.contact .inquiry > section .selectBox > button::after, #contents.research .application > section .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
  right: 20px;
}
#recruit .selectjob .form .application > section .selectBox > button.placeholder, .recruit .selectjob .form .application > section .selectBox > button.placeholder, #recruit .form > section .selectBox > button.placeholder, .recruit .form > section .selectBox > button.placeholder, #recruit .container #inquiry form.inquiry > section .selectBox > button.placeholder, .recruit .container #inquiry form.inquiry > section .selectBox > button.placeholder, #contents.contact .inquiry > section .selectBox > button.placeholder, #contents.research .application > section .selectBox > button.placeholder {
  color: #a5a5a5;
}
#recruit .selectjob .form .application > section .selectBox > button.active, .recruit .selectjob .form .application > section .selectBox > button.active, #recruit .form > section .selectBox > button.active, .recruit .form > section .selectBox > button.active, #recruit .container #inquiry form.inquiry > section .selectBox > button.active, .recruit .container #inquiry form.inquiry > section .selectBox > button.active, #contents.contact .inquiry > section .selectBox > button.active, #contents.research .application > section .selectBox > button.active {
  color: #4415a0;
  border-color: #4415a0;
}
#recruit .selectjob .form .application > section .selectBox > button.active::after, .recruit .selectjob .form .application > section .selectBox > button.active::after, #recruit .form > section .selectBox > button.active::after, .recruit .form > section .selectBox > button.active::after, #recruit .container #inquiry form.inquiry > section .selectBox > button.active::after, .recruit .container #inquiry form.inquiry > section .selectBox > button.active::after, #contents.contact .inquiry > section .selectBox > button.active::after, #contents.research .application > section .selectBox > button.active::after {
  border-color: #4415a0;
}
#recruit .selectjob .form .application > section .selectBox > div, .recruit .selectjob .form .application > section .selectBox > div, #recruit .form > section .selectBox > div, .recruit .form > section .selectBox > div, #recruit .container #inquiry form.inquiry > section .selectBox > div, .recruit .container #inquiry form.inquiry > section .selectBox > div, #contents.contact .inquiry > section .selectBox > div, #contents.research .application > section .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#recruit .selectjob .form .application > section .selectBox > div::before, .recruit .selectjob .form .application > section .selectBox > div::before, #recruit .form > section .selectBox > div::before, .recruit .form > section .selectBox > div::before, #recruit .container #inquiry form.inquiry > section .selectBox > div::before, .recruit .container #inquiry form.inquiry > section .selectBox > div::before, #contents.contact .inquiry > section .selectBox > div::before, #contents.research .application > section .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
  display: none;
}
#recruit .selectjob .form .application > section .selectBox > div button, .recruit .selectjob .form .application > section .selectBox > div button, #recruit .form > section .selectBox > div button, .recruit .form > section .selectBox > div button, #recruit .container #inquiry form.inquiry > section .selectBox > div button, .recruit .container #inquiry form.inquiry > section .selectBox > div button, #contents.contact .inquiry > section .selectBox > div button, #contents.research .application > section .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
#recruit .selectjob .form .application > section .selectBox > div button.selected, .recruit .selectjob .form .application > section .selectBox > div button.selected, #recruit .form > section .selectBox > div button.selected, .recruit .form > section .selectBox > div button.selected, #recruit .container #inquiry form.inquiry > section .selectBox > div button.selected, .recruit .container #inquiry form.inquiry > section .selectBox > div button.selected, #contents.contact .inquiry > section .selectBox > div button.selected, #contents.research .application > section .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section .selectBox > div > button:first-child, .recruit .selectjob .form .application > section .selectBox > div > button:first-child, #recruit .form > section .selectBox > div > button:first-child, .recruit .form > section .selectBox > div > button:first-child, #recruit .container #inquiry form.inquiry > section .selectBox > div > button:first-child, .recruit .container #inquiry form.inquiry > section .selectBox > div > button:first-child, #contents.contact .inquiry > section .selectBox > div > button:first-child, #contents.research .application > section .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  #recruit .selectjob .form .application > section .selectBox > div > button:last-child, .recruit .selectjob .form .application > section .selectBox > div > button:last-child, #recruit .form > section .selectBox > div > button:last-child, .recruit .form > section .selectBox > div > button:last-child, #recruit .container #inquiry form.inquiry > section .selectBox > div > button:last-child, .recruit .container #inquiry form.inquiry > section .selectBox > div > button:last-child, #contents.contact .inquiry > section .selectBox > div > button:last-child, #contents.research .application > section .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button {
    height: 54px;
  }
  #recruit .selectjob .form .application > section .selectBox > button::after, .recruit .selectjob .form .application > section .selectBox > button::after, #recruit .form > section .selectBox > button::after, .recruit .form > section .selectBox > button::after, #recruit .container #inquiry form.inquiry > section .selectBox > button::after, .recruit .container #inquiry form.inquiry > section .selectBox > button::after, #contents.contact .inquiry > section .selectBox > button::after, #contents.research .application > section .selectBox > button::after {
    top: 20px;
  }
  #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button,
  #recruit .selectjob .form .application > section .selectBox > div button,
  .recruit .selectjob .form .application > section .selectBox > div button,
  #recruit .form > section .selectBox > div button,
  .recruit .form > section .selectBox > div button,
  #recruit .container #inquiry form.inquiry > section .selectBox > div button,
  .recruit .container #inquiry form.inquiry > section .selectBox > div button,
  #contents.contact .inquiry > section .selectBox > div button,
  #contents.research .application > section .selectBox > div button {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section .selectBox > div > button:first-child, .recruit .selectjob .form .application > section .selectBox > div > button:first-child, #recruit .form > section .selectBox > div > button:first-child, .recruit .form > section .selectBox > div > button:first-child, #recruit .container #inquiry form.inquiry > section .selectBox > div > button:first-child, .recruit .container #inquiry form.inquiry > section .selectBox > div > button:first-child, #contents.contact .inquiry > section .selectBox > div > button:first-child, #contents.research .application > section .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  #recruit .selectjob .form .application > section .selectBox > div > button:last-child, .recruit .selectjob .form .application > section .selectBox > div > button:last-child, #recruit .form > section .selectBox > div > button:last-child, .recruit .form > section .selectBox > div > button:last-child, #recruit .container #inquiry form.inquiry > section .selectBox > div > button:last-child, .recruit .container #inquiry form.inquiry > section .selectBox > div > button:last-child, #contents.contact .inquiry > section .selectBox > div > button:last-child, #contents.research .application > section .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
  #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button {
    height: 40px;
  }
  #recruit .selectjob .form .application > section .selectBox > button::after, .recruit .selectjob .form .application > section .selectBox > button::after, #recruit .form > section .selectBox > button::after, .recruit .form > section .selectBox > button::after, #recruit .container #inquiry form.inquiry > section .selectBox > button::after, .recruit .container #inquiry form.inquiry > section .selectBox > button::after, #contents.contact .inquiry > section .selectBox > button::after, #contents.research .application > section .selectBox > button::after {
    top: 10px;
  }
  #recruit .selectjob .form .application > section .selectBox > button, .recruit .selectjob .form .application > section .selectBox > button, #recruit .form > section .selectBox > button, .recruit .form > section .selectBox > button, #recruit .container #inquiry form.inquiry > section .selectBox > button, .recruit .container #inquiry form.inquiry > section .selectBox > button, #contents.contact .inquiry > section .selectBox > button, #contents.research .application > section .selectBox > button,
  #recruit .selectjob .form .application > section .selectBox > div button,
  .recruit .selectjob .form .application > section .selectBox > div button,
  #recruit .form > section .selectBox > div button,
  .recruit .form > section .selectBox > div button,
  #recruit .container #inquiry form.inquiry > section .selectBox > div button,
  .recruit .container #inquiry form.inquiry > section .selectBox > div button,
  #contents.contact .inquiry > section .selectBox > div button,
  #contents.research .application > section .selectBox > div button {
    padding-left: 15px;
    padding-right: 15px;
  }
}
#recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span,
#recruit .selectjob .form .application > section .phone span,
.recruit .selectjob .form .application > section .phone span,
#recruit .form > section .phone span,
.recruit .form > section .phone span,
#recruit .container #inquiry form.inquiry > section .phone span,
.recruit .container #inquiry form.inquiry > section .phone span,
#contents.contact .inquiry > section .phone span,
#contents.research .application > section .phone span {
  text-align: center;
  color: #212121;
}
#recruit .selectjob .form .application > section .phone, .recruit .selectjob .form .application > section .phone, #recruit .form > section .phone, .recruit .form > section .phone, #recruit .container #inquiry form.inquiry > section .phone, .recruit .container #inquiry form.inquiry > section .phone, #contents.contact .inquiry > section .phone, #contents.research .application > section .phone {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section {
  overflow: auto;
  border: 1px solid #c8c8c8;
}
#recruit .selectjob .form .application > section .terms > section h1, .recruit .selectjob .form .application > section .terms > section h1, #recruit .form > section .terms > section h1, .recruit .form > section .terms > section h1, #recruit .container #inquiry form.inquiry > section .terms > section h1, .recruit .container #inquiry form.inquiry > section .terms > section h1, #contents.contact .inquiry > section .terms > section h1, #contents.research .application > section .terms > section h1,
#recruit .selectjob .form .application > section .terms > section h2,
.recruit .selectjob .form .application > section .terms > section h2,
#recruit .form > section .terms > section h2,
.recruit .form > section .terms > section h2,
#recruit .container #inquiry form.inquiry > section .terms > section h2,
.recruit .container #inquiry form.inquiry > section .terms > section h2,
#contents.contact .inquiry > section .terms > section h2,
#contents.research .application > section .terms > section h2,
#recruit .selectjob .form .application > section .terms > section h3,
.recruit .selectjob .form .application > section .terms > section h3,
#recruit .form > section .terms > section h3,
.recruit .form > section .terms > section h3,
#recruit .container #inquiry form.inquiry > section .terms > section h3,
.recruit .container #inquiry form.inquiry > section .terms > section h3,
#contents.contact .inquiry > section .terms > section h3,
#contents.research .application > section .terms > section h3,
#recruit .selectjob .form .application > section .terms > section h4,
.recruit .selectjob .form .application > section .terms > section h4,
#recruit .form > section .terms > section h4,
.recruit .form > section .terms > section h4,
#recruit .container #inquiry form.inquiry > section .terms > section h4,
.recruit .container #inquiry form.inquiry > section .terms > section h4,
#contents.contact .inquiry > section .terms > section h4,
#contents.research .application > section .terms > section h4,
#recruit .selectjob .form .application > section .terms > section h5,
.recruit .selectjob .form .application > section .terms > section h5,
#recruit .form > section .terms > section h5,
.recruit .form > section .terms > section h5,
#recruit .container #inquiry form.inquiry > section .terms > section h5,
.recruit .container #inquiry form.inquiry > section .terms > section h5,
#contents.contact .inquiry > section .terms > section h5,
#contents.research .application > section .terms > section h5,
#recruit .selectjob .form .application > section .terms > section h6,
.recruit .selectjob .form .application > section .terms > section h6,
#recruit .form > section .terms > section h6,
.recruit .form > section .terms > section h6,
#recruit .container #inquiry form.inquiry > section .terms > section h6,
.recruit .container #inquiry form.inquiry > section .terms > section h6,
#contents.contact .inquiry > section .terms > section h6,
#contents.research .application > section .terms > section h6 {
  font-weight: 400;
  color: #212121;
}
#recruit .selectjob .form .application > section .terms > section h1:not(:first-child), .recruit .selectjob .form .application > section .terms > section h1:not(:first-child), #recruit .form > section .terms > section h1:not(:first-child), .recruit .form > section .terms > section h1:not(:first-child), #recruit .container #inquiry form.inquiry > section .terms > section h1:not(:first-child), .recruit .container #inquiry form.inquiry > section .terms > section h1:not(:first-child), #contents.contact .inquiry > section .terms > section h1:not(:first-child), #contents.research .application > section .terms > section h1:not(:first-child),
#recruit .selectjob .form .application > section .terms > section h2:not(:first-child),
.recruit .selectjob .form .application > section .terms > section h2:not(:first-child),
#recruit .form > section .terms > section h2:not(:first-child),
.recruit .form > section .terms > section h2:not(:first-child),
#recruit .container #inquiry form.inquiry > section .terms > section h2:not(:first-child),
.recruit .container #inquiry form.inquiry > section .terms > section h2:not(:first-child),
#contents.contact .inquiry > section .terms > section h2:not(:first-child),
#contents.research .application > section .terms > section h2:not(:first-child),
#recruit .selectjob .form .application > section .terms > section h3:not(:first-child),
.recruit .selectjob .form .application > section .terms > section h3:not(:first-child),
#recruit .form > section .terms > section h3:not(:first-child),
.recruit .form > section .terms > section h3:not(:first-child),
#recruit .container #inquiry form.inquiry > section .terms > section h3:not(:first-child),
.recruit .container #inquiry form.inquiry > section .terms > section h3:not(:first-child),
#contents.contact .inquiry > section .terms > section h3:not(:first-child),
#contents.research .application > section .terms > section h3:not(:first-child),
#recruit .selectjob .form .application > section .terms > section h4:not(:first-child),
.recruit .selectjob .form .application > section .terms > section h4:not(:first-child),
#recruit .form > section .terms > section h4:not(:first-child),
.recruit .form > section .terms > section h4:not(:first-child),
#recruit .container #inquiry form.inquiry > section .terms > section h4:not(:first-child),
.recruit .container #inquiry form.inquiry > section .terms > section h4:not(:first-child),
#contents.contact .inquiry > section .terms > section h4:not(:first-child),
#contents.research .application > section .terms > section h4:not(:first-child),
#recruit .selectjob .form .application > section .terms > section h5:not(:first-child),
.recruit .selectjob .form .application > section .terms > section h5:not(:first-child),
#recruit .form > section .terms > section h5:not(:first-child),
.recruit .form > section .terms > section h5:not(:first-child),
#recruit .container #inquiry form.inquiry > section .terms > section h5:not(:first-child),
.recruit .container #inquiry form.inquiry > section .terms > section h5:not(:first-child),
#contents.contact .inquiry > section .terms > section h5:not(:first-child),
#contents.research .application > section .terms > section h5:not(:first-child),
#recruit .selectjob .form .application > section .terms > section h6:not(:first-child),
.recruit .selectjob .form .application > section .terms > section h6:not(:first-child),
#recruit .form > section .terms > section h6:not(:first-child),
.recruit .form > section .terms > section h6:not(:first-child),
#recruit .container #inquiry form.inquiry > section .terms > section h6:not(:first-child),
.recruit .container #inquiry form.inquiry > section .terms > section h6:not(:first-child),
#contents.contact .inquiry > section .terms > section h6:not(:first-child),
#contents.research .application > section .terms > section h6:not(:first-child) {
  margin-top: 20px;
}
#recruit .selectjob .form .application > section .terms > section h1 + *, .recruit .selectjob .form .application > section .terms > section h1 + *, #recruit .form > section .terms > section h1 + *, .recruit .form > section .terms > section h1 + *, #recruit .container #inquiry form.inquiry > section .terms > section h1 + *, .recruit .container #inquiry form.inquiry > section .terms > section h1 + *, #contents.contact .inquiry > section .terms > section h1 + *, #contents.research .application > section .terms > section h1 + *,
#recruit .selectjob .form .application > section .terms > section h2 + *,
.recruit .selectjob .form .application > section .terms > section h2 + *,
#recruit .form > section .terms > section h2 + *,
.recruit .form > section .terms > section h2 + *,
#recruit .container #inquiry form.inquiry > section .terms > section h2 + *,
.recruit .container #inquiry form.inquiry > section .terms > section h2 + *,
#contents.contact .inquiry > section .terms > section h2 + *,
#contents.research .application > section .terms > section h2 + *,
#recruit .selectjob .form .application > section .terms > section h3 + *,
.recruit .selectjob .form .application > section .terms > section h3 + *,
#recruit .form > section .terms > section h3 + *,
.recruit .form > section .terms > section h3 + *,
#recruit .container #inquiry form.inquiry > section .terms > section h3 + *,
.recruit .container #inquiry form.inquiry > section .terms > section h3 + *,
#contents.contact .inquiry > section .terms > section h3 + *,
#contents.research .application > section .terms > section h3 + *,
#recruit .selectjob .form .application > section .terms > section h4 + *,
.recruit .selectjob .form .application > section .terms > section h4 + *,
#recruit .form > section .terms > section h4 + *,
.recruit .form > section .terms > section h4 + *,
#recruit .container #inquiry form.inquiry > section .terms > section h4 + *,
.recruit .container #inquiry form.inquiry > section .terms > section h4 + *,
#contents.contact .inquiry > section .terms > section h4 + *,
#contents.research .application > section .terms > section h4 + *,
#recruit .selectjob .form .application > section .terms > section h5 + *,
.recruit .selectjob .form .application > section .terms > section h5 + *,
#recruit .form > section .terms > section h5 + *,
.recruit .form > section .terms > section h5 + *,
#recruit .container #inquiry form.inquiry > section .terms > section h5 + *,
.recruit .container #inquiry form.inquiry > section .terms > section h5 + *,
#contents.contact .inquiry > section .terms > section h5 + *,
#contents.research .application > section .terms > section h5 + *,
#recruit .selectjob .form .application > section .terms > section h6 + *,
.recruit .selectjob .form .application > section .terms > section h6 + *,
#recruit .form > section .terms > section h6 + *,
.recruit .form > section .terms > section h6 + *,
#recruit .container #inquiry form.inquiry > section .terms > section h6 + *,
.recruit .container #inquiry form.inquiry > section .terms > section h6 + *,
#contents.contact .inquiry > section .terms > section h6 + *,
#contents.research .application > section .terms > section h6 + * {
  margin-top: 13px;
}
#recruit .selectjob .form .application > section .terms > section p + ul, .recruit .selectjob .form .application > section .terms > section p + ul, #recruit .form > section .terms > section p + ul, .recruit .form > section .terms > section p + ul, #recruit .container #inquiry form.inquiry > section .terms > section p + ul, .recruit .container #inquiry form.inquiry > section .terms > section p + ul, #contents.contact .inquiry > section .terms > section p + ul, #contents.research .application > section .terms > section p + ul, #recruit .selectjob .form .application > section .terms > section p + ol, .recruit .selectjob .form .application > section .terms > section p + ol, #recruit .form > section .terms > section p + ol, .recruit .form > section .terms > section p + ol, #recruit .container #inquiry form.inquiry > section .terms > section p + ol, .recruit .container #inquiry form.inquiry > section .terms > section p + ol, #contents.contact .inquiry > section .terms > section p + ol, #contents.research .application > section .terms > section p + ol, #recruit .selectjob .form .application > section .terms > section p + p, .recruit .selectjob .form .application > section .terms > section p + p, #recruit .form > section .terms > section p + p, .recruit .form > section .terms > section p + p, #recruit .container #inquiry form.inquiry > section .terms > section p + p, .recruit .container #inquiry form.inquiry > section .terms > section p + p, #contents.contact .inquiry > section .terms > section p + p, #contents.research .application > section .terms > section p + p, #recruit .selectjob .form .application > section .terms > section .tableWrapper, .recruit .selectjob .form .application > section .terms > section .tableWrapper, #recruit .form > section .terms > section .tableWrapper, .recruit .form > section .terms > section .tableWrapper, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, #contents.contact .inquiry > section .terms > section .tableWrapper, #contents.research .application > section .terms > section .tableWrapper, #recruit .selectjob .form .application > section .terms > section .tableWrapper + p, .recruit .selectjob .form .application > section .terms > section .tableWrapper + p, #recruit .form > section .terms > section .tableWrapper + p, .recruit .form > section .terms > section .tableWrapper + p, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper + p, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper + p, #contents.contact .inquiry > section .terms > section .tableWrapper + p, #contents.research .application > section .terms > section .tableWrapper + p {
  margin-top: 10px;
}
#recruit .selectjob .form .application > section .terms > section p, .recruit .selectjob .form .application > section .terms > section p, #recruit .form > section .terms > section p, .recruit .form > section .terms > section p, #recruit .container #inquiry form.inquiry > section .terms > section p, .recruit .container #inquiry form.inquiry > section .terms > section p, #contents.contact .inquiry > section .terms > section p, #contents.research .application > section .terms > section p, #recruit .selectjob .form .application > section .terms > section ul, .recruit .selectjob .form .application > section .terms > section ul, #recruit .form > section .terms > section ul, .recruit .form > section .terms > section ul, #recruit .container #inquiry form.inquiry > section .terms > section ul, .recruit .container #inquiry form.inquiry > section .terms > section ul, #contents.contact .inquiry > section .terms > section ul, #contents.research .application > section .terms > section ul, #recruit .selectjob .form .application > section .terms > section ol, .recruit .selectjob .form .application > section .terms > section ol, #recruit .form > section .terms > section ol, .recruit .form > section .terms > section ol, #recruit .container #inquiry form.inquiry > section .terms > section ol, .recruit .container #inquiry form.inquiry > section .terms > section ol, #contents.contact .inquiry > section .terms > section ol, #contents.research .application > section .terms > section ol, #recruit .selectjob .form .application > section .terms > section .tableWrapper, .recruit .selectjob .form .application > section .terms > section .tableWrapper, #recruit .form > section .terms > section .tableWrapper, .recruit .form > section .terms > section .tableWrapper, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, #contents.contact .inquiry > section .terms > section .tableWrapper, #contents.research .application > section .terms > section .tableWrapper {
  font-weight: 300;
}
#recruit .selectjob .form .application > section .terms > section .listDash > li, .recruit .selectjob .form .application > section .terms > section .listDash > li, #recruit .form > section .terms > section .listDash > li, .recruit .form > section .terms > section .listDash > li, #recruit .container #inquiry form.inquiry > section .terms > section .listDash > li, .recruit .container #inquiry form.inquiry > section .terms > section .listDash > li, #contents.contact .inquiry > section .terms > section .listDash > li, #contents.research .application > section .terms > section .listDash > li, #recruit .selectjob .form .application > section .terms > section p.dash, .recruit .selectjob .form .application > section .terms > section p.dash, #recruit .form > section .terms > section p.dash, .recruit .form > section .terms > section p.dash, #recruit .container #inquiry form.inquiry > section .terms > section p.dash, .recruit .container #inquiry form.inquiry > section .terms > section p.dash, #contents.contact .inquiry > section .terms > section p.dash, #contents.research .application > section .terms > section p.dash {
  position: relative;
  padding-left: 0.7em;
}
#recruit .selectjob .form .application > section .terms > section .listDash > li::before, .recruit .selectjob .form .application > section .terms > section .listDash > li::before, #recruit .form > section .terms > section .listDash > li::before, .recruit .form > section .terms > section .listDash > li::before, #recruit .container #inquiry form.inquiry > section .terms > section .listDash > li::before, .recruit .container #inquiry form.inquiry > section .terms > section .listDash > li::before, #contents.contact .inquiry > section .terms > section .listDash > li::before, #contents.research .application > section .terms > section .listDash > li::before, #recruit .selectjob .form .application > section .terms > section p.dash::before, .recruit .selectjob .form .application > section .terms > section p.dash::before, #recruit .form > section .terms > section p.dash::before, .recruit .form > section .terms > section p.dash::before, #recruit .container #inquiry form.inquiry > section .terms > section p.dash::before, .recruit .container #inquiry form.inquiry > section .terms > section p.dash::before, #contents.contact .inquiry > section .terms > section p.dash::before, #contents.research .application > section .terms > section p.dash::before {
  content: "-";
  position: absolute;
  left: 0;
  width: 1.2em;
}
#recruit .selectjob .form .application > section .terms > section .listDot > li, .recruit .selectjob .form .application > section .terms > section .listDot > li, #recruit .form > section .terms > section .listDot > li, .recruit .form > section .terms > section .listDot > li, #recruit .container #inquiry form.inquiry > section .terms > section .listDot > li, .recruit .container #inquiry form.inquiry > section .terms > section .listDot > li, #contents.contact .inquiry > section .terms > section .listDot > li, #contents.research .application > section .terms > section .listDot > li {
  position: relative;
  padding-left: 0.7em;
}
#recruit .selectjob .form .application > section .terms > section .listDot > li::before, .recruit .selectjob .form .application > section .terms > section .listDot > li::before, #recruit .form > section .terms > section .listDot > li::before, .recruit .form > section .terms > section .listDot > li::before, #recruit .container #inquiry form.inquiry > section .terms > section .listDot > li::before, .recruit .container #inquiry form.inquiry > section .terms > section .listDot > li::before, #contents.contact .inquiry > section .terms > section .listDot > li::before, #contents.research .application > section .terms > section .listDot > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.75em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #666;
}
#recruit .selectjob .form .application > section .terms > section .tableWrapper, .recruit .selectjob .form .application > section .terms > section .tableWrapper, #recruit .form > section .terms > section .tableWrapper, .recruit .form > section .terms > section .tableWrapper, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper, #contents.contact .inquiry > section .terms > section .tableWrapper, #contents.research .application > section .terms > section .tableWrapper {
  overflow-x: auto;
}
#recruit .selectjob .form .application > section .terms > section .tableWrapper table, .recruit .selectjob .form .application > section .terms > section .tableWrapper table, #recruit .form > section .terms > section .tableWrapper table, .recruit .form > section .terms > section .tableWrapper table, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table, #contents.contact .inquiry > section .terms > section .tableWrapper table, #contents.research .application > section .terms > section .tableWrapper table {
  table-layout: fixed;
  width: 100%;
  border-top: 2px solid #212121;
}
#recruit .selectjob .form .application > section .terms > section .tableWrapper table th, .recruit .selectjob .form .application > section .terms > section .tableWrapper table th, #recruit .form > section .terms > section .tableWrapper table th, .recruit .form > section .terms > section .tableWrapper table th, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th, #contents.contact .inquiry > section .terms > section .tableWrapper table th, #contents.research .application > section .terms > section .tableWrapper table th {
  background: #f6f6f6;
  font-weight: 400;
  color: #212121;
}
#recruit .selectjob .form .application > section .terms > section .tableWrapper table th, .recruit .selectjob .form .application > section .terms > section .tableWrapper table th, #recruit .form > section .terms > section .tableWrapper table th, .recruit .form > section .terms > section .tableWrapper table th, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th, #contents.contact .inquiry > section .terms > section .tableWrapper table th, #contents.research .application > section .terms > section .tableWrapper table th, #recruit .selectjob .form .application > section .terms > section .tableWrapper table td, .recruit .selectjob .form .application > section .terms > section .tableWrapper table td, #recruit .form > section .terms > section .tableWrapper table td, .recruit .form > section .terms > section .tableWrapper table td, #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table td, .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table td, #contents.contact .inquiry > section .terms > section .tableWrapper table td, #contents.research .application > section .terms > section .tableWrapper table td {
  padding: 5px 10px;
  border-bottom: 1px solid #c8c8c8;
}
#recruit .selectjob .form .application > section .terms > section .tableWrapper table th:not(:first-child), .recruit .selectjob .form .application > section .terms > section .tableWrapper table th:not(:first-child), #recruit .form > section .terms > section .tableWrapper table th:not(:first-child), .recruit .form > section .terms > section .tableWrapper table th:not(:first-child), #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th:not(:first-child), .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table th:not(:first-child), #contents.contact .inquiry > section .terms > section .tableWrapper table th:not(:first-child), #contents.research .application > section .terms > section .tableWrapper table th:not(:first-child), #recruit .selectjob .form .application > section .terms > section .tableWrapper table td:not(:first-child), .recruit .selectjob .form .application > section .terms > section .tableWrapper table td:not(:first-child), #recruit .form > section .terms > section .tableWrapper table td:not(:first-child), .recruit .form > section .terms > section .tableWrapper table td:not(:first-child), #recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table td:not(:first-child), .recruit .container #inquiry form.inquiry > section .terms > section .tableWrapper table td:not(:first-child), #contents.contact .inquiry > section .terms > section .tableWrapper table td:not(:first-child), #contents.research .application > section .terms > section .tableWrapper table td:not(:first-child) {
  border-left: 1px solid #c8c8c8;
}
#recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#recruit .selectjob .form .application > section .terms > p::before, .recruit .selectjob .form .application > section .terms > p::before, #recruit .form > section .terms > p::before, .recruit .form > section .terms > p::before, #recruit .container #inquiry form.inquiry > section .terms > p::before, .recruit .container #inquiry form.inquiry > section .terms > p::before, #contents.contact .inquiry > section .terms > p::before, #contents.research .application > section .terms > p::before {
  content: "※";
  padding-right: 4px;
  font-size: 14px;
  font-weight: 300;
}
#recruit .selectjob .form .application > section .terms label, .recruit .selectjob .form .application > section .terms label, #recruit .form > section .terms label, .recruit .form > section .terms label, #recruit .container #inquiry form.inquiry > section .terms label, .recruit .container #inquiry form.inquiry > section .terms label, #contents.contact .inquiry > section .terms label, #contents.research .application > section .terms label {
  margin-top: 20px;
}
@media (min-width: 641px) {
  #recruit .selectjob .form .application > section .half, .recruit .selectjob .form .application > section .half, #recruit .form > section .half, .recruit .form > section .half, #recruit .container #inquiry form.inquiry > section .half, .recruit .container #inquiry form.inquiry > section .half, #contents.contact .inquiry > section .half, #contents.research .application > section .half {
    float: left;
    width: calc(50% - 5px);
  }
  #recruit .selectjob .form .application > section .half:nth-of-type(even), .recruit .selectjob .form .application > section .half:nth-of-type(even), #recruit .form > section .half:nth-of-type(even), .recruit .form > section .half:nth-of-type(even), #recruit .container #inquiry form.inquiry > section .half:nth-of-type(even), .recruit .container #inquiry form.inquiry > section .half:nth-of-type(even), #contents.contact .inquiry > section .half:nth-of-type(even), #contents.research .application > section .half:nth-of-type(even), #recruit .selectjob .form .application > section .half.caseEven, .recruit .selectjob .form .application > section .half.caseEven, #recruit .form > section .half.caseEven, .recruit .form > section .half.caseEven, #recruit .container #inquiry form.inquiry > section .half.caseEven, .recruit .container #inquiry form.inquiry > section .half.caseEven, #contents.contact .inquiry > section .half.caseEven, #contents.research .application > section .half.caseEven {
    margin-left: 10px;
  }
  #recruit .selectjob .form .application > section .half.caseOdd, .recruit .selectjob .form .application > section .half.caseOdd, #recruit .form > section .half.caseOdd, .recruit .form > section .half.caseOdd, #recruit .container #inquiry form.inquiry > section .half.caseOdd, .recruit .container #inquiry form.inquiry > section .half.caseOdd, #contents.contact .inquiry > section .half.caseOdd, #contents.research .application > section .half.caseOdd {
    margin-left: 0 !important;
  }
  #recruit .selectjob .form .application > section .half + label, .recruit .selectjob .form .application > section .half + label, #recruit .form > section .half + label, .recruit .form > section .half + label, #recruit .container #inquiry form.inquiry > section .half + label, .recruit .container #inquiry form.inquiry > section .half + label, #contents.contact .inquiry > section .half + label, #contents.research .application > section .half + label {
    clear: both;
  }
}
#recruit .selectjob .form .application > footer, .recruit .selectjob .form .application > footer, #recruit .form > footer, .recruit .form > footer, #recruit .container #inquiry form.inquiry > footer, .recruit .container #inquiry form.inquiry > footer, #contents.contact .inquiry > footer, #contents.research .application > footer {
  text-align: center;
}
#recruit .selectjob .form .application > footer button, .recruit .selectjob .form .application > footer button, #recruit .form > footer button, .recruit .form > footer button, #recruit .container #inquiry form.inquiry > footer button, .recruit .container #inquiry form.inquiry > footer button, #contents.contact .inquiry > footer button, #contents.research .application > footer button {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#recruit .selectjob .form .application > footer button::before, .recruit .selectjob .form .application > footer button::before, #recruit .form > footer button::before, .recruit .form > footer button::before, #recruit .container #inquiry form.inquiry > footer button::before, .recruit .container #inquiry form.inquiry > footer button::before, #contents.contact .inquiry > footer button::before, #contents.research .application > footer button::before, #recruit .selectjob .form .application > footer button::after, .recruit .selectjob .form .application > footer button::after, #recruit .form > footer button::after, .recruit .form > footer button::after, #recruit .container #inquiry form.inquiry > footer button::after, .recruit .container #inquiry form.inquiry > footer button::after, #contents.contact .inquiry > footer button::after, #contents.research .application > footer button::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#recruit .selectjob .form .application > footer button:not(:disabled):hover, .recruit .selectjob .form .application > footer button:not(:disabled):hover, #recruit .form > footer button:not(:disabled):hover, .recruit .form > footer button:not(:disabled):hover, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover, #contents.contact .inquiry > footer button:not(:disabled):hover, #contents.research .application > footer button:not(:disabled):hover, #recruit .selectjob .form .application > footer button:not(:disabled):focus, .recruit .selectjob .form .application > footer button:not(:disabled):focus, #recruit .form > footer button:not(:disabled):focus, .recruit .form > footer button:not(:disabled):focus, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus, #contents.contact .inquiry > footer button:not(:disabled):focus, #contents.research .application > footer button:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#recruit .selectjob .form .application > footer button:not(:disabled):hover::before, .recruit .selectjob .form .application > footer button:not(:disabled):hover::before, #recruit .form > footer button:not(:disabled):hover::before, .recruit .form > footer button:not(:disabled):hover::before, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover::before, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover::before, #contents.contact .inquiry > footer button:not(:disabled):hover::before, #contents.research .application > footer button:not(:disabled):hover::before, #recruit .selectjob .form .application > footer button:not(:disabled):hover::after, .recruit .selectjob .form .application > footer button:not(:disabled):hover::after, #recruit .form > footer button:not(:disabled):hover::after, .recruit .form > footer button:not(:disabled):hover::after, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover::after, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):hover::after, #contents.contact .inquiry > footer button:not(:disabled):hover::after, #contents.research .application > footer button:not(:disabled):hover::after, #recruit .selectjob .form .application > footer button:not(:disabled):focus::before, .recruit .selectjob .form .application > footer button:not(:disabled):focus::before, #recruit .form > footer button:not(:disabled):focus::before, .recruit .form > footer button:not(:disabled):focus::before, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus::before, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus::before, #contents.contact .inquiry > footer button:not(:disabled):focus::before, #contents.research .application > footer button:not(:disabled):focus::before, #recruit .selectjob .form .application > footer button:not(:disabled):focus::after, .recruit .selectjob .form .application > footer button:not(:disabled):focus::after, #recruit .form > footer button:not(:disabled):focus::after, .recruit .form > footer button:not(:disabled):focus::after, #recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus::after, .recruit .container #inquiry form.inquiry > footer button:not(:disabled):focus::after, #contents.contact .inquiry > footer button:not(:disabled):focus::after, #contents.research .application > footer button:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > footer button, .recruit .selectjob .form .application > footer button, #recruit .form > footer button, .recruit .form > footer button, #recruit .container #inquiry form.inquiry > footer button, .recruit .container #inquiry form.inquiry > footer button, #contents.contact .inquiry > footer button, #contents.research .application > footer button {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #recruit .selectjob .form .application > footer button::before, .recruit .selectjob .form .application > footer button::before, #recruit .form > footer button::before, .recruit .form > footer button::before, #recruit .container #inquiry form.inquiry > footer button::before, .recruit .container #inquiry form.inquiry > footer button::before, #contents.contact .inquiry > footer button::before, #contents.research .application > footer button::before {
    margin-right: 10px;
  }
  #recruit .selectjob .form .application > footer button::after, .recruit .selectjob .form .application > footer button::after, #recruit .form > footer button::after, .recruit .form > footer button::after, #recruit .container #inquiry form.inquiry > footer button::after, .recruit .container #inquiry form.inquiry > footer button::after, #contents.contact .inquiry > footer button::after, #contents.research .application > footer button::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > footer button, .recruit .selectjob .form .application > footer button, #recruit .form > footer button, .recruit .form > footer button, #recruit .container #inquiry form.inquiry > footer button, .recruit .container #inquiry form.inquiry > footer button, #contents.contact .inquiry > footer button, #contents.research .application > footer button {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #recruit .selectjob .form .application > footer button::before, .recruit .selectjob .form .application > footer button::before, #recruit .form > footer button::before, .recruit .form > footer button::before, #recruit .container #inquiry form.inquiry > footer button::before, .recruit .container #inquiry form.inquiry > footer button::before, #contents.contact .inquiry > footer button::before, #contents.research .application > footer button::before {
    margin-right: 14px;
  }
  #recruit .selectjob .form .application > footer button::after, .recruit .selectjob .form .application > footer button::after, #recruit .form > footer button::after, .recruit .form > footer button::after, #recruit .container #inquiry form.inquiry > footer button::after, .recruit .container #inquiry form.inquiry > footer button::after, #contents.contact .inquiry > footer button::after, #contents.research .application > footer button::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > footer button.caseWide, .recruit .selectjob .form .application > footer button.caseWide, #recruit .form > footer button.caseWide, .recruit .form > footer button.caseWide, #recruit .container #inquiry form.inquiry > footer button.caseWide, .recruit .container #inquiry form.inquiry > footer button.caseWide, #contents.contact .inquiry > footer button.caseWide, #contents.research .application > footer button.caseWide {
    width: 256px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > footer button.caseWide, .recruit .selectjob .form .application > footer button.caseWide, #recruit .form > footer button.caseWide, .recruit .form > footer button.caseWide, #recruit .container #inquiry form.inquiry > footer button.caseWide, .recruit .container #inquiry form.inquiry > footer button.caseWide, #contents.contact .inquiry > footer button.caseWide, #contents.research .application > footer button.caseWide {
    width: 180px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section, .recruit .selectjob .form .application > section, #recruit .form > section, .recruit .form > section, #recruit .container #inquiry form.inquiry > section, .recruit .container #inquiry form.inquiry > section, #contents.contact .inquiry > section, #contents.research .application > section {
    position: relative;
    padding-left: 318px;
    padding-bottom: 80px;
  }
  #recruit .selectjob .form .application > section > header, .recruit .selectjob .form .application > section > header, #recruit .form > section > header, .recruit .form > section > header, #recruit .container #inquiry form.inquiry > section > header, .recruit .container #inquiry form.inquiry > section > header, #contents.contact .inquiry > section > header, #contents.research .application > section > header,
  #recruit .selectjob .form .application > section > h1,
  .recruit .selectjob .form .application > section > h1,
  #recruit .form > section > h1,
  .recruit .form > section > h1,
  #recruit .container #inquiry form.inquiry > section > h1,
  .recruit .container #inquiry form.inquiry > section > h1,
  #contents.contact .inquiry > section > h1,
  #contents.research .application > section > h1 {
    position: absolute;
    left: 0;
    top: 0;
  }
  #recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p,
  #recruit .selectjob .form .application > section > h1 p,
  .recruit .selectjob .form .application > section > h1 p,
  #recruit .form > section > h1 p,
  .recruit .form > section > h1 p,
  #recruit .container #inquiry form.inquiry > section > h1 p,
  .recruit .container #inquiry form.inquiry > section > h1 p,
  #contents.contact .inquiry > section > h1 p,
  #contents.research .application > section > h1 p {
    margin-top: 15px;
  }
  #recruit .selectjob .form .application > section + section, .recruit .selectjob .form .application > section + section, #recruit .form > section + section, .recruit .form > section + section, #recruit .container #inquiry form.inquiry > section + section, .recruit .container #inquiry form.inquiry > section + section, #contents.contact .inquiry > section + section, #contents.research .application > section + section {
    margin-top: 80px;
  }
  #recruit .selectjob .form .application > section label, .recruit .selectjob .form .application > section label, #recruit .form > section label, .recruit .form > section label, #recruit .container #inquiry form.inquiry > section label, .recruit .container #inquiry form.inquiry > section label, #contents.contact .inquiry > section label, #contents.research .application > section label, #recruit .selectjob .form .application > section .label, .recruit .selectjob .form .application > section .label, #recruit .form > section .label, .recruit .form > section .label, #recruit .container #inquiry form.inquiry > section .label, .recruit .container #inquiry form.inquiry > section .label, #contents.contact .inquiry > section .label, #contents.research .application > section .label {
    margin-bottom: 8px;
  }
  #recruit .selectjob .form .application > section > *:not(header):not(h1) + label, .recruit .selectjob .form .application > section > *:not(header):not(h1) + label, #recruit .form > section > *:not(header):not(h1) + label, .recruit .form > section > *:not(header):not(h1) + label, #recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + label, .recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + label, #contents.contact .inquiry > section > *:not(header):not(h1) + label, #contents.research .application > section > *:not(header):not(h1) + label,
  #recruit .selectjob .form .application > section .half:not(:first-of-type),
  .recruit .selectjob .form .application > section .half:not(:first-of-type),
  #recruit .form > section .half:not(:first-of-type),
  .recruit .form > section .half:not(:first-of-type),
  #recruit .container #inquiry form.inquiry > section .half:not(:first-of-type),
  .recruit .container #inquiry form.inquiry > section .half:not(:first-of-type),
  #contents.contact .inquiry > section .half:not(:first-of-type),
  #contents.research .application > section .half:not(:first-of-type),
  #recruit .selectjob .form .application > section > *:not(header):not(h1) + .label,
  .recruit .selectjob .form .application > section > *:not(header):not(h1) + .label,
  #recruit .form > section > *:not(header):not(h1) + .label,
  .recruit .form > section > *:not(header):not(h1) + .label,
  #recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + .label,
  .recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + .label,
  #contents.contact .inquiry > section > *:not(header):not(h1) + .label,
  #contents.research .application > section > *:not(header):not(h1) + .label {
    margin-top: 42px;
  }
  #recruit .selectjob .form .application > section .half:first-of-type + .half, .recruit .selectjob .form .application > section .half:first-of-type + .half, #recruit .form > section .half:first-of-type + .half, .recruit .form > section .half:first-of-type + .half, #recruit .container #inquiry form.inquiry > section .half:first-of-type + .half, .recruit .container #inquiry form.inquiry > section .half:first-of-type + .half, #contents.contact .inquiry > section .half:first-of-type + .half, #contents.research .application > section .half:first-of-type + .half {
    margin-top: 0;
  }
  #recruit .selectjob .form .application > section .email, .recruit .selectjob .form .application > section .email, #recruit .form > section .email, .recruit .form > section .email, #recruit .container #inquiry form.inquiry > section .email, .recruit .container #inquiry form.inquiry > section .email, #contents.contact .inquiry > section .email, #contents.research .application > section .email {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #recruit .selectjob .form .application > section .email > :not(span), .recruit .selectjob .form .application > section .email > :not(span), #recruit .form > section .email > :not(span), .recruit .form > section .email > :not(span), #recruit .container #inquiry form.inquiry > section .email > :not(span), .recruit .container #inquiry form.inquiry > section .email > :not(span), #contents.contact .inquiry > section .email > :not(span), #contents.research .application > section .email > :not(span) {
    width: calc(33.3333333333% - 16px);
  }
  #recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span {
    width: 16px;
  }
  #recruit .selectjob .form .application > section .phone .input, .recruit .selectjob .form .application > section .phone .input, #recruit .form > section .phone .input, .recruit .form > section .phone .input, #recruit .container #inquiry form.inquiry > section .phone .input, .recruit .container #inquiry form.inquiry > section .phone .input, #contents.contact .inquiry > section .phone .input, #contents.research .application > section .phone .input {
    width: calc(33.3333333333% - 18px);
  }
  #recruit .selectjob .form .application > section .phone span, .recruit .selectjob .form .application > section .phone span, #recruit .form > section .phone span, .recruit .form > section .phone span, #recruit .container #inquiry form.inquiry > section .phone span, .recruit .container #inquiry form.inquiry > section .phone span, #contents.contact .inquiry > section .phone span, #contents.research .application > section .phone span {
    width: 27px;
  }
  #recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section {
    height: 300px;
    padding: 15px 20px;
  }
  #recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p {
    margin-top: 20px;
  }
  #recruit .selectjob .form .application > footer, .recruit .selectjob .form .application > footer, #recruit .form > footer, .recruit .form > footer, #recruit .container #inquiry form.inquiry > footer, .recruit .container #inquiry form.inquiry > footer, #contents.contact .inquiry > footer, #contents.research .application > footer {
    margin-top: 80px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section, .recruit .selectjob .form .application > section, #recruit .form > section, .recruit .form > section, #recruit .container #inquiry form.inquiry > section, .recruit .container #inquiry form.inquiry > section, #contents.contact .inquiry > section, #contents.research .application > section {
    padding-bottom: 40px;
  }
  #recruit .selectjob .form .application > section > header, .recruit .selectjob .form .application > section > header, #recruit .form > section > header, .recruit .form > section > header, #recruit .container #inquiry form.inquiry > section > header, .recruit .container #inquiry form.inquiry > section > header, #contents.contact .inquiry > section > header, #contents.research .application > section > header,
  #recruit .selectjob .form .application > section > h1,
  .recruit .selectjob .form .application > section > h1,
  #recruit .form > section > h1,
  .recruit .form > section > h1,
  #recruit .container #inquiry form.inquiry > section > h1,
  .recruit .container #inquiry form.inquiry > section > h1,
  #contents.contact .inquiry > section > h1,
  #contents.research .application > section > h1 {
    margin-bottom: 32px;
  }
  #recruit .selectjob .form .application > section > header p, .recruit .selectjob .form .application > section > header p, #recruit .form > section > header p, .recruit .form > section > header p, #recruit .container #inquiry form.inquiry > section > header p, .recruit .container #inquiry form.inquiry > section > header p, #contents.contact .inquiry > section > header p, #contents.research .application > section > header p,
  #recruit .selectjob .form .application > section > h1 p,
  .recruit .selectjob .form .application > section > h1 p,
  #recruit .form > section > h1 p,
  .recruit .form > section > h1 p,
  #recruit .container #inquiry form.inquiry > section > h1 p,
  .recruit .container #inquiry form.inquiry > section > h1 p,
  #contents.contact .inquiry > section > h1 p,
  #contents.research .application > section > h1 p {
    margin-top: 15px;
  }
  #recruit .selectjob .form .application > section h1 br, .recruit .selectjob .form .application > section h1 br, #recruit .form > section h1 br, .recruit .form > section h1 br, #recruit .container #inquiry form.inquiry > section h1 br, .recruit .container #inquiry form.inquiry > section h1 br, #contents.contact .inquiry > section h1 br, #contents.research .application > section h1 br {
    display: none;
  }
  #recruit .selectjob .form .application > section + section, .recruit .selectjob .form .application > section + section, #recruit .form > section + section, .recruit .form > section + section, #recruit .container #inquiry form.inquiry > section + section, .recruit .container #inquiry form.inquiry > section + section, #contents.contact .inquiry > section + section, #contents.research .application > section + section {
    margin-top: 40px;
  }
  #recruit .selectjob .form .application > section label, .recruit .selectjob .form .application > section label, #recruit .form > section label, .recruit .form > section label, #recruit .container #inquiry form.inquiry > section label, .recruit .container #inquiry form.inquiry > section label, #contents.contact .inquiry > section label, #contents.research .application > section label, #recruit .selectjob .form .application > section .label, .recruit .selectjob .form .application > section .label, #recruit .form > section .label, .recruit .form > section .label, #recruit .container #inquiry form.inquiry > section .label, .recruit .container #inquiry form.inquiry > section .label, #contents.contact .inquiry > section .label, #contents.research .application > section .label {
    margin-bottom: 3px;
  }
  #recruit .selectjob .form .application > section > *:not(header):not(h1) + label, .recruit .selectjob .form .application > section > *:not(header):not(h1) + label, #recruit .form > section > *:not(header):not(h1) + label, .recruit .form > section > *:not(header):not(h1) + label, #recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + label, .recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + label, #contents.contact .inquiry > section > *:not(header):not(h1) + label, #contents.research .application > section > *:not(header):not(h1) + label,
  #recruit .selectjob .form .application > section > *:not(header):not(h1) + .label,
  .recruit .selectjob .form .application > section > *:not(header):not(h1) + .label,
  #recruit .form > section > *:not(header):not(h1) + .label,
  .recruit .form > section > *:not(header):not(h1) + .label,
  #recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + .label,
  .recruit .container #inquiry form.inquiry > section > *:not(header):not(h1) + .label,
  #contents.contact .inquiry > section > *:not(header):not(h1) + .label,
  #contents.research .application > section > *:not(header):not(h1) + .label,
  #recruit .selectjob .form .application > section .half,
  .recruit .selectjob .form .application > section .half,
  #recruit .form > section .half,
  .recruit .form > section .half,
  #recruit .container #inquiry form.inquiry > section .half,
  .recruit .container #inquiry form.inquiry > section .half,
  #contents.contact .inquiry > section .half,
  #contents.research .application > section .half {
    margin-top: 20px;
  }
  #recruit .selectjob .form .application > section .email, .recruit .selectjob .form .application > section .email, #recruit .form > section .email, .recruit .form > section .email, #recruit .container #inquiry form.inquiry > section .email, .recruit .container #inquiry form.inquiry > section .email, #contents.contact .inquiry > section .email, #contents.research .application > section .email {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  #recruit .selectjob .form .application > section .email .input, .recruit .selectjob .form .application > section .email .input, #recruit .form > section .email .input, .recruit .form > section .email .input, #recruit .container #inquiry form.inquiry > section .email .input, .recruit .container #inquiry form.inquiry > section .email .input, #contents.contact .inquiry > section .email .input, #contents.research .application > section .email .input {
    width: calc(50% - 12px);
  }
  #recruit .selectjob .form .application > section .email span, .recruit .selectjob .form .application > section .email span, #recruit .form > section .email span, .recruit .form > section .email span, #recruit .container #inquiry form.inquiry > section .email span, .recruit .container #inquiry form.inquiry > section .email span, #contents.contact .inquiry > section .email span, #contents.research .application > section .email span {
    width: 24px;
  }
  #recruit .selectjob .form .application > section .email .selectBox, .recruit .selectjob .form .application > section .email .selectBox, #recruit .form > section .email .selectBox, .recruit .form > section .email .selectBox, #recruit .container #inquiry form.inquiry > section .email .selectBox, .recruit .container #inquiry form.inquiry > section .email .selectBox, #contents.contact .inquiry > section .email .selectBox, #contents.research .application > section .email .selectBox {
    margin-top: 10px;
    width: 100%;
  }
  #recruit .selectjob .form .application > section .phone .input, .recruit .selectjob .form .application > section .phone .input, #recruit .form > section .phone .input, .recruit .form > section .phone .input, #recruit .container #inquiry form.inquiry > section .phone .input, .recruit .container #inquiry form.inquiry > section .phone .input, #contents.contact .inquiry > section .phone .input, #contents.research .application > section .phone .input {
    width: calc(33.3333333333% - 12px);
  }
  #recruit .selectjob .form .application > section .phone span, .recruit .selectjob .form .application > section .phone span, #recruit .form > section .phone span, .recruit .form > section .phone span, #recruit .container #inquiry form.inquiry > section .phone span, .recruit .container #inquiry form.inquiry > section .phone span, #contents.contact .inquiry > section .phone span, #contents.research .application > section .phone span {
    width: 18px;
  }
  #recruit .selectjob .form .application > section .terms > section, .recruit .selectjob .form .application > section .terms > section, #recruit .form > section .terms > section, .recruit .form > section .terms > section, #recruit .container #inquiry form.inquiry > section .terms > section, .recruit .container #inquiry form.inquiry > section .terms > section, #contents.contact .inquiry > section .terms > section, #contents.research .application > section .terms > section {
    height: 220px;
    padding: 15px;
  }
  #recruit .selectjob .form .application > section .terms > p, .recruit .selectjob .form .application > section .terms > p, #recruit .form > section .terms > p, .recruit .form > section .terms > p, #recruit .container #inquiry form.inquiry > section .terms > p, .recruit .container #inquiry form.inquiry > section .terms > p, #contents.contact .inquiry > section .terms > p, #contents.research .application > section .terms > p {
    margin-top: 10px;
  }
  #recruit .selectjob .form .application > footer, .recruit .selectjob .form .application > footer, #recruit .form > footer, .recruit .form > footer, #recruit .container #inquiry form.inquiry > footer, .recruit .container #inquiry form.inquiry > footer, #contents.contact .inquiry > footer, #contents.research .application > footer {
    margin-top: 40px;
  }
}

.banner > ul {
  display: flex;
  flex-direction: column;
}
.banner > ul > li {
  position: relative;
  padding: 40px 20px;
  color: #fff;
  font-size: 18px;
  line-height: 28px;
  word-break: keep-all;
  background-size: cover;
}
.banner > ul > li:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.banner .officemarket {
  background-image: url("../images/shinyoung/page/bannerOffice.jpg");
}
.banner .newsletter {
  background-image: url("../images/shinyoung/page/bannerNewsletter.jpg");
}
.banner .REIKorea {
  background-image: url("../images/shinyoung/page/bannerREI.jpg");
}
.banner .inner {
  position: relative;
  z-index: 1;
}
.banner .link {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 148px;
  min-height: 20px;
  margin-top: 20px;
  padding: 5px 25px;
  font-size: 14px;
  border: 1px solid #fff;
  border-radius: 22px;
}
@media (min-width: 1025px) {
  .banner > ul {
    flex-direction: row;
    width: 100%;
    min-height: 200px;
  }
  .banner > ul > li {
    display: flex;
    flex: 1;
  }
  .banner > ul > li:first-child:not(:last-of-type) {
    justify-content: flex-end;
  }
  .banner > ul > li:last-of-type:only-child .inner {
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  .banner > ul > li:after {
    background-color: rgba(33, 33, 33, 0.7);
  }
  .banner > ul .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 600px;
    padding: 0 20px;
    font-size: 24px;
  }
  .banner > ul p {
    max-width: calc(100% - 200px);
  }
  .banner > ul .link {
    font-size: 16px;
  }
  .banner .officemarket {
    background-image: url("../images/shinyoung/page/bannerOffice_L.jpg");
  }
  .banner .newsletter {
    background-image: url("../images/shinyoung/page/bannerNewsletter_L.jpg");
  }
  .banner .REIKorea {
    background-image: url("../images/shinyoung/page/bannerREI_L.jpg");
  }
}

.card .cardItem {
  min-height: 250px;
  padding: 30px 30px 20px;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  word-break: keep-all;
}
.card .cardItem + .cardItem {
  border-top: 0;
}
.card h3,
.card .itemTit {
  font-size: 18px;
  font-weight: 400;
}
.card img {
  display: block;
  margin: 40px auto 30px;
}
.card .link {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  min-width: 100px;
}
.card .link::before, .card .link::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.card .link:not(:disabled):hover, .card .link:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.card .link:not(:disabled):hover::before, .card .link:not(:disabled):hover::after, .card .link:not(:disabled):focus::before, .card .link:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .card .link {
    font-size: 16px;
    font-size: 14px;
    min-width: 100px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .card .link::before {
    margin-right: 10px;
  }
  .card .link::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .card .link {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .card .link::before {
    margin-right: 14px;
  }
  .card .link::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  .card {
    display: flex;
    width: 100%;
  }
  .card .cardItem {
    position: relative;
    flex: 1;
    padding: 48px 40px;
  }
  .card .cardItem + .cardItem {
    border-top: 1px solid #c8c8c8;
    border-left: 0;
  }
  .card .cardItem img {
    margin: 0;
  }
}

.listCard {
  margin-top: 25px;
}
.listCard > li {
  margin-top: 15px;
  padding: 30px 30px 30px 25px;
  color: #666;
  line-height: 26px;
  border: 1px solid #c8c8c8;
  border-radius: 8px;
  word-break: keep-all;
}
.listCard .tit {
  display: block;
  margin: 20px 0 15px;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  color: #212121;
}
.listCard p + .dot {
  margin-top: 25px;
}
.listCard .dot li {
  position: relative;
  padding-left: 14px;
  font-size: 16px;
}
.listCard .dot li:before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #4415a0;
}
.listCard .dot li + li {
  margin-top: 10px;
}
@media (min-width: 1025px) {
  .listCard {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-left: -30px;
  }
  .listCard > li {
    flex: 1;
    margin-top: 30px;
    margin-left: 30px;
    padding: 50px 40px;
    font-size: 18px;
    line-height: 30px;
  }
  .listCard .tit {
    margin: 50px 0 20px;
    font-size: 24px;
    line-height: 36px;
  }
  .listCard .wrapIcon img {
    width: 80px;
  }
  .listCard p + .dot {
    margin-top: 20px;
  }
  .listCard .dot li {
    font-size: 18px;
  }
  .listCard .dot li:before {
    top: 12px;
    width: 5px;
    height: 5px;
  }
}

.datepickerBig {
  border-bottom: 1px solid #e5e5e5;
}
.datepickerBig.hasDatepicker {
  background-image: none !important;
}
.datepickerBig .ui-widget-content {
  margin-top: 0 !important;
  width: 100%;
  padding: 0 !important;
  -ms-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
  border-radius: unset !important;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-widget-content {
    font-size: 16px !important;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-widget-content {
    font-size: 14px !important;
  }
}
.datepickerBig .ui-state-hover,
.datepickerBig .ui-widget-content .ui-state-hover {
  background: unset;
}
.datepickerBig .ui-datepicker .ui-datepicker-header {
  margin-bottom: 0 !important;
  height: 70px;
  padding: 0 !important;
  border-radius: unset !important;
  background: #f9f9f9;
}
.datepickerBig .ui-datepicker .ui-datepicker-title {
  line-height: 70px;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker .ui-datepicker-title {
    font-size: 20px;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker .ui-datepicker-title {
    font-size: 18px;
  }
}
.datepickerBig .ui-datepicker .ui-datepicker-prev, .datepickerBig .ui-datepicker .ui-datepicker-next {
  top: 0 !important;
  bottom: 0 !important;
  margin: auto !important;
  border: 1px solid #c8c8c8;
  cursor: pointer;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker .ui-datepicker-prev {
    left: 30px;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker .ui-datepicker-prev {
    left: 20px;
  }
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker .ui-datepicker-next {
    right: 30px;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker .ui-datepicker-next {
    right: 20px;
  }
}
.datepickerBig .ui-datepicker table {
  margin: 0 !important;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker table {
    font-size: 16px !important;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker table {
    font-size: 14px !important;
  }
}
.datepickerBig .ui-datepicker-calendar thead {
  border-bottom: none !important;
}
.datepickerBig .ui-datepicker th {
  height: 55px;
  vertical-align: middle;
  padding: 0 !important;
  color: #212121 !important;
}
.datepickerBig .ui-datepicker td {
  padding: 0 !important;
  vertical-align: middle;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker td {
    height: 54px !important;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker td {
    height: 60px !important;
  }
}
.datepickerBig .ui-datepicker td a:hover {
  background: #e5e5e5;
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].start {
  position: relative;
  background: #e9e9e9;
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].start a {
  position: absolute;
  z-index: 5;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker td[data-handler=selectDay].start a {
    top: calc(50% - 20px);
    left: calc(50% - 20px);
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker td[data-handler=selectDay].start a {
    top: calc(50% - 14px);
    left: calc(50% - 14px);
  }
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].start:after {
  position: absolute;
  top: 0;
  left: 7px;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 30px 0 0 30px;
}
@media (max-width: 480px) {
  .datepickerBig .ui-datepicker td[data-handler=selectDay].start:after {
    left: 3px;
  }
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].end {
  position: relative;
  background: #e9e9e9;
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].end a {
  position: absolute;
  z-index: 5;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-datepicker td[data-handler=selectDay].end a {
    top: calc(50% - 20px);
    right: calc(50% - 20px);
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-datepicker td[data-handler=selectDay].end a {
    top: calc(50% - 14px);
    right: calc(50% - 14px);
  }
}
.datepickerBig .ui-datepicker td[data-handler=selectDay].end:after {
  position: absolute;
  top: 0;
  right: 7px;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 0 30px 30px 0;
}
.datepickerBig .ui-state-disabled, .datepickerBig .ui-widget-content .ui-state-disabled, .datepickerBig .ui-widget-header .ui-state-disabled {
  opacity: 1 !important;
  background: #e9e9e9;
}
.datepickerBig .ui-state-default, .datepickerBig .ui-widget-content .ui-state-default, .datepickerBig .ui-widget-header .ui-state-default {
  border: 0 !important;
  color: #212121;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
}
@media (min-width: 1025px) {
  .datepickerBig .ui-state-default, .datepickerBig .ui-widget-content .ui-state-default, .datepickerBig .ui-widget-header .ui-state-default {
    width: 40px !important;
    height: 40px !important;
    line-height: 40px !important;
  }
}
@media (max-width: 1024px) {
  .datepickerBig .ui-state-default, .datepickerBig .ui-widget-content .ui-state-default, .datepickerBig .ui-widget-header .ui-state-default {
    width: 30px !important;
    height: 30px !important;
    line-height: 30px !important;
  }
}
.datepickerBig .ui-state-highlight, .datepickerBig .ui-widget-content .ui-state-highlight, .datepickerBig .ui-widget-header .ui-state-highlight {
  background: #e5e5e5;
  color: #212121;
}
.datepickerBig .ui-state-active {
  background: #0097e0 !important;
  color: #fff !important;
}
.datepickerBig .ui-datepicker td span, .datepickerBig .ui-datepicker td a {
  padding: 0 !important;
}
.datepickerBig .ui-datepicker-other-month .ui-state-default {
  color: #666 !important;
}

.ui-helper-hidden {
  display: none;
}

.ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.ui-helper-reset {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  line-height: 1.3;
  text-decoration: none;
  font-size: 100%;
  list-style: none;
}

.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
  content: "";
  display: table;
  border-collapse: collapse;
}

.ui-helper-clearfix:after {
  clear: both;
}

.ui-helper-clearfix {
  min-height: 0; /* support: IE7 */
}

.ui-helper-zfix {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  filter: Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
  z-index: 100;
}

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
  cursor: default !important;
}

/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
}

/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.ui-accordion .ui-accordion-header {
  display: block;
  cursor: pointer;
  position: relative;
  margin: 2px 0 0 0;
  padding: 0.5em 0.5em 0.5em 0.7em;
  min-height: 0; /* support: IE7 */
  font-size: 100%;
}

.ui-accordion .ui-accordion-icons {
  padding-left: 2.2em;
}

.ui-accordion .ui-accordion-icons .ui-accordion-icons {
  padding-left: 2.2em;
}

.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: absolute;
  left: 0.5em;
  top: 50%;
  margin-top: -8px;
}

.ui-accordion .ui-accordion-content {
  padding: 1em 2.2em;
  border-top: 0;
  overflow: auto;
}

.ui-autocomplete {
  position: absolute;
  top: 0;
  left: 0;
  cursor: default;
}

.ui-button {
  display: inline-block;
  position: relative;
  padding: 0;
  line-height: normal;
  margin-right: 0.1em;
  cursor: pointer;
  vertical-align: middle;
  text-align: center;
  overflow: visible; /* removes extra width in IE */
}

.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
  text-decoration: none;
}

/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
  width: 2.2em;
}

/* button elements seem to need a little more width */
button.ui-button-icon-only {
  width: 2.4em;
}

.ui-button-icons-only {
  width: 3.4em;
}

button.ui-button-icons-only {
  width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
  display: block;
  line-height: normal;
}

.ui-button-text-only .ui-button-text {
  padding: 0.4em 1em;
}

.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
  padding: 0.4em;
  text-indent: -9999999px;
}

.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
  padding: 0.4em 1em 0.4em 2.1em;
}

.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
  padding: 0.4em 2.1em 0.4em 1em;
}

.ui-button-text-icons .ui-button-text {
  padding-left: 2.1em;
  padding-right: 2.1em;
}

/* no icon support for input elements, provide padding by default */
input.ui-button {
  padding: 0.4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
  position: absolute;
  top: 50%;
  margin-top: -8px;
}

.ui-button-icon-only .ui-icon {
  left: 50%;
  margin-left: -8px;
}

.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
  left: 0.5em;
}

.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
  right: 0.5em;
}

/* button sets */
.ui-buttonset {
  margin-right: 7px;
}

.ui-buttonset .ui-button {
  margin-left: 0;
  margin-right: -0.3em;
}

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
  border: 0;
  padding: 0;
}

.ui-datepicker {
  width: 17em;
  padding: 0.2em 0.2em 0;
  display: none;
}

.ui-datepicker .ui-datepicker-header {
  position: relative;
  padding: 0.2em 0;
  margin-bottom: 13px;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  position: absolute;
  top: 2px;
  width: 30px;
  height: 30px;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
  top: 2px;
}

.ui-datepicker .ui-datepicker-prev {
  left: 2px;
}

.ui-datepicker .ui-datepicker-next {
  right: 2px;
}

.ui-datepicker .ui-datepicker-prev-hover {
  left: 2px;
}

.ui-datepicker .ui-datepicker-next-hover {
  right: 2px;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  display: block;
  position: absolute;
  left: 0%;
  top: 0%;
}

.ui-datepicker .ui-datepicker-title {
  margin: 0 2.3em;
  line-height: 1.8em;
  text-align: center;
  font-size: 14px;
  font-size: 0.9rem;
}

.ui-datepicker .ui-datepicker-title select {
  font-size: 1em;
  margin: 1px 0;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 45%;
}

.ui-datepicker table {
  width: 100%;
  font-size: 0.9em;
  border-collapse: collapse;
  margin: 0 0 0.4em;
}

.ui-datepicker-calendar thead {
  border-bottom: 4px solid #fff;
}

a.ui-datepicker-next.ui-corner-all::before {
  border: solid #63666a;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 4px 2px 2px 4px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  content: "";
  position: absolute;
  top: 11px;
  left: 9px;
}

button.ui-datepicker-trigger {
  border: none;
  background: #4c5762 url("../../images/sub/datapicker.png") 16px 15px no-repeat;
  width: 49px;
  height: 48px;
  text-indent: -9999px;
}

a.ui-datepicker-prev.ui-corner-all::before {
  border: solid #63666a;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 4px 2px 2px 4px;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  content: "";
  position: absolute;
  top: 11px;
  left: 12px;
}

.ui-datepicker th {
  padding: 0.7em 0.3em;
  text-align: center;
  font-weight: bold;
  border: 0;
  color: #63666a;
}

.ui-datepicker td {
  border: 0;
  padding: 1px;
}

.ui-datepicker td span,
.ui-datepicker td a {
  display: block;
  padding: 0.2em;
  text-align: right;
  text-decoration: none;
}

.ui-datepicker .ui-datepicker-buttonpane {
  background-image: none;
  margin: 0.7em 0 0 0;
  padding: 0 0.2em;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}

.ui-datepicker .ui-datepicker-buttonpane button {
  float: right;
  margin: 0.5em 0.2em 0.4em;
  cursor: pointer;
  padding: 0.2em 0.6em 0.3em 0.6em;
  width: auto;
  overflow: visible;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
  width: auto;
}

.ui-datepicker-multi .ui-datepicker-group {
  float: left;
}

.ui-datepicker-multi .ui-datepicker-group table {
  width: 95%;
  margin: 0 auto 0.4em;
}

.ui-datepicker-multi-2 .ui-datepicker-group {
  width: 50%;
}

.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 33.3%;
}

.ui-datepicker-multi-4 .ui-datepicker-group {
  width: 25%;
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
  border-left-width: 0;
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
  clear: left;
}

.ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
  direction: rtl;
}

.ui-datepicker-rtl .ui-datepicker-prev {
  right: 2px;
  left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next {
  left: 2px;
  right: auto;
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
  right: 1px;
  left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
  left: 1px;
  right: auto;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane {
  clear: right;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button {
  float: left;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
  float: right;
}

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
  border-right-width: 0;
  border-left-width: 1px;
}

.ui-dialog {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.2em;
  outline: 0;
}

.ui-dialog .ui-dialog-titlebar {
  padding: 0.4em 1em;
  position: relative;
}

.ui-dialog .ui-dialog-title {
  float: left;
  margin: 0.1em 0;
  white-space: nowrap;
  width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-dialog .ui-dialog-titlebar-close {
  position: absolute;
  right: 0.3em;
  top: 50%;
  width: 20px;
  margin: -10px 0 0 0;
  padding: 1px;
  height: 20px;
}

.ui-dialog .ui-dialog-content {
  position: relative;
  border: 0;
  padding: 0.5em 1em;
  background: none;
  overflow: auto;
}

.ui-dialog .ui-dialog-buttonpane {
  text-align: left;
  border-width: 1px 0 0 0;
  background-image: none;
  margin-top: 0.5em;
  padding: 0.3em 1em 0.5em 0.4em;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
  float: right;
}

.ui-dialog .ui-dialog-buttonpane button {
  margin: 0.5em 0.4em 0.5em 0;
  cursor: pointer;
}

.ui-dialog .ui-resizable-se {
  width: 12px;
  height: 12px;
  right: -5px;
  bottom: -5px;
  background-position: 16px 16px;
}

.ui-draggable .ui-dialog-titlebar {
  cursor: move;
}

.ui-draggable-handle {
  touch-action: none;
}

.ui-menu {
  list-style: none;
  padding: 0;
  margin: 0;
  display: block;
  outline: none;
}

.ui-menu .ui-menu {
  position: absolute;
}

.ui-menu .ui-menu-item {
  position: relative;
  margin: 0;
  padding: 3px 1em 3px 0.4em;
  cursor: pointer;
  min-height: 0; /* support: IE7 */
  /* support: IE10, see #8844 */
}

.ui-menu .ui-menu-divider {
  margin: 5px 0;
  height: 0;
  font-size: 0;
  line-height: 0;
  border-width: 1px 0 0 0;
}

.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
  margin: -1px;
}

/* icon support */
.ui-menu-icons {
  position: relative;
}

.ui-menu-icons .ui-menu-item {
  padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.2em;
  margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
  left: auto;
  right: 0;
}

.ui-progressbar {
  height: 2em;
  text-align: left;
  overflow: hidden;
}

.ui-progressbar .ui-progressbar-value {
  margin: -1px;
  height: 100%;
}

.ui-progressbar .ui-progressbar-overlay {
  height: 100%;
  filter: alpha(opacity=25); /* support: IE8 */
  opacity: 0.25;
}

.ui-progressbar-indeterminate .ui-progressbar-value {
  background-image: none;
}

.ui-resizable {
  position: relative;
}

.ui-resizable-handle {
  position: absolute;
  font-size: 0.1px;
  display: block;
  touch-action: none;
}

.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
  display: none;
}

.ui-resizable-n {
  cursor: n-resize;
  height: 7px;
  width: 100%;
  top: -5px;
  left: 0;
}

.ui-resizable-s {
  cursor: s-resize;
  height: 7px;
  width: 100%;
  bottom: -5px;
  left: 0;
}

.ui-resizable-e {
  cursor: e-resize;
  width: 7px;
  right: -5px;
  top: 0;
  height: 100%;
}

.ui-resizable-w {
  cursor: w-resize;
  width: 7px;
  left: -5px;
  top: 0;
  height: 100%;
}

.ui-resizable-se {
  cursor: se-resize;
  width: 12px;
  height: 12px;
  right: 1px;
  bottom: 1px;
}

.ui-resizable-sw {
  cursor: sw-resize;
  width: 9px;
  height: 9px;
  left: -5px;
  bottom: -5px;
}

.ui-resizable-nw {
  cursor: nw-resize;
  width: 9px;
  height: 9px;
  left: -5px;
  top: -5px;
}

.ui-resizable-ne {
  cursor: ne-resize;
  width: 9px;
  height: 9px;
  right: -5px;
  top: -5px;
}

.ui-selectable {
  touch-action: none;
}

.ui-selectable-helper {
  position: absolute;
  z-index: 100;
  border: 1px dotted black;
}

.ui-selectmenu-menu {
  padding: 0;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}

.ui-selectmenu-menu .ui-menu {
  overflow: auto;
  /* Support: IE7 */
  overflow-x: hidden;
  padding-bottom: 1px;
}

.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
  font-size: 1em;
  font-weight: bold;
  line-height: 1.5;
  padding: 2px 0.4em;
  margin: 0.5em 0 0 0;
  height: auto;
  border: 0;
}

.ui-selectmenu-open {
  display: block;
}

.ui-selectmenu-button {
  display: inline-block;
  overflow: hidden;
  position: relative;
  text-decoration: none;
  cursor: pointer;
}

.ui-selectmenu-button span.ui-icon {
  right: 0.5em;
  left: auto;
  margin-top: -8px;
  position: absolute;
  top: 50%;
}

.ui-selectmenu-button span.ui-selectmenu-text {
  text-align: left;
  padding: 0.4em 2.1em 0.4em 1em;
  display: block;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-slider {
  position: relative;
  text-align: left;
}

.ui-slider .ui-slider-handle {
  position: absolute;
  z-index: 2;
  width: 1.2em;
  height: 1.2em;
  cursor: default;
  touch-action: none;
}

.ui-slider .ui-slider-range {
  position: absolute;
  z-index: 1;
  font-size: 0.7em;
  display: block;
  border: 0;
  background-position: 0 0;
}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
  filter: inherit;
}

.ui-slider-horizontal {
  height: 0.8em;
}

.ui-slider-horizontal .ui-slider-handle {
  top: -0.3em;
  margin-left: -0.6em;
}

.ui-slider-horizontal .ui-slider-range {
  top: 0;
  height: 100%;
}

.ui-slider-horizontal .ui-slider-range-min {
  left: 0;
}

.ui-slider-horizontal .ui-slider-range-max {
  right: 0;
}

.ui-slider-vertical {
  width: 0.8em;
  height: 100px;
}

.ui-slider-vertical .ui-slider-handle {
  left: -0.3em;
  margin-left: 0;
  margin-bottom: -0.6em;
}

.ui-slider-vertical .ui-slider-range {
  left: 0;
  width: 100%;
}

.ui-slider-vertical .ui-slider-range-min {
  bottom: 0;
}

.ui-slider-vertical .ui-slider-range-max {
  top: 0;
}

.ui-sortable-handle {
  touch-action: none;
}

.ui-spinner {
  position: relative;
  display: inline-block;
  overflow: hidden;
  padding: 0;
  vertical-align: middle;
}

.ui-spinner-input {
  border: none;
  background: none;
  color: inherit;
  padding: 0;
  margin: 0.2em 0;
  vertical-align: middle;
  margin-left: 0.4em;
  margin-right: 22px;
}

.ui-spinner-button {
  width: 16px;
  height: 50%;
  font-size: 0.5em;
  padding: 0;
  margin: 0;
  text-align: center;
  position: absolute;
  cursor: default;
  display: block;
  overflow: hidden;
  right: 0;
}

/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
  border-top: none;
  border-bottom: none;
  border-right: none;
}

/* vertically center icon */
.ui-spinner .ui-icon {
  position: absolute;
  margin-top: -8px;
  top: 50%;
  left: 0;
}

.ui-spinner-up {
  top: 0;
}

.ui-spinner-down {
  bottom: 0;
}

/* TR overrides */
.ui-spinner .ui-icon-triangle-1-s {
  /* need to fix icons sprite */
  background-position: -65px -16px;
}

.ui-tabs {
  position: relative; /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
  padding: 0.2em;
}

.ui-tabs .ui-tabs-nav {
  margin: 0;
  padding: 0.2em 0.2em 0;
}

.ui-tabs .ui-tabs-nav li {
  list-style: none;
  float: left;
  position: relative;
  top: 0;
  margin: 1px 0.2em 0 0;
  border-bottom-width: 0;
  padding: 0;
  white-space: nowrap;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
  float: left;
  padding: 0.5em 1em;
  text-decoration: none;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active {
  margin-bottom: -1px;
  padding-bottom: 1px;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
  cursor: text;
}

.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
  cursor: pointer;
}

.ui-tabs .ui-tabs-panel {
  display: block;
  border-width: 0;
  padding: 1em 1.4em;
  background: none;
}

.ui-tooltip {
  padding: 8px;
  position: absolute;
  z-index: 9999;
  max-width: 300px;
  box-shadow: 0 0 5px #aaa;
}

body .ui-tooltip {
  border-width: 2px;
}

/* Component containers
----------------------------------*/
.ui-widget {
  font-family: Verdana, Arial, sans-serif;
  font-size: 1.1em;
}

.ui-widget .ui-widget {
  font-size: 1em;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: Verdana, Arial, sans-serif;
  font-size: 1em;
}

.ui-widget-content {
  margin-top: 4px;
  font-size: 12px;
  font-size: 0.75rem;
  border-radius: 2px;
  -o-box-shadow: 0 1px 5px 0 #2f3133;
  box-shadow: 0 1px 5px 0 #2f3133;
  padding: 20px 15px;
  border-width: 0;
  text-align: center;
  background-color: #fff;
  cursor: default;
  z-index: 100;
  width: 273px;
}

.ui-widget-content a {
  color: #222222;
}

.ui-widget-header {
  color: #222222;
  font-weight: bold;
}

.ui-widget-header a {
  color: #222222;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  border: 1px solid #63666a;
  width: 30px;
  line-height: 30px;
  text-align: center;
  color: #555555;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
  color: #555555;
  text-decoration: none;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover {
  background: #63666a;
  color: #fff;
}

.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
  background: #bec3c9;
  background: #bec3c9;
  font-weight: normal;
  color: #fff;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
  color: #212121;
  text-decoration: none;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  font-weight: normal;
  color: #212121;
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
  color: #212121;
  text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  background: #0758a8;
  color: #fff;
}

.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
  color: #363636;
}

.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
  border: 1px solid #cd0a0a;
  color: #cd0a0a;
}

.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
  color: #cd0a0a;
}

.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
  color: #cd0a0a;
}

.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
  font-weight: bold;
}

.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
  opacity: 0.7;
  filter: Alpha(Opacity=70); /* support: IE8 */
  font-weight: normal;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
  opacity: 0.35;
  filter: Alpha(Opacity=35); /* support: IE8 */
  background-image: none;
}

.ui-state-disabled .ui-icon {
  filter: Alpha(Opacity=35); /* support: IE8 - See #6059 */
}

/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
  width: 30px;
  height: 30px;
}

/* positioning */
.ui-icon-blank {
  background-position: 16px 16px;
}

.ui-icon-carat-1-n {
  background-position: 0 0;
}

.ui-icon-carat-1-ne {
  background-position: -16px 0;
}

.ui-icon-carat-1-e {
  background-position: -32px 0;
}

.ui-icon-carat-1-se {
  background-position: -48px 0;
}

.ui-icon-carat-1-s {
  background-position: -64px 0;
}

.ui-icon-carat-1-sw {
  background-position: -80px 0;
}

.ui-icon-carat-1-w {
  background-position: -96px 0;
}

.ui-icon-carat-1-nw {
  background-position: -112px 0;
}

.ui-icon-carat-2-n-s {
  background-position: -128px 0;
}

.ui-icon-carat-2-e-w {
  background-position: -144px 0;
}

.ui-icon-triangle-1-n {
  background-position: 0 -16px;
}

.ui-icon-triangle-1-ne {
  background-position: -16px -16px;
}

.ui-icon-triangle-1-e {
  background-position: -32px -16px;
}

.ui-icon-triangle-1-se {
  background-position: -48px -16px;
}

.ui-icon-triangle-1-s {
  background-position: -64px -16px;
}

.ui-icon-triangle-1-sw {
  background-position: -80px -16px;
}

.ui-icon-triangle-1-w {
  background-position: -96px -16px;
}

.ui-icon-triangle-1-nw {
  background-position: -112px -16px;
}

.ui-icon-triangle-2-n-s {
  background-position: -128px -16px;
}

.ui-icon-triangle-2-e-w {
  background-position: -144px -16px;
}

.ui-icon-arrow-1-n {
  background-position: 0 -32px;
}

.ui-icon-arrow-1-ne {
  background-position: -16px -32px;
}

.ui-icon-arrow-1-e {
  background-position: -32px -32px;
}

.ui-icon-arrow-1-se {
  background-position: -48px -32px;
}

.ui-icon-arrow-1-s {
  background-position: -64px -32px;
}

.ui-icon-arrow-1-sw {
  background-position: -80px -32px;
}

.ui-icon-arrow-1-w {
  background-position: -96px -32px;
}

.ui-icon-arrow-1-nw {
  background-position: -112px -32px;
}

.ui-icon-arrow-2-n-s {
  background-position: -128px -32px;
}

.ui-icon-arrow-2-ne-sw {
  background-position: -144px -32px;
}

.ui-icon-arrow-2-e-w {
  background-position: -160px -32px;
}

.ui-icon-arrow-2-se-nw {
  background-position: -176px -32px;
}

.ui-icon-arrowstop-1-n {
  background-position: -192px -32px;
}

.ui-icon-arrowstop-1-e {
  background-position: -208px -32px;
}

.ui-icon-arrowstop-1-s {
  background-position: -224px -32px;
}

.ui-icon-arrowstop-1-w {
  background-position: -240px -32px;
}

.ui-icon-arrowthick-1-n {
  background-position: 0 -48px;
}

.ui-icon-arrowthick-1-ne {
  background-position: -16px -48px;
}

.ui-icon-arrowthick-1-e {
  background-position: -32px -48px;
}

.ui-icon-arrowthick-1-se {
  background-position: -48px -48px;
}

.ui-icon-arrowthick-1-s {
  background-position: -64px -48px;
}

.ui-icon-arrowthick-1-sw {
  background-position: -80px -48px;
}

.ui-icon-arrowthick-1-w {
  background-position: -96px -48px;
}

.ui-icon-arrowthick-1-nw {
  background-position: -112px -48px;
}

.ui-icon-arrowthick-2-n-s {
  background-position: -128px -48px;
}

.ui-icon-arrowthick-2-ne-sw {
  background-position: -144px -48px;
}

.ui-icon-arrowthick-2-e-w {
  background-position: -160px -48px;
}

.ui-icon-arrowthick-2-se-nw {
  background-position: -176px -48px;
}

.ui-icon-arrowthickstop-1-n {
  background-position: -192px -48px;
}

.ui-icon-arrowthickstop-1-e {
  background-position: -208px -48px;
}

.ui-icon-arrowthickstop-1-s {
  background-position: -224px -48px;
}

.ui-icon-arrowthickstop-1-w {
  background-position: -240px -48px;
}

.ui-icon-arrowreturnthick-1-w {
  background-position: 0 -64px;
}

.ui-icon-arrowreturnthick-1-n {
  background-position: -16px -64px;
}

.ui-icon-arrowreturnthick-1-e {
  background-position: -32px -64px;
}

.ui-icon-arrowreturnthick-1-s {
  background-position: -48px -64px;
}

.ui-icon-arrowreturn-1-w {
  background-position: -64px -64px;
}

.ui-icon-arrowreturn-1-n {
  background-position: -80px -64px;
}

.ui-icon-arrowreturn-1-e {
  background-position: -96px -64px;
}

.ui-icon-arrowreturn-1-s {
  background-position: -112px -64px;
}

.ui-icon-arrowrefresh-1-w {
  background-position: -128px -64px;
}

.ui-icon-arrowrefresh-1-n {
  background-position: -144px -64px;
}

.ui-icon-arrowrefresh-1-e {
  background-position: -160px -64px;
}

.ui-icon-arrowrefresh-1-s {
  background-position: -176px -64px;
}

.ui-icon-arrow-4 {
  background-position: 0 -80px;
}

.ui-icon-arrow-4-diag {
  background-position: -16px -80px;
}

.ui-icon-extlink {
  background-position: -32px -80px;
}

.ui-icon-newwin {
  background-position: -48px -80px;
}

.ui-icon-refresh {
  background-position: -64px -80px;
}

.ui-icon-shuffle {
  background-position: -80px -80px;
}

.ui-icon-transfer-e-w {
  background-position: -96px -80px;
}

.ui-icon-transferthick-e-w {
  background-position: -112px -80px;
}

.ui-icon-folder-collapsed {
  background-position: 0 -96px;
}

.ui-icon-folder-open {
  background-position: -16px -96px;
}

.ui-icon-document {
  background-position: -32px -96px;
}

.ui-icon-document-b {
  background-position: -48px -96px;
}

.ui-icon-note {
  background-position: -64px -96px;
}

.ui-icon-mail-closed {
  background-position: -80px -96px;
}

.ui-icon-mail-open {
  background-position: -96px -96px;
}

.ui-icon-suitcase {
  background-position: -112px -96px;
}

.ui-icon-comment {
  background-position: -128px -96px;
}

.ui-icon-person {
  background-position: -144px -96px;
}

.ui-icon-print {
  background-position: -160px -96px;
}

.ui-icon-trash {
  background-position: -176px -96px;
}

.ui-icon-locked {
  background-position: -192px -96px;
}

.ui-icon-unlocked {
  background-position: -208px -96px;
}

.ui-icon-bookmark {
  background-position: -224px -96px;
}

.ui-icon-tag {
  background-position: -240px -96px;
}

.ui-icon-home {
  background-position: 0 -112px;
}

.ui-icon-flag {
  background-position: -16px -112px;
}

.ui-icon-calendar {
  background-position: -32px -112px;
}

.ui-icon-cart {
  background-position: -48px -112px;
}

.ui-icon-pencil {
  background-position: -64px -112px;
}

.ui-icon-clock {
  background-position: -80px -112px;
}

.ui-icon-disk {
  background-position: -96px -112px;
}

.ui-icon-calculator {
  background-position: -112px -112px;
}

.ui-icon-zoomin {
  background-position: -128px -112px;
}

.ui-icon-zoomout {
  background-position: -144px -112px;
}

.ui-icon-search {
  background-position: -160px -112px;
}

.ui-icon-wrench {
  background-position: -176px -112px;
}

.ui-icon-gear {
  background-position: -192px -112px;
}

.ui-icon-heart {
  background-position: -208px -112px;
}

.ui-icon-star {
  background-position: -224px -112px;
}

.ui-icon-link {
  background-position: -240px -112px;
}

.ui-icon-cancel {
  background-position: 0 -128px;
}

.ui-icon-plus {
  background-position: -16px -128px;
}

.ui-icon-plusthick {
  background-position: -32px -128px;
}

.ui-icon-minus {
  background-position: -48px -128px;
}

.ui-icon-minusthick {
  background-position: -64px -128px;
}

.ui-icon-close {
  background-position: -80px -128px;
}

.ui-icon-closethick {
  background-position: -96px -128px;
}

.ui-icon-key {
  background-position: -112px -128px;
}

.ui-icon-lightbulb {
  background-position: -128px -128px;
}

.ui-icon-scissors {
  background-position: -144px -128px;
}

.ui-icon-clipboard {
  background-position: -160px -128px;
}

.ui-icon-copy {
  background-position: -176px -128px;
}

.ui-icon-contact {
  background-position: -192px -128px;
}

.ui-icon-image {
  background-position: -208px -128px;
}

.ui-icon-video {
  background-position: -224px -128px;
}

.ui-icon-script {
  background-position: -240px -128px;
}

.ui-icon-alert {
  background-position: 0 -144px;
}

.ui-icon-info {
  background-position: -16px -144px;
}

.ui-icon-notice {
  background-position: -32px -144px;
}

.ui-icon-help {
  background-position: -48px -144px;
}

.ui-icon-check {
  background-position: -64px -144px;
}

.ui-icon-bullet {
  background-position: -80px -144px;
}

.ui-icon-radio-on {
  background-position: -96px -144px;
}

.ui-icon-radio-off {
  background-position: -112px -144px;
}

.ui-icon-pin-w {
  background-position: -128px -144px;
}

.ui-icon-pin-s {
  background-position: -144px -144px;
}

.ui-icon-play {
  background-position: 0 -160px;
}

.ui-icon-pause {
  background-position: -16px -160px;
}

.ui-icon-seek-next {
  background-position: -32px -160px;
}

.ui-icon-seek-prev {
  background-position: -48px -160px;
}

.ui-icon-seek-end {
  background-position: -64px -160px;
}

.ui-icon-seek-start {
  background-position: -80px -160px;
}

/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first {
  background-position: -80px -160px;
}

.ui-icon-stop {
  background-position: -96px -160px;
}

.ui-icon-eject {
  background-position: -112px -160px;
}

.ui-icon-volume-off {
  background-position: -128px -160px;
}

.ui-icon-volume-on {
  background-position: -144px -160px;
}

.ui-icon-power {
  background-position: 0 -176px;
}

.ui-icon-signal-diag {
  background-position: -16px -176px;
}

.ui-icon-signal {
  background-position: -32px -176px;
}

.ui-icon-battery-0 {
  background-position: -48px -176px;
}

.ui-icon-battery-1 {
  background-position: -64px -176px;
}

.ui-icon-battery-2 {
  background-position: -80px -176px;
}

.ui-icon-battery-3 {
  background-position: -96px -176px;
}

.ui-icon-circle-plus {
  background-position: 0 -192px;
}

.ui-icon-circle-minus {
  background-position: -16px -192px;
}

.ui-icon-circle-close {
  background-position: -32px -192px;
}

.ui-icon-circle-triangle-e {
  background-position: -48px -192px;
}

.ui-icon-circle-triangle-s {
  background-position: -64px -192px;
}

.ui-icon-circle-triangle-w {
  background-position: -80px -192px;
}

.ui-icon-circle-triangle-n {
  background-position: -96px -192px;
}

.ui-icon-circle-arrow-e {
  background-position: -112px -192px;
}

.ui-icon-circle-arrow-s {
  background-position: -128px -192px;
}

.ui-icon-circle-arrow-w {
  background-position: -144px -192px;
}

.ui-icon-circle-arrow-n {
  background-position: -160px -192px;
}

.ui-icon-circle-zoomin {
  background-position: -176px -192px;
}

.ui-icon-circle-zoomout {
  background-position: -192px -192px;
}

.ui-icon-circle-check {
  background-position: -208px -192px;
}

.ui-icon-circlesmall-plus {
  background-position: 0 -208px;
}

.ui-icon-circlesmall-minus {
  background-position: -16px -208px;
}

.ui-icon-circlesmall-close {
  background-position: -32px -208px;
}

.ui-icon-squaresmall-plus {
  background-position: -48px -208px;
}

.ui-icon-squaresmall-minus {
  background-position: -64px -208px;
}

.ui-icon-squaresmall-close {
  background-position: -80px -208px;
}

.ui-icon-grip-dotted-vertical {
  background-position: 0 -224px;
}

.ui-icon-grip-dotted-horizontal {
  background-position: -16px -224px;
}

.ui-icon-grip-solid-vertical {
  background-position: -32px -224px;
}

.ui-icon-grip-solid-horizontal {
  background-position: -48px -224px;
}

.ui-icon-gripsmall-diagonal-se {
  background-position: -64px -224px;
}

.ui-icon-grip-diagonal-se {
  background-position: -80px -224px;
}

/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  border-top-left-radius: 4px;
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
  border-top-right-radius: 4px;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
  border-bottom-left-radius: 4px;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  border-bottom-right-radius: 4px;
}

a.ui-corner-all {
  border-radius: 50%;
}

/* Overlays */
.ui-widget-overlay {
  opacity: 0.3;
  filter: Alpha(Opacity=30); /* support: IE8 */
}

.ui-widget-shadow {
  margin: -8px 0 0 -8px;
  padding: 8px;
  opacity: 0.3;
  filter: Alpha(Opacity=30); /* support: IE8 */
  border-radius: 8px;
}

.mtz-monthpicker-year {
  padding: 0.5em 1em;
}

#contents {
  min-width: 315px;
}
#contents > header hgroup {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents > header hgroup h1 {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#contents > header hgroup h2 {
  font-weight: 400;
}
#contents > header hgroup a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  position: absolute;
  right: 20px;
}
#contents > header hgroup a::before, #contents > header hgroup a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents > header hgroup a:not(:disabled):hover, #contents > header hgroup a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents > header hgroup a:not(:disabled):hover::before, #contents > header hgroup a:not(:disabled):hover::after, #contents > header hgroup a:not(:disabled):focus::before, #contents > header hgroup a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents > header hgroup a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents > header hgroup a::before {
    margin-right: 10px;
  }
  #contents > header hgroup a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents > header hgroup a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents > header hgroup a::before {
    margin-right: 14px;
  }
  #contents > header hgroup a::after {
    margin-left: 18px;
  }
}
#contents > header .vi {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  overflow: hidden;
  border-radius: 0 0 0 50px;
  background-position: 64%;
  background-size: cover;
}
#contents > header .vi p {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 100;
  word-break: keep-all;
  color: #fff;
}
#contents > header .vi .desc {
  margin-top: 20px;
  font-size: 18px;
}
#contents > header .breadcrumb {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  color: #666;
}
#contents > header .breadcrumb > li {
  position: relative;
}
#contents > header .breadcrumb > li + li::before {
  content: "";
  left: 0;
  width: 1px;
  height: 11px;
  background: #dcdcdc;
}
#contents > header .breadcrumb > li button {
  position: relative;
  padding-right: 20px;
  text-align: left;
}
#contents > header .breadcrumb > li button::before, #contents > header .breadcrumb > li button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 12px;
  height: 1px;
  background: #666;
}
#contents > header .breadcrumb > li button::after {
  transform: rotate(90deg);
}
#contents > header .breadcrumb > li button::before, #contents > header .breadcrumb > li button::after {
  left: unset;
}
#contents > header .breadcrumb > li button::after {
  transition: all 0.2s ease-in-out;
}
#contents > header .breadcrumb > li button.active {
  font-weight: 700;
  color: #212121;
}
#contents > header .breadcrumb > li button.active + div {
  max-height: 400px;
}
#contents > header .breadcrumb > li button.active::before {
  background: #212121;
}
#contents > header .breadcrumb > li button.active::after {
  opacity: 0;
}
#contents > header .breadcrumb > li > a:hover,
#contents > header .breadcrumb > li > a.focus {
  color: #212121;
}
#contents > header .breadcrumb > li > div {
  position: absolute;
  left: -20px;
  max-height: 0;
  padding: 0 20px;
  overflow: hidden;
  transition: max-height 0.4s ease-in-out;
}
#contents > header .breadcrumb > li > div ul {
  z-index: 3;
  position: relative;
  margin-top: 1.125em;
  margin-bottom: 20px;
  padding-top: 1em;
  padding-bottom: 1em;
  -ms-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.102);
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.102);
  background: #fff;
  line-height: 2.5em;
  white-space: nowrap;
}
#contents > header .breadcrumb > li > div ul a:hover,
#contents > header .breadcrumb > li > div ul a:focus,
#contents > header .breadcrumb > li > div ul li.selected {
  color: #4415a0;
}
#contents > header .breadcrumb > li > div ul li.selected {
  font-weight: 700;
}
#contents > header .breadcrumb > li > div ul::before {
  content: "";
  position: absolute;
  top: -32px;
  display: block;
  -moz-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.102));
  -ms-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.102));
  -o-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.102));
  filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.102));
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 8px;
  border-color: transparent transparent #fff transparent;
}
@media (min-width: 1025px) {
  #contents > header .vi {
    height: 520px;
  }
  #contents > header .breadcrumb {
    height: 60px;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: -0.03em;
  }
  #contents > header .breadcrumb > li {
    margin-left: 25px;
    padding-left: 25px;
  }
  #contents > header .breadcrumb > li:nth-child(2) button {
    min-width: 85px;
  }
  #contents > header .breadcrumb > li:last-child button {
    min-width: 120px;
  }
  #contents > header .breadcrumb > li > div {
    right: -45px;
  }
  #contents > header .breadcrumb > li > div ul {
    padding-left: 25px;
  }
  #contents > header .breadcrumb > li > div ul::before {
    right: 22px;
  }
  #contents > header hgroup {
    padding-top: 20px;
    padding-bottom: 90px;
  }
  #contents > header hgroup a {
    top: 30px;
  }
}
@media (max-width: 1024px) {
  #contents > header .vi {
    height: 250px;
  }
  #contents > header .breadcrumb {
    height: 50px;
    font-size: 13px;
    line-height: 23px;
    letter-spacing: -0.02em;
  }
  #contents > header .breadcrumb > li {
    margin-left: 15px;
    padding-left: 15px;
  }
  #contents > header .breadcrumb > li button {
    min-width: 100px;
  }
  #contents > header .breadcrumb > li > div {
    right: -35px;
  }
  #contents > header .breadcrumb > li > div ul {
    padding-left: 15px;
  }
  #contents > header .breadcrumb > li > div ul::before {
    right: 12px;
  }
  #contents > header hgroup {
    padding-top: 10px;
    padding-bottom: 40px;
  }
  #contents > header hgroup a {
    top: 10px;
  }
}
@media (max-width: 480px) {
  #contents > header .vi {
    height: 110px;
  }
  #contents > header .vi p {
    display: none;
  }
  #contents > header .breadcrumb {
    display: none;
  }
  #contents > header hgroup {
    padding-top: 48px;
  }
  #contents > header hgroup a {
    top: 48px;
  }
}

#detailContents {
  min-width: 315px;
}
#detailContents > header {
  word-break: keep-all;
}
#detailContents > header .img img {
  display: block;
  width: 100%;
}
#detailContents > header .modifier {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents > header .modifier button.share {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  background: url("../images/icon/iconShareBig.svg") no-repeat center;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.45;
}
#detailContents > header .modifier button.share.active, #detailContents > header .modifier button.share:hover, #detailContents > header .modifier button.share:focus {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
@media (min-width: 1025px) {
  #detailContents > header .modifier {
    padding-bottom: 24px;
  }
  #detailContents > header .modifier button.share {
    position: absolute;
    right: 20px;
    width: 40px;
    height: 40px;
  }
  #detailContents > header .modifier div.share {
    right: 20px;
    margin-top: 60px;
  }
  #detailContents > header .modifier p {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 300;
  }
}
@media (max-width: 1024px) {
  #detailContents > header .modifier {
    padding-bottom: 7px;
  }
  #detailContents > header .modifier button.share {
    margin-bottom: 17px;
    width: 30px;
    height: 30px;
  }
  #detailContents > header .modifier p {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
  }
}
#detailContents > header hgroup {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents > header hgroup *:not(.title):not(.modifier) {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#detailContents > header .modifier + hgroup .title {
  padding-top: 0 !important;
}

.container.heading {
  padding-top: 0;
}
.container:last-of-type {
  padding-bottom: 80px;
}
.container > .inner {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 50px;
}
.container > .inner > .tit {
  display: block;
  padding: 0 0 15px;
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
}
.container > .inner > .desc {
  color: #666;
  font-size: 16px;
  line-height: 26px;
  word-break: keep-all;
}
@media (min-width: 1025px) {
  .container:last-of-type {
    padding-bottom: 150px;
  }
  .container > .inner {
    padding-top: 100px;
  }
  .container > .inner > .tit {
    padding-bottom: 25px;
    font-size: 30px;
    line-height: 42px;
  }
  .container > .inner > .desc {
    font-size: 18px;
    line-height: 30px;
  }
}

body.scrollingUp #header, body.scrollingUp #groupHeader {
  position: sticky;
  top: 0;
}

body.scrollingDown #header .menu::before, body.scrollingDown #header .menu::after {
  display: none;
}
body.scrollingDown #header .menu > ul ul, body.scrollingDown #header .menu > ul::before, body.scrollingDown #header .menu > ul::after, body.scrollingDown #header .menu aside {
  transition: none !important;
}

#header.scrolling, #groupHeader.scrolling {
  border-bottom: 1px solid #e5e5e5;
}

#header {
  z-index: 11;
  top: 0;
  top: calc(constant(safe-area-inset-top) + 0);
  top: calc(env(safe-area-inset-top) + 0);
  left: 0;
  width: 100%;
  background: #fff;
  transition: all 0.3s linear;
}
#header > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}
#header h1 {
  position: relative;
}
#header h1 span {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#header h1 a {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#header h1 img {
  left: 0;
  display: block;
  width: 100%;
}
#header h1 img.groupLogo {
  width: 35px;
  height: 35px;
}
#header > div > button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  background: url("../../resources/images/icon/header_menu.png") no-repeat center;
}
#header > div > button::before, #header > div > button::after {
  z-index: 1;
  content: "";
  position: absolute;
  opacity: 0;
  transition: all 0.5s;
}
#header > div > button.active {
  background: none;
}
#header > div > button.active::before, #header > div > button.active::after {
  opacity: 1;
}
@media (min-width: 1025px) {
  #header > div {
    height: 91px;
    padding-top: 32px;
  }
  #header h1 {
    margin-top: -7px;
    width: 162px;
    height: 39px;
  }
  #header > div > button {
    right: 17px;
    width: 30px;
    height: 30px;
    background-size: 23px auto;
  }
  #header > div > button::before, #header > div > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 30px;
    height: 1px;
    background: #000;
  }
  #header > div > button::before {
    transform: rotate(45deg);
  }
  #header > div > button::after {
    transform: rotate(-45deg);
  }
  #header .wideOnly {
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    position: absolute;
  }
  #header .menu {
    z-index: 11;
    position: absolute;
    right: 90px;
    top: 0;
  }
  #header .menu > ul {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  #header .menu > ul > li {
    position: relative;
    font-size: 16px;
    letter-spacing: -0.015em;
  }
  #header .menu > ul > li a:hover, #header .menu > ul > li a:focus {
    color: #4415a0;
  }
  #header .menu > ul > li > a {
    display: block;
    padding: 0 35px;
    font-weight: 700;
    line-height: 91px;
  }
}
@media (min-width: 1025px) and (max-width: 1100px) {
  #header .menu > ul > li > a {
    padding: 0 30px;
  }
}
@media (min-width: 1025px) {
  #header .menu > ul > li > a::before {
    z-index: 3;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    display: block;
    margin: auto;
    width: 0;
    height: 3px;
    background: #4415a0;
  }
  #header .menu > ul > li > button {
    display: none;
  }
  #header .menu > ul > li.active > a {
    color: #4415a0;
  }
  #header .menu > ul > li.active > a::before {
    width: 99px;
  }
  #header .menu > ul ul {
    z-index: 3;
    position: absolute;
    left: 0;
    right: 0;
    max-height: 0;
    padding-top: 40px;
    overflow: hidden;
    border-top: 1px solid transparent;
    text-align: center;
    line-height: 2.375em;
    color: #666;
    transition: max-height 0.6s ease-in-out;
  }
  #header .menu > ul ul li.active a {
    color: #4415a0;
  }
  #header .menu::before {
    content: "";
    z-index: 1;
    top: 80px;
    top: calc(constant(safe-area-inset-top) + 80px);
    top: calc(env(safe-area-inset-top) + 80px);
    height: 10px;
    background: #fff;
  }
  #header .menu::after {
    top: 90px;
    top: calc(constant(safe-area-inset-top) + 90px);
    top: calc(env(safe-area-inset-top) + 90px);
    height: 310px;
    background: #fbfbfb;
    border-top: 1px solid #fff;
  }
  #header .menu::before, #header .menu::after {
    position: fixed;
    left: "0px";
    left: calc(constant(safe-area-inset-left) + 0px);
    left: calc(env(safe-area-inset-left) + 0px);
    right: "0px";
    right: calc(constant(safe-area-inset-right) + 0px);
    right: calc(env(safe-area-inset-right) + 0px);
    display: block;
  }
  #header .menu::after, #header .menu > ul::before, #header .menu > ul::after {
    content: "";
    max-height: 0;
    overflow: hidden;
    transition: all 0.6s ease-in-out;
  }
  #header .menu > ul::before, #header .menu > ul::after {
    z-index: 2;
    display: block;
    height: 309px;
  }
  #header .menu > ul::before {
    /*
    position: fixed;
    @include notchCalc(top, top, $wHeaderHeight+1);
    @include notchCalc(left, left, '0px');
    width: 50%;
    */
    position: absolute;
    right: 0;
    top: 90px;
    margin-top: 1px;
    width: 100vw;
    background: #fff;
  }
  #header .menu > ul::after {
    position: absolute;
    left: -55px;
    top: 91px;
    right: 0;
    width: 100vw;
    background: #fbfbfb;
  }
  #header .menu aside {
    z-index: 2;
    position: absolute;
    top: 90px;
    left: -325px;
    /*
    left: 0;
    right: 0;
    @include container;
    */
    max-height: 0;
    overflow: hidden;
    transition: all 0.6s ease-in-out;
  }
}
@media (min-width: 1025px) and (max-width: 1210px) {
  #header .menu aside {
    left: -290px;
  }
}
@media (min-width: 1025px) and (max-width: 1180px) {
  #header .menu aside {
    left: -250px;
  }
}
@media (min-width: 1025px) and (max-width: 1140px) {
  #header .menu aside {
    left: -220px;
  }
}
@media (min-width: 1025px) and (max-width: 1100px) {
  #header .menu aside {
    left: -250px;
  }
}
@media (min-width: 1025px) and (max-width: 1080px) {
  #header .menu aside {
    left: -230px;
  }
}
@media (min-width: 1025px) and (max-width: 1060px) {
  #header .menu aside {
    left: -210px;
  }
}
@media (min-width: 1025px) and (max-width: 1040px) {
  #header .menu aside {
    left: -190px;
  }
}
@media (min-width: 1025px) {
  #header .menu aside .swiper {
    margin-left: 0;
    margin-right: 0;
    width: 230px;
    padding: 40px 0 70px;
  }
  #header .menu aside .swiper img:last-child {
    display: none;
  }
  #header .menu aside .swiper .swiper-pagination {
    bottom: 30px;
  }
  #header .menu.opened::after {
    -ms-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.278);
    -o-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.278);
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.278);
    border-top: 1px solid #e5e5e5;
  }
  #header .menu.opened::after, #header .menu.opened > ul::before, #header .menu.opened > ul::after, #header .menu.opened > ul ul, #header .menu.opened aside {
    max-height: 400px;
  }
  #header .menu.asset > ul > li > a {
    padding: 0 25px;
  }
}
@media (min-width: 1025px) and (max-width: 1160px) {
  #header .menu.asset {
    right: 55px;
  }
}
@media (min-width: 1025px) and (max-width: 1160px) and (max-width: 1085px) {
  #header .menu.asset > ul > li > a {
    font-size: 15px;
  }
}
@media (max-width: 1024px) {
  #header > div {
    height: 60px;
    padding-top: 14px;
  }
  #header h1 {
    margin-left: 10px;
    width: 138px;
    height: 33px;
  }
  #header > div > button {
    right: 28px;
    width: 25px;
    height: 25px;
    background-size: 20px auto;
  }
  #header > div > button::before, #header > div > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 25px;
    height: 1px;
    background: #000;
  }
  #header > div > button::before {
    transform: rotate(45deg);
  }
  #header > div > button::after {
    transform: rotate(-45deg);
  }
  #header .menu {
    z-index: 9999;
    position: fixed;
    top: 60px;
    top: calc(constant(safe-area-inset-top) + 60px);
    top: calc(env(safe-area-inset-top) + 60px);
    left: "100%";
    left: calc(constant(safe-area-inset-left) + 100%);
    left: calc(env(safe-area-inset-left) + 100%);
    width: 100%;
    min-width: 315px;
    height: calc(100vh - 60px);
    height: calc(var(--vh, 1vh) * 100 - 60px);
    overflow-y: auto;
    overflow-x: hidden;
    border-top: 1px solid #e5e5e5;
    background: #fff;
    transition: all 0.3s ease-in-out;
  }
  #header .menu.opened {
    left: "0px";
    left: calc(constant(safe-area-inset-left) + 0px);
    left: calc(env(safe-area-inset-left) + 0px);
  }
  #header .menu > ul {
    min-height: calc(100vh - 60px - 131px);
    min-height: calc(var(--vh, 1vh) * 100 - 60px - 131px);
    padding: 20px 30px;
  }
  #header .menu > ul > li {
    position: relative;
    padding-top: 20px;
  }
  #header .menu > ul > li > button, #header .menu > ul > li > a {
    display: block;
    margin-bottom: 20px;
    width: 100%;
    text-align: left;
    font-size: 20px;
    line-height: 34px;
  }
  #header .menu > ul > li > button + a, #header .menu > ul > li > a + a {
    display: none;
  }
  #header .menu > ul > li.active > a, #header .menu > ul > li.opened > a, #header .menu > ul > li.active > button, #header .menu > ul > li.opened > button {
    color: #4415a0;
  }
  #header .menu > ul > li ul {
    margin-left: -30px;
    margin-right: -30px;
    max-height: 0;
    padding: 0 30px 0 52px;
    overflow: hidden;
    background: #fbfbfb;
    border-top: 1px dashed #fbfbfb;
    transition: all 0.6s;
  }
  #header .menu > ul > li ul::before, #header .menu > ul > li ul::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 17px;
    height: 1px;
    background: #707070;
  }
  #header .menu > ul > li ul::after {
    transform: rotate(90deg);
  }
  #header .menu > ul > li ul::before, #header .menu > ul > li ul::after {
    left: unset;
    bottom: unset;
    top: 36px;
    opacity: 1;
    transition: all 0.5s;
  }
  #header .menu > ul > li ul li {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.25em;
    color: #666;
  }
  #header .menu > ul > li ul li:last-child {
    margin-bottom: 20px;
  }
  #header .menu > ul > li ul li.active a, #header .menu > ul > li ul li a:hover, #header .menu > ul > li ul li a:focus {
    color: #4415a0;
  }
  #header .menu > ul > li.opened ul {
    max-height: 300px;
    border-top: 1px dashed #f2f2f2;
  }
  #header .menu > ul > li.opened ul::before {
    background: #4415a0;
  }
  #header .menu > ul > li.opened ul::after {
    opacity: 0;
  }
  #header .menu aside {
    display: none !important;
    padding-top: 10px;
  }
  #header .menu aside .swiper {
    height: 120px;
  }
  #header .menu aside .swiper li {
    position: relative;
    overflow: hidden;
  }
  #header .menu aside .swiper li img:first-child {
    display: none;
  }
  #header .menu aside .swiper li img:last-child {
    position: absolute;
    left: 50%;
    display: block;
    margin-left: -512px;
    width: 1024px;
  }
  #header .menu aside .swiper .swiper-pagination {
    bottom: 15px;
  }
}

#groupHeader {
  z-index: 11;
  background: #fff;
}
#groupHeader::before {
  z-index: -9999;
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
}
@media (min-width: 1025px) {
  #groupHeader.opened::before {
    z-index: 11;
    right: 0;
    bottom: 0;
    opacity: 1;
  }
}
#groupHeader > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 1025px) {
  #groupHeader > div {
    height: 90px;
  }
}
@media (max-width: 1024px) {
  #groupHeader > div {
    height: 60px;
  }
}
#groupHeader > div h1 {
  z-index: 11;
  position: relative;
}
#groupHeader > div h1 #websiteTitle {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#groupHeader > div h1 a {
  display: block;
}
@media (min-width: 1025px) {
  #groupHeader > div h1 a {
    width: 33px;
  }
}
@media (max-width: 1024px) {
  #groupHeader > div h1 a {
    width: 17px;
  }
}
#groupHeader > div h1 a img {
  display: block;
  width: 100%;
}
#groupHeader > div button {
  z-index: 11;
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  background: url("../../resources/images/icon/header_menu.png") no-repeat center;
}
@media (min-width: 1025px) {
  #groupHeader > div button {
    width: 30px;
    height: 30px;
    background-size: 23px auto;
  }
}
@media (max-width: 1024px) {
  #groupHeader > div button {
    width: 20px;
    height: 20px;
    background-size: 20px auto;
  }
}
#groupHeader .menu {
  z-index: 99;
  position: fixed;
  top: 0;
  bottom: 0;
  right: "-100%";
  right: calc(constant(safe-area-inset-right) + -100%);
  right: calc(env(safe-area-inset-right) + -100%);
  background: #fff;
  transition: all 0.3s ease-in-out;
  overflow-y: auto;
}
#groupHeader .menu.opened {
  right: "0px";
  right: calc(constant(safe-area-inset-right) + 0px);
  right: calc(env(safe-area-inset-right) + 0px);
}
@media (min-width: 1025px) {
  #groupHeader .menu {
    width: 800px;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu {
    width: 100%;
  }
}
#groupHeader .menu > div {
  position: relative;
  min-height: calc(100vh + 0px);
  min-height: calc(var(--vh, 1vh) * 100 + 0px);
}
@media (min-width: 1025px) {
  #groupHeader .menu > div {
    padding-top: 80px;
    padding-bottom: 188px;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu > div {
    padding-top: 40px;
    padding-left: 40px;
  }
}
#groupHeader .menu > div > button {
  position: absolute;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  /*&::before,&::after {
      z-index: 1;
      content: '';
      position: absolute;
      opacity: 0;
      @include prefix(transition, all .5s);
  }*/
}
@media (min-width: 1025px) {
  #groupHeader .menu > div > button {
    top: 32px;
    right: 80px;
    width: 30px;
    height: 30px;
  }
  #groupHeader .menu > div > button::before, #groupHeader .menu > div > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 30px;
    height: 1px;
    background: #000;
  }
  #groupHeader .menu > div > button::before {
    transform: rotate(45deg);
  }
  #groupHeader .menu > div > button::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu > div > button {
    top: 20px;
    right: 20px;
    width: 23px;
    height: 23px;
  }
  #groupHeader .menu > div > button::before, #groupHeader .menu > div > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 25px;
    height: 1px;
    background: #000;
  }
  #groupHeader .menu > div > button::before {
    transform: rotate(45deg);
  }
  #groupHeader .menu > div > button::after {
    transform: rotate(-45deg);
  }
}
#groupHeader .menu section {
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 1025px) {
  #groupHeader .menu section {
    width: 640px;
  }
  #groupHeader .menu section::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
}
#groupHeader .menu section + section {
  border-top: 1px dashed #c8c8c8;
}
@media (min-width: 1025px) {
  #groupHeader .menu section + section {
    margin-top: 28px;
    padding-top: 33px;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu section + section {
    margin-top: 18px;
    padding-top: 23px;
  }
}
@media (min-width: 1025px) {
  #groupHeader .menu section h2 {
    float: left;
    width: 180px;
    padding-top: 2px;
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu section h2 {
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
}
#groupHeader .menu section ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  color: #212121;
}
@media (min-width: 1025px) {
  #groupHeader .menu section ul {
    float: right;
    width: 460px;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu section ul {
    padding-top: 2px;
  }
}
@media (min-width: 1025px) {
  #groupHeader .menu section ul li {
    width: 155px;
  }
  #groupHeader .menu section ul li:nth-child(3n) {
    width: 145px;
  }
  #groupHeader .menu section ul li + li + li + li {
    padding-top: 10px;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu section ul li {
    width: 50%;
    max-width: 160px;
    padding-top: 10px;
  }
}
#groupHeader .menu section ul li.active, #groupHeader .menu section ul li a:hover {
  color: #4415a0;
}
#groupHeader .menu aside::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
@media (min-width: 1025px) {
  #groupHeader .menu aside {
    position: absolute;
    bottom: 20px;
    right: 0;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu aside {
    padding-top: 38px;
  }
}
@media (min-width: 1025px) {
  #groupHeader .menu aside .swiper {
    float: right;
    width: 719px;
    height: 145px;
  }
}
#groupHeader .menu aside li img {
  display: block;
}
@media (min-width: 1025px) {
  #groupHeader .menu aside li img:last-child {
    display: none;
  }
}
@media (max-width: 1024px) {
  #groupHeader .menu aside li img {
    width: 100%;
  }
  #groupHeader .menu aside li img:first-child {
    display: none;
  }
}

body.groupMain #groupHeader {
  background: transparent !important;
  border-bottom: none !important;
}
@media (min-width: 1025px) {
  body.groupMain #groupHeader h1 {
    width: 34px;
    height: 36px;
    background: url("../images/shinyoungGroup/common/group_logo_white.svg") no-repeat center;
  }
  body.groupMain #groupHeader h1 img {
    display: none;
  }
}

#detailHeader {
  position: relative;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
}
#detailHeader > h1 {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#detailHeader > button {
  position: absolute;
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  #detailHeader > button {
    top: 100px;
    right: 107px;
    width: 48px;
    height: 48px;
  }
  #detailHeader > button::before, #detailHeader > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 23px;
    height: 1px;
    background: #fff;
  }
  #detailHeader > button::before {
    transform: rotate(45deg);
  }
  #detailHeader > button::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  #detailHeader > button {
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
  }
  #detailHeader > button::before, #detailHeader > button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #fff;
  }
  #detailHeader > button::before {
    transform: rotate(45deg);
  }
  #detailHeader > button::after {
    transform: rotate(-45deg);
  }
}

#footer {
  z-index: 9;
  position: relative;
  background: #141642;
}
#footer > div {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#footer > div > h1 {
  width: 159px;
  height: 38px;
}
#footer > div > h1 img {
  display: block;
}
#footer .banners {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#footer .banners a {
  background-repeat: no-repeat;
  background-size: 60px auto;
  font-size: 16px;
  line-height: 20px;
  color: #fff;
}
#footer .banners a + a {
  margin-left: 15px;
}
#footer .banners a.story {
  background-color: #4b47b5;
  background-image: url("../images/common/imgFooterBanner01.svg");
}
#footer .banners a.story.asset {
  background-image: url("../images/common/imgFooterBanner04.svg");
}
#footer .banners a.brochure {
  background-color: #3EC3FF;
  background-image: url("../images/common/imgFooterBanner02.png");
}
#footer .banners a.newsletter {
  background-color: #6d4aaf;
  background-image: url("../images/common/imgFooterBanner03.png");
}
#footer .banners a.newsletter.asset {
  background-image: url("../images/common/imgFooterBanner05.svg");
}
#footer .banners a.newsletter.enc {
  background-image: url("../images/common/imgFooterBanner06.svg");
}
#footer .banners a span {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
  font-weight: 900;
}
#footer nav section {
  position: relative;
  padding-left: 113px;
}
#footer nav section + section {
  margin-top: 20px;
}
#footer nav section h1 {
  position: absolute;
  top: 2px;
  left: 0;
  vertical-align: middle;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #fff;
}
#footer nav section a {
  vertical-align: middle;
  font-size: 14px;
  line-height: 28px;
  letter-spacing: 0;
  color: #b2b2b2;
}
#footer nav section a:hover, #footer nav section a:focus {
  color: #0097e0;
}
#footer nav a,
#footer address *:not(.case) {
  position: relative;
}
#footer nav a:not(:last-child),
#footer address *:not(.case):not(:last-child) {
  margin-right: 10px;
}
#footer nav a:not(:last-child)::after,
#footer address *:not(.case):not(:last-child)::after {
  content: "";
  position: relative;
  top: 1px;
  display: inline-block;
  margin-left: 10px;
  width: 1px;
  height: 11px;
  background: #404040;
}
#footer address hr {
  display: block;
  padding-left: 0;
}
#footer address hr::after {
  display: none;
}
#footer address *,
#footer > div > p {
  font-size: 13px;
  line-height: 30px;
  letter-spacing: 0;
  color: #949494;
}
#footer address button:hover,
#footer address button:focus {
  color: #0097e0;
}
#footer .sns {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 82px;
}
#footer .sns a {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 33px;
  height: 33px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  transition: all 0.7s;
}
#footer .sns a.youtube {
  width: 38px;
  height: 38px;
  background-image: url("../images/icon/iconSnsYoutube.svg");
}
#footer .sns a.youtube:hover, #footer .sns a.youtube:focus {
  background-image: url("../images/icon/iconSnsYoutubeOver.svg");
}
#footer .sns a.instagram {
  background-image: url("../images/icon/iconSnsInstagram.svg");
}
#footer .sns a.instagram:hover, #footer .sns a.instagram:focus {
  background-image: url("../images/icon/iconSnsInstagramOver.svg");
}
#footer .familySite > button {
  position: relative;
  height: 41px;
  padding-left: 10px;
  border-bottom: 1px solid #fff;
  text-align: left;
  font-size: 16px;
  color: #fff;
}
#footer .familySite > button::after {
  content: "";
  position: absolute;
  right: 10px;
  width: 12px;
  height: 12px;
  border-width: 1px 1px 0 0;
  border-color: #fff;
  border-style: solid;
  transform: rotate(135deg);
}
#footer .familySite ul {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  display: none;
  padding: 20px;
  background: #fff;
  -ms-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  -o-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.16);
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
}
@media (min-width: 1025px) {
  #footer .familySite {
    position: absolute;
    bottom: 8px;
    right: 20px;
  }
  #footer .familySite > button {
    width: 184px;
  }
}
@media (max-width: 1024px) {
  #footer .familySite {
    position: relative;
    margin-top: 35px;
  }
  #footer .familySite > button {
    width: 100%;
  }
}
#footer .jump2top {
  position: fixed;
}
#footer .jump2top button {
  border-radius: 50%;
  background: url("../images/shinyoung/home/btnTop.svg") no-repeat center;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
}
@media (min-width: 1025px) {
  #footer {
    padding-top: 120px;
    padding-bottom: 115px;
  }
  #footer.group {
    padding-top: 92px;
  }
  #footer:not(.group) > div > h1 {
    margin-bottom: 30px;
  }
  #footer .banners {
    float: left;
  }
  #footer .banners a {
    width: 132px;
    height: 170px;
    padding: 17px;
    background-position: bottom 15px right 15px;
  }
  #footer .banners a.enc {
    width: 205px;
  }
  #footer nav {
    float: right;
    width: calc(100% - 426px - 40px);
    max-width: 580px;
  }
  #footer nav section:first-child {
    margin-top: 7px;
  }
  #footer address {
    clear: both;
    padding-top: 50px;
  }
  #footer address hr.middleOnly {
    display: none !important;
  }
  #footer.group address {
    padding-top: 37px;
  }
  #footer .sns {
    position: absolute;
    right: 20px;
    bottom: 10px;
  }
}
@media (min-width: 1025px) and (min-width: 1025px) and (max-width: 1075px) {
  #footer .sns {
    bottom: -30px;
  }
}
@media (min-width: 1025px) {
  #footer .jump2top {
    bottom: 40px;
    right: 80px;
  }
  #footer .jump2top button {
    width: 60px;
    height: 60px;
  }
}
@media (max-width: 1024px) {
  #footer {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  #footer.group {
    padding-top: 70px;
  }
  #footer:not(.group) > div > h1 {
    margin-bottom: 20px;
  }
  #footer .banners a {
    width: calc(33.3333333333% - 10px);
    height: 100px;
    padding: 16px 15px;
    background-position: center right 15px;
  }
}
@media (max-width: 1024px) and (min-width: 481px) and (max-width: 600px) {
  #footer .banners a {
    height: 150px;
    background-position: bottom 10px right 10px;
  }
}
@media (max-width: 1024px) {
  #footer nav section:first-child {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #footer nav section {
    padding-top: 30px;
    padding-left: 0;
  }
  #footer nav section h1 {
    top: 0;
  }
}
@media (max-width: 1024px) {
  #footer address {
    padding-top: 35px;
  }
  #footer address * {
    line-height: 24px;
  }
  #footer address hr {
    height: 8px;
  }
  #footer address hr.wideOnly {
    display: none !important;
  }
  #footer address .caseMiddle::after {
    display: none !important;
  }
  #footer.group address {
    padding-top: 27px;
  }
  #footer > div > p {
    margin-top: 10px;
    line-height: 24px;
  }
  #footer .sns {
    margin-top: 40px;
  }
  #footer .jump2top {
    bottom: 20px;
    right: 20px;
  }
  #footer .jump2top button {
    width: 35px;
    height: 35px;
    background-size: 35px;
  }
}
@media (max-width: 480px) {
  #footer .banners a {
    width: 100%;
  }
  #footer .banners a + a {
    margin-top: 10px;
    margin-left: 0;
  }
}

@media (min-width: 1025px) {
  body.groupMain #footer.group {
    padding-top: 43px;
    padding-bottom: 43px;
    background: #fff;
  }
  body.groupMain #footer.group h1 {
    background: url("../images/shinyoungGroup/common/group_logo.svg") no-repeat left center;
    background-size: 30px;
  }
  body.groupMain #footer.group h1 img {
    display: none;
  }
  body.groupMain #footer.group address button, body.groupMain #footer.group p {
    color: #212121;
  }
  body.groupMain #footer.group .familySite > button {
    border-color: #212121;
    color: #212121;
  }
  body.groupMain #footer.group .familySite > button::after {
    border-color: #212121;
  }
}

#contents.mainSt > header .vi {
  background-image: url("../images/shinyoung/vi/viSpecial.jpg");
}

#contents.mainBa > header .vi {
  background-image: url("../images/shinyoung/vi/viBa.jpg");
}

#contents.mainBp > header .vi {
  background-image: url("../images/shinyoung/vi/viBp.jpg");
}

#contents.mainPr > header .vi {
  background-image: url("../images/shinyoung/vi/viPr.jpg");
}

#contents.mainAu > header .vi {
  background-image: url("../images/shinyoung/vi/viAu.jpg");
}

#contents.mainCr > header .vi {
  background-image: url("../images/shinyoung/vi/viCr.jpg");
}

#contents.assetSt > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viSt.jpg");
}

#contents.assetBa > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viBa.jpg");
}

#contents.assetBp > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viBp.jpg");
}

#contents.assetRs > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viRs.jpg");
}

#contents.assetPr > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viPr.jpg");
}

#contents.assetAu > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viAu.jpg");
}

#contents.assetCr > header .vi {
  background-image: url("../images/shinyoungAsset/vi/viCr.jpg");
}

#contents.encBa > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viBa.jpg");
}

#contents.encSc > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viSc.jpg");
}

#contents.encPr > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viPr.jpg");
}

#contents.encCt > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viCt.jpg");
}

#contents.encAu > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viAu.jpg");
}

#contents.encCr > header .vi {
  background-image: url("../images/shinyoungEnc/vi/viCr.jpg");
}

#contents.groupSt > header .vi {
  background-image: url("../images/shinyoungGroup/vi/viSt.jpg");
}

#contents.groupBd > header .vi {
  background-image: url("../images/shinyoungGroup/vi/viBd.jpg");
}

#contents.groupGr > header .vi {
  background-image: url("../images/shinyoungGroup/vi/viGr.png");
}

#contents.groupPr > header .vi {
  background-image: url("../images/shinyoungGroup/vi/viPr.jpg");
}

#contents.groupCr > header .vi {
  background-image: url("../images/shinyoungGroup/vi/viCr.jpg");
}

body.animationStart {
  overflow: hidden;
}
body.animationStart #contents.home.mainHome .vi h1 {
  top: -350px;
  color: #4415a0;
}

body.animationMid {
  overflow: hidden;
}
body.animationMid #contents.home.mainHome .vi h1 {
  color: #4415a0;
}
@media (min-width: 1025px) {
  body.animationMid #contents.home.mainHome .vi .viSlide, body.animationMid #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 786px;
    mask-size: 786px;
  }
}
@media (max-width: 1024px) {
  body.animationMid #contents.home.mainHome .vi .viSlide, body.animationMid #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 100vw;
    mask-size: 100vw;
  }
}

body.animationMid2 {
  overflow: hidden;
}
@media (min-width: 1025px) {
  body.animationMid2 #contents.home.mainHome .vi .viSlide, body.animationMid2 #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 100vw;
    mask-size: 100vw;
  }
}
@media (max-width: 1024px) {
  body.animationMid2 #contents.home.mainHome .vi .viSlide, body.animationMid2 #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 150vw;
    mask-size: 150vw;
  }
}

@media (min-width: 1025px) {
  body.animationEnd #contents.home.mainHome .vi .viSlide, body.animationEnd #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 150vw;
    mask-size: 150vw;
  }
}
@media (max-width: 1024px) {
  body.animationEnd #contents.home.mainHome .vi .viSlide, body.animationEnd #contents.home.mainHome .vi .vod {
    -webkit-mask-size: 500vw;
    mask-size: 500vw;
  }
}

#contents.home {
  /*
  &.assetHome,
  &.encHome,
  &.mainHome {
      @include wide {
          @media (max-width: 1357px) {
              .vi h1,.performanceList,.news>div {
                  width: 100%;
                  max-width: 100%;
                  padding-left: 70px;
              }
          }
      }
  }
  */
}
#contents.home.mainHome .viSlide, #contents.home.mainHome .vod {
  -webkit-mask-image: url("../images/common/mask.svg");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-image: url("../images/common/mask.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  transition: all 1s;
}
@media (min-width: 1025px) {
  #contents.home.mainHome .viSlide, #contents.home.mainHome .vod {
    -webkit-mask-size: 478px;
    mask-size: 478px;
  }
}
@media (max-width: 1024px) {
  #contents.home.mainHome .viSlide, #contents.home.mainHome .vod {
    -webkit-mask-size: 75vw;
    mask-size: 75vw;
  }
}
@media (min-width: 1025px) {
  #contents.home.mainHome .performance ul li.selected:first-child {
    background-image: url("../images/shinyoung/home/imgPerformance.jpg");
  }
  #contents.home.mainHome .performance ul li.selected:nth-child(2) {
    background-image: url("../images/shinyoung/home/imgPerformance2.jpg");
  }
  #contents.home.mainHome .performance ul li.selected:nth-child(3) {
    background-image: url("../images/shinyoung/home/imgPerformance3.jpg");
  }
}
@media (max-width: 1024px) {
  #contents.home.mainHome .performance ul li.selected::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 300%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  #contents.home.mainHome .performance ul li.selected:first-child::after {
    top: 0;
    background-image: url("../images/shinyoung/home/imgPerformanceMobile.png");
  }
  #contents.home.mainHome .performance ul li.selected:nth-child(2)::after {
    top: -100%;
    background-image: url("../images/shinyoung/home/imgPerformance2.jpg");
  }
  #contents.home.mainHome .performance ul li.selected:last-child::after {
    bottom: 0;
    background-image: url("../images/shinyoung/home/imgPerformance3.jpg");
  }
}
@media (min-width: 1025px) {
  #contents.home.assetHome .performance ul li.selected:first-child {
    background-image: url("../images/shinyoungAsset/home/imgPerformance.jpg");
  }
  #contents.home.assetHome .performance ul li.selected:nth-child(2) {
    background-image: url("../images/shinyoungAsset/home/imgPerformance2.jpg");
  }
}
@media (max-width: 1024px) {
  #contents.home.assetHome .performance ul li.selected::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 200%;
    background-size: cover;
    background-repeat: no-repeat;
  }
  #contents.home.assetHome .performance ul li.selected:first-child::after {
    top: 0;
    background-image: url("../images/shinyoungAsset/home/imgPerformance.jpg");
  }
  #contents.home.assetHome .performance ul li.selected:last-child::after {
    bottom: 0;
    background-image: url("../images/shinyoungAsset/home/imgPerformance2.jpg");
  }
}
#contents.home.assetHome .jump {
  background-image: url("../images/shinyoungAsset/home/bgShortcut.jpg");
}
@media (max-width: 1024px) {
  #contents.home.assetHome .jump {
    background-size: cover;
  }
}
@media (min-width: 1025px) {
  #contents.home.assetHome .jump ul li + li {
    padding-left: 34px;
  }
}
@media (min-width: 1025px) {
  #contents.home.encHome .performance ul li.selected:first-child {
    background-image: url("../images/shinyoungEnc/home/imgPerformance.jpg");
  }
  #contents.home.encHome .performance ul li.selected:nth-child(2) {
    background-image: url("../images/shinyoungEnc/home/imgPerformance2.jpg");
  }
  #contents.home.encHome .performance ul li.selected:nth-child(3) {
    background-image: url("../images/shinyoungEnc/home/imgPerformance3.jpg");
  }
  #contents.home.encHome .performance ul li.selected:nth-child(4) {
    background-image: url("../images/shinyoungEnc/home/imgPerformance4.jpg");
  }
}
@media (max-width: 1024px) {
  #contents.home.encHome .performance ul li.selected::after {
    z-index: -1;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 400%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  #contents.home.encHome .performance ul li.selected:first-child::after {
    top: 0;
    background-image: url("../images/shinyoungEnc/home/imgPerformance.jpg");
  }
  #contents.home.encHome .performance ul li.selected:nth-child(2)::after {
    top: -100%;
    background-image: url("../images/shinyoungEnc/home/imgPerformance2.jpg");
  }
  #contents.home.encHome .performance ul li.selected:nth-child(3)::after {
    top: -200%;
    background-image: url("../images/shinyoungEnc/home/imgPerformance3.jpg");
  }
  #contents.home.encHome .performance ul li.selected:last-child::after {
    bottom: 0;
    background-image: url("../images/shinyoungEnc/home/imgPerformance4.jpg");
  }
}
#contents.home.groupHome .vi::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, transparent 0%, transparent 78%, #404040 100%);
}
#contents.home.groupHome .vi h1 {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
}
#contents.home.groupHome .vi h1 .groupTxt {
  display: none;
  width: 100%;
  text-align: center;
}
@media (max-width: 1024px) {
  #contents.home.groupHome .vi h1 {
    padding-bottom: 150px !important;
  }
}
@media (max-width: 1024px) {
  #contents.home.groupHome .vi .vod {
    height: calc(100vh - 60px);
    height: calc(var(--vh, 1vh) * 100 - 60px);
    max-height: 705px;
    min-height: 400px;
  }
}
@media (min-width: 1025px) {
  #contents.home.groupHome {
    margin-top: -90px;
  }
  #contents.home.groupHome .vi .viSlide .viPagination {
    bottom: 50px;
  }
  #contents.home.groupHome .vi .groupTxt {
    margin-bottom: 15px;
  }
}
@media (max-width: 1024px) {
  #contents.home.groupHome .vi .viSlide .viPagination {
    bottom: 30px;
  }
  #contents.home.groupHome .vi .groupTxt {
    margin-bottom: 50px;
  }
  #contents.home.groupHome .vi .groupTxt img {
    width: 329px;
    max-width: 90%;
  }
}
#contents.home .pageNav {
  z-index: 10;
}
#contents.home .vi {
  z-index: 9;
  position: relative;
  overflow: hidden;
}
#contents.home .vi h1 {
  z-index: 2;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: auto;
  margin-bottom: auto;
  font-weight: 700;
  line-height: 1.3;
  word-break: keep-all;
  pointer-events: none;
  color: #fff;
  transition: all 1s;
}
@media (min-width: 1025px) {
  #contents.home .vi h1 {
    padding-bottom: 49px;
    font-size: 70px;
  }
}
@media (max-width: 1024px) {
  #contents.home .vi h1 {
    padding-bottom: 60px;
    font-size: 30px;
  }
  #contents.home .vi h1 br.narrowOnly {
    display: none;
  }
}
#contents.home .vi > button {
  z-index: 2;
  position: absolute;
  left: 0;
  right: 0;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  margin: auto;
  background: url("../images/shinyoung/home/btnArr.svg") no-repeat center;
}
@media (min-width: 1025px) {
  #contents.home .vi > button {
    bottom: 56px;
    width: 75px;
    height: 70px;
  }
}
@media (max-width: 1024px) {
  #contents.home .vi > button {
    bottom: 50px;
    width: 55px;
    height: 50px;
    background-size: 100%;
  }
}
@media (max-width: 1024px) {
  #contents.home .vi > button {
    display: none !important;
  }
}
@media (min-width: 1025px) {
  #contents.home .vi .vod {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
    background-size: cover !important;
  }
  #contents.home .vi .vod video {
    z-index: -1;
    width: 100vw;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
  }
}
@media screen and (min-width: 1025px) and (max-aspect-ratio: 1219/685) {
  #contents.home .vi .vod video {
    width: 1920px;
  }
}
@media (max-width: 1024px) {
  #contents.home .vi .vod {
    height: 705px;
  }
  #contents.home .vi .vod video {
    height: 705px;
  }
}
#contents.home .vi .viSlide .swiper-slide {
  background-repeat: no-repeat;
  background-size: cover !important;
}
@media (min-width: 1025px) {
  #contents.home .vi .viSlide .swiper-slide {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
  }
}
@media (max-width: 1024px) {
  #contents.home .vi .viSlide .swiper-slide {
    height: 705px;
  }
}
#contents.home .vi .viSlide .viPagination {
  z-index: 1;
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
}
@media (min-width: 1025px) {
  #contents.home .vi .viSlide .viPagination {
    bottom: 155px;
  }
}
#contents.home .vi .groupLink {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  color: #fff;
}
#contents.home .vi .groupLink li {
  position: relative;
}
#contents.home .vi .groupLink li img {
  display: none;
}
#contents.home .vi .groupLink li a {
  transition: all 0.3s;
}
#contents.home .vi .groupLink li a:hover::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  -moz-backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  -o-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
#contents.home .vi .groupLink li a:hover img {
  display: unset;
}
#contents.home .vi .groupLink li a:hover p, #contents.home .vi .groupLink li a:hover img {
  z-index: 1;
  position: relative;
}
#contents.home .vi .groupLink li a:hover p {
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.home .vi .groupLink {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-end;
    bottom: 50px;
  }
  #contents.home .vi .groupLink li {
    width: calc(16.6666666667% - 20px);
  }
  #contents.home .vi .groupLink li + li {
    margin-left: 24px;
  }
  #contents.home .vi .groupLink li a {
    display: block;
    max-height: 40px;
    padding-top: 15px;
    border-top: 1px solid #fff;
    overflow: hidden;
    text-align: center;
  }
  #contents.home .vi .groupLink li a p {
    margin-bottom: 95px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
  #contents.home .vi .groupLink li a p span {
    display: none;
  }
  #contents.home .vi .groupLink li a:hover {
    max-height: 200px;
    padding-top: 35px;
    padding-bottom: 100px;
    border-top: 0;
  }
  #contents.home .vi .groupLink li a:hover p {
    padding-left: 20px;
    padding-right: 20px;
    /*span {
        position: relative;
        @include hiddenTxt;
        width: 15px;
        height: 15px;
        @include cross(cross, 15px, 1px, $invert);
    }*/
  }
}
@media (max-width: 1024px) {
  #contents.home .vi .groupLink {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  #contents.home .vi .groupLink li {
    width: 33.3333333333%;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
  }
  #contents.home .vi .groupLink li:not(:nth-child(3n-2)) {
    border-left: 1px solid rgba(255, 255, 255, 0.16);
  }
  #contents.home .vi .groupLink li a {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    height: 76px;
  }
  #contents.home .vi .groupLink li a img {
    margin-top: 15px;
    width: 77px;
  }
  #contents.home .vi .groupLink li a p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #contents.home .vi .groupLink li a p span {
    display: none;
  }
}
@media (min-width: 1025px) {
  #contents.home .groupBanner {
    border-bottom: 1px solid #c8c8c8;
  }
}
@media (min-width: 1025px) {
  #contents.home .groupBanner > div {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
}
#contents.home .groupBanner > div a {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  height: 80px;
  padding-left: 100px;
  padding-right: 30px;
  background-repeat: no-repeat;
  background-position: 30px center;
}
#contents.home .groupBanner > div a:first-child {
  background-image: url("../images/shinyoungGroup/home/iconHome1.svg");
}
#contents.home .groupBanner > div a:nth-child(2) {
  background-image: url("../images/shinyoungGroup/home/iconHome2.svg");
}
#contents.home .groupBanner > div a:last-child {
  background-image: url("../images/shinyoungGroup/home/iconHome3.svg");
}
#contents.home .groupBanner > div a::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #c8c8c8;
  border-style: solid;
  transform: rotate(-135deg);
}
@media (min-width: 1025px) {
  #contents.home .groupBanner > div a {
    width: 33.3333333333%;
  }
  #contents.home .groupBanner > div a + a {
    border-left: 1px solid #c8c8c8;
  }
}
@media (max-width: 1024px) {
  #contents.home .groupBanner > div a {
    width: 100%;
  }
  #contents.home .groupBanner > div a + a {
    border-top: 1px solid #c8c8c8;
  }
}
#contents.home .performance ul li {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.home .performance ul {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
  #contents.home .performance ul li {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
  }
  #contents.home .performance ul li.selected {
    width: 46.25%;
    padding: 0 50px 0 130px;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    color: #fff;
  }
  #contents.home .performance ul li.selected a {
    border-color: #fff;
  }
  #contents.home .performance ul li:not(.selected) {
    width: 26.875%;
    padding: 0 30px 0 50px;
  }
  #contents.home .performance ul li:not(.selected):first-child {
    padding-left: 80px;
  }
  #contents.home .performance ul li:not(.selected) + li:not(.selected) {
    border-left: 1px solid #c8c8c8;
  }
  #contents.home .performance ul li:not(.selected) p {
    color: #666;
  }
  #contents.home .performance ul li a {
    display: block;
    width: 100px;
    border: 1px solid #c8c8c8;
    border-radius: 21px;
    text-align: center;
    font-size: 16px;
    line-height: 42px;
  }
  #contents.home .performance ul li p {
    margin: 16px 0 40px;
  }
  #contents.home .performance ul.double li.selected {
    width: 54.75%;
  }
  #contents.home .performance ul.double li:not(.selected) {
    width: 45.25%;
  }
  #contents.home .performance ul.quarter li.selected {
    width: 33.75%;
  }
  #contents.home .performance ul.quarter li:not(.selected) {
    width: 22.0833333333%;
  }
}
@media (max-width: 1024px) {
  #contents.home .performance ul {
    background-size: cover !important;
    background-position: center;
    color: #fff;
  }
  #contents.home .performance ul li {
    position: relative;
    height: 215px;
    padding: 42px 20px 33px;
  }
  #contents.home .performance ul li.selected::before {
    z-index: 0;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.35);
  }
  #contents.home .performance ul li > * {
    z-index: 1;
    position: relative;
  }
  #contents.home .performance ul li p {
    margin-top: 10px;
  }
  #contents.home .performance ul li a {
    margin-top: 35px;
    width: 100px;
    border: 1px solid #fff;
    border-radius: 20px;
    text-align: center;
    font-size: 14px;
    line-height: 38px;
  }
}
#contents.home .overview {
  position: relative;
  background-color: #f9f9f9;
  text-align: center;
}
#contents.home .overview::before, #contents.home .overview::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
}
#contents.home .overview li img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#contents.home .overview li em {
  display: block;
  font-weight: 300;
  line-height: 1.3;
}
@media (min-width: 1025px) {
  #contents.home .overview {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
    padding-top: 160px;
    padding-bottom: 279px;
  }
  #contents.home .overview::before {
    top: 0;
    height: 172px;
    background: url("../images/shinyoung/home/bgOverview1.svg") no-repeat center -1143px;
    opacity: 0.47;
  }
  #contents.home .overview::after {
    bottom: 0;
    height: 200px;
    background: url("../images/shinyoung/home/bgOverview2.svg") no-repeat center top;
    opacity: 0.47;
  }
  #contents.home .overview p {
    font-size: 50px;
    line-height: 62px;
    letter-spacing: -0.035em;
  }
  #contents.home .overview ul {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    margin-top: 73px;
    margin-left: auto;
    margin-right: auto;
    max-width: 1300px;
    height: 350px;
    padding: 0 50px;
  }
  #contents.home .overview ul li {
    width: 33.3333333333%;
    text-align: center;
  }
  #contents.home .overview ul li img {
    margin-bottom: 27px;
  }
  #contents.home .overview ul li span {
    display: block;
    margin-top: 25px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
    color: #666;
  }
  #contents.home .overview ul li em {
    margin-top: 8px;
    margin-bottom: 15px;
    font-size: 66px;
  }
  #contents.home .overview ul li small {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    font-weight: 300;
  }
  #contents.home .overview ul.quarter li {
    width: 25%;
  }
}
@media (max-width: 1024px) {
  #contents.home .overview {
    padding: 68px 0 60px;
  }
  #contents.home .overview > div {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    max-width: 500px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.home .overview > div > span {
    display: block;
    margin-top: 30px;
  }
  #contents.home .overview::before {
    top: 0;
    height: 60px;
    background: url("../images/shinyoung/home/bgOverview1Mobile.svg") no-repeat center -236px;
  }
  #contents.home .overview::after {
    bottom: 0;
    height: 48px;
    background: url("../images/shinyoung/home/bgOverview2Mobile.svg") no-repeat center top;
  }
  #contents.home .overview p {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #contents.home .overview ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
  }
  #contents.home .overview ul li {
    width: 50%;
  }
  #contents.home .overview ul li:last-child, #contents.home .overview ul li:nth-last-child(2) {
    margin-top: 40px;
  }
  #contents.home .overview ul li span {
    display: block;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    color: #666;
  }
  #contents.home .overview ul li em {
    margin-top: 8px;
    margin-bottom: 7px;
    font-size: 32px;
  }
  #contents.home .overview ul li small {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #contents.home .overview > div:not(.case) p {
    position: absolute;
    width: 50%;
    text-align: left;
    word-break: keep-all;
  }
  #contents.home .overview > div:not(.case) ul::before {
    content: "";
    width: 50%;
  }
  #contents.home .overview > div.case ul {
    margin-top: 24px;
  }
}
#contents.home .performanceList {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
#contents.home .performanceList > div {
  position: relative;
  word-break: keep-all;
}
#contents.home .performanceList > div li {
  position: relative;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.home .performanceList > div li .img {
  position: relative;
  overflow: hidden;
  vertical-align: top;
}
#contents.home .performanceList > div li .img img {
  display: block;
  width: 100%;
}
#contents.home .performanceList > div li .detail {
  position: relative;
  vertical-align: top;
}
#contents.home .performanceList > div li .detail .pagination span {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 50%;
}
#contents.home .performanceList > div li .detail .pagination span:hover::before {
  opacity: 0;
}
#contents.home .performanceList > div li .detail .pagination span::before, #contents.home .performanceList > div li .detail .pagination span::after {
  z-index: 1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  transition: opacity 0.3s;
}
#contents.home .performanceList > div li .detail .pagination span::before {
  background: rgba(0, 0, 0, 0.53);
}
#contents.home .performanceList > div li .detail .pagination span::after {
  max-width: 0;
  background: rgba(0, 151, 224, 0.47);
}
#contents.home .performanceList > div li .detail .pagination span.swiper-pagination-bullet-active::before {
  display: none;
}
@keyframes maxWidthKey {
  to {
    max-width: 100%;
  }
}
#contents.home .performanceList > div li .detail .pagination span.swiper-pagination-bullet-active::after {
  max-width: 0;
  animation: maxWidthKey 10s 0s forwards;
}
#contents.home .performanceList > div li .detail .pagination span + span {
  margin-left: 10px;
}
#contents.home .performanceList > div li .detail .pagination span img {
  display: block;
  width: 100%;
  height: 100%;
}
#contents.home .performanceList > div li .detail em {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 4.2em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
  word-break: keep-all;
}
#contents.home .performanceList > div li .detail > span {
  display: block;
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 3.4em;
  line-height: 1.7 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
#contents.home .performanceList > div li .detail a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  min-width: 100px;
}
#contents.home .performanceList > div li .detail a::before, #contents.home .performanceList > div li .detail a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.home .performanceList > div li .detail a:not(:disabled):hover, #contents.home .performanceList > div li .detail a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.home .performanceList > div li .detail a:not(:disabled):hover::before, #contents.home .performanceList > div li .detail a:not(:disabled):hover::after, #contents.home .performanceList > div li .detail a:not(:disabled):focus::before, #contents.home .performanceList > div li .detail a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.home .performanceList > div li .detail a {
    font-size: 16px;
    font-size: 14px;
    min-width: 100px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.home .performanceList > div li .detail a::before {
    margin-right: 10px;
  }
  #contents.home .performanceList > div li .detail a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.home .performanceList > div li .detail a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.home .performanceList > div li .detail a::before {
    margin-right: 14px;
  }
  #contents.home .performanceList > div li .detail a::after {
    margin-left: 18px;
  }
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next {
    width: 40px;
    height: 40px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next {
    width: 35px;
    height: 35px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-next::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev {
    width: 40px;
    height: 40px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev {
    width: 35px;
    height: 35px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap .swiper-button-prev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
#contents.home .performanceList > div li .detail .buttonWrap button:disabled, #contents.home .performanceList > div li .detail .buttonWrap button.swiper-button-disabled {
  display: none !important;
}
#contents.home .performanceList > div li .detail .buttonWrap button:disabled + button, #contents.home .performanceList > div li .detail .buttonWrap button.swiper-button-disabled + button {
  margin-left: 0 !important;
}
@media (min-width: 1025px) {
  #contents.home .performanceList > div li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    max-width: 1240px;
  }
  #contents.home .performanceList > div li .img {
    z-index: 2;
    width: 64.166%;
    height: 0;
    padding-bottom: 37.0829%;
    transition: all 0.5s;
  }
  #contents.home .performanceList > div li .img.order {
    order: 2;
    padding-left: 4%;
  }
  #contents.home .performanceList > div li .detail {
    width: 35.834%;
    min-height: 100%;
    padding-left: 4%;
    padding-right: 20px;
    opacity: 1;
    transition: left 1s;
  }
  #contents.home .performanceList > div li .detail.order {
    order: 1;
    padding-left: 0;
  }
  #contents.home .performanceList > div li .detail .pagination {
    margin: 25px 0 40px;
  }
  #contents.home .performanceList > div li .detail .pagination span {
    width: 53px;
    height: 53px;
  }
  #contents.home .performanceList > div li .detail > span {
    margin-top: 15px;
  }
  #contents.home .performanceList > div li .detail em {
    height: 4.2em;
  }
  #contents.home .performanceList > div li .detail a {
    margin-top: 40px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap {
    margin-top: 50px;
    /*@media (max-width: 1200px) {
      left: unset;
      right: $space;
    }*/
  }
  #contents.home .performanceList > div li .detail .buttonWrap * + * {
    margin-left: 20px;
  }
}
@media (min-width: 1025px) and (min-width: 1281px) {
  #contents.home .performanceList > div li.swiper-slide-prev, #contents.home .performanceList > div li.swiper-slide-duplicate-prev {
    /*
    .img {
      margin-left: 35.834%;
    }
    .detail {
      left: 50%;
      opacity: 0;
    }*/
  }
  #contents.home .performanceList > div li.swiper-slide-prev .img, #contents.home .performanceList > div li.swiper-slide-duplicate-prev .img {
    order: 1;
  }
}
@media (max-width: 1024px) {
  #contents.home .performanceList > div li {
    width: 100%;
  }
  #contents.home .performanceList > div li .detail .pagination {
    margin-bottom: 36px;
  }
  #contents.home .performanceList > div li .detail .pagination span {
    width: 40px;
    height: 40px;
  }
  #contents.home .performanceList > div li .detail > span {
    margin-top: 12px;
  }
  #contents.home .performanceList > div li .detail a {
    margin-top: 20px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap * + * {
    margin-left: 12px;
  }
}
@media (max-width: 1024px) and (min-width: 801px) {
  #contents.home .performanceList > div li .img {
    width: 55%;
    height: 0;
    padding-bottom: 31.796875%;
  }
  #contents.home .performanceList > div li .detail {
    width: 45%;
    min-height: 100%;
    padding-left: 30px;
    padding-right: 20px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap {
    margin-top: 20px;
    /*@media (max-width: 990px) {
      left: unset;
      right: $space;
    }*/
  }
}
@media (max-width: 800px) {
  #contents.home .performanceList > div li {
    max-width: 300px;
    padding: 0 10px;
  }
  #contents.home .performanceList > div li .detail .pagination {
    margin-top: 18px;
  }
  #contents.home .performanceList > div li .detail > a {
    margin-top: 40px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap {
    margin-top: 30px;
  }
}
@media (max-width: 800px) and (min-width: 360px) {
  #contents.home .performanceList > div li .pagination,
  #contents.home .performanceList > div li .buttonWrap,
  #contents.home .performanceList > div li > a {
    opacity: 1;
    transition: all 0.5s;
  }
  #contents.home .performanceList > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .pagination,
  #contents.home .performanceList > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .buttonWrap,
  #contents.home .performanceList > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .detail > a {
    opacity: 0;
  }
}
@media (max-width: 480px) {
  #contents.home .performanceList > div {
    margin-left: -20px;
  }
  #contents.home .performanceList > div li {
    max-width: calc(100% - 20px * 3);
  }
}
@media (max-width: 480px) and (max-width: 359px) {
  #contents.home .performanceList > div {
    min-width: 315px;
    margin: 0 !important;
  }
  #contents.home .performanceList > div li {
    max-width: unset;
    width: 100%;
    padding: 0 20px;
  }
}
#contents.home .performanceList > div li .detail em {
  height: unset;
}
@media (min-width: 1025px) {
  #contents.home .performanceList {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
    padding-top: 155px;
    padding-bottom: 155px;
  }
}
@media (max-width: 1024px) {
  #contents.home .performanceList {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  #contents.home .performanceList > div li .detail .buttonWrap * + * {
    margin-left: 20px;
  }
}
#contents.home .news {
  background-color: #F6F6F6;
}
#contents.home .news > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.home .news .newsPrev {
  position: relative;
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.home .news .newsPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.home .news .newsPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.home .news .newsPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  #contents.home .news .newsPrev {
    width: 40px;
    height: 40px;
  }
  #contents.home .news .newsPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  #contents.home .news .newsPrev {
    width: 35px;
    height: 35px;
  }
  #contents.home .news .newsPrev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
#contents.home .news .newsNext {
  position: relative;
  margin-left: 20px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.home .news .newsNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.home .news .newsNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.home .news .newsNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  #contents.home .news .newsNext {
    width: 40px;
    height: 40px;
  }
  #contents.home .news .newsNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  #contents.home .news .newsNext {
    width: 35px;
    height: 35px;
  }
  #contents.home .news .newsNext::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
#contents.home .news .swiper-slide {
  word-break: keep-all;
}
#contents.home .news .swiper-slide div {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 63.33%;
}
#contents.home .news .swiper-slide div img {
  display: block;
  width: 100%;
  transition: all 0.3s;
}
#contents.home .news .swiper-slide strong {
  display: block;
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 2.8em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
#contents.home .news .swiper-slide p {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 3.33em;
  line-height: 1.665 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
  color: #666;
}
#contents.home .news .swiper-slide:hover div img, #contents.home .news .swiper-slide:focus div img {
  transform: scale(1.06);
}
#contents.home .news .swiper-slide:hover strong, #contents.home .news .swiper-slide:focus strong {
  color: #4415a0;
}
#contents.home .news .swiper-slide:hover p, #contents.home .news .swiper-slide:focus p {
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.home .news {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
    padding-top: 30px;
    background-image: url("../images/shinyoung/home/bgNews.svg");
    background-repeat: no-repeat;
    background-position: 497px -300px;
  }
  #contents.home .news header {
    display: inline-block;
    width: 340px;
  }
  #contents.home .news header h1 {
    margin-bottom: 44px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #contents.home .news header div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 65px;
  }
  #contents.home .news .swiper {
    display: inline-block;
    position: absolute;
    width: calc(850px + (100vw - 1200px) / 2);
  }
}
@media screen and (min-width: 1025px) and (max-width: 1250px) {
  #contents.home .news .swiper {
    width: calc(100vw - 360px);
  }
}
@media (min-width: 1025px) {
  #contents.home .news .swiper .swiper-slide {
    margin-right: 40px;
    width: 380px;
  }
  #contents.home .news .swiper .swiper-slide strong {
    margin-top: 20px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #contents.home .news .swiper .swiper-slide p {
    margin-top: 30px;
    font-size: 18px;
    letter-spacing: -0.03em;
  }
  #contents.home .news footer {
    display: none;
  }
}
@media (max-width: 1024px) {
  #contents.home .news {
    padding-top: 58px;
    padding-bottom: 50px;
  }
  #contents.home .news .swiper {
    margin-top: 20px;
    margin-left: -20px;
    margin-right: -20px;
  }
  #contents.home .news .swiper .swiper-slide {
    margin-left: 20px;
    width: calc(100% - 60px);
    max-width: 300px;
  }
  #contents.home .news .swiper .swiper-slide strong {
    margin-top: 15px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    letter-spacing: -0.04em;
  }
  #contents.home .news .swiper .swiper-slide p {
    margin-top: 15px;
    font-size: 15px;
    letter-spacing: -0.02em;
  }
  #contents.home .news footer {
    padding: 30px 20px 0 0;
  }
}
#contents.home .jump {
  color: #fff;
}
#contents.home .jump em {
  color: #0097e0;
}
#contents.home .jump a {
  display: block;
  width: 100px;
  border: 1px solid #fff;
  border-radius: 21px;
  text-align: center;
  font-weight: 400;
  line-height: 40px;
}
#contents.home .jump a:hover {
  border-color: #0097e0;
  color: #0097e0;
}
@media (min-width: 1025px) {
  #contents.home .jump {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
    background: url("../images/shinyoung/home/bgShortcut.jpg");
    background-size: cover;
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
    word-break: keep-all;
    font-weight: 100;
  }
  #contents.home .jump ul {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
  }
  #contents.home .jump ul li {
    width: 50%;
  }
  #contents.home .jump ul li + li {
    padding-left: 80px;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
  }
  #contents.home .jump ul li a {
    margin-top: 40px;
    font-size: 16px;
  }
}
@media (max-width: 1024px) {
  #contents.home .jump {
    padding-left: 20px;
    padding-right: 20px;
    background: url("../images/shinyoung/home/bgShortcutMobile.png") no-repeat center bottom;
    background-size: 100% auto;
  }
  #contents.home .jump li {
    padding: 50px 0;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.home .jump li + li {
    border-top: 2px solid rgba(255, 255, 255, 0.2);
  }
  #contents.home .jump li a {
    margin-top: 30px;
    font-size: 14px;
  }
}
#contents.home .banner {
  z-index: 9;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  overflow: hidden;
  background: #fff;
}
#contents.home .banner > div.case {
  position: relative;
  width: 100%;
}
#contents.home .banner > div.case h1 {
  color: #4415a0;
}
#contents.home .banner > div.case p {
  font-weight: 300;
}
#contents.home .banner > div.case a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100px;
}
#contents.home .banner > div.case a::before, #contents.home .banner > div.case a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.home .banner > div.case a:not(:disabled):hover, #contents.home .banner > div.case a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.home .banner > div.case a:not(:disabled):hover::before, #contents.home .banner > div.case a:not(:disabled):hover::after, #contents.home .banner > div.case a:not(:disabled):focus::before, #contents.home .banner > div.case a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.home .banner > div.case a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.home .banner > div.case a::before {
    margin-right: 10px;
  }
  #contents.home .banner > div.case a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > div.case a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.home .banner > div.case a::before {
    margin-right: 14px;
  }
  #contents.home .banner > div.case a::after {
    margin-left: 18px;
  }
}
@media (max-width: 359px) {
  #contents.home .banner > div.case a {
    margin-top: 10px;
  }
}
@media (min-width: 1025px) {
  #contents.home .banner > div.case {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    padding-top: 50px;
    padding-bottom: 50px;
  }
  #contents.home .banner > div.case > div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding-left: 85px;
  }
  #contents.home .banner > div.case > div p + p {
    margin-left: 50px;
  }
  #contents.home .banner > div.case a {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > div.case {
    padding-top: 40px;
    padding-bottom: 40px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(112, 112, 112, 0.23);
  }
  #contents.home .banner > div.case h1 {
    margin-bottom: 23px;
    width: 100%;
    line-height: 1.3;
  }
  #contents.home .banner > div.case div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }
}
@media (max-width: 1024px) and (max-width: 359px) {
  #contents.home .banner > div.case div {
    width: 100%;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > div.case p + p {
    margin-left: 20px;
  }
}
#contents.home .banner > section {
  padding-top: 40px;
  padding-bottom: 40px;
}
#contents.home .banner > section:first-of-type {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#contents.home .banner > section:first-of-type a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100px;
}
#contents.home .banner > section:first-of-type a::before, #contents.home .banner > section:first-of-type a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.home .banner > section:first-of-type a:not(:disabled):hover, #contents.home .banner > section:first-of-type a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.home .banner > section:first-of-type a:not(:disabled):hover::before, #contents.home .banner > section:first-of-type a:not(:disabled):hover::after, #contents.home .banner > section:first-of-type a:not(:disabled):focus::before, #contents.home .banner > section:first-of-type a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.home .banner > section:first-of-type a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.home .banner > section:first-of-type a::before {
    margin-right: 10px;
  }
  #contents.home .banner > section:first-of-type a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > section:first-of-type a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.home .banner > section:first-of-type a::before {
    margin-right: 14px;
  }
  #contents.home .banner > section:first-of-type a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.home .banner > section:last-of-type {
    border-left: 1px solid rgba(112, 112, 112, 0.23);
  }
}
#contents.home .banner > section:last-of-type h1 {
  color: #4415a0;
}
#contents.home .banner > section:last-of-type p {
  font-weight: 300;
}
#contents.home .banner > section:last-of-type a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100px;
}
#contents.home .banner > section:last-of-type a::before, #contents.home .banner > section:last-of-type a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.home .banner > section:last-of-type a:not(:disabled):hover, #contents.home .banner > section:last-of-type a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.home .banner > section:last-of-type a:not(:disabled):hover::before, #contents.home .banner > section:last-of-type a:not(:disabled):hover::after, #contents.home .banner > section:last-of-type a:not(:disabled):focus::before, #contents.home .banner > section:last-of-type a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.home .banner > section:last-of-type a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.home .banner > section:last-of-type a::before {
    margin-right: 10px;
  }
  #contents.home .banner > section:last-of-type a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > section:last-of-type a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.home .banner > section:last-of-type a::before {
    margin-right: 14px;
  }
  #contents.home .banner > section:last-of-type a::after {
    margin-left: 18px;
  }
}
@media (max-width: 359px) {
  #contents.home .banner > section:last-of-type a {
    margin-top: 10px;
  }
}
@media (min-width: 1025px) {
  #contents.home .banner > section:last-of-type {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding-left: 64px;
  }
  #contents.home .banner > section:last-of-type p + p {
    margin-top: 5px;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > section:last-of-type {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(112, 112, 112, 0.23);
  }
  #contents.home .banner > section:last-of-type h1 {
    margin-bottom: 23px;
    width: 100%;
  }
  #contents.home .banner > section:last-of-type div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }
}
@media (max-width: 1024px) and (max-width: 359px) {
  #contents.home .banner > section:last-of-type div {
    width: 100%;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > section:last-of-type p + p {
    margin-left: 20px;
  }
}
#contents.home .banner > section h1 {
  font-weight: 400;
}
@media (min-width: 1025px) {
  #contents.home .banner {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
  #contents.home .banner > section {
    width: 50%;
  }
  #contents.home .banner > section:first-of-type {
    padding-right: 50px;
  }
}
@media (min-width: 1025px) and (min-width: 1240px) {
  #contents.home .banner > section:first-of-type {
    padding-right: 110px;
  }
}
@media (min-width: 1025px) {
  #contents.home .banner > div:not(.case) {
    display: none;
    position: absolute;
    right: -100px;
  }
  #contents.home .banner > div:not(.case) button {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: url("../images/shinyoung/home/btnTop.svg") no-repeat center;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
  }
}
@media (max-width: 1024px) {
  #contents.home .banner > section {
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.home .banner > div {
    display: none;
  }
}

.popNotice {
  z-index: 99999;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
}
.popNotice > div {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  max-height: calc(100vh -40px);
  max-height: calc(var(--vh, 1vh) * 100 -40px);
  overflow: auto;
  background: #fff;
}
@media (min-width: 1025px) {
  .popNotice > div {
    width: 400px;
    height: 550px;
  }
}
@media (max-width: 1024px) {
  .popNotice > div {
    width: 300px;
    height: 417px;
  }
}
.popNotice .swiper {
  position: relative;
}
@media (min-width: 1025px) {
  .popNotice .swiper img {
    width: 400px;
    height: 490px;
  }
}
@media (max-width: 1024px) {
  .popNotice .swiper img {
    width: 300px;
    height: 367.5px;
  }
}
.popNotice .swiper .swiper-pagination-bullet {
  background: #fff;
}
.popNotice .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #a5a5a5;
}
.popNotice .swiper .btnPrev, .popNotice .swiper .btnNext {
  z-index: 1;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #fff;
}
.popNotice .swiper .btnPrev::after, .popNotice .swiper .btnNext::after {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  .popNotice .swiper .btnPrev, .popNotice .swiper .btnNext {
    width: 36px;
    height: 36px;
  }
}
@media (max-width: 1024px) {
  .popNotice .swiper .btnPrev, .popNotice .swiper .btnNext {
    width: 25px;
    height: 25px;
  }
}
@media (min-width: 1025px) {
  .popNotice .swiper .btnPrev {
    left: 15px;
  }
  .popNotice .swiper .btnPrev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    left: 5px;
  }
}
@media (max-width: 1024px) {
  .popNotice .swiper .btnPrev {
    left: 10px;
  }
  .popNotice .swiper .btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    left: 3px;
  }
}
@media (min-width: 1025px) {
  .popNotice .swiper .btnNext {
    right: 15px;
  }
  .popNotice .swiper .btnNext::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    right: 5px;
  }
}
@media (max-width: 1024px) {
  .popNotice .swiper .btnNext {
    right: 10px;
  }
  .popNotice .swiper .btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    right: 3px;
  }
}
.popNotice footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  color: #212121;
}
.popNotice footer button {
  width: 50%;
}
.popNotice footer button + button {
  border-left: 1px solid #c8c8c8;
}
@media (min-width: 1025px) {
  .popNotice footer button {
    height: 60px;
  }
}
@media (max-width: 1024px) {
  .popNotice footer button {
    height: 50px;
  }
}

#home .container {
  overflow: hidden;
}
#home .temp {
  display: block;
  margin: 0 auto;
}
#home .list {
  display: flex;
  height: 890px;
}
#home .item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
  padding: 90px;
  background: none;
}
#home .item + .item {
  border-left: 1px solid #C8C8C8;
}
#home .item dt {
  font-size: 50px;
  line-height: 60px;
  margin-bottom: 12px;
}
#home .item dd:nth-of-type(1) {
  margin-bottom: 40px;
  font-size: 20px;
  line-height: 30px;
  color: #666;
}
#home .item:hover {
  color: #fff;
  flex: none;
  width: 100%;
}
#home .item:hover dd:nth-of-type(1) {
  color: #fff;
}
#home .item:hover dd img {
  filter: brightness(100);
}
#home.sy .item:hover {
  max-width: 740px;
  background-image: url(../../resources/images/shinyoung/temp/temp_home9.png);
}
#home.enc .item:hover {
  max-width: 540px;
}
#home.enc .item:nth-child(1):hover {
  background-image: url(../../resources/images/shinyoungEnc/temp/temp_home8.png);
}
#home.enc .item:nth-child(2):hover {
  background-image: url(../../resources/images/shinyoungEnc/temp/temp_home9.png);
}
#home.enc .item:nth-child(3):hover {
  background-image: url(../../resources/images/shinyoungEnc/temp/temp_home10.png);
}
#home.enc .item:nth-child(4):hover {
  background-image: url(../../resources/images/shinyoungEnc/temp/temp_home11.png);
}
#home.enc .item dd:nth-of-type(1) {
  height: 59px;
}

#contents.develop .overview {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.develop .overview > p {
  font-weight: 300;
  word-break: keep-all;
}
#contents.develop .overview > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
  text-align: center;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #666;
}
#contents.develop .overview > ul li {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
}
#contents.develop .overview > ul li + li {
  border-left: 1px dashed #d1d1d1;
}
#contents.develop .overview > ul li span {
  display: block;
  background-repeat: no-repeat;
  background-position: center top;
  color: #4415a0;
}
#contents.develop .overview > ul li span.case1 {
  background-image: url("../images/icon/iconOverview1.svg");
}
#contents.develop .overview > ul li span.case2 {
  background-image: url("../images/icon/iconOverview2.svg");
}
#contents.develop .overview > ul li span.case3 {
  background-image: url("../images/icon/iconOverview3.svg");
}
#contents.develop .overview > ul li strong {
  font-weight: 500;
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.develop .overview > ul {
    padding-top: 80px;
  }
  #contents.develop .overview > ul li span {
    padding-top: 105px;
    padding-bottom: 15px;
    background-size: 80px auto;
  }
  #contents.develop .overview > ul li strong {
    font-size: 60px;
    line-height: 74px;
    letter-spacing: -0.05em;
  }
}
@media (max-width: 1024px) {
  #contents.develop .overview > ul {
    padding-top: 10px;
  }
  #contents.develop .overview > ul li {
    margin-top: 30px;
    padding-top: 30px;
  }
  #contents.develop .overview > ul li span {
    padding-top: 110px;
    padding-bottom: 8px;
  }
  #contents.develop .overview > ul li strong {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #contents.develop .overview > ul.caseTrp {
    flex-wrap: wrap;
  }
  #contents.develop .overview > ul.caseTrp li {
    flex-basis: 100%;
  }
  #contents.develop .overview > ul.caseTrp li + li {
    border-top: 1px dashed #d1d1d1;
    border-left: none;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #contents.develop .overview > ul:not(.caseTrp) {
    flex-wrap: wrap;
  }
  #contents.develop .overview > ul:not(.caseTrp) li {
    flex-basis: 100%;
  }
  #contents.develop .overview > ul:not(.caseTrp) li + li {
    border-top: 1px dashed #d1d1d1;
    border-left: none;
  }
}
#contents.develop .process {
  background: #f9f9f9;
}
#contents.develop .process > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.develop .process p {
  word-break: keep-all;
  color: #666;
}
@media (min-width: 1025px) {
  #contents.develop .process {
    padding-bottom: 100px;
  }
  #contents.develop .process p {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .process {
    padding-bottom: 50px;
  }
  #contents.develop .process p {
    margin-top: 20px;
  }
}
#contents.develop .processSwipe {
  position: relative;
}
#contents.develop .processSwipe > button {
  z-index: 1;
  position: absolute !important;
}
#contents.develop .processSwipe > button.btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.develop .processSwipe > button.btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .processSwipe > button.btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .processSwipe > button.btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe > button.btnPrev {
    width: 37px;
    height: 37px;
  }
  #contents.develop .processSwipe > button.btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe > button.btnPrev {
    width: 25px;
    height: 25px;
  }
  #contents.develop .processSwipe > button.btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
#contents.develop .processSwipe > button.btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.develop .processSwipe > button.btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .processSwipe > button.btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .processSwipe > button.btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe > button.btnNext {
    width: 37px;
    height: 37px;
  }
  #contents.develop .processSwipe > button.btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe > button.btnNext {
    width: 25px;
    height: 25px;
  }
  #contents.develop .processSwipe > button.btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
#contents.develop .processSwipe > button:disabled {
  opacity: 0.3;
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe > button {
    bottom: 120px;
  }
  #contents.develop .processSwipe > button.btnPrev {
    left: -18px;
  }
  #contents.develop .processSwipe > button.btnNext {
    right: -18px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe > button {
    bottom: 171px;
  }
  #contents.develop .processSwipe > button.btnPrev {
    left: -12px;
  }
  #contents.develop .processSwipe > button.btnNext {
    right: -12px;
  }
}
@media (max-width: 579px) {
  #contents.develop .processSwipe .swiper {
    padding-top: 133px;
  }
}
#contents.develop .processSwipe .swiper .swiper-pagination {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  text-align: left;
}
#contents.develop .processSwipe .swiper .swiper-pagination::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: calc(100% - 100px);
  height: 1px;
  background: #a5a5a5;
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe .swiper .swiper-pagination::before {
    top: 26px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe .swiper .swiper-pagination::before {
    top: 21px;
  }
}
@media (max-width: 579px) {
  #contents.develop .processSwipe .swiper .swiper-pagination::before {
    display: none;
  }
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe .swiper .swiper-pagination.case::before {
    width: calc(100% - 150px);
  }
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet {
  display: unset;
  margin: unset;
  width: unset;
  height: unset;
  background: none !important;
  vertical-align: top;
  border-radius: unset;
  color: #a5a5a5;
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet + .swiper-pagination-bullet::before {
    content: "";
    position: absolute;
    right: 50%;
    margin: auto;
    width: 100px;
    height: 1px;
    background: #a5a5a5;
    top: 21px;
  }
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet span {
  z-index: 1;
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #a5a5a5;
  border-radius: 50%;
  background: #fff;
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet p {
  margin-left: auto;
  margin-right: auto;
  word-break: keep-all;
  white-space: normal;
  text-align: center;
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  font-weight: 600;
  color: #4415a0;
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active span {
  border: 2px solid #4415a0;
}
#contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active p {
  color: #4415a0;
}
@media (min-width: 580px) {
  #contents.develop .processSwipe .swiper .swiper-pagination {
    position: static;
    width: unset !important;
    max-width: 1200px;
    left: unset !important;
    transform: none !important;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet {
    left: unset !important;
    transition: unset !important;
    transform: unset !important;
  }
}
@media (max-width: 579px) {
  #contents.develop .processSwipe .swiper .swiper-pagination {
    top: 0;
    height: 141px;
  }
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet span {
    width: 53px !important;
    height: 53px !important;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet p {
    width: 150px;
    letter-spacing: -0.03em;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination.case .swiper-pagination-bullet p {
    width: 200px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet {
    transform: unset !important;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet span {
    width: 43px !important;
    height: 43px !important;
  }
  #contents.develop .processSwipe .swiper .swiper-pagination .swiper-pagination-bullet p {
    width: 90px;
    letter-spacing: -0.03em;
  }
}
#contents.develop .processSwipe .swiper .swiper-wrapper > li {
  background: #fff;
  word-break: keep-all;
}
#contents.develop .processSwipe .swiper .swiper-wrapper > li em {
  font-weight: 500;
}
#contents.develop .processSwipe .swiper .swiper-wrapper > li ul li {
  position: relative;
}
#contents.develop .processSwipe .swiper .swiper-wrapper > li ul li::before {
  content: "";
  position: absolute;
  left: 0;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  #contents.develop .processSwipe .swiper {
    margin-top: 80px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper {
    margin-top: 60px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    height: 276px;
    padding: 0 60px 0 580px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li img {
    position: absolute;
    left: 162px;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 270px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul {
    margin-top: 24px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li {
    padding-left: 18px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li + li {
    margin-top: 18px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li::before {
    top: 11px;
    width: 8px;
    height: 8px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li.case {
    padding-left: 40%;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li.case img {
    left: 15%;
    width: 184px;
    height: 184px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .processSwipe .swiper {
    margin-top: 40px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper {
    margin-top: 20px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li {
    height: 368px;
    padding: 30px 25px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li.case {
    height: 350px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li img.middleOnly {
    display: none !important;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li img:not(.middleOnly) {
    display: block;
    margin-bottom: 24px;
    width: 100px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul {
    margin-top: 20px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li {
    padding-left: 14px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li + li {
    margin-top: 15px;
  }
  #contents.develop .processSwipe .swiper .swiper-wrapper > li ul li::before {
    top: 10px;
    width: 4px;
    height: 4px;
  }
}
#contents.develop > .shortcutMiddle.caseMargin {
  margin-top: 50px;
}
#contents.develop .detailContainer > section.caseOdd, #contents.develop .detailContainer > section:nth-of-type(even):not(.caseEven) {
  background: #f9f9f9;
}
#contents.develop .detailContainer > section > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.develop .detailContainer > section .title {
  word-break: keep-all;
}
#contents.develop .detailContainer > section .video {
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
}
#contents.develop .detailContainer > section .video iframe,
#contents.develop .detailContainer > section .video object,
#contents.develop .detailContainer > section .video embed,
#contents.develop .detailContainer > section .video video {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#contents.develop .detailContainer > section.gallery .swiperContainer {
  position: relative;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide {
  text-align: left;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide div {
  overflow: hidden;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide div img {
  display: block;
  width: 100%;
  transition: all 0.3s;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide p {
  margin-top: 15px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  word-break: keep-all;
  color: #666;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide:hover img, #contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide:focus img {
  transform: scale(1.06);
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev {
    width: 37px;
    height: 37px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev {
    width: 25px;
    height: 25px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    width: 37px;
    height: 37px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    width: 25px;
    height: 25px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev,
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
  z-index: 1;
  position: absolute;
}
#contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev:disabled,
#contents.develop .detailContainer > section.gallery .swiperContainer .btnNext:disabled {
  opacity: 0;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer .swiper {
    margin-left: -15px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide {
    margin-left: 15px;
    width: 285px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev,
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    top: 80px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev {
    left: -18px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    right: -18px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer > section.gallery .swiperContainer {
    margin-left: -20px;
    margin-right: -20px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .swiper {
    margin-left: -10px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .swiper-slide {
    margin-left: 10px;
    width: 320px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev,
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    top: 98px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnPrev {
    left: 10px;
  }
  #contents.develop .detailContainer > section.gallery .swiperContainer .btnNext {
    right: 10px;
  }
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer > header {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.develop .detailContainer > header > div {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 100px 0;
  }
  #contents.develop .detailContainer > header button {
    text-align: left;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  #contents.develop .detailContainer > header button + button {
    margin-top: 20px;
  }
  #contents.develop .detailContainer > header button:not(.active) {
    font-weight: 300;
    color: #b2b2b2;
  }
  #contents.develop .detailContainer > header button.active {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    color: #4415a0;
  }
  #contents.develop .detailContainer > header button.active::after {
    content: "";
    margin-left: 17px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #4415a0;
  }
  #contents.develop .detailContainer > section {
    padding-bottom: 100px;
  }
  #contents.develop .detailContainer > section > div {
    padding-left: 335px;
  }
  #contents.develop .detailContainer > section h1 {
    position: absolute;
    display: inline-block;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
  }
  #contents.develop .detailContainer > section .title {
    font-size: 36px;
    line-height: 48px;
    letter-spacing: -0.03em;
  }
  #contents.develop .detailContainer > section .detail {
    margin-top: 60px;
  }
  #contents.develop .detailContainer.caseNoContents {
    margin-bottom: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer > header {
    display: none;
  }
  #contents.develop .detailContainer > section {
    padding-bottom: 50px;
  }
  #contents.develop .detailContainer > section h1 {
    margin-bottom: 23px;
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
    font-weight: normal;
    color: #4415a0;
  }
  #contents.develop .detailContainer > section .title {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 400;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #contents.develop .detailContainer > section .title {
    width: 250px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer > section .detail {
    margin-top: 30px;
  }
  #contents.develop .detailContainer.caseNoContents {
    margin-bottom: 50px;
  }
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer.caseMargin {
    margin-top: 100px;
  }
}
#contents.develop .detailContainer dt, #contents.develop .detailContainer dd {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  text-align: center;
  color: #fff !important;
}
#contents.develop .detailContainer dt {
  background: #5E4C8E;
  font-weight: 500;
}
#contents.develop .detailContainer dt + dd {
  background: #335D8F;
}
#contents.develop .detailContainer dt + dd + dd {
  background: #5AA5C9;
}
#contents.develop .detailContainer .diagramDevelop {
  position: relative;
  overflow: hidden;
}
#contents.develop .detailContainer .diagramDevelop dt {
  position: relative;
}
#contents.develop .detailContainer .diagramDevelop dt::after {
  content: "";
  position: absolute;
  margin: auto;
  border-top: 1px dashed #c8c8c8;
  width: 1000px;
  height: 0;
}
#contents.develop .detailContainer .diagramDevelop dd {
  position: absolute;
}
#contents.develop .detailContainer .diagramDevelop dt::before, #contents.develop .detailContainer .diagramDevelop dd::before, #contents.develop .detailContainer .diagramDevelop dt + dd::after {
  content: "";
  position: absolute;
  margin: auto;
  border-radius: 50%;
  background: #d6d6d6;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .diagramDevelop {
    margin-top: 80px;
  }
  #contents.develop .detailContainer .diagramDevelop dt, #contents.develop .detailContainer .diagramDevelop dd {
    width: 167px;
    height: 167px;
  }
  #contents.develop .detailContainer .diagramDevelop dd {
    position: absolute;
    margin-top: -167px;
  }
  #contents.develop .detailContainer .diagramDevelop dt + dd {
    right: 263px;
  }
  #contents.develop .detailContainer .diagramDevelop dt + dd + dd {
    right: 0;
  }
  #contents.develop .detailContainer .diagramDevelop dt:not(:first-of-type) {
    margin-top: 60px;
  }
  #contents.develop .detailContainer .diagramDevelop dt::after {
    left: 167px;
  }
  #contents.develop .detailContainer .diagramDevelop dt::before, #contents.develop .detailContainer .diagramDevelop dd::before, #contents.develop .detailContainer .diagramDevelop dt + dd::after {
    top: 0;
    bottom: 0;
    width: 8px;
    height: 8px;
  }
  #contents.develop .detailContainer .diagramDevelop dt::before, #contents.develop .detailContainer .diagramDevelop dt + dd::after {
    right: -4px;
  }
  #contents.develop .detailContainer .diagramDevelop dd::before {
    left: -4px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .diagramDevelop {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    margin: 40px 10px 0;
    max-width: 450px;
    min-height: 485px;
  }
  #contents.develop .detailContainer .diagramDevelop dt {
    width: 127px;
    height: 127px;
  }
  #contents.develop .detailContainer .diagramDevelop dd {
    width: 100px;
    height: 100px;
  }
  #contents.develop .detailContainer .diagramDevelop dt + dd {
    top: 220px;
  }
  #contents.develop .detailContainer .diagramDevelop dd + dd {
    top: 385px;
  }
  #contents.develop .detailContainer .diagramDevelop dt:first-child + dd, #contents.develop .detailContainer .diagramDevelop dt:first-child + dd + dd {
    left: 13.5px;
  }
  #contents.develop .detailContainer .diagramDevelop dt:nth-of-type(2) + dd, #contents.develop .detailContainer .diagramDevelop dt:nth-of-type(2) + dd + dd {
    right: 13.5px;
  }
  #contents.develop .detailContainer .diagramDevelop dt::before, #contents.develop .detailContainer .diagramDevelop dd::before, #contents.develop .detailContainer .diagramDevelop dt + dd::after {
    left: 0;
    right: 0;
    width: 6px;
    height: 6px;
  }
  #contents.develop .detailContainer .diagramDevelop dt::after {
    top: 626px;
    transform: rotate(90deg);
  }
  #contents.develop .detailContainer .diagramDevelop dt::before, #contents.develop .detailContainer .diagramDevelop dt + dd::after {
    bottom: -4px;
  }
  #contents.develop .detailContainer .diagramDevelop dd::before {
    top: -4px;
  }
}
#contents.develop .detailContainer .logos li {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  background: #fff;
}
#contents.develop .detailContainer .logos li img {
  max-width: 90%;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .logos {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 80px;
  }
  #contents.develop .detailContainer .logos li {
    width: calc(50% - 12px);
    height: 194px;
  }
  #contents.develop .detailContainer .logos li img.brighten {
    margin-top: 35px;
    width: 249px;
  }
  #contents.develop .detailContainer .logos li img.gwell {
    margin-top: 40px;
    width: 176px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .logos {
    margin-top: 40px;
  }
  #contents.develop .detailContainer .logos li {
    height: 144px;
  }
  #contents.develop .detailContainer .logos li + li {
    margin-top: 15px;
  }
  #contents.develop .detailContainer .logos li img.brighten {
    margin-top: 15px;
    width: 221px;
  }
  #contents.develop .detailContainer .logos li img.gwell {
    margin-top: 22px;
    width: 162px;
  }
}
#contents.develop .detailContainer .developSwiper {
  position: relative;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .developSwiper.case {
    margin-top: 55px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .developSwiper.case {
    margin-top: 40px;
  }
}
#contents.develop .detailContainer .developSwiper.case li {
  background: #f9f9f9;
}
#contents.develop .detailContainer .developSwiper li {
  background: #fff;
  word-break: keep-all;
}
#contents.develop .detailContainer .developSwiper > button {
  z-index: 1;
  position: absolute !important;
  top: 0;
  bottom: 0;
  margin: auto;
}
#contents.develop .detailContainer .developSwiper > button:disabled {
  opacity: 0.3;
}
#contents.develop .detailContainer .developSwiper > button.btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  left: -12px;
}
#contents.develop .detailContainer .developSwiper > button.btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .detailContainer .developSwiper > button.btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .detailContainer .developSwiper > button.btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .developSwiper > button.btnPrev {
    width: 37px;
    height: 37px;
  }
  #contents.develop .detailContainer .developSwiper > button.btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .developSwiper > button.btnPrev {
    width: 25px;
    height: 25px;
  }
  #contents.develop .detailContainer .developSwiper > button.btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
#contents.develop .detailContainer .developSwiper > button.btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  right: -12px;
}
#contents.develop .detailContainer .developSwiper > button.btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.develop .detailContainer .developSwiper > button.btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.develop .detailContainer .developSwiper > button.btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .developSwiper > button.btnNext {
    width: 37px;
    height: 37px;
  }
  #contents.develop .detailContainer .developSwiper > button.btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .developSwiper > button.btnNext {
    width: 25px;
    height: 25px;
  }
  #contents.develop .detailContainer .developSwiper > button.btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .developSwiper > button {
    display: none !important;
  }
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .developSwiper .swiper-wrapper {
    display: unset !important;
  }
  #contents.develop .detailContainer .developSwiper li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 25px;
    padding: 35px 50px;
  }
  #contents.develop .detailContainer .developSwiper li strong {
    margin-left: 43px;
    margin-right: 43px;
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
  }
  #contents.develop .detailContainer .developSwiper .swiper-slide-duplicate {
    display: none;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .developSwiper {
    margin-top: 15px;
  }
  #contents.develop .detailContainer .developSwiper li {
    padding: 30px 25px;
  }
  #contents.develop .detailContainer .developSwiper li img {
    width: 60px;
  }
  #contents.develop .detailContainer .developSwiper li strong {
    display: block;
    margin: 25px 0 15px;
  }
}
#contents.develop .detailContainer .accordionWrapper {
  z-index: 1;
  position: relative;
  word-break: keep-all;
}
#contents.develop .detailContainer .accordionWrapper h2 {
  padding-bottom: 26px;
  border-bottom: 1px solid #4415a0;
  color: #4415a0;
}
#contents.develop .detailContainer .accordionWrapper button {
  position: relative;
  width: 100%;
  padding-right: 25px !important;
  border-bottom: 1px solid #c8c8c8;
  text-align: left;
  font-weight: 600;
}
#contents.develop .detailContainer .accordionWrapper button::after {
  position: absolute;
  right: 3px;
  top: 0;
  bottom: 0;
  margin: auto;
}
#contents.develop .detailContainer .accordionWrapper button:not(.on)::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 2px 2px;
  border-color: #949494;
  border-style: solid;
  transform: rotate(-45deg);
}
#contents.develop .detailContainer .accordionWrapper button.on::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 2px 2px;
  border-color: #949494;
  border-style: solid;
  transform: rotate(135deg);
}
#contents.develop .detailContainer .accordionWrapper button.case {
  padding-left: 1.8em;
}
#contents.develop .detailContainer .accordionWrapper button.case em {
  position: absolute;
  left: 0;
}
#contents.develop .detailContainer .accordionWrapper button span {
  font-weight: 400;
}
#contents.develop .detailContainer .accordionWrapper li div {
  display: none;
}
#contents.develop .detailContainer .accordionWrapper li div p {
  position: relative;
  padding-left: 14px;
}
#contents.develop .detailContainer .accordionWrapper li div p + p {
  margin-top: 13px;
}
#contents.develop .detailContainer .accordionWrapper li div p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  width: 5px;
  height: 5px;
  background: #4415a0;
  border-radius: 50%;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .accordionWrapper {
    margin-top: 85px;
  }
  #contents.develop .detailContainer .accordionWrapper li + li {
    padding-top: 40px;
  }
  #contents.develop .detailContainer .accordionWrapper button {
    padding: 26px 0;
  }
  #contents.develop .detailContainer .accordionWrapper button span {
    padding-left: 40px;
  }
  #contents.develop .detailContainer .accordionWrapper div {
    padding-top: 20px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .accordionWrapper {
    margin-top: 54px;
  }
  #contents.develop .detailContainer .accordionWrapper li + li {
    padding-top: 22px;
  }
  #contents.develop .detailContainer .accordionWrapper button {
    padding: 23px 0 18px;
  }
  #contents.develop .detailContainer .accordionWrapper button span {
    display: block;
    margin-top: 10px;
  }
  #contents.develop .detailContainer .accordionWrapper div {
    padding-top: 23px;
  }
  #contents.develop .detailContainer .accordionWrapper div p::before {
    top: 10px !important;
  }
}
#contents.develop .detailContainer .baInfo {
  color: #fff;
  background-position: center;
  background-repeat: no-repeat;
}
#contents.develop .detailContainer .baInfo a {
  z-index: 1;
  position: relative;
  border: 1px solid #fff;
  border-radius: 21px;
  text-align: center;
  line-height: 40px;
}
@media (min-width: 1025px) {
  #contents.develop .detailContainer .baInfo {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 80px;
    height: 200px;
    padding: 0 80px;
  }
  #contents.develop .detailContainer .baInfo.caseAsset1 {
    background-image: url("../images/shinyoungAsset/page/bgInfo1.jpg");
  }
  #contents.develop .detailContainer .baInfo.caseAsset2 {
    background-image: url("../images/shinyoungAsset/page/bgInfo2.jpg");
  }
  #contents.develop .detailContainer .baInfo.caseAsset3 {
    background-image: url("../images/shinyoungAsset/page/bgInfo3.jpg");
  }
  #contents.develop .detailContainer .baInfo.caseAsset4 {
    background-image: url("../images/shinyoungAsset/page/bgInfo4.jpg");
  }
  #contents.develop .detailContainer .baInfo p {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.develop .detailContainer .baInfo a {
    padding: 0 20px;
  }
}
@media (max-width: 1024px) {
  #contents.develop .detailContainer .baInfo {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    background-size: cover;
    margin-top: 50px;
    height: 195px;
    padding: 0 20px;
  }
  #contents.develop .detailContainer .baInfo.caseAsset1 {
    background-image: url("../images/shinyoungAsset/page/bgInfo1Mobile.png");
  }
  #contents.develop .detailContainer .baInfo.caseAsset2 {
    background-image: url("../images/shinyoungAsset/page/bgInfo2Mobile.png");
  }
  #contents.develop .detailContainer .baInfo.caseAsset3 {
    background-image: url("../images/shinyoungAsset/page/bgInfo3Mobile.png");
  }
  #contents.develop .detailContainer .baInfo.caseAsset4 {
    background-image: url("../images/shinyoungAsset/page/bgInfo4Mobile.png");
  }
  #contents.develop .detailContainer .baInfo p {
    padding-bottom: 30px;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
  #contents.develop .detailContainer .baInfo a {
    padding: 0 24px;
  }
}
#contents.develop .banner li {
  background-position: center;
}
#contents.develop .banner li::after {
  display: none;
}
@media (min-width: 1025px) {
  #contents.develop .banner li.case1 {
    background-image: url("../images/shinyoung/page/bgBannerInquiry2.png");
  }
  #contents.develop .banner li.case2 {
    background-image: url("../images/shinyoung/page/bgBannerPerformance.png");
  }
  #contents.develop .banner li.case3 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset1.png");
  }
  #contents.develop .banner li.case4 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset2.png");
  }
  #contents.develop .banner li.case5 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset3.png");
  }
}
@media (max-width: 1024px) {
  #contents.develop .banner li.case1 {
    background-image: url("../images/shinyoung/page/bgBannerInquiryMobile.png");
  }
  #contents.develop .banner li.case2 {
    background-image: url("../images/shinyoung/page/bgBannerPerformanceMobile.png");
  }
  #contents.develop .banner li.case3 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset1Mobile.png");
  }
  #contents.develop .banner li.case4 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset2Mobile.png");
  }
  #contents.develop .banner li.case5 {
    background-image: url("../images/shinyoungAsset/page/bgBannerAsset3Mobile.png");
  }
}

/*
#contents.develop {
    .container {
        overflow: hidden;
    }
    .temp {
        display: block;
        margin: 0 auto;
    }
    @include wide {
        .headline li .summary > div p {
            white-space: unset;
        }
    }
}
*/
#contents.research .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.research .heading h1 + p, #contents.research .heading p:first-child {
  word-break: keep-all;
}
#contents.research .heading p + p {
  color: #666;
}
@media (max-width: 640px) {
  #contents.research .heading p + p br {
    display: none;
  }
}
@media (max-width: 1024px) {
  #contents.research .downloadInfo > div img {
    margin-right: unset !important;
  }
}
#contents.research .centerInfo {
  padding: 50px 0;
}
#contents.research .centerInfo h2 {
  font-size: 22px;
  color: #0097e0;
}
#contents.research .centerInfo h2:nth-child(2) {
  color: #004392;
}
#contents.research .centerInfo li {
  position: relative;
  margin-top: 15px;
  padding-left: 10px;
  line-height: 28px;
}
#contents.research .centerInfo li:before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #0097e0;
}
#contents.research .centerInfo .wrapImg {
  padding: 40px 0;
  text-align: center;
}
#contents.research .REIinfo .swiperContainer {
  position: relative;
}
#contents.research .REIinfo .swiper-slide {
  height: unset !important;
}
#contents.research .reiNext, #contents.research .reiPrev {
  z-index: 1;
  position: absolute !important;
  top: 0;
  bottom: 0;
  margin: auto;
}
#contents.research .reiNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  right: -9px;
}
#contents.research .reiNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.research .reiNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.research .reiNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#contents.research .reiNext::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#contents.research .reiPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  left: -9px;
}
#contents.research .reiPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.research .reiPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.research .reiPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#contents.research .reiPrev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
@media (min-width: 1025px) {
  #contents.research .heading h1 + p {
    margin-top: 45px;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
  #contents.research .heading p + p {
    margin-top: 30px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    font-weight: 300;
    line-height: 32px;
  }
  #contents.research .tabTarget > .list {
    padding-top: 45px;
  }
  #contents.research .centerInfo {
    position: relative;
    display: flex;
    justify-content: space-between;
    min-height: 365px;
    padding: 0;
    margin: 100px 0;
  }
  #contents.research .centerInfo .wrapImg {
    width: 280px;
    margin: 34px 0;
  }
  #contents.research .centerInfo .bgCenter {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 570px;
    z-index: -1;
  }
  #contents.research .centerInfo .wrapItem {
    flex: 1;
    padding-left: 60px;
  }
  #contents.research .centerInfo .wrapItem:last-child {
    align-self: flex-end;
  }
}
@media (max-width: 1024px) {
  #contents.research .heading h1 + p {
    margin-top: 35px;
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.research .heading p + p {
    margin-top: 15px;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
  }
  #contents.research .tabTarget > .list {
    padding-top: 23px;
  }
}

@media (min-width: 1025px) {
  #contents.contact .contactInfo {
    margin-top: 150px;
  }
}
@media (max-width: 1024px) {
  #contents.contact .contactInfo {
    margin-top: 50px;
  }
}

#contents.performance .performanceInfo {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  word-break: keep-all;
}
#contents.performance .performanceInfo.enc {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  font-weight: 300;
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo.enc img {
    width: 360px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.enc span {
    padding-right: 150px;
  }
  #contents.performance .performanceInfo.enc img {
    width: 240px;
  }
  #contents.performance .performanceInfo.enc br {
    display: none;
  }
}
@media (max-width: 768px) {
  #contents.performance .performanceInfo.enc span {
    padding-right: 100px;
  }
  #contents.performance .performanceInfo.enc img {
    width: 200px;
  }
}
@media (max-width: 640px) {
  #contents.performance .performanceInfo.enc {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #contents.performance .performanceInfo.enc span {
    padding-right: 0;
  }
  #contents.performance .performanceInfo.enc img {
    margin-top: 40px;
  }
}
#contents.performance .performanceInfo.enc + section {
  position: relative;
}
#contents.performance .performanceInfo.enc + section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 20px;
  right: 20px;
  margin: auto;
  max-width: 1200px;
  border-top: 1px dashed #dcdcdc;
}
#contents.performance .performanceInfo.enc + section > header {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.performance .performanceInfo.enc + section > header h1 {
  font-weight: 500;
}
#contents.performance .performanceInfo.enc + section > header a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  position: absolute;
  right: 20px;
}
#contents.performance .performanceInfo.enc + section > header a::before, #contents.performance .performanceInfo.enc + section > header a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.performance .performanceInfo.enc + section > header a:not(:disabled):hover, #contents.performance .performanceInfo.enc + section > header a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.performance .performanceInfo.enc + section > header a:not(:disabled):hover::before, #contents.performance .performanceInfo.enc + section > header a:not(:disabled):hover::after, #contents.performance .performanceInfo.enc + section > header a:not(:disabled):focus::before, #contents.performance .performanceInfo.enc + section > header a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo.enc + section > header a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.performance .performanceInfo.enc + section > header a::before {
    margin-right: 10px;
  }
  #contents.performance .performanceInfo.enc + section > header a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.enc + section > header a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.performance .performanceInfo.enc + section > header a::before {
    margin-right: 14px;
  }
  #contents.performance .performanceInfo.enc + section > header a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo.enc + section > header a {
    top: -1px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.enc + section > header a {
    top: -4px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo.enc + section > header + .tab {
    margin-top: 80px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.enc + section > header + .tab {
    margin-top: 40px;
  }
}
#contents.performance .performanceInfo.case {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo.case {
    margin-top: 60px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo.case {
    margin-top: 40px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo + .clients {
    padding-top: 6px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo + .clients {
    padding-top: 10px;
  }
}
#contents.performance .performanceInfo > small {
  display: block;
  font-weight: 400;
  color: #666;
}
@media (min-width: 1025px) {
  #contents.performance .performanceInfo > small {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .performanceInfo > small {
    margin-top: 20px;
  }
}
#contents.performance .headline .img {
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#contents.performance .headline .summary em,
#contents.performance .headline .summary .type,
#contents.performance .headline .summary .period {
  display: block;
}
#contents.performance .headline .summary em {
  word-break: keep-all;
}
#contents.performance .headline .summary .info span,
#contents.performance .headline .summary .period {
  color: #212121;
}
#contents.performance .headline .summary .info span + span {
  position: relative;
  margin-left: 1em;
  padding-left: 1em;
}
#contents.performance .headline .summary .info span + span::before {
  content: "";
  left: 0;
  display: block;
  width: 1px;
  height: 1em;
  background: #c8c8c8;
}
#contents.performance .headline .summary p {
  word-break: keep-all;
}
#contents.performance .headline .summary a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.performance .headline .summary a::before, #contents.performance .headline .summary a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.performance .headline .summary a:not(:disabled):hover, #contents.performance .headline .summary a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.performance .headline .summary a:not(:disabled):hover::before, #contents.performance .headline .summary a:not(:disabled):hover::after, #contents.performance .headline .summary a:not(:disabled):focus::before, #contents.performance .headline .summary a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.performance .headline .summary a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.performance .headline .summary a::before {
    margin-right: 10px;
  }
  #contents.performance .headline .summary a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.performance .headline .summary a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.performance .headline .summary a::before {
    margin-right: 14px;
  }
  #contents.performance .headline .summary a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.performance .headline li {
    position: relative;
  }
  #contents.performance .headline li::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
  #contents.performance .headline li .img {
    position: relative;
    width: calc(100% - ((100% - 1200px) / 2 + 500px));
    height: 570px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  #contents.performance .headline li .summary {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.performance .headline li .summary::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
  #contents.performance .headline li .summary > div {
    width: 500px;
    padding-top: 95px;
  }
  #contents.performance .headline li .summary > div .type,
  #contents.performance .headline li .summary > div p {
    margin-top: 15px;
  }
  #contents.performance .headline li .summary > div .info {
    margin-top: 23px;
  }
  #contents.performance .headline li .summary > div .period {
    margin-top: 35px;
  }
  #contents.performance .headline li .summary > div p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 8.35em;
    line-height: 1.67 !important;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  #contents.performance .headline li .summary > div a {
    margin-top: 40px;
  }
}
@media (min-width: 1025px) and (max-width: 1239px) {
  #contents.performance .headline li .summary > div {
    width: calc(100% - ((100% - 1200px) / 2 + 700px));
  }
}
@media (min-width: 1025px) {
  #contents.performance .headline li:nth-child(odd) .summary > div {
    float: right;
    padding-left: 60px;
  }
  #contents.performance .headline li:nth-child(even) .summary > div {
    padding-right: 60px;
  }
  #contents.performance .headline li:nth-child(even) .img {
    float: right;
  }
}
@media (max-width: 1024px) {
  #contents.performance .headline li .summary .type,
  #contents.performance .headline li .summary p {
    margin-top: 10px;
  }
  #contents.performance .headline li .summary .info {
    margin-top: 15px;
  }
  #contents.performance .headline li .summary .period {
    margin-top: 25px;
  }
  #contents.performance .headline li .summary a {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) and (min-width: 881px) {
  #contents.performance .headline li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #contents.performance .headline li .img {
    width: 55%;
    height: 380px;
  }
  #contents.performance .headline li .img img {
    width: unset;
    height: 380px;
  }
  #contents.performance .headline li .summary {
    width: 45%;
  }
  #contents.performance .headline li .summary p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 4.2em;
    line-height: 1.4 !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  #contents.performance .headline li:nth-child(odd) .summary {
    padding-left: 30px;
    padding-right: 20px;
  }
  #contents.performance .headline li:nth-child(even) .img {
    order: 1;
  }
  #contents.performance .headline li:nth-child(even) .summary {
    padding-left: 20px;
    padding-right: 30px;
  }
}
@media (max-width: 1024px) and (max-width: 880px) {
  #contents.performance .headline li + li {
    margin-top: 50px;
  }
  #contents.performance .headline li .img {
    height: 0;
    padding-bottom: 63.3333%;
  }
  #contents.performance .headline li .summary {
    margin-top: 35px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
#contents.statusList .empty {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 390px;
  padding-bottom: 40px;
  border-bottom: 1px solid #c8c8c8;
  text-align: center;
}
#contents.statusList .empty::before {
  content: "";
  width: 300px;
  height: 34px;
  background: url("../images/shinyoungEnc/page/logoEstate.svg") no-repeat center;
}
#contents.statusList .empty span {
  margin-top: 25px;
  color: #666;
}
#contents.statusList > .list,
#contents.statusList .tabTarget > .list {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.statusList > .list .list,
#contents.statusList .tabTarget > .list .list {
  display: none;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  margin-top: 0 !important;
}
#contents.statusList > .list .list > li,
#contents.statusList .tabTarget > .list .list > li {
  position: relative;
}
#contents.statusList > .list .list > li.scheduled a:not(.btn)::before, #contents.statusList > .list .list > li.onSale a:not(.btn)::before, #contents.statusList > .list .list > li.completed a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::before {
  z-index: 1;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  background: url("../images/shinyoungEnc/page/bgStatusText.svg") no-repeat center;
  background-size: 100% auto;
}
#contents.statusList > .list .list > li.scheduled a:not(.btn)::after, #contents.statusList > .list .list > li.onSale a:not(.btn)::after, #contents.statusList > .list .list > li.completed a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::after {
  z-index: 2;
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 16px;
  line-height: 20px;
  word-spacing: 100vw;
  color: #fff;
}
#contents.statusList > .list .list > li.scheduled a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::before {
  -moz-filter: invert(29%) sepia(34%) saturate(2430%) hue-rotate(234deg) brightness(89%) contrast(94%);
  -ms-filter: invert(29%) sepia(34%) saturate(2430%) hue-rotate(234deg) brightness(89%) contrast(94%);
  -o-filter: invert(29%) sepia(34%) saturate(2430%) hue-rotate(234deg) brightness(89%) contrast(94%);
  filter: invert(29%) sepia(34%) saturate(2430%) hue-rotate(234deg) brightness(89%) contrast(94%);
}
#contents.statusList > .list .list > li.onSale a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::before {
  -moz-filter: invert(35%) sepia(93%) saturate(2127%) hue-rotate(189deg) brightness(104%) contrast(88%);
  -ms-filter: invert(35%) sepia(93%) saturate(2127%) hue-rotate(189deg) brightness(104%) contrast(88%);
  -o-filter: invert(35%) sepia(93%) saturate(2127%) hue-rotate(189deg) brightness(104%) contrast(88%);
  filter: invert(35%) sepia(93%) saturate(2127%) hue-rotate(189deg) brightness(104%) contrast(88%);
}
#contents.statusList > .list .list > li.completed a:not(.btn)::before,
#contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::before {
  -moz-filter: invert(7%) sepia(53%) saturate(6411%) hue-rotate(234deg) brightness(82%) contrast(96%);
  -ms-filter: invert(7%) sepia(53%) saturate(6411%) hue-rotate(234deg) brightness(82%) contrast(96%);
  -o-filter: invert(7%) sepia(53%) saturate(6411%) hue-rotate(234deg) brightness(82%) contrast(96%);
  filter: invert(7%) sepia(53%) saturate(6411%) hue-rotate(234deg) brightness(82%) contrast(96%);
}
#contents.statusList > .list .list > li.scheduled a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::after {
  content: "분양 예정";
}
#contents.statusList > .list .list > li.onSale a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::after {
  content: "분양중";
}
#contents.statusList > .list .list > li.completed a:not(.btn)::after,
#contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::after {
  content: "분양 완료";
}
#contents.statusList > .list .list a:not(.btn),
#contents.statusList .tabTarget > .list .list a:not(.btn) {
  display: block;
}
#contents.statusList > .list .list a:not(.btn) .img,
#contents.statusList .tabTarget > .list .list a:not(.btn) .img {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 70.098%;
  overflow: hidden;
}
#contents.statusList > .list .list a:not(.btn) .img img,
#contents.statusList .tabTarget > .list .list a:not(.btn) .img img {
  display: block;
  width: 100%;
  transition: all 0.3s linear;
}
#contents.statusList > .list .list a:not(.btn) p,
#contents.statusList .tabTarget > .list .list a:not(.btn) p {
  font-weight: 700;
}
#contents.statusList > .list .list a:not(.btn) dl,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  line-height: 1.4;
}
#contents.statusList > .list .list a:not(.btn) dl dt,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dt {
  color: #212121;
}
#contents.statusList > .list .list a:not(.btn) dl dd.percent,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dd.percent {
  height: 22px;
  overflow: hidden;
  border-radius: 11px;
  background: #f9f9f9;
}
#contents.statusList > .list .list a:not(.btn) dl dd.percent div,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dd.percent div {
  height: 22px;
  background: linear-gradient(to right, #cec2e5 0%, #4415a0 200px);
}
#contents.statusList > .list .list a:not(.btn) dl dd.percent div span,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dd.percent div span {
  position: absolute;
  right: 0;
  line-height: 22px;
  color: #212121;
}
#contents.statusList > .list .list a:not(.btn) dl dd.percent div span em,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dd.percent div span em {
  font-weight: 700;
  color: #4415a0;
}
#contents.statusList > .list .list a:not(.btn) dl dd.location,
#contents.statusList .tabTarget > .list .list a:not(.btn) dl dd.location {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 1.4em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
#contents.statusList > .list .list a:not(.btn):hover img, #contents.statusList > .list .list a:not(.btn):focus img,
#contents.statusList .tabTarget > .list .list a:not(.btn):hover img,
#contents.statusList .tabTarget > .list .list a:not(.btn):focus img {
  transform: scale(1.06);
}
#contents.statusList > .list .list a.btn,
#contents.statusList .tabTarget > .list .list a.btn {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.statusList > .list .list a.btn::before, #contents.statusList > .list .list a.btn::after,
#contents.statusList .tabTarget > .list .list a.btn::before,
#contents.statusList .tabTarget > .list .list a.btn::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.statusList > .list .list a.btn:not(:disabled):hover, #contents.statusList > .list .list a.btn:not(:disabled):focus,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):hover,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.statusList > .list .list a.btn:not(:disabled):hover::before, #contents.statusList > .list .list a.btn:not(:disabled):hover::after, #contents.statusList > .list .list a.btn:not(:disabled):focus::before, #contents.statusList > .list .list a.btn:not(:disabled):focus::after,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):hover::before,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):hover::after,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):focus::before,
#contents.statusList .tabTarget > .list .list a.btn:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.statusList > .list .list a.btn,
  #contents.statusList .tabTarget > .list .list a.btn {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.statusList > .list .list a.btn::before,
  #contents.statusList .tabTarget > .list .list a.btn::before {
    margin-right: 10px;
  }
  #contents.statusList > .list .list a.btn::after,
  #contents.statusList .tabTarget > .list .list a.btn::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.statusList > .list .list a.btn,
  #contents.statusList .tabTarget > .list .list a.btn {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.statusList > .list .list a.btn::before,
  #contents.statusList .tabTarget > .list .list a.btn::before {
    margin-right: 14px;
  }
  #contents.statusList > .list .list a.btn::after,
  #contents.statusList .tabTarget > .list .list a.btn::after {
    margin-left: 18px;
  }
}
#contents.statusList > .list .list a.btn:not(.half),
#contents.statusList .tabTarget > .list .list a.btn:not(.half) {
  width: 100%;
}
@media (min-width: 1025px) {
  #contents.statusList > .list .list > li,
  #contents.statusList .tabTarget > .list .list > li {
    width: calc(33.3333333333% - 40px);
    padding-bottom: 72px;
  }
  #contents.statusList > .list .list > li:not(:nth-child(3n-2)),
  #contents.statusList .tabTarget > .list .list > li:not(:nth-child(3n-2)) {
    margin-left: 60px;
  }
  #contents.statusList > .list .list > li + li + li + li,
  #contents.statusList .tabTarget > .list .list > li + li + li + li {
    margin-top: 100px;
  }
  #contents.statusList > .list .list > li.scheduled, #contents.statusList > .list .list > li.onSale, #contents.statusList > .list .list > li.completed,
  #contents.statusList .tabTarget > .list .list > li.scheduled,
  #contents.statusList .tabTarget > .list .list > li.onSale,
  #contents.statusList .tabTarget > .list .list > li.completed {
    padding-bottom: 213px;
  }
  #contents.statusList > .list .list > li.scheduled a:not(.btn)::before,
  #contents.statusList > .list .list > li.scheduled a:not(.btn)::after, #contents.statusList > .list .list > li.onSale a:not(.btn)::before,
  #contents.statusList > .list .list > li.onSale a:not(.btn)::after, #contents.statusList > .list .list > li.completed a:not(.btn)::before,
  #contents.statusList > .list .list > li.completed a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::after {
    width: 89px;
    height: 82px;
    padding-bottom: 3px;
  }
  #contents.statusList > .list .list > li.scheduled dl, #contents.statusList > .list .list > li.onSale dl, #contents.statusList > .list .list > li.completed dl,
  #contents.statusList .tabTarget > .list .list > li.scheduled dl,
  #contents.statusList .tabTarget > .list .list > li.onSale dl,
  #contents.statusList .tabTarget > .list .list > li.completed dl {
    position: absolute;
    bottom: 72px;
  }
  #contents.statusList > .list .list > li.scheduled .btns, #contents.statusList > .list .list > li.onSale .btns, #contents.statusList > .list .list > li.completed .btns,
  #contents.statusList .tabTarget > .list .list > li.scheduled .btns,
  #contents.statusList .tabTarget > .list .list > li.onSale .btns,
  #contents.statusList .tabTarget > .list .list > li.completed .btns {
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  #contents.statusList > .list .list > li p,
  #contents.statusList .tabTarget > .list .list > li p {
    margin-top: 32px;
    padding-bottom: 20px;
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.statusList > .list .list > li dl dt:not(:first-of-type),
  #contents.statusList > .list .list > li dl dd:not(:first-of-type),
  #contents.statusList .tabTarget > .list .list > li dl dt:not(:first-of-type),
  #contents.statusList .tabTarget > .list .list > li dl dd:not(:first-of-type) {
    margin-top: 13px;
  }
  #contents.statusList > .list .list > li dl dt,
  #contents.statusList .tabTarget > .list .list > li dl dt {
    width: 95px;
  }
  #contents.statusList > .list .list > li dl dd:not(.percent),
  #contents.statusList .tabTarget > .list .list > li dl dd:not(.percent) {
    width: calc(100% - 95px);
  }
  #contents.statusList > .list .list > li dl dd.percent,
  #contents.statusList .tabTarget > .list .list > li dl dd.percent {
    width: calc(100% - 95px - 66px);
  }
  #contents.statusList > .list .list > li .btns,
  #contents.statusList .tabTarget > .list .list > li .btns {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #contents.statusList > .list .list > li a.half,
  #contents.statusList .tabTarget > .list .list > li a.half {
    width: calc(50% - 7px);
  }
  #contents.statusList > .list .list > li a.btn:not(.half),
  #contents.statusList .tabTarget > .list .list > li a.btn:not(.half) {
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
@media (max-width: 1024px) {
  #contents.statusList > .list .list > li p,
  #contents.statusList .tabTarget > .list .list > li p {
    margin-top: 12px;
    padding-bottom: 10px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #contents.statusList > .list .list > li dl dt:not(:first-of-type),
  #contents.statusList > .list .list > li dl dd:not(:first-of-type),
  #contents.statusList .tabTarget > .list .list > li dl dt:not(:first-of-type),
  #contents.statusList .tabTarget > .list .list > li dl dd:not(:first-of-type) {
    margin-top: 5px;
  }
  #contents.statusList > .list .list > li dl dt,
  #contents.statusList .tabTarget > .list .list > li dl dt {
    width: 88px;
  }
  #contents.statusList > .list .list > li dl dd:not(.percent),
  #contents.statusList .tabTarget > .list .list > li dl dd:not(.percent) {
    width: calc(100% - 88px);
  }
  #contents.statusList > .list .list > li dl dd.percent,
  #contents.statusList .tabTarget > .list .list > li dl dd.percent {
    width: calc(100% - 88px - 58px);
  }
  #contents.statusList > .list .list > li.scheduled a:not(.btn)::before,
  #contents.statusList > .list .list > li.scheduled a:not(.btn)::after, #contents.statusList > .list .list > li.onSale a:not(.btn)::before,
  #contents.statusList > .list .list > li.onSale a:not(.btn)::after, #contents.statusList > .list .list > li.completed a:not(.btn)::before,
  #contents.statusList > .list .list > li.completed a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.scheduled a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.onSale a:not(.btn)::after,
  #contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::before,
  #contents.statusList .tabTarget > .list .list > li.completed a:not(.btn)::after {
    width: 70px;
    height: 65px;
    padding-bottom: 3px;
  }
}
@media (max-width: 1024px) and (min-width: 769px) {
  #contents.statusList > .list .list > li.scheduled, #contents.statusList > .list .list > li.onSale, #contents.statusList > .list .list > li.completed,
  #contents.statusList .tabTarget > .list .list > li.scheduled,
  #contents.statusList .tabTarget > .list .list > li.onSale,
  #contents.statusList .tabTarget > .list .list > li.completed {
    padding-bottom: 175px;
  }
  #contents.statusList > .list .list > li.scheduled dl, #contents.statusList > .list .list > li.onSale dl, #contents.statusList > .list .list > li.completed dl,
  #contents.statusList .tabTarget > .list .list > li.scheduled dl,
  #contents.statusList .tabTarget > .list .list > li.onSale dl,
  #contents.statusList .tabTarget > .list .list > li.completed dl {
    position: absolute;
    bottom: 67px;
  }
}
@media (max-width: 1024px) and (min-width: 641px) and (max-width: 768px) {
  #contents.statusList > .list .list > li.scheduled, #contents.statusList > .list .list > li.onSale, #contents.statusList > .list .list > li.completed,
  #contents.statusList .tabTarget > .list .list > li.scheduled,
  #contents.statusList .tabTarget > .list .list > li.onSale,
  #contents.statusList .tabTarget > .list .list > li.completed {
    padding-bottom: 230px;
  }
  #contents.statusList > .list .list > li.scheduled dl, #contents.statusList > .list .list > li.onSale dl, #contents.statusList > .list .list > li.completed dl,
  #contents.statusList .tabTarget > .list .list > li.scheduled dl,
  #contents.statusList .tabTarget > .list .list > li.onSale dl,
  #contents.statusList .tabTarget > .list .list > li.completed dl {
    position: absolute;
    bottom: 122px;
  }
}
@media (max-width: 1024px) and (min-width: 641px) {
  #contents.statusList > .list .list > li .btns,
  #contents.statusList .tabTarget > .list .list > li .btns {
    position: absolute;
    bottom: 0;
    width: 100%;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #contents.statusList > .list .list > li .btns a.half,
  #contents.statusList .tabTarget > .list .list > li .btns a.half {
    width: 100%;
  }
  #contents.statusList > .list .list > li .btns a.half + a.half,
  #contents.statusList .tabTarget > .list .list > li .btns a.half + a.half {
    margin-top: 15px;
  }
}
@media (max-width: 1024px) and (min-width: 769px) {
  #contents.statusList > .list .list > li .btns,
  #contents.statusList .tabTarget > .list .list > li .btns {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #contents.statusList > .list .list > li .btns a.half,
  #contents.statusList .tabTarget > .list .list > li .btns a.half {
    width: calc(50% - 5px);
  }
}
@media (max-width: 1024px) and (min-width: 641px) {
  #contents.statusList > .list .list,
  #contents.statusList .tabTarget > .list .list {
    margin-left: -20px;
  }
  #contents.statusList > .list .list > li,
  #contents.statusList .tabTarget > .list .list > li {
    margin-left: 40px;
    width: calc(50% - 40px);
    padding-bottom: 68px;
  }
  #contents.statusList > .list .list > li + li + li,
  #contents.statusList .tabTarget > .list .list > li + li + li {
    margin-top: 40px;
  }
  #contents.statusList > .list .list > li a.btn:not(.half),
  #contents.statusList .tabTarget > .list .list > li a.btn:not(.half) {
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
@media (max-width: 640px) {
  #contents.statusList > .list .list,
  #contents.statusList .tabTarget > .list .list {
    margin-left: 0;
  }
  #contents.statusList > .list .list > li,
  #contents.statusList .tabTarget > .list .list > li {
    margin-left: 0;
    width: 100%;
  }
  #contents.statusList > .list .list > li + li,
  #contents.statusList .tabTarget > .list .list > li + li {
    margin-top: 40px;
  }
  #contents.statusList > .list .list > li a.btn,
  #contents.statusList .tabTarget > .list .list > li a.btn {
    margin-top: 27px;
  }
  #contents.statusList > .list .list > li dl,
  #contents.statusList .tabTarget > .list .list > li dl {
    position: relative;
  }
}
#contents.statusList > .list .more,
#contents.statusList .tabTarget > .list .more {
  text-align: center;
}
#contents.statusList > .list .more > button,
#contents.statusList .tabTarget > .list .more > button {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.statusList > .list .more > button::before, #contents.statusList > .list .more > button::after,
#contents.statusList .tabTarget > .list .more > button::before,
#contents.statusList .tabTarget > .list .more > button::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.statusList > .list .more > button:not(:disabled):hover, #contents.statusList > .list .more > button:not(:disabled):focus,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):hover,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.statusList > .list .more > button:not(:disabled):hover::before, #contents.statusList > .list .more > button:not(:disabled):hover::after, #contents.statusList > .list .more > button:not(:disabled):focus::before, #contents.statusList > .list .more > button:not(:disabled):focus::after,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):hover::before,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):hover::after,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):focus::before,
#contents.statusList .tabTarget > .list .more > button:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.statusList > .list .more > button,
  #contents.statusList .tabTarget > .list .more > button {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #contents.statusList > .list .more > button::before,
  #contents.statusList .tabTarget > .list .more > button::before {
    margin-right: 10px;
  }
  #contents.statusList > .list .more > button::after,
  #contents.statusList .tabTarget > .list .more > button::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.statusList > .list .more > button,
  #contents.statusList .tabTarget > .list .more > button {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #contents.statusList > .list .more > button::before,
  #contents.statusList .tabTarget > .list .more > button::before {
    margin-right: 14px;
  }
  #contents.statusList > .list .more > button::after,
  #contents.statusList .tabTarget > .list .more > button::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.statusList > .list .more,
  #contents.statusList .tabTarget > .list .more {
    margin-top: 80px;
  }
}
@media (max-width: 1024px) {
  #contents.statusList > .list .more,
  #contents.statusList .tabTarget > .list .more {
    margin-top: 40px;
  }
}
#detailContents.portfolioDetail > header .swiper-pagination {
  bottom: 20px;
}
#detailContents.portfolioDetail > header .swiper-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #c8c8c8;
}
#detailContents.portfolioDetail > header .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}
#detailContents.portfolioDetail > header .direction {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents.portfolioDetail > header .direction > * {
  z-index: 1;
}
#detailContents.portfolioDetail > header .direction .swiper-button-prev {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
  left: 20px;
}
#detailContents.portfolioDetail > header .direction .swiper-button-prev:hover, #detailContents.portfolioDetail > header .direction .swiper-button-prev:focus {
  border-color: #4415a0;
}
#detailContents.portfolioDetail > header .direction .swiper-button-prev:hover::after, #detailContents.portfolioDetail > header .direction .swiper-button-prev:focus::after {
  border-color: #4415a0;
}
#detailContents.portfolioDetail > header .direction .swiper-button-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail > header .direction .swiper-button-prev {
    width: 40px;
    height: 40px;
  }
  #detailContents.portfolioDetail > header .direction .swiper-button-prev::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 11px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .direction .swiper-button-prev {
    width: 30px;
    height: 30px;
  }
  #detailContents.portfolioDetail > header .direction .swiper-button-prev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 9px;
  }
}
#detailContents.portfolioDetail > header .direction .swiper-button-next {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
  right: 20px;
}
#detailContents.portfolioDetail > header .direction .swiper-button-next:hover, #detailContents.portfolioDetail > header .direction .swiper-button-next:focus {
  border-color: #4415a0;
}
#detailContents.portfolioDetail > header .direction .swiper-button-next:hover::after, #detailContents.portfolioDetail > header .direction .swiper-button-next:focus::after {
  border-color: #4415a0;
}
#detailContents.portfolioDetail > header .direction .swiper-button-next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail > header .direction .swiper-button-next {
    width: 40px;
    height: 40px;
  }
  #detailContents.portfolioDetail > header .direction .swiper-button-next::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 11px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .direction .swiper-button-next {
    width: 30px;
    height: 30px;
  }
  #detailContents.portfolioDetail > header .direction .swiper-button-next::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 9px;
  }
}
#detailContents.portfolioDetail > header .img {
  overflow: hidden;
}
#detailContents.portfolioDetail > header .btns {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#detailContents.portfolioDetail > header .btns > * {
  min-width: 180px;
}
#detailContents.portfolioDetail > header .btns .web {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#detailContents.portfolioDetail > header .btns .web::before, #detailContents.portfolioDetail > header .btns .web::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#detailContents.portfolioDetail > header .btns .web::before {
  content: "";
  background-image: url("../images/icon/iconWeb.svg");
}
#detailContents.portfolioDetail > header .btns .web:not(:disabled):hover, #detailContents.portfolioDetail > header .btns .web:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#detailContents.portfolioDetail > header .btns .web:not(:disabled):hover::before, #detailContents.portfolioDetail > header .btns .web:not(:disabled):hover::after, #detailContents.portfolioDetail > header .btns .web:not(:disabled):focus::before, #detailContents.portfolioDetail > header .btns .web:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail > header .btns .web {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #detailContents.portfolioDetail > header .btns .web::before {
    margin-right: 10px;
  }
  #detailContents.portfolioDetail > header .btns .web::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .btns .web {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #detailContents.portfolioDetail > header .btns .web::before {
    margin-right: 14px;
  }
  #detailContents.portfolioDetail > header .btns .web::after {
    margin-left: 18px;
  }
}
#detailContents.portfolioDetail > header .btns .call {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#detailContents.portfolioDetail > header .btns .call::before, #detailContents.portfolioDetail > header .btns .call::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#detailContents.portfolioDetail > header .btns .call::before {
  content: "";
  background-image: url("../images/icon/iconCall.svg");
}
#detailContents.portfolioDetail > header .btns .call:not(:disabled):hover, #detailContents.portfolioDetail > header .btns .call:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#detailContents.portfolioDetail > header .btns .call:not(:disabled):hover::before, #detailContents.portfolioDetail > header .btns .call:not(:disabled):hover::after, #detailContents.portfolioDetail > header .btns .call:not(:disabled):focus::before, #detailContents.portfolioDetail > header .btns .call:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail > header .btns .call {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #detailContents.portfolioDetail > header .btns .call::before {
    margin-right: 10px;
  }
  #detailContents.portfolioDetail > header .btns .call::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .btns .call {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #detailContents.portfolioDetail > header .btns .call::before {
    margin-right: 14px;
  }
  #detailContents.portfolioDetail > header .btns .call::after {
    margin-left: 18px;
  }
}
#detailContents.portfolioDetail > header .percent {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  max-width: 937px;
  text-align: center;
}
#detailContents.portfolioDetail > header .percent button {
  position: relative;
  margin-right: 31px;
  border-bottom: 1px solid #212121;
  font-weight: 700;
  line-height: 1.2;
}
#detailContents.portfolioDetail > header .percent button::before {
  content: "";
  right: -31px;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: #4415a0;
}
#detailContents.portfolioDetail > header .percent button::after {
  right: -23px;
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-width: 0 0 1px 1px;
  border-color: #fff;
  border-style: solid;
  transform: rotate(-135deg);
}
#detailContents.portfolioDetail > header .percent div {
  position: relative;
  overflow: hidden;
  background: #f6f6f6;
}
#detailContents.portfolioDetail > header .percent div span {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  display: block;
}
#detailContents.portfolioDetail > header .percent p {
  position: relative;
}
#detailContents.portfolioDetail > header .percent p span {
  position: absolute;
  bottom: 0;
  margin-left: -40px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
}
#detailContents.portfolioDetail > header .percent p span::before, #detailContents.portfolioDetail > header .percent p span::after {
  content: "";
  background: #c8c8c8;
}
#detailContents.portfolioDetail > header .percent p span::before {
  width: 1px;
  height: 20px;
}
#detailContents.portfolioDetail > header .percent p span::after {
  border-radius: 50%;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail > header .detailInfo {
    margin-top: 65px;
  }
  #detailContents.portfolioDetail > header .btns {
    margin-top: 40px;
  }
  #detailContents.portfolioDetail > header .btns > * + * {
    margin-left: 20px;
  }
  #detailContents.portfolioDetail > header .percent {
    margin-top: 80px;
  }
  #detailContents.portfolioDetail > header .percent div {
    margin-top: 30px;
    height: 20px;
    border-radius: 10px;
  }
  #detailContents.portfolioDetail > header .percent div span {
    background: linear-gradient(to right, #cec2e5 0%, #4415a0 897px);
  }
  #detailContents.portfolioDetail > header .percent p {
    height: 60px;
  }
  #detailContents.portfolioDetail > header .percent p span::before {
    top: -34px;
  }
  #detailContents.portfolioDetail > header .percent p span::after {
    top: -14px;
    width: 5px;
    height: 5px;
  }
  #detailContents.portfolioDetail > header.type01 {
    padding-bottom: 50px;
  }
  #detailContents.portfolioDetail > header.type01 .img {
    position: relative;
    margin-left: auto;
    margin-right: auto;
  }
  #detailContents.portfolioDetail > header.type01 .img img {
    display: block;
    width: 100%;
    /*
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -1200px;
    width: 2400px;
    height: 1200px;
    */
  }
  #detailContents.portfolioDetail > header.type01 .detailInfo,
  #detailContents.portfolioDetail > header.type01 .overview {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #detailContents.portfolioDetail > header.type01 .title,
  #detailContents.portfolioDetail > header.type01 .detailInfo,
  #detailContents.portfolioDetail > header.type01 .modifier {
    text-align: center;
  }
  #detailContents.portfolioDetail > header.type01 .title {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail > header.type01 .btns {
    justify-content: center;
  }
}
@media (min-width: 1025px) and (min-width: 1280px) {
  #detailContents.portfolioDetail > header.type02 {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    min-height: 1092px;
  }
  #detailContents.portfolioDetail > header.type02 .img {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 1920px;
  }
  #detailContents.portfolioDetail > header.type02 .img img {
    float: right;
    width: 800px;
  }
  #detailContents.portfolioDetail > header.type02 > *:not(.img) {
    width: 100%;
  }
  #detailContents.portfolioDetail > header.type02 hgroup {
    padding: 100px 0 0;
  }
  #detailContents.portfolioDetail > header.type02 .title {
    padding-top: 0;
    max-width: 400px;
  }
  #detailContents.portfolioDetail > header.type02 .detailInfo {
    max-width: 500px;
  }
  #detailContents.portfolioDetail > header.type02 .overview {
    max-width: 540px;
  }
  #detailContents.portfolioDetail > header.type02 .overview li {
    width: calc(50% - 20px);
  }
  #detailContents.portfolioDetail > header.type02 .overview li:nth-child(even) {
    margin-left: 40px;
  }
  #detailContents.portfolioDetail > header.type02 .overview li + li + li {
    margin-top: 45px;
  }
}
@media (min-width: 1025px) and (min-width: 1280px) and (min-width: 1431px) and (max-width: 1580px) {
  #detailContents.portfolioDetail > header.type02 .title,
  #detailContents.portfolioDetail > header.type02 .detailInfo,
  #detailContents.portfolioDetail > header.type02 .overview {
    width: 40%;
  }
}
@media (min-width: 1025px) and (min-width: 1280px) and (max-width: 1430px) {
  #detailContents.portfolioDetail > header.type02 .title,
  #detailContents.portfolioDetail > header.type02 .detailInfo,
  #detailContents.portfolioDetail > header.type02 .overview {
    width: 35%;
  }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  #detailContents.portfolioDetail > header.type02 .detailInfo,
  #detailContents.portfolioDetail > header.type02 .overview {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #detailContents.portfolioDetail > header.type02 .title,
  #detailContents.portfolioDetail > header.type02 .detailInfo {
    text-align: center;
  }
  #detailContents.portfolioDetail > header.type02 .title {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail > header.type02 .overview li {
    width: calc(25% - 12px);
    padding: 30px 25px 25px;
    background: #f9f9f9;
  }
  #detailContents.portfolioDetail > header.type02 .overview li:not(:nth-child(4n-3)) {
    margin-left: 16px;
  }
  #detailContents.portfolioDetail > header.type02 .overview li + li + li + li + li {
    margin-top: 17px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .detailInfo,
  #detailContents.portfolioDetail > header .overview {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #detailContents.portfolioDetail > header .detailInfo {
    margin-top: 15px;
  }
  #detailContents.portfolioDetail > header .btns {
    padding-top: 15px;
  }
  #detailContents.portfolioDetail > header .btns > * {
    margin-top: 15px;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #detailContents.portfolioDetail > header .btns > * {
    width: 100%;
  }
}
@media (max-width: 1024px) and (min-width: 481px) {
  #detailContents.portfolioDetail > header .btns > * + * {
    margin-left: 10px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .percent {
    margin-top: 50px;
  }
  #detailContents.portfolioDetail > header .percent div {
    margin-top: 20px;
    height: 30px;
    border-radius: 15px;
  }
  #detailContents.portfolioDetail > header .percent div span {
    background: linear-gradient(to right, #cec2e5 0%, #4415a0 600px);
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #detailContents.portfolioDetail > header .percent div span {
    background: linear-gradient(to right, #cec2e5 0%, #4415a0 500px);
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #detailContents.portfolioDetail > header .percent div span {
    background: linear-gradient(to right, #cec2e5 0%, #4415a0 400px);
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail > header .percent p {
    height: 53px;
  }
  #detailContents.portfolioDetail > header .percent p span::before {
    top: -27px;
  }
  #detailContents.portfolioDetail > header .percent p span::after {
    top: -7px;
    width: 7px;
    height: 7px;
  }
  #detailContents.portfolioDetail > header.type01 .img {
    position: relative;
    margin-left: auto;
    margin-right: auto;
  }
  #detailContents.portfolioDetail > header.type01 .img img {
    width: 100%;
    display: block;
    /*
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -768px;
    width: 1536px;
    height: 768px;
    */
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #detailContents.portfolioDetail > header.type01 .img.case {
    height: 360px;
  }
  #detailContents.portfolioDetail > header.type01 .img.case img {
    margin-left: -709px;
    width: 1418px;
  }
}
#detailContents.portfolioDetail .statusContent {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) and (min-width: 1025px) {
  #detailContents.portfolioDetail header.type01 .overview,
  #detailContents.portfolioDetail .statusContent .overview {
    margin-top: 50px;
  }
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail header.type01 .overview li,
  #detailContents.portfolioDetail .statusContent .overview li {
    width: calc(25% - 12px);
    padding: 30px 25px 25px;
    background: #f9f9f9;
  }
  #detailContents.portfolioDetail header.type01 .overview li:not(:nth-child(4n-3)),
  #detailContents.portfolioDetail .statusContent .overview li:not(:nth-child(4n-3)) {
    margin-left: 16px;
  }
  #detailContents.portfolioDetail header.type01 .overview li + li + li + li + li,
  #detailContents.portfolioDetail .statusContent .overview li + li + li + li + li {
    margin-top: 17px;
  }
  #detailContents.portfolioDetail header.type01 .overview li.merge,
  #detailContents.portfolioDetail .statusContent .overview li.merge {
    width: calc(75% - 4px);
  }
}
#detailContents.portfolioDetail .overview {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  word-break: keep-all;
}
#detailContents.portfolioDetail .overview li strong {
  display: block;
  background-position: left top;
  background-repeat: no-repeat;
  font-weight: 700;
  color: #212121;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .overview {
    margin-top: 65px;
  }
  #detailContents.portfolioDetail .overview li strong {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 15px;
    line-height: 33px;
  }
  #detailContents.portfolioDetail .overview li strong img {
    margin-right: 10px;
  }
  #detailContents.portfolioDetail .overview li strong br {
    display: none;
  }
  #detailContents.portfolioDetail .overview.hl {
    justify-content: center;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .overview {
    margin-top: 45px;
  }
  #detailContents.portfolioDetail .overview li {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    width: calc(50% - 8px);
    padding: 20px;
    background: #f9f9f9;
  }
  #detailContents.portfolioDetail .overview li:nth-child(even) {
    margin-left: 16px;
  }
  #detailContents.portfolioDetail .overview li + li + li {
    margin-top: 15px;
  }
  #detailContents.portfolioDetail .overview li strong {
    margin-right: 20px;
    width: 33px;
    background-position: center top;
    text-align: center;
    line-height: 20px;
    word-break: break-all;
  }
  #detailContents.portfolioDetail .overview li strong img {
    margin-bottom: 3px;
  }
  #detailContents.portfolioDetail .overview li.case strong {
    margin: 0 14px 0 -6px;
    width: 45px;
  }
  #detailContents.portfolioDetail .overview li span {
    width: calc(100% - 33px - 20px);
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #detailContents.portfolioDetail .overview li {
    width: 100%;
    margin-left: 0 !important;
  }
  #detailContents.portfolioDetail .overview li + li {
    margin-top: 15px;
  }
}
@media (max-width: 1024px) and (min-width: 641px) {
  #detailContents.portfolioDetail .overview.hl {
    justify-content: stretch;
  }
  #detailContents.portfolioDetail .overview.hl li {
    width: unset !important;
    min-width: calc(50% - 8px);
    flex-grow: 1;
  }
}
#detailContents.portfolioDetail .map {
  position: relative;
  width: 100%;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .map + .inquiry {
    margin-top: 150px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .map + .inquiry {
    margin-top: 90px;
  }
}
#detailContents.portfolioDetail .map #map {
  background: rgba(0, 151, 224, 0.3);
}
#detailContents.portfolioDetail .map .buttons {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents.portfolioDetail .map .buttons > * {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  border-radius: 21px;
  background: #f9f9f9;
  font-size: 16px;
  line-height: 40px;
  color: #666;
}
#detailContents.portfolioDetail .map .buttons > *::before {
  content: "";
  margin-right: 5px;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-position: center;
}
#detailContents.portfolioDetail .map .buttons > *.mapView::before {
  background-image: url("../images/icon/iconMapView1.svg");
}
#detailContents.portfolioDetail .map .buttons > *.roadView::before {
  background-image: url("../images/icon/iconMapView2.svg");
}
#detailContents.portfolioDetail .map .buttons > *.editView::before {
  background-image: url("../images/icon/iconMapView3.svg");
}
#detailContents.portfolioDetail .map .buttons > *.active {
  border: 0;
  background: #4415a0;
  line-height: 42px;
  color: #fff;
}
#detailContents.portfolioDetail .map .buttons > *.active::before {
  -moz-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
  -ms-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
  -o-filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
  filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .map #map {
    height: 490px;
  }
  #detailContents.portfolioDetail .map #container, #detailContents.portfolioDetail .map #mapWrapper, #detailContents.portfolioDetail .map #rvWrapper {
    height: 490px !important;
  }
  #detailContents.portfolioDetail .map .buttons {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
  }
  #detailContents.portfolioDetail .map .buttons > * {
    margin-left: 10px;
    padding: 0 25px 0 17px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .map #map {
    height: 226px;
  }
  #detailContents.portfolioDetail .map #container, #detailContents.portfolioDetail .map #mapWrapper, #detailContents.portfolioDetail .map #rvWrapper {
    height: 226px !important;
  }
  #detailContents.portfolioDetail .map .buttons {
    padding-top: 15px;
  }
  #detailContents.portfolioDetail .map .buttons > * {
    margin-top: 15px;
    width: 100%;
  }
}
@media (max-width: 1024px) and (min-width: 768px) {
  #detailContents.portfolioDetail .map #map {
    height: 490px;
  }
  #detailContents.portfolioDetail .map .buttons {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
  }
  #detailContents.portfolioDetail .map .buttons > * {
    margin-left: 10px;
    width: unset;
    padding: 0 25px 0 17px;
  }
}
#detailContents.portfolioDetail > .shortcutMiddle {
  margin-top: 50px;
}
#detailContents.portfolioDetail .detailContainer > section.caseOdd, #detailContents.portfolioDetail .detailContainer > section:nth-of-type(even):not(.caseEven) {
  background: #f9f9f9;
}
#detailContents.portfolioDetail .detailContainer > section > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#detailContents.portfolioDetail .detailContainer > section .title {
  word-break: keep-all;
}
#detailContents.portfolioDetail .detailContainer > section .video {
  position: relative;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
}
#detailContents.portfolioDetail .detailContainer > section .video iframe,
#detailContents.portfolioDetail .detailContainer > section .video object,
#detailContents.portfolioDetail .detailContainer > section .video embed,
#detailContents.portfolioDetail .detailContainer > section .video video {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer {
  position: relative;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide {
  text-align: left;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide div {
  overflow: hidden;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide div img {
  display: block;
  width: 100%;
  transition: all 0.3s;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide p {
  margin-top: 15px;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  word-break: keep-all;
  color: #666;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide:hover img, #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide:focus img {
  transform: scale(1.06);
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext:not(:disabled):hover {
  border-color: #4415a0;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev,
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
  z-index: 1;
  position: absolute;
}
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev:disabled,
#detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext:disabled {
  opacity: 0;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper {
    margin-left: -15px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide {
    margin-left: 15px;
    width: 285px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev,
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    top: 80px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev {
    left: -18px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    right: -18px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer {
    margin-left: -20px;
    margin-right: -20px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper {
    margin-left: -10px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .swiper-slide {
    margin-left: 10px;
    width: 320px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev,
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    top: 98px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnPrev {
    left: 10px;
  }
  #detailContents.portfolioDetail .detailContainer > section.gallery .swiperContainer .btnNext {
    right: 10px;
  }
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .detailContainer > header {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #detailContents.portfolioDetail .detailContainer > header > div {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 100px 0;
  }
  #detailContents.portfolioDetail .detailContainer > header button {
    text-align: left;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  #detailContents.portfolioDetail .detailContainer > header button + button {
    margin-top: 20px;
  }
  #detailContents.portfolioDetail .detailContainer > header button:not(.active) {
    font-weight: 300;
    color: #b2b2b2;
  }
  #detailContents.portfolioDetail .detailContainer > header button.active {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    color: #4415a0;
  }
  #detailContents.portfolioDetail .detailContainer > header button.active::after {
    content: "";
    margin-left: 17px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #4415a0;
  }
  #detailContents.portfolioDetail .detailContainer > section {
    padding-bottom: 100px;
  }
  #detailContents.portfolioDetail .detailContainer > section > div {
    padding-left: 335px;
  }
  #detailContents.portfolioDetail .detailContainer > section h1 {
    position: absolute;
    display: inline-block;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
  }
  #detailContents.portfolioDetail .detailContainer > section .title {
    font-size: 36px;
    line-height: 48px;
    letter-spacing: -0.03em;
  }
  #detailContents.portfolioDetail .detailContainer > section .detail {
    margin-top: 60px;
  }
  #detailContents.portfolioDetail .detailContainer.caseNoContents {
    margin-bottom: 100px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > header {
    display: none;
  }
  #detailContents.portfolioDetail .detailContainer > section {
    padding-bottom: 50px;
  }
  #detailContents.portfolioDetail .detailContainer > section h1 {
    margin-bottom: 23px;
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
    font-weight: normal;
    color: #4415a0;
  }
  #detailContents.portfolioDetail .detailContainer > section .title {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 400;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #detailContents.portfolioDetail .detailContainer > section .title {
    width: 250px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .detailContainer > section .detail {
    margin-top: 30px;
  }
  #detailContents.portfolioDetail .detailContainer.caseNoContents {
    margin-bottom: 50px;
  }
}
#detailContents.portfolioDetail .progressCalendar .calendar {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 1px solid #e5e5e5;
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox {
  position: relative;
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox > button {
  position: relative;
  font-weight: 700;
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox > button::after {
  position: absolute;
  top: 0;
  bottom: 10px;
  right: 0;
  margin: auto;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 2px 2px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div {
  z-index: 2;
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  display: none;
  width: 100%;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div button {
  width: 100%;
  padding: 0 20px;
  line-height: 2.5 !important;
  text-align: left;
}
#detailContents.portfolioDetail .progressCalendar .calendar .selectBox > div button.selected {
  color: #4415a0;
}
#detailContents.portfolioDetail .progressCalendar .calendar .month button {
  border-radius: 50%;
  padding: 2px 0;
}
#detailContents.portfolioDetail .progressCalendar .calendar .month button:disabled {
  color: #c8c8c8;
}
#detailContents.portfolioDetail .progressCalendar .calendar .month button.active {
  background: #4415a0;
  color: #fff;
}
#detailContents.portfolioDetail .progressCalendar .performance {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  word-break: keep-all;
}
#detailContents.portfolioDetail .progressCalendar .performance header {
  padding-top: 20px;
}
#detailContents.portfolioDetail .progressCalendar .performance header p {
  font-weight: 700;
}
#detailContents.portfolioDetail .progressCalendar .performance header h2 {
  color: #212121;
}
#detailContents.portfolioDetail .progressCalendar .performance header ul li {
  position: relative;
  padding-left: 15px;
}
#detailContents.portfolioDetail .progressCalendar .performance header ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #4415a0;
}
#detailContents.portfolioDetail .progressCalendar .performance header ul {
  overflow-y: auto;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .progressCalendar .performance header ul {
    max-height: 300px;
  }
}
@media (max-width: 1080px) {
  #detailContents.portfolioDetail .progressCalendar .performance header ul {
    max-height: 250px;
  }
}
@media (max-width: 910px) {
  #detailContents.portfolioDetail .progressCalendar .performance header ul {
    max-height: 220px;
  }
}
@media (max-width: 810px) {
  #detailContents.portfolioDetail .progressCalendar .performance header ul {
    max-height: 180px;
  }
}
@media (max-width: 768px) {
  #detailContents.portfolioDetail .progressCalendar .performance header ul {
    max-height: unset;
  }
}
#detailContents.portfolioDetail .progressCalendar .performance .swiper {
  margin-left: unset;
}
#detailContents.portfolioDetail .progressCalendar .performance .swiper img {
  width: 100%;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination img {
  width: 100%;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .swiper-pagination-bullet {
  position: relative;
  display: inline-block;
  margin: unset;
  width: unset;
  height: unset;
  border-radius: 0;
  background: none;
  opacity: 1 !important;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .swiper-pagination-bullet-active::before {
  content: "";
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 6px solid #4415a0;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button {
  position: relative;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button::before {
  content: "";
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.44);
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button::after {
  content: "";
  width: 39px;
  height: 39px;
  border: 1px solid #fff;
  border-radius: 50%;
}
#detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs button span::before {
  content: "";
  left: 9px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 7px;
  border-color: transparent transparent transparent #fff;
}
#detailContents.portfolioDetail .progressCalendar .performance .exclamation {
  width: 100%;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail .progressCalendar .selectBox > button {
    padding-right: 35px;
    font-size: 60px;
  }
  #detailContents.portfolioDetail .progressCalendar .month {
    width: calc(100% - 280px);
  }
  #detailContents.portfolioDetail .progressCalendar .month > div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #detailContents.portfolioDetail .progressCalendar .month > div button {
    width: 50px;
    height: 50px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance {
    margin-top: 50px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header {
    width: calc(50% - 60px);
  }
  #detailContents.portfolioDetail .progressCalendar .performance header h1 {
    margin-bottom: 20px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header h2 {
    margin-top: 40px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header ul, #detailContents.portfolioDetail .progressCalendar .performance header div {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper {
    width: 50%;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev,
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next {
    display: none;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination {
    margin-top: 20px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .performanceSwipeThumb {
    width: 86%;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .performanceSwipeThumb .swiper-pagination-bullet {
    margin-right: 20px;
    width: calc(25% - 20px);
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs {
    width: 14%;
    padding-left: 12px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .exclamation {
    margin-top: 25px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail .progressCalendar .selectBox > button {
    padding-right: 20px;
    font-size: 30px;
  }
  #detailContents.portfolioDetail .progressCalendar .month {
    max-width: calc(100% - 110px);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  #detailContents.portfolioDetail .progressCalendar .month::-webkit-scrollbar {
    display: none;
  }
  #detailContents.portfolioDetail .progressCalendar .month > div {
    white-space: nowrap;
  }
  #detailContents.portfolioDetail .progressCalendar .month > div button.active {
    width: 36px;
    height: 36px;
  }
  #detailContents.portfolioDetail .progressCalendar .month > div button + button {
    margin-left: 25px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance {
    margin-top: 30px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header h1 {
    margin-bottom: 5px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header h2 {
    margin-top: 30px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header ul, #detailContents.portfolioDetail .progressCalendar .performance header div {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) and (min-width: 769px) {
  #detailContents.portfolioDetail .progressCalendar .performance header {
    width: calc(50% - 30px);
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper {
    width: 50%;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .exclamation {
    margin-top: 20px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper-button-prev,
  #detailContents.portfolioDetail .progressCalendar .performance .swiper-button-next {
    display: none;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination {
    margin-top: 10px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .performanceSwipeThumb {
    width: 85%;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .performanceSwipeThumb .swiper-pagination-bullet {
    margin-right: 10px;
    width: calc(25% - 10px);
  }
  #detailContents.portfolioDetail .progressCalendar .performance .pagination .timelabs {
    width: 15%;
    padding-left: 6px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #detailContents.portfolioDetail .progressCalendar .performance header,
  #detailContents.portfolioDetail .progressCalendar .performance .swiper {
    width: 100%;
  }
  #detailContents.portfolioDetail .progressCalendar .performance header {
    order: 2;
    margin-top: 40px;
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #e5e5e5;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper {
    order: 1;
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 20px + 20px);
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-wrapper {
    padding-left: 10px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-slide {
    width: calc(100% - 20px - 10px);
    max-width: 500px;
    padding-left: 10px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-slide:last-child {
    margin-right: 30px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev,
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next {
    z-index: 1;
    position: absolute !important;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
    left: 8px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev:not(:disabled):hover {
    border-color: #4415a0;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
@media (max-width: 1024px) and (max-width: 768px) and (min-width: 1025px) {
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) and (max-width: 1024px) {
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-prev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next {
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    border: 1px solid #c1c1c1;
    border-radius: 50%;
    background: #fff;
    right: 8px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next:not(:disabled):hover {
    border-color: #4415a0;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next:not(:disabled):hover::after {
    border-color: #4415a0 !important;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
@media (max-width: 1024px) and (max-width: 768px) and (min-width: 1025px) {
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next {
    width: 37px;
    height: 37px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) and (max-width: 1024px) {
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next {
    width: 25px;
    height: 25px;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .swiper .swiper-button-next::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #detailContents.portfolioDetail .progressCalendar .performance .pagination {
    display: none;
  }
  #detailContents.portfolioDetail .progressCalendar .performance .exclamation {
    order: 3;
  }
}
#detailContents.portfolioDetail footer.button {
  text-align: center;
}
#detailContents.portfolioDetail footer.button a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#detailContents.portfolioDetail footer.button a::before, #detailContents.portfolioDetail footer.button a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#detailContents.portfolioDetail footer.button a:not(:disabled):hover, #detailContents.portfolioDetail footer.button a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#detailContents.portfolioDetail footer.button a:not(:disabled):hover::before, #detailContents.portfolioDetail footer.button a:not(:disabled):hover::after, #detailContents.portfolioDetail footer.button a:not(:disabled):focus::before, #detailContents.portfolioDetail footer.button a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail footer.button a {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #detailContents.portfolioDetail footer.button a::before {
    margin-right: 10px;
  }
  #detailContents.portfolioDetail footer.button a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail footer.button a {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #detailContents.portfolioDetail footer.button a::before {
    margin-right: 14px;
  }
  #detailContents.portfolioDetail footer.button a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #detailContents.portfolioDetail footer.button {
    padding-top: 80px;
  }
}
@media (max-width: 1024px) {
  #detailContents.portfolioDetail footer.button {
    padding-top: 40px;
  }
}

#contents.pressList > .list .list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#contents.pressList > section h1 {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.pressList > section + .list {
  margin-top: -50px;
}
#contents.pressList .newsPick > div {
  position: relative;
}
#contents.pressList .newsPick > div li {
  position: relative;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.pressList .newsPick > div li .img {
  position: relative;
  overflow: hidden;
  vertical-align: top;
}
#contents.pressList .newsPick > div li .img img {
  display: block;
  width: 100%;
}
#contents.pressList .newsPick > div li .detail {
  position: relative;
  vertical-align: top;
}
#contents.pressList .newsPick > div li .detail .pagination span {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 50%;
}
#contents.pressList .newsPick > div li .detail .pagination span:hover::before {
  opacity: 0;
}
#contents.pressList .newsPick > div li .detail .pagination span::before, #contents.pressList .newsPick > div li .detail .pagination span::after {
  z-index: 1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  transition: opacity 0.3s;
}
#contents.pressList .newsPick > div li .detail .pagination span::before {
  background: rgba(0, 0, 0, 0.53);
}
#contents.pressList .newsPick > div li .detail .pagination span::after {
  max-width: 0;
  background: rgba(0, 151, 224, 0.47);
}
#contents.pressList .newsPick > div li .detail .pagination span.swiper-pagination-bullet-active::before {
  display: none;
}
@keyframes maxWidthKey {
  to {
    max-width: 100%;
  }
}
#contents.pressList .newsPick > div li .detail .pagination span.swiper-pagination-bullet-active::after {
  max-width: 0;
  animation: maxWidthKey 10s 0s forwards;
}
#contents.pressList .newsPick > div li .detail .pagination span + span {
  margin-left: 10px;
}
#contents.pressList .newsPick > div li .detail .pagination span img {
  display: block;
  width: 100%;
  height: 100%;
}
#contents.pressList .newsPick > div li .detail em {
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 4.2em;
  line-height: 1.4 !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
  word-break: keep-all;
}
#contents.pressList .newsPick > div li .detail > span {
  display: block;
  display: block;
  display: -ms-flexbox;
  display: -moz-box;
  display: -webkit-box;
  -ms-box-align: center;
  -o-box-align: center;
  box-align: center;
  max-height: 3.4em;
  line-height: 1.7 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: break-spaces;
}
#contents.pressList .newsPick > div li .detail a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  min-width: 100px;
}
#contents.pressList .newsPick > div li .detail a::before, #contents.pressList .newsPick > div li .detail a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.pressList .newsPick > div li .detail a:not(:disabled):hover, #contents.pressList .newsPick > div li .detail a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.pressList .newsPick > div li .detail a:not(:disabled):hover::before, #contents.pressList .newsPick > div li .detail a:not(:disabled):hover::after, #contents.pressList .newsPick > div li .detail a:not(:disabled):focus::before, #contents.pressList .newsPick > div li .detail a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.pressList .newsPick > div li .detail a {
    font-size: 16px;
    font-size: 14px;
    min-width: 100px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.pressList .newsPick > div li .detail a::before {
    margin-right: 10px;
  }
  #contents.pressList .newsPick > div li .detail a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsPick > div li .detail a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.pressList .newsPick > div li .detail a::before {
    margin-right: 14px;
  }
  #contents.pressList .newsPick > div li .detail a::after {
    margin-left: 18px;
  }
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next {
    width: 40px;
    height: 40px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next {
    width: 35px;
    height: 35px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-next::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev {
    width: 40px;
    height: 40px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev {
    width: 35px;
    height: 35px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap .swiper-button-prev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
#contents.pressList .newsPick > div li .detail .buttonWrap button:disabled, #contents.pressList .newsPick > div li .detail .buttonWrap button.swiper-button-disabled {
  display: none !important;
}
#contents.pressList .newsPick > div li .detail .buttonWrap button:disabled + button, #contents.pressList .newsPick > div li .detail .buttonWrap button.swiper-button-disabled + button {
  margin-left: 0 !important;
}
@media (min-width: 1025px) {
  #contents.pressList .newsPick > div li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    max-width: 1240px;
  }
  #contents.pressList .newsPick > div li .img {
    z-index: 2;
    width: 64.166%;
    height: 0;
    padding-bottom: 37.0829%;
    transition: all 0.5s;
  }
  #contents.pressList .newsPick > div li .img.order {
    order: 2;
    padding-left: 4%;
  }
  #contents.pressList .newsPick > div li .detail {
    width: 35.834%;
    min-height: 100%;
    padding-left: 4%;
    padding-right: 20px;
    opacity: 1;
    transition: left 1s;
  }
  #contents.pressList .newsPick > div li .detail.order {
    order: 1;
    padding-left: 0;
  }
  #contents.pressList .newsPick > div li .detail .pagination {
    margin: 25px 0 40px;
  }
  #contents.pressList .newsPick > div li .detail .pagination span {
    width: 53px;
    height: 53px;
  }
  #contents.pressList .newsPick > div li .detail > span {
    margin-top: 15px;
  }
  #contents.pressList .newsPick > div li .detail em {
    height: 4.2em;
  }
  #contents.pressList .newsPick > div li .detail a {
    margin-top: 40px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap {
    margin-top: 50px;
    /*@media (max-width: 1200px) {
      left: unset;
      right: $space;
    }*/
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap * + * {
    margin-left: 20px;
  }
}
@media (min-width: 1025px) and (min-width: 1281px) {
  #contents.pressList .newsPick > div li.swiper-slide-prev, #contents.pressList .newsPick > div li.swiper-slide-duplicate-prev {
    /*
    .img {
      margin-left: 35.834%;
    }
    .detail {
      left: 50%;
      opacity: 0;
    }*/
  }
  #contents.pressList .newsPick > div li.swiper-slide-prev .img, #contents.pressList .newsPick > div li.swiper-slide-duplicate-prev .img {
    order: 1;
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsPick > div li {
    width: 100%;
  }
  #contents.pressList .newsPick > div li .detail .pagination {
    margin-bottom: 36px;
  }
  #contents.pressList .newsPick > div li .detail .pagination span {
    width: 40px;
    height: 40px;
  }
  #contents.pressList .newsPick > div li .detail > span {
    margin-top: 12px;
  }
  #contents.pressList .newsPick > div li .detail a {
    margin-top: 20px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap * + * {
    margin-left: 12px;
  }
}
@media (max-width: 1024px) and (min-width: 801px) {
  #contents.pressList .newsPick > div li .img {
    width: 55%;
    height: 0;
    padding-bottom: 31.796875%;
  }
  #contents.pressList .newsPick > div li .detail {
    width: 45%;
    min-height: 100%;
    padding-left: 30px;
    padding-right: 20px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap {
    margin-top: 20px;
    /*@media (max-width: 990px) {
      left: unset;
      right: $space;
    }*/
  }
}
@media (max-width: 800px) {
  #contents.pressList .newsPick > div li {
    max-width: 300px;
    padding: 0 10px;
  }
  #contents.pressList .newsPick > div li .detail .pagination {
    margin-top: 18px;
  }
  #contents.pressList .newsPick > div li .detail > a {
    margin-top: 40px;
  }
  #contents.pressList .newsPick > div li .detail .buttonWrap {
    margin-top: 30px;
  }
}
@media (max-width: 800px) and (min-width: 360px) {
  #contents.pressList .newsPick > div li .pagination,
  #contents.pressList .newsPick > div li .buttonWrap,
  #contents.pressList .newsPick > div li > a {
    opacity: 1;
    transition: all 0.5s;
  }
  #contents.pressList .newsPick > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .pagination,
  #contents.pressList .newsPick > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .buttonWrap,
  #contents.pressList .newsPick > div li:not(.swiper-slide-duplicate-active):not(.swiper-slide-active) .detail > a {
    opacity: 0;
  }
}
@media (max-width: 480px) {
  #contents.pressList .newsPick > div {
    margin-left: -20px;
  }
  #contents.pressList .newsPick > div li {
    max-width: calc(100% - 20px * 3);
  }
}
@media (max-width: 480px) and (max-width: 359px) {
  #contents.pressList .newsPick > div {
    min-width: 315px;
    margin: 0 !important;
  }
  #contents.pressList .newsPick > div li {
    max-width: unset;
    width: 100%;
    padding: 0 20px;
  }
}
#contents.pressList .newsCollect > div {
  background: #f9f9f9;
}
#contents.pressList .newsCollect > div .swiper {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.pressList .newsCollect > div .swiper button {
  position: relative;
  height: unset !important;
  border: 1px solid #c8c8c8;
  background: #fff;
  text-align: left;
}
#contents.pressList .newsCollect > div .swiper button p {
  display: block;
  height: 100%;
  word-spacing: 9999999px;
}
#contents.pressList .newsCollect > div .swiper button em {
  position: absolute;
  color: #4415a0;
}
#contents.pressList .newsCollect > div .swiper button em::after {
  content: " 건";
  color: #4415a0;
}
#contents.pressList .newsCollect > div .swiper button.selected {
  border-color: #4415a0;
}
@media (min-width: 769px) {
  #contents.pressList .newsCollect > div .swiper .swiper-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    transform: none !important;
  }
  #contents.pressList .newsCollect > div .swiper .swiper-wrapper button:hover {
    border-color: #4415a0;
  }
}
@media (min-width: 1025px) {
  #contents.pressList .newsCollect > div .swiper button {
    width: calc(25% - 19.5px);
    padding: 40px 10px 120px 40px;
  }
  #contents.pressList .newsCollect > div .swiper button:not(:nth-child(4n-3)) {
    margin-left: 26px;
  }
  #contents.pressList .newsCollect > div .swiper button + button + button + button + button {
    margin-top: 26px;
  }
  #contents.pressList .newsCollect > div .swiper button em {
    bottom: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsCollect > div .swiper {
    margin-left: -10px;
  }
  #contents.pressList .newsCollect > div .swiper button {
    width: calc(25% - 10px);
    margin-left: 10px;
    padding: 20px 10px 90px 20px;
  }
  #contents.pressList .newsCollect > div .swiper button + button + button + button + button {
    margin-top: 10px;
  }
  #contents.pressList .newsCollect > div .swiper button em {
    bottom: 20px;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  #contents.pressList .newsCollect > div .swiper button {
    width: 190px;
    margin-top: 0 !important;
  }
}
@media (min-width: 1025px) {
  #contents.pressList .newsCollect > div {
    padding: 100px 0;
  }
}
@media (max-width: 1024px) {
  #contents.pressList .newsCollect > div {
    padding: 50px 0;
  }
}

#contents.brochure .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 300;
  word-break: keep-all;
}
#contents.brochure .downloadInfo:nth-of-type(even) {
  background: #fff;
}

#contents.groupPr .library:nth-of-type(2n) {
  background: #f9f9f9;
}
#contents.groupPr .library > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.groupPr .library .swiper-slide div {
  position: relative;
  margin-bottom: 15px;
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  padding-top: 30px;
}
#contents.groupPr .library .swiper-slide div iframe, #contents.groupPr .library .swiper-slide div object, #contents.groupPr .library .swiper-slide div embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#contents.groupPr .library .swiper-slide img {
  display: block;
  width: 100%;
}
#contents.groupPr .library header div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.groupPr .library header div button {
  position: relative;
}
#contents.groupPr .library header div .prev {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
  margin-right: 10px;
}
#contents.groupPr .library header div .prev:hover, #contents.groupPr .library header div .prev:focus {
  border-color: #4415a0;
}
#contents.groupPr .library header div .prev:hover::after, #contents.groupPr .library header div .prev:focus::after {
  border-color: #4415a0;
}
#contents.groupPr .library header div .prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.groupPr .library header div .prev {
    width: 40px;
    height: 40px;
  }
  #contents.groupPr .library header div .prev::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 11px;
  }
}
@media (max-width: 1024px) {
  #contents.groupPr .library header div .prev {
    width: 30px;
    height: 30px;
  }
  #contents.groupPr .library header div .prev::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 9px;
  }
}
#contents.groupPr .library header div .next {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
}
#contents.groupPr .library header div .next:hover, #contents.groupPr .library header div .next:focus {
  border-color: #4415a0;
}
#contents.groupPr .library header div .next:hover::after, #contents.groupPr .library header div .next:focus::after {
  border-color: #4415a0;
}
#contents.groupPr .library header div .next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.groupPr .library header div .next {
    width: 40px;
    height: 40px;
  }
  #contents.groupPr .library header div .next::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 11px;
  }
}
@media (max-width: 1024px) {
  #contents.groupPr .library header div .next {
    width: 30px;
    height: 30px;
  }
  #contents.groupPr .library header div .next::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 9px;
  }
}
@media (min-width: 1025px) {
  #contents.groupPr .library {
    margin-top: -10px;
    padding-bottom: 100px;
  }
  #contents.groupPr .library:nth-of-type(2n) {
    padding-top: 100px;
    padding-bottom: 150px;
  }
  #contents.groupPr .library header {
    display: inline-flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    width: 424px;
    height: 465px;
  }
  #contents.groupPr .library header.photo {
    height: 350px;
  }
  #contents.groupPr .library header h1 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  #contents.groupPr .library header a {
    position: relative;
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    border: 1px solid #c8c8c8;
    background-color: #fff;
    text-align: center;
    letter-spacing: -0.02em;
    line-height: 1.2;
    word-break: keep-all;
    color: #666;
    margin-top: 30px;
    width: 275px;
    padding-left: 47px !important;
    background: url("../images/icon/iconYoutube.svg") no-repeat 18px center;
  }
  #contents.groupPr .library header a::before, #contents.groupPr .library header a::after {
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.7;
  }
  #contents.groupPr .library header a:not(:disabled):hover, #contents.groupPr .library header a:not(:disabled):focus {
    border-color: #4415a0;
    background: #4415a0;
    color: #fff;
  }
  #contents.groupPr .library header a:not(:disabled):hover::before, #contents.groupPr .library header a:not(:disabled):hover::after, #contents.groupPr .library header a:not(:disabled):focus::before, #contents.groupPr .library header a:not(:disabled):focus::after {
    -moz-filter: grayscale(1) brightness(100);
    -ms-filter: grayscale(1) brightness(100);
    -o-filter: grayscale(1) brightness(100);
    filter: grayscale(1) brightness(100);
    opacity: 1;
  }
}
@media (min-width: 1025px) and (min-width: 1025px) {
  #contents.groupPr .library header a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupPr .library header a::before {
    margin-right: 10px;
  }
  #contents.groupPr .library header a::after {
    margin: 0 2px 0 15px;
  }
}
@media (min-width: 1025px) and (max-width: 1024px) {
  #contents.groupPr .library header a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupPr .library header a::before {
    margin-right: 14px;
  }
  #contents.groupPr .library header a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.groupPr .library header a.insta {
    background-image: url("../images/icon/iconInsta.svg");
  }
  #contents.groupPr .library header div {
    margin-top: 30px;
  }
  #contents.groupPr .library .swiper {
    display: inline-block;
    position: absolute;
    margin-left: -40px;
    width: calc(808px + (100vw - 1200px) / 2);
  }
  #contents.groupPr .library .swiper .swiper-slide {
    margin-left: 40px;
  }
  #contents.groupPr .library .swiper.video {
    width: calc(808px + (100vw - 1200px) / 2);
  }
  #contents.groupPr .library .swiper.video .swiper-slide {
    width: 700px;
  }
  #contents.groupPr .library .swiper.video .swiper-slide div + p {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1254px) {
  #contents.groupPr .library .swiper.video {
    width: calc(100vw - 424px);
  }
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  #contents.groupPr .library .swiper.video .swiper-slide {
    width: calc(100% - 80px);
  }
}
@media (min-width: 1025px) {
  #contents.groupPr .library .swiper.photo .swiper-slide {
    width: 350px;
  }
}
@media (max-width: 1024px) {
  #contents.groupPr .library {
    padding-bottom: 60px;
  }
  #contents.groupPr .library:nth-of-type(2n) {
    padding-top: 67px;
    padding-bottom: 80px;
  }
  #contents.groupPr .library header {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }
  #contents.groupPr .library header h1 {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
  #contents.groupPr .library header a {
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
    margin-left: 23px;
    width: 32px;
    height: 23px;
    background: url("../images/icon/iconYoutube2.svg") no-repeat center;
  }
  #contents.groupPr .library header a.insta {
    width: 28px;
    height: 28px;
    background-image: url("../images/icon/iconInsta.png");
    background-size: 28px;
  }
  #contents.groupPr .library header div {
    margin-top: 20px;
    width: 100%;
  }
  #contents.groupPr .library .swiper {
    margin-top: 30px;
    margin-left: -20px;
    margin-right: -20px;
  }
  #contents.groupPr .library .swiper .swiper-slide {
    margin-left: 20px;
  }
  #contents.groupPr .library .swiper.video .swiper-slide {
    width: 300px;
  }
  #contents.groupPr .library .swiper.video .swiper-slide div + p {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #contents.groupPr .library .swiper.photo .swiper-slide {
    width: 180px;
  }
}

#contents.cibi img,
#contents.ci img {
  max-width: 100%;
}
@media (min-width: 1025px) {
  #contents.cibi > section:not(.heading):not(.tabTarget),
  #contents.ci > section:not(.heading):not(.tabTarget) {
    padding-top: 100px !important;
  }
}
@media (max-width: 1024px) {
  #contents.cibi > section:not(.heading):not(.tabTarget),
  #contents.ci > section:not(.heading):not(.tabTarget) {
    padding-top: 55px !important;
  }
}
#contents.cibi > section h1,
#contents.ci > section h1 {
  padding-bottom: 20px;
}
#contents.cibi > section > .inner,
#contents.ci > section > .inner {
  margin-top: 0 !important;
}
@media (min-width: 1025px) {
  #contents.cibi > section > .inner,
  #contents.ci > section > .inner {
    padding-bottom: 0 !important;
  }
}
#contents.cibi .heading,
#contents.ci .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.cibi .heading h1 + p,
#contents.cibi .heading p:first-child,
#contents.ci .heading h1 + p,
#contents.ci .heading p:first-child {
  word-break: keep-all;
}
#contents.cibi .heading p + p,
#contents.ci .heading p + p {
  color: #666;
}
@media (max-width: 640px) {
  #contents.cibi .heading p + p br,
  #contents.ci .heading p + p br {
    display: none;
  }
}
#contents.cibi .buttons .download,
#contents.ci .buttons .download {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.cibi .buttons .download::before, #contents.cibi .buttons .download::after,
#contents.ci .buttons .download::before,
#contents.ci .buttons .download::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.cibi .buttons .download::after,
#contents.ci .buttons .download::after {
  content: "";
  margin-top: -2px !important;
  background-image: url("../images/icon/iconDownload2.svg");
}
#contents.cibi .buttons .download:not(:disabled):hover, #contents.cibi .buttons .download:not(:disabled):focus,
#contents.ci .buttons .download:not(:disabled):hover,
#contents.ci .buttons .download:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.cibi .buttons .download:not(:disabled):hover::before, #contents.cibi .buttons .download:not(:disabled):hover::after, #contents.cibi .buttons .download:not(:disabled):focus::before, #contents.cibi .buttons .download:not(:disabled):focus::after,
#contents.ci .buttons .download:not(:disabled):hover::before,
#contents.ci .buttons .download:not(:disabled):hover::after,
#contents.ci .buttons .download:not(:disabled):focus::before,
#contents.ci .buttons .download:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.cibi .buttons .download,
  #contents.ci .buttons .download {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.cibi .buttons .download::before,
  #contents.ci .buttons .download::before {
    margin-right: 10px;
  }
  #contents.cibi .buttons .download::after,
  #contents.ci .buttons .download::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.cibi .buttons .download,
  #contents.ci .buttons .download {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.cibi .buttons .download::before,
  #contents.ci .buttons .download::before {
    margin-right: 14px;
  }
  #contents.cibi .buttons .download::after,
  #contents.ci .buttons .download::after {
    margin-left: 18px;
  }
  #contents.cibi .heading .buttons,
  #contents.ci .heading .buttons {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
}
#contents.cibi > header hgroup h2,
#contents.ci > header hgroup h2 {
  padding: 0;
}
#contents.cibi h2:not(#title2depth):not(.case),
#contents.ci h2:not(#title2depth):not(.case) {
  padding: 50px 0 16px;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
}
#contents.cibi .heading .desc,
#contents.ci .heading .desc {
  margin-top: 16px;
  font-size: 18px;
  line-height: 28px;
}
#contents.cibi .heading .buttons,
#contents.ci .heading .buttons {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
#contents.cibi .heading .buttons .download,
#contents.ci .heading .buttons .download {
  min-width: 260px;
}
#contents.cibi .concept,
#contents.ci .concept {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}
#contents.cibi .concept .desc,
#contents.ci .concept .desc {
  color: #666;
  line-height: 26px;
}
#contents.cibi .wrapImg,
#contents.ci .wrapImg {
  text-align: center;
  margin: 40px 0 30px;
}
#contents.cibi .wrapImg img,
#contents.ci .wrapImg img {
  max-width: 100%;
}
#contents.cibi .CIinfo,
#contents.ci .CIinfo {
  background-color: #f9f9f9;
}
#contents.cibi .CIinfo .inner,
#contents.ci .CIinfo .inner {
  max-width: 1240px;
  padding: 0 20px 50px 20px;
  margin: 0 auto;
}
#contents.cibi .CIinfo .card,
#contents.ci .CIinfo .card {
  margin-top: 5px;
}
#contents.cibi .CIinfo .cardItem,
#contents.ci .CIinfo .cardItem {
  min-height: 250px;
  padding: 30px 30px 20px;
  border: 1px solid #c8c8c8;
  background-color: #fff;
}
#contents.cibi .CIinfo .cardItem + .cardItem,
#contents.ci .CIinfo .cardItem + .cardItem {
  border-top: 0;
}
#contents.cibi .CIinfo .cardItem h3,
#contents.ci .CIinfo .cardItem h3 {
  font-size: 18px;
  font-weight: 400;
}
#contents.cibi .CIinfo .cardItem img,
#contents.ci .CIinfo .cardItem img {
  display: block;
  margin: 40px auto 30px;
}
#contents.cibi .CIinfo .ciTab,
#contents.ci .CIinfo .ciTab {
  display: flex;
  flex-direction: column;
}
#contents.cibi .CIinfo .ciTabMenu,
#contents.ci .CIinfo .ciTabMenu {
  position: relative;
  order: 1;
  margin-bottom: 20px;
}
#contents.cibi .CIinfo .ciTabMenu ul,
#contents.ci .CIinfo .ciTabMenu ul {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 22px;
  background-color: #f9f9f9;
}
#contents.cibi .CIinfo .ciTabMenu li,
#contents.ci .CIinfo .ciTabMenu li {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 44px;
  color: #c8c8c8;
  border: 1px solid transparent;
  border-radius: 22px;
  margin: -1px;
}
#contents.cibi .CIinfo .ciTabMenu button,
#contents.ci .CIinfo .ciTabMenu button {
  position: relative;
  z-index: 1;
}
#contents.cibi .CIinfo .ciTabMenu li.active,
#contents.ci .CIinfo .ciTabMenu li.active {
  color: #212121;
  background-color: #fff;
  border-color: #c8c8c8;
}
#contents.cibi .ciTabCont,
#contents.ci .ciTabCont {
  display: none;
}
#contents.cibi .ciTabCont.active,
#contents.ci .ciTabCont.active {
  display: block;
}
#contents.cibi .listColor,
#contents.ci .listColor {
  overflow: hidden;
  margin-top: 5px;
  border-radius: 30px 0 0 0;
}
#contents.cibi .listColor.case,
#contents.ci .listColor.case {
  position: relative;
}
@media (max-width: 1024px) {
  #contents.cibi .listColor.case,
  #contents.ci .listColor.case {
    border-radius: 20px;
  }
}
@media (min-width: 1025px) {
  #contents.cibi .listColor .swiper,
  #contents.ci .listColor .swiper {
    width: 100%;
  }
  #contents.cibi .listColor .swiper .swiper-slide-duplicate,
  #contents.ci .listColor .swiper .swiper-slide-duplicate {
    display: none !important;
  }
}
#contents.cibi .colorInfo > button,
#contents.ci .colorInfo > button {
  z-index: 1;
  margin: auto;
  top: 53px;
  bottom: 0;
}
@media (min-width: 1025px) {
  #contents.cibi .colorInfo > button,
  #contents.ci .colorInfo > button {
    display: none !important;
  }
}
#contents.cibi .colorInfo > button.colorPrev,
#contents.ci .colorInfo > button.colorPrev {
  left: 9px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  position: absolute;
}
#contents.cibi .colorInfo > button.colorPrev:not(:disabled):hover,
#contents.ci .colorInfo > button.colorPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.cibi .colorInfo > button.colorPrev:not(:disabled):hover::after,
#contents.ci .colorInfo > button.colorPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.cibi .colorInfo > button.colorPrev::after,
#contents.ci .colorInfo > button.colorPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#contents.cibi .colorInfo > button.colorPrev::after,
#contents.ci .colorInfo > button.colorPrev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
#contents.cibi .colorInfo > button.colorNext,
#contents.ci .colorInfo > button.colorNext {
  right: 9px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  position: absolute;
}
#contents.cibi .colorInfo > button.colorNext:not(:disabled):hover,
#contents.ci .colorInfo > button.colorNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.cibi .colorInfo > button.colorNext:not(:disabled):hover::after,
#contents.ci .colorInfo > button.colorNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.cibi .colorInfo > button.colorNext::after,
#contents.ci .colorInfo > button.colorNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#contents.cibi .colorInfo > button.colorNext::after,
#contents.ci .colorInfo > button.colorNext::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#contents.cibi .listColor .item,
#contents.ci .listColor .item {
  padding: 30px;
  color: #fff;
}
#contents.cibi .colorInfo,
#contents.ci .colorInfo {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px 50px 20px;
}
@media (max-width: 1024px) {
  #contents.cibi .colorInfo,
  #contents.ci .colorInfo {
    position: relative;
  }
}
#contents.cibi .listColor dt,
#contents.ci .listColor dt {
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 20px;
}
#contents.cibi .listColor dd,
#contents.ci .listColor dd {
  line-height: 24px;
  opacity: 0.74;
  font-weight: 300;
}
#contents.cibi .listColor dd + dd,
#contents.ci .listColor dd + dd {
  margin-top: 4px;
}
#contents.cibi .listColor .navy,
#contents.ci .listColor .navy {
  background-color: #0f145a;
}
#contents.cibi .listColor .blue,
#contents.ci .listColor .blue {
  background-color: #2c50e4;
}
#contents.cibi .listColor .skyBlue,
#contents.ci .listColor .skyBlue {
  background-color: #3f93f4;
}
#contents.cibi .listColor .lightViolet,
#contents.ci .listColor .lightViolet {
  background-color: #593cda;
}
#contents.cibi .listColor .violet,
#contents.ci .listColor .violet {
  background-color: #4415a0;
}
@media (min-width: 1025px) {
  #contents.cibi .heading,
  #contents.ci .heading {
    position: relative;
  }
  #contents.cibi .heading .wrapImg,
  #contents.ci .heading .wrapImg {
    margin-bottom: 0;
  }
  #contents.cibi .heading .buttons,
  #contents.ci .heading .buttons {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 40px;
  }
  #contents.cibi .heading .buttons .download,
  #contents.ci .heading .buttons .download {
    height: 55px;
    background-color: transparent;
    color: #fff !important;
    border-color: #c8c8c8 !important;
    color: #fff;
    border-radius: 27px;
    font-weight: 500;
  }
  #contents.cibi .heading .buttons .download:after,
  #contents.ci .heading .buttons .download:after {
    filter: brightness(100) !important;
  }
  #contents.cibi h2:not(#title2depth),
  #contents.ci h2:not(#title2depth) {
    padding-top: 100px !important;
    font-size: 30px;
    line-height: 50px;
  }
  #contents.cibi .card + h2:not(#title2depth),
  #contents.ci .card + h2:not(#title2depth) {
    padding-top: 55px !important;
  }
  #contents.cibi .concept .wrapImg,
  #contents.ci .concept .wrapImg {
    margin: 130px 0;
  }
  #contents.cibi .CIinfo,
  #contents.ci .CIinfo {
    padding-bottom: 50px;
  }
  #contents.cibi .CIinfo .card,
  #contents.ci .CIinfo .card {
    display: flex;
    width: 100%;
  }
  #contents.cibi .CIinfo .cardItem,
  #contents.ci .CIinfo .cardItem {
    position: relative;
    flex: 1;
    min-height: 400px;
    padding: 48px 40px;
  }
  #contents.cibi .CIinfo .cardItem + .cardItem,
  #contents.ci .CIinfo .cardItem + .cardItem {
    border-top: 1px solid #c8c8c8;
    border-left: 0;
  }
  #contents.cibi .CIinfo .cardItem img,
  #contents.ci .CIinfo .cardItem img {
    margin: 0;
  }
  #contents.cibi .CIinfo .ciTabMenu,
  #contents.ci .CIinfo .ciTabMenu {
    position: absolute;
    top: 44px;
    right: 40px;
    min-width: 170px;
  }
  #contents.cibi .CIinfo .ciTabMenu button,
  #contents.ci .CIinfo .ciTabMenu button {
    padding: 0 18px;
  }
  #contents.cibi .CIinfo .ciRow,
  #contents.ci .CIinfo .ciRow {
    width: 325px;
  }
  #contents.cibi .CIinfo .ciColumn,
  #contents.ci .CIinfo .ciColumn {
    width: 150px;
  }
  #contents.cibi .CIinfo .ciSpace,
  #contents.ci .CIinfo .ciSpace {
    width: 414px;
  }
  #contents.cibi .CIinfo .ciSize,
  #contents.ci .CIinfo .ciSize {
    width: 394px;
  }
  #contents.cibi .ciTabCont.active,
  #contents.cibi .cardCont,
  #contents.ci .ciTabCont.active,
  #contents.ci .cardCont {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding-top: 25px;
  }
  #contents.cibi .colorInfo,
  #contents.ci .colorInfo {
    padding-bottom: 150px;
  }
  #contents.cibi .colorInfo .listColor,
  #contents.ci .colorInfo .listColor {
    display: flex;
    border-radius: 0 0 0 30px;
  }
  #contents.cibi .colorInfo .listColor .item,
  #contents.ci .colorInfo .listColor .item {
    flex: 1;
    padding-bottom: 44px;
  }
  #contents.cibi .colorInfo dt,
  #contents.ci .colorInfo dt {
    line-height: 26px;
  }
  #contents.cibi .colorInfo dd + dd,
  #contents.ci .colorInfo dd + dd {
    margin-top: 5px;
  }
  #contents.cibi .colorInfo .name,
  #contents.ci .colorInfo .name {
    display: block;
    font-weight: 300;
  }
  #contents.cibi .brighten,
  #contents.ci .brighten {
    margin-top: -35px;
  }
  #contents.cibi .brighten,
  #contents.cibi .gwell,
  #contents.ci .brighten,
  #contents.ci .gwell {
    display: flex;
    align-items: center;
    min-height: 500px;
  }
  #contents.cibi .brighten img,
  #contents.ci .brighten img {
    width: 598px;
  }
  #contents.cibi .gwell img,
  #contents.ci .gwell img {
    width: 369px;
  }
  #contents.cibi .brighten .desc,
  #contents.cibi .gwell .desc,
  #contents.ci .brighten .desc,
  #contents.ci .gwell .desc {
    margin-top: 50px;
    font-size: 20px;
  }
  #contents.cibi .brighten .desc,
  #contents.ci .brighten .desc {
    color: #666666;
  }
  #contents.cibi .card.cardDownload,
  #contents.ci .card.cardDownload {
    display: flex;
  }
  #contents.cibi .card.cardDownload .cardItem,
  #contents.ci .card.cardDownload .cardItem {
    position: relative;
    display: flex;
    flex: 1;
    align-items: center;
    padding: 45px 60px;
    min-height: 184px;
  }
  #contents.cibi .card .cardItem + .cardItem,
  #contents.ci .card .cardItem + .cardItem {
    border-top: 1px solid #c8c8c8;
    border-left: 0;
  }
  #contents.cibi .card.cardDownload h3,
  #contents.ci .card.cardDownload h3 {
    align-self: flex-start;
    padding-right: 60px;
  }
  #contents.cibi .card.cardDownload .cardCont,
  #contents.ci .card.cardDownload .cardCont {
    flex: 1;
    flex-direction: column;
    justify-content: space-evenly;
    padding: 0;
  }
  #contents.cibi .card.cardDownload .buttons,
  #contents.ci .card.cardDownload .buttons {
    position: absolute;
    bottom: 37px;
    left: 60px;
  }
  #contents.cibi .card.cardDownload .buttons .download::after,
  #contents.ci .card.cardDownload .buttons .download::after {
    display: none;
    margin: 0;
  }
  #contents.cibi .wrapImg img,
  #contents.ci .wrapImg img {
    margin: 0 auto;
  }
}
#contents.cibi.mainPr .brighten,
#contents.ci.mainPr .brighten {
  margin-top: -55px;
  background-color: #f9f9f9;
}
#contents.cibi.mainPr .brighten .inner,
#contents.cibi.mainPr .gwell .inner,
#contents.ci.mainPr .brighten .inner,
#contents.ci.mainPr .gwell .inner {
  max-width: 1240px;
  padding: 80px 20px;
  margin: 0 auto;
  text-align: center;
}
#contents.cibi.mainPr .brighten .desc,
#contents.cibi.mainPr .gwell .desc,
#contents.ci.mainPr .brighten .desc,
#contents.ci.mainPr .gwell .desc {
  margin-top: 40px;
  line-height: 26px;
}
#contents.cibi.mainPr .gwell,
#contents.ci.mainPr .gwell {
  color: #fff;
  background-color: #37234d;
}
#contents.cibi.mainPr .downloadBI,
#contents.ci.mainPr .downloadBI {
  padding-bottom: 50px;
  background-color: #f9f9f9;
}
#contents.cibi.mainPr .downloadBI .inner,
#contents.ci.mainPr .downloadBI .inner {
  max-width: 1240px;
  padding: 0 20px;
  margin: 0 auto;
}
#contents.cibi.mainPr .downloadBI .cardDownload .download,
#contents.ci.mainPr .downloadBI .cardDownload .download {
  width: 100%;
}
#contents.cibi.mainPr .banner .story,
#contents.ci.mainPr .banner .story {
  background-image: url("../../resources/images/shinyoung/page/bannerStory.jpg");
}
@media (min-width: 1025px) {
  #contents.cibi.mainPr .downloadBI,
  #contents.ci.mainPr .downloadBI {
    padding-bottom: 100px;
  }
}
#contents.cibi.assetPr .wideOnly, #contents.cibi.encPr .wideOnly,
#contents.ci.assetPr .wideOnly,
#contents.ci.encPr .wideOnly {
  display: none !important;
}
@media (min-width: 1025px) {
  #contents.cibi.assetPr .middleOnly, #contents.cibi.encPr .middleOnly,
  #contents.ci.assetPr .middleOnly,
  #contents.ci.encPr .middleOnly {
    display: none !important;
  }
  #contents.cibi.assetPr .wideOnly, #contents.cibi.encPr .wideOnly,
  #contents.ci.assetPr .wideOnly,
  #contents.ci.encPr .wideOnly {
    display: block !important;
  }
}
#contents.cibi.encPr #ci .CIinfo .ciSize:first-child,
#contents.ci.encPr #ci .CIinfo .ciSize:first-child {
  height: 85px;
  margin: 40px auto 30px;
}
#contents.cibi.encPr #ci .CIinfo .ciSpace:first-child,
#contents.ci.encPr #ci .CIinfo .ciSpace:first-child {
  margin: 40px auto 30px;
}
#contents.cibi.encPr #bi .CIinfo img.ciSize:first-child,
#contents.ci.encPr #bi .CIinfo img.ciSize:first-child {
  width: auto;
  height: 53px;
  margin: 40px auto 30px;
}
#contents.cibi.encPr #bi .CIinfo img.ciSpace:first-child,
#contents.ci.encPr #bi .CIinfo img.ciSpace:first-child {
  width: auto;
  margin: 40px auto 30px;
}
#contents.cibi.encPr .estate .inner,
#contents.ci.encPr .estate .inner {
  position: relative;
  width: 100%;
  max-width: 1240px;
  padding: 0 20px;
  margin: 0 auto;
  line-height: 26px;
}
#contents.cibi.encPr .estate h2,
#contents.ci.encPr .estate h2 {
  padding: 25px 0 20px;
}
#contents.cibi.encPr .estate .wrapLogo,
#contents.ci.encPr .estate .wrapLogo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 110px;
  margin-top: 40px;
  background-color: #37234d;
}
#contents.cibi.encPr .estate .buttons,
#contents.ci.encPr .estate .buttons {
  padding: 30px;
}
#contents.cibi.encPr .estate .buttons .download,
#contents.ci.encPr .estate .buttons .download {
  width: 100%;
}
#contents.cibi.encPr .infoBI .inner,
#contents.ci.encPr .infoBI .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 245px;
  background-image: linear-gradient(5deg, #f9f9f9 26%, rgba(133, 133, 133, 0.39) 159%);
}
#contents.cibi.encPr .infoBI.type2,
#contents.ci.encPr .infoBI.type2 {
  background-color: #37234d;
}
#contents.cibi.encPr .infoBI.type2 .inner,
#contents.ci.encPr .infoBI.type2 .inner {
  max-width: 1240px;
  flex-direction: column;
  margin: 0 auto;
  padding: 70px 20px 80px;
  background: none;
}
#contents.cibi.encPr .infoBI.type2 img,
#contents.ci.encPr .infoBI.type2 img {
  width: 426px;
}
#contents.cibi.encPr .infoBI.type2 .desc,
#contents.ci.encPr .infoBI.type2 .desc {
  margin-top: 30px;
  font-weight: 300;
  line-height: 26px;
  color: #fff;
  text-align: center;
}
#contents.cibi.encPr .listColor .gwellViolet,
#contents.ci.encPr .listColor .gwellViolet {
  background-color: #37234d;
}
#contents.cibi.encPr .listColor .gwellBrown,
#contents.ci.encPr .listColor .gwellBrown {
  background-color: #aa7a72;
}
#contents.cibi.encPr .listColor .gwellGray,
#contents.ci.encPr .listColor .gwellGray {
  background-color: #828282;
}
#contents.cibi.encPr .listColor .gwellLightBlue,
#contents.ci.encPr .listColor .gwellLightBlue {
  color: #212121;
  background-color: #f0f2f2;
}
@media (min-width: 1025px) {
  #contents.cibi.encPr,
  #contents.ci.encPr {
    /*.colorGwell .listColor .item:hover {
      min-width: 450px;
    }*/
  }
  #contents.cibi.encPr #ci .heading .buttons,
  #contents.ci.encPr #ci .heading .buttons {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 40px;
  }
  #contents.cibi.encPr .heading .buttons .download,
  #contents.cibi.encPr .estate .buttons .download,
  #contents.ci.encPr .heading .buttons .download,
  #contents.ci.encPr .estate .buttons .download {
    height: 55px;
    background-color: transparent;
    color: #fff !important;
    border-color: #c8c8c8 !important;
    color: #fff;
    border-radius: 27px;
    font-weight: 500;
  }
  #contents.cibi.encPr .heading .buttons .download:after,
  #contents.cibi.encPr .estate .buttons .download:after,
  #contents.ci.encPr .heading .buttons .download:after,
  #contents.ci.encPr .estate .buttons .download:after {
    filter: brightness(100) !important;
  }
  #contents.cibi.encPr #ci .CIinfo img.ciSize:last-child,
  #contents.ci.encPr #ci .CIinfo img.ciSize:last-child {
    width: auto;
    height: 78px;
  }
  #contents.cibi.encPr #ci .CIinfo img.ciSpace:last-child,
  #contents.ci.encPr #ci .CIinfo img.ciSpace:last-child {
    width: auto;
    height: 160px;
  }
  #contents.cibi.encPr #bi .CIinfo img.ciSize:last-child,
  #contents.ci.encPr #bi .CIinfo img.ciSize:last-child {
    width: auto;
    height: 36px;
  }
  #contents.cibi.encPr #bi .CIinfo img.ciSpace:last-child,
  #contents.ci.encPr #bi .CIinfo img.ciSpace:last-child {
    width: auto;
    height: 120px;
  }
  #contents.cibi.encPr .estate .inner,
  #contents.ci.encPr .estate .inner {
    margin-bottom: 100px;
  }
  #contents.cibi.encPr .estate .wrapLogo,
  #contents.ci.encPr .estate .wrapLogo {
    padding: 85px 0 156px;
  }
  #contents.cibi.encPr .estate .buttons,
  #contents.ci.encPr .estate .buttons {
    position: absolute;
    bottom: 42px;
    left: 50%;
    width: 260px;
    padding: 0;
    transform: translateX(-50%);
  }
  #contents.cibi.encPr .estate,
  #contents.cibi.encPr .gwell,
  #contents.ci.encPr .estate,
  #contents.ci.encPr .gwell {
    display: flex;
    align-items: center;
    min-height: 500px;
  }
  #contents.cibi.encPr .estate img,
  #contents.ci.encPr .estate img {
    width: 598px;
  }
  #contents.cibi.encPr .gwell img,
  #contents.ci.encPr .gwell img {
    width: 369px;
  }
  #contents.cibi.encPr .estate .desc,
  #contents.cibi.encPr .gwell .desc,
  #contents.ci.encPr .estate .desc,
  #contents.ci.encPr .gwell .desc {
    font-size: 20px;
  }
  #contents.cibi.encPr .gwell .desc,
  #contents.ci.encPr .gwell .desc {
    margin-top: 50px;
  }
  #contents.cibi.encPr .estate .desc,
  #contents.ci.encPr .estate .desc {
    color: #666666;
  }
  #contents.cibi.encPr .infoBI .inner,
  #contents.ci.encPr .infoBI .inner {
    min-height: 500px;
  }
  #contents.cibi.encPr .infoBI img,
  #contents.ci.encPr .infoBI img {
    width: 368px;
  }
  #contents.cibi.encPr .card.cardDownload .buttons .download::after,
  #contents.ci.encPr .card.cardDownload .buttons .download::after {
    display: none;
    margin: 0;
  }
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget),
#contents.ci > section.identity:not(.heading):not(.tabTarget) {
  padding-top: 0 !important;
}
@media (min-width: 1025px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div {
    padding-bottom: 100px;
    background: #f9f9f9;
  }
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) h1,
#contents.ci > section.identity:not(.heading):not(.tabTarget) h1 {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) h1,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) h1 {
    padding-top: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) h1,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) h1 {
    padding-top: 5px;
  }
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 20px;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul a,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul a {
  min-width: 260px;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li {
  text-align: center;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li img,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li img {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
}
@media (min-width: 1025px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li {
    padding-top: 70px;
    padding-bottom: 50px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li a,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li a {
    background: transparent !important;
    color: #fff !important;
    border-color: #fff !important;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li a::after,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li a::after {
    -moz-filter: grayscale(1) brightness(100) !important;
    -ms-filter: grayscale(1) brightness(100) !important;
    -o-filter: grayscale(1) brightness(100) !important;
    filter: grayscale(1) brightness(100) !important;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child {
    background: #37234D;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child img {
    width: 278px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child a,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child a {
    margin-top: 47px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child {
    background: #C77D63;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child img {
    width: 338px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child a,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child a {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li + li,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li + li {
    margin-top: 40px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child div {
    background: #37234D;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child div img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:first-child div img {
    width: 110px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child div {
    background: #C77D63;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child div img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li:last-child div img {
    width: 165px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li div {
    position: relative;
    margin-bottom: 30px;
    height: 109px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > div > ul li div img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > div > ul li div img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li {
  position: relative;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > img,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > img {
  display: block;
  margin: auto;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  border-top: 1px solid #c8c8c8;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div span,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div span {
  width: 50%;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 260px;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::before, #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::after,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::before,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover, #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover::before, #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover::after, #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus::before, #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus::after,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover::before,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):hover::after,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus::before,
#contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::before,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::before {
    margin-right: 10px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::after,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::before,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::before {
    margin-right: 14px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li a::after,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul {
    padding-top: 100px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li {
    position: relative;
    width: 50%;
    height: 330px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li:first-child,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li:first-child {
    border-right: 1px solid #c8c8c8;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li:first-child > img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li:first-child > img {
    width: 349px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li:last-child,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li:last-child {
    padding-top: 11px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li:last-child > img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li:last-child > img {
    width: 324px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li img.middleOnly,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li img.middleOnly {
    display: none;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div {
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    width: 348px;
    padding-top: 10px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div span,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div span {
    padding-top: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul {
    padding-top: 50px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li {
    width: 100%;
    padding-bottom: 74px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li:last-child,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li:last-child {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #c8c8c8;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li img.wideOnly,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li img.wideOnly {
    display: none;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div {
    margin-top: 30px;
    padding-top: 3px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div span,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div span {
    padding-top: 27px;
  }
  #contents.cibi > section.identity:not(.heading):not(.tabTarget) > ul li > div span img,
  #contents.ci > section.identity:not(.heading):not(.tabTarget) > ul li > div span img {
    height: 16px;
  }
}

#ci .heading .buttons {
  text-align: center;
}
#ci .heading .buttons .download {
  min-width: 260px;
}

@media (min-width: 1025px) {
  #contents.groupPr.cibi .colorInfo {
    padding-bottom: 100px !important;
  }
}

#contents.historyCenter .historyTab {
  position: relative;
  height: 900px;
  background: #888;
}
#contents.historyCenter .historyTab nav {
  z-index: 2;
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  font-weight: 300;
  color: #fff;
}
#contents.historyCenter .historyTab nav button:not(.active) {
  opacity: 0.6;
}
#contents.historyCenter .historyTab nav button.active {
  text-decoration: underline;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab nav button {
    margin-right: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab nav button {
    margin-right: 30px;
  }
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab nav {
    top: 157px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab nav {
    top: 77px;
  }
}
#contents.historyCenter .historyTab section {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  max-width: 2400px;
  height: 900px;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  transition: opacity 0.6s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#contents.historyCenter .historyTab section:not(.active) {
  z-index: 0;
  opacity: 0;
}
#contents.historyCenter .historyTab section.active {
  z-index: 1;
  opacity: 1;
}
#contents.historyCenter .historyTab section.history01a {
  background-image: url("../images/shinyoungGroup/page/bgHistory01a.jpg");
}
#contents.historyCenter .historyTab section.history01b {
  background-image: url("../images/shinyoungGroup/page/bgHistory01b.jpg");
}
#contents.historyCenter .historyTab section.history02a {
  background-image: url("../images/shinyoungGroup/page/bgHistory02a.jpg");
}
#contents.historyCenter .historyTab section.history02b {
  background-image: url("../images/shinyoungGroup/page/bgHistory02b.jpg");
}
#contents.historyCenter .historyTab section.history03a {
  background-image: url("../images/shinyoungGroup/page/bgHistory03a.jpg");
}
#contents.historyCenter .historyTab section.history03b {
  background-image: url("../images/shinyoungGroup/page/bgHistory03b.jpg");
}
#contents.historyCenter .historyTab section.history04a {
  background-image: url("../images/shinyoungGroup/page/bgHistory04a.jpg");
}
#contents.historyCenter .historyTab section.history04b {
  background-image: url("../images/shinyoungGroup/page/bgHistory04b.jpg");
}
#contents.historyCenter .historyTab section.history04c {
  background-image: url("../images/shinyoungGroup/page/bgHistory04c.jpg");
}
#contents.historyCenter .historyTab section > div {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  height: 900px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab section > div {
    padding-top: 225px;
    padding-left: 88px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab section > div {
    padding-top: 124px;
  }
}
#contents.historyCenter .historyTab section h1 {
  font-weight: 100;
  color: #fff;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab section h1 {
    font-size: 60px;
    line-height: 74px;
    letter-spacing: -0.05em;
    padding-bottom: 60px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab section h1 {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
    padding-bottom: 30px;
  }
}
#contents.historyCenter .historyTab section > div > button:not(.active) {
  border: 1px solid #fff;
  color: #fff;
}
#contents.historyCenter .historyTab section > div > button.active {
  background: #fff;
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab section > div > button {
    margin-top: 15px;
    height: 44px;
    padding: 0 24px;
    border-radius: 22px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab section > div > button {
    margin-top: 10px;
    height: 36px;
    padding: 0 20px;
    border-radius: 18px;
  }
}
#contents.historyCenter .historyTab section p {
  word-break: keep-all;
  color: #fff;
}
#contents.historyCenter .historyTab section p:not(:first-of-type) {
  display: none;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab section p {
    position: absolute;
    right: 20px;
    top: 440px;
    width: 700px;
    font-weight: 300;
  }
}
@media (min-width: 1025px) and (max-width: 1160px) {
  #contents.historyCenter .historyTab section p {
    width: calc(100% - 460px);
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab section p {
    margin-top: 45px;
  }
}
#contents.historyCenter .historyTab section > div > div button {
  position: absolute;
  right: 20px;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  border: 1px solid rgba(102, 102, 102, 0.7);
  font-weight: 300;
  text-align: left;
  color: #fff;
}
#contents.historyCenter .historyTab section > div > div button span {
  display: block;
  color: #c8c8c8;
}
@media (min-width: 1025px) {
  #contents.historyCenter .historyTab section > div > div button {
    width: 140px;
    height: 140px;
    padding: 0 0 14px 22px;
  }
  #contents.historyCenter .historyTab section > div > div button span {
    margin-bottom: 8px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .historyTab section > div > div button {
    width: 100px;
    height: 100px;
    padding: 0 0 13px 10px;
  }
  #contents.historyCenter .historyTab section > div > div button span {
    margin-bottom: 4px;
  }
}
#contents.historyCenter .book {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.historyCenter .book {
    padding-top: 120px;
    padding-bottom: 90px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .book {
    padding-top: 57px;
    padding-bottom: 80px;
  }
}
#contents.historyCenter .book h1 {
  text-transform: uppercase;
}
@media (min-width: 1025px) {
  #contents.historyCenter .book h1 {
    font-weight: 400;
  }
}
#contents.historyCenter .book > div {
  position: relative;
  border: 1px solid #c8c8c8;
}
#contents.historyCenter .book > div img {
  display: block;
}
#contents.historyCenter .book > div p {
  margin-bottom: 30px;
  font-weight: 300;
}
#contents.historyCenter .book > div > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
}
#contents.historyCenter .book > div > div a.download {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.historyCenter .book > div > div a.download::before, #contents.historyCenter .book > div > div a.download::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.historyCenter .book > div > div a.download::after {
  content: "";
  margin-top: -2px !important;
  background-image: url("../images/icon/iconDownload2.svg");
}
#contents.historyCenter .book > div > div a.download:not(:disabled):hover, #contents.historyCenter .book > div > div a.download:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.historyCenter .book > div > div a.download:not(:disabled):hover::before, #contents.historyCenter .book > div > div a.download:not(:disabled):hover::after, #contents.historyCenter .book > div > div a.download:not(:disabled):focus::before, #contents.historyCenter .book > div > div a.download:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.historyCenter .book > div > div a.download {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.historyCenter .book > div > div a.download::before {
    margin-right: 10px;
  }
  #contents.historyCenter .book > div > div a.download::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .book > div > div a.download {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.historyCenter .book > div > div a.download::before {
    margin-right: 14px;
  }
  #contents.historyCenter .book > div > div a.download::after {
    margin-left: 18px;
  }
}
#contents.historyCenter .book > div > div a.zoom {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.historyCenter .book > div > div a.zoom::before, #contents.historyCenter .book > div > div a.zoom::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.historyCenter .book > div > div a.zoom::after {
  content: "";
  background-image: url("../images/icon/iconZoom.svg");
}
#contents.historyCenter .book > div > div a.zoom:not(:disabled):hover, #contents.historyCenter .book > div > div a.zoom:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.historyCenter .book > div > div a.zoom:not(:disabled):hover::before, #contents.historyCenter .book > div > div a.zoom:not(:disabled):hover::after, #contents.historyCenter .book > div > div a.zoom:not(:disabled):focus::before, #contents.historyCenter .book > div > div a.zoom:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.historyCenter .book > div > div a.zoom {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.historyCenter .book > div > div a.zoom::before {
    margin-right: 10px;
  }
  #contents.historyCenter .book > div > div a.zoom::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .book > div > div a.zoom {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.historyCenter .book > div > div a.zoom::before {
    margin-right: 14px;
  }
  #contents.historyCenter .book > div > div a.zoom::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.historyCenter .book > div > div a + a {
    margin-left: 14px;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .book > div > div a + a {
    margin-left: 6px;
  }
}
@media (min-width: 1025px) {
  #contents.historyCenter .book > div {
    margin-top: 50px;
    height: 300px;
    padding: 55px 35px 45px 550px;
  }
  #contents.historyCenter .book > div img {
    position: absolute;
    left: -1px;
    top: -1px;
    width: 500px;
    height: 300px;
  }
}
@media (min-width: 1025px) and (max-width: 1070px) {
  #contents.historyCenter .book > div p {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #contents.historyCenter .book > div {
    margin-top: 30px;
    padding: 0 20px 40px;
  }
  #contents.historyCenter .book > div img {
    margin: -1px -21px 45px;
    width: calc(100% + 42px);
    border-bottom: 1px solid #c8c8c8;
  }
}

@media (min-width: 1025px) {
  #contents.history .historyTab {
    display: none;
  }
}
@media (max-width: 1024px) {
  #contents.history .historyTab {
    margin-top: 40px !important;
    margin-bottom: 0 !important;
  }
}
#contents.history .historyInfo {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  word-break: keep-all;
}
#contents.history .content > section > h1 {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
@media (max-width: 1024px) {
  #contents.history .tab {
    display: none;
  }
}

.historyContainer .content,
.awardContainer .content {
  position: relative;
}
.historyContainer .content .year h1,
.awardContainer .content .year h1 {
  position: relative;
  font-weight: 500;
}
.historyContainer .content .year h1::before,
.awardContainer .content .year h1::before {
  z-index: 1;
  content: "";
  width: 10px;
  height: 10px;
  border: 2px solid #4415a0;
  border-radius: 50%;
  background: #fff;
}
.historyContainer .content .year h1::after,
.awardContainer .content .year h1::after {
  z-index: 0;
  content: "";
  width: 100%;
  max-width: 0;
  height: 1px;
  background: #c8c8c8;
  transition: all 0.2s;
}
.historyContainer .content .follower,
.awardContainer .content .follower {
  position: absolute;
  display: block;
  width: 1px;
  height: 100%;
  background: #c8c8c8;
  transition: all 0.2s;
}
.historyContainer .content ul,
.awardContainer .content ul {
  margin-top: 20px;
}
.historyContainer .content ul li,
.awardContainer .content ul li {
  position: relative;
  padding-left: 12px;
  word-break: keep-all;
}
.historyContainer .content ul li.highlight,
.awardContainer .content ul li.highlight {
  color: #4415a0;
}
.historyContainer .content ul li::before,
.awardContainer .content ul li::before {
  content: "";
  position: absolute;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #4415a0;
}
.historyContainer .content ul li figure,
.awardContainer .content ul li figure {
  margin-left: -12px;
  width: calc(100% + 12px);
  max-width: 440px;
}
.historyContainer .content ul li figure img,
.awardContainer .content ul li figure img {
  width: 100%;
}
.historyContainer .content ul li figure figcaption,
.awardContainer .content ul li figure figcaption {
  text-align: right;
  line-height: 1.2;
}
.historyContainer .content ul li p em,
.awardContainer .content ul li p em {
  margin-right: 10px;
  white-space: nowrap;
  color: #4415a0;
}
.historyContainer .content ul li p em::before,
.awardContainer .content ul li p em::before {
  content: "[ ";
}
.historyContainer .content ul li p em::after,
.awardContainer .content ul li p em::after {
  content: " ]";
}
.historyContainer .content ul li p span,
.awardContainer .content ul li p span {
  font-weight: 300;
  color: #666;
}
@media (min-width: 1025px) {
  .historyContainer,
  .awardContainer {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 40px;
  }
  .historyContainer .tab,
  .historyContainer .displayYear,
  .awardContainer .tab,
  .awardContainer .displayYear {
    position: sticky;
    top: 90px;
    font-size: 140px;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
    color: #e2e2e2;
    margin-top: 80px;
    width: 445px;
  }
  .historyContainer .tab button,
  .historyContainer .displayYear button,
  .awardContainer .tab button,
  .awardContainer .displayYear button {
    overflow: hidden;
    height: 140px;
  }
  .historyContainer .tab button.active,
  .historyContainer .displayYear button.active,
  .awardContainer .tab button.active,
  .awardContainer .displayYear button.active {
    pointer-events: none;
    color: #4415a0;
  }
  .historyContainer .tab span,
  .historyContainer .displayYear span,
  .awardContainer .tab span,
  .awardContainer .displayYear span {
    display: none;
  }
  .historyContainer .displayYear,
  .awardContainer .displayYear {
    color: #4415a0;
  }
  .historyContainer .content,
  .awardContainer .content {
    width: calc(100% - 445px);
    padding-top: 20px;
    padding-left: 120px;
  }
  .historyContainer .content .year,
  .awardContainer .content .year {
    padding-top: 80px;
  }
  .historyContainer .content .year h1,
  .awardContainer .content .year h1 {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
  .historyContainer .content .year h1::before,
  .awardContainer .content .year h1::before {
    left: -120px;
  }
  .historyContainer .content .year h1::after,
  .awardContainer .content .year h1::after {
    left: -120px;
  }
  .historyContainer .content .year h1.active::after,
  .awardContainer .content .year h1.active::after {
    max-width: 93px;
  }
  .historyContainer .content .year ul > li::before,
  .awardContainer .content .year ul > li::before {
    top: 12px;
  }
  .historyContainer .content .year ul > li + li,
  .awardContainer .content .year ul > li + li {
    margin-top: 15px;
  }
  .historyContainer .content .year ul > li figure,
  .awardContainer .content .year ul > li figure {
    margin-top: 15px;
  }
  .historyContainer .content .year ul > li p,
  .awardContainer .content .year ul > li p {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .historyContainer .content .follower,
  .awardContainer .content .follower {
    top: 100px;
    left: 5px;
    min-height: 30px;
    max-height: 30px;
  }
}
@media (max-width: 1024px) {
  .historyContainer .content,
  .awardContainer .content {
    margin-top: -5px;
    padding-left: 60px;
  }
  .historyContainer .content .year,
  .awardContainer .content .year {
    padding-top: 60px;
  }
  .historyContainer .content .year h1,
  .awardContainer .content .year h1 {
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.025em;
  }
  .historyContainer .content .year h1::before,
  .awardContainer .content .year h1::before {
    left: -40px;
  }
  .historyContainer .content .year h1::after,
  .awardContainer .content .year h1::after {
    left: -40px;
  }
  .historyContainer .content .year h1.active::after,
  .awardContainer .content .year h1.active::after {
    max-width: 30px;
  }
  .historyContainer .content .year ul > li,
  .awardContainer .content .year ul > li {
    padding-right: 20px;
  }
  .historyContainer .content .year ul > li::before,
  .awardContainer .content .year ul > li::before {
    top: 10px;
  }
  .historyContainer .content .year ul > li + li,
  .awardContainer .content .year ul > li + li {
    margin-top: 13px;
  }
  .historyContainer .content .year ul > li figure,
  .awardContainer .content .year ul > li figure {
    margin-top: 16px;
  }
  .historyContainer .content .year ul > li figure img,
  .awardContainer .content .year ul > li figure img {
    display: block;
    margin-right: -20px;
    width: calc(100% + 20px);
  }
  .historyContainer .content .year ul > li figure figcaption,
  .awardContainer .content .year ul > li figure figcaption {
    padding-top: 7px;
  }
  .historyContainer .content .year ul > li p em,
  .awardContainer .content .year ul > li p em {
    display: block;
  }
  .historyContainer .content .year:first-of-type h1::after,
  .awardContainer .content .year:first-of-type h1::after {
    min-width: 30px;
  }
  .historyContainer .content .follower,
  .awardContainer .content .follower {
    top: 55px;
    left: 25px;
    min-height: 20px;
    max-height: 20px;
  }
  .historyContainer .content .tabTarget:not(.active),
  .awardContainer .content .tabTarget:not(.active) {
    display: none;
  }
}

@media (min-width: 1025px) {
  .awardContainer {
    margin-top: -80px;
  }
}
@media (max-width: 1024px) {
  .awardContainer {
    margin-top: -60px;
  }
}
@media (max-width: 1024px) {
  .awardContainer .displayYear {
    display: none;
  }
}
.awardContainer .content .year li {
  padding-left: 0;
}
.awardContainer .content .year li::before {
  display: none;
}
.awardContainer .content .year li p strong {
  width: 52px;
  font-weight: 700;
  color: #a5a5a5;
}
.awardContainer .content .year li p span {
  font-weight: 400;
  color: #212121;
}
.awardContainer .content .year li figure {
  margin-left: 0;
  width: 100%;
}

#contents.introduction img {
  max-width: 100%;
}
#contents.introduction .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.introduction .heading .desc {
  margin-top: 16px;
  font-size: 18px;
  line-height: 28px;
}
#contents.introduction .heading h1 + p,
#contents.introduction .heading p:first-child {
  word-break: keep-all;
}
#contents.introduction .heading p + p {
  color: #666;
  margin-top: 16px;
}
@media (max-width: 640px) {
  #contents.introduction .heading p + p br {
    display: none;
  }
}
#contents.introduction .cardIntroduction {
  display: flex;
  flex-wrap: wrap;
  margin: 50px 0;
  border-top: 1px solid #c8c8c8;
}
@media (max-width: 1024px) {
  #contents.introduction .cardIntroduction {
    margin-bottom: 0 !important;
  }
}
#contents.introduction .cardIntroduction .cardItem {
  position: relative;
  display: flex;
  width: 50%;
  min-height: 50px;
  padding: 30px 20px;
  border-top: 0;
}
#contents.introduction .cardIntroduction .cardItem:after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border: 1px solid #4415a0;
  opacity: 0;
  transition: all 0.3s;
}
#contents.introduction .cardIntroduction .cardItem:hover:after {
  opacity: 1;
  transition: all 0.3s;
}
#contents.introduction .cardIntroduction .cardItem.w100 {
  width: 100%;
}
#contents.introduction .cardIntroduction .cardItem.w100 + .w100 {
  border-left: 1px solid #c8c8c8;
}
#contents.introduction .cardIntroduction .cardItem:nth-child(2n) {
  border-left: 0;
}
#contents.introduction .cardIntroduction .icon {
  flex: none;
  width: 50px;
}
#contents.introduction .cardIntroduction .icon img {
  margin: 0;
  filter: grayscale(100%);
}
#contents.introduction .cardIntroduction dt {
  margin-bottom: 5px;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}
#contents.introduction .cardIntroduction dd {
  font-weight: 500;
  line-height: 26px;
}
#contents.introduction img {
  max-width: 100%;
}
#contents.introduction .heading .desc {
  margin-top: 16px;
  font-size: 18px;
  line-height: 28px;
}
#contents.introduction .cardIntroduction {
  display: flex;
  flex-wrap: wrap;
  margin: 50px 0;
  border-top: 1px solid #c8c8c8;
}
#contents.introduction .cardIntroduction .cardItem {
  position: relative;
  display: flex;
  width: 50%;
  min-height: 50px;
  padding: 30px 20px;
  border-top: 0;
}
#contents.introduction .cardIntroduction .cardItem:after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border: 1px solid #4415a0;
  opacity: 0;
  transition: all 0.3s;
}
#contents.introduction .cardIntroduction .cardItem:hover:after {
  opacity: 1;
  transition: all 0.3s;
}
#contents.introduction .cardIntroduction .cardItem.w100 {
  width: 100%;
}
#contents.introduction .cardIntroduction .cardItem.w100 + .w100 {
  border-left: 1px solid #c8c8c8;
}
#contents.introduction .cardIntroduction .cardItem:nth-child(2n) {
  border-left: 0;
}
#contents.introduction .cardIntroduction .icon {
  flex: none;
  width: 50px;
}
#contents.introduction .cardIntroduction .icon img {
  margin: 0;
  filter: grayscale(100%);
}
#contents.introduction .cardIntroduction dt {
  margin-bottom: 5px;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}
#contents.introduction .cardIntroduction dd {
  font-weight: 500;
  line-height: 26px;
}
#contents.introduction .banner > ul > li {
  padding: 50px 20px 85px;
}
#contents.introduction .banner > ul > li:after {
  display: none;
}
#contents.introduction .banner .logo {
  margin-bottom: 25px;
}
#contents.introduction .banner .tit {
  font-size: 20px;
  line-height: 30px;
}
#contents.introduction .banner .desc {
  margin-top: 10px;
  font-size: 16px;
  line-height: 26px;
}
#contents.introduction .banner .link {
  margin-top: 30px;
}
#contents.introduction .cardBusiness {
  margin-top: 25px;
}
#contents.introduction .cardBusiness .cardItem {
  padding: 60px 30px;
  margin-top: 15px;
  border: 0;
  background-color: #f9f9f9;
  background-size: cover;
}
#contents.introduction .cardBusiness .itemTit {
  display: block;
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 700;
}
#contents.introduction .cardBusiness .desc {
  margin-bottom: 30px;
  line-height: 26px;
}
#contents.introduction .cardBusiness .link {
  height: 44px;
  font-size: 16px;
}
@media (min-width: 1025px) {
  #contents.introduction .heading h1 + p {
    margin-top: 45px;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
  #contents.introduction .heading p + p {
    margin-top: 30px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    font-weight: 300;
    line-height: 32px;
  }
  #contents.introduction .cardIntroduction {
    margin-bottom: 120px;
    border-left: 1px solid #c8c8c8;
  }
  #contents.introduction .cardIntroduction .cardItem {
    flex: none;
    align-items: center;
    width: 33.3333333333% !important;
    min-height: 140px;
    padding: 25px 35px;
    border: 1px solid #c8c8c8;
    border-top: 0 !important;
    border-left: 0 !important;
  }
  #contents.introduction .cardIntroduction .icon {
    width: 85px;
  }
  #contents.introduction .cardIntroduction .icon img {
    width: 50px;
  }
  #contents.introduction .cardIntroduction dt {
    font-size: 16px;
    line-height: 26px;
  }
  #contents.introduction .cardIntroduction dd {
    font-size: 18px;
    line-height: 28px;
    transition: all 0.3s;
  }
  #contents.introduction .cardIntroduction .cardItem:hover dd {
    color: #4415a0;
    transition: all 0.3s;
  }
  #contents.introduction .cardIntroduction .cardItem:hover .icon img {
    filter: grayscale(0);
  }
  #contents.introduction .banner > ul {
    min-height: 700px;
  }
  #contents.introduction .banner > ul .inner {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    max-width: 700px;
    padding-left: 60px;
  }
  #contents.introduction .banner .wrapLogo {
    position: absolute;
    top: 0;
    right: 50px;
  }
  #contents.introduction .banner .tit {
    margin-bottom: 26px;
    font-size: 30px;
    line-height: 42px;
    vertical-align: middle;
  }
  #contents.introduction .banner .desc {
    font-size: 18px;
    line-height: 32px;
  }
  #contents.introduction .banner .link {
    height: 44px;
    margin-top: 40px;
  }
  #contents.introduction .cardBusiness {
    margin-top: 80px;
  }
  #contents.introduction .cardBusiness .cardItem {
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 50px 50px 28px;
  }
  #contents.introduction .cardBusiness .cardItem + .cardItem {
    margin-left: 43px;
  }
  #contents.introduction .cardBusiness .cardItem .desc {
    flex: 1;
    color: #666;
  }
  #contents.introduction .cardBusiness .link {
    width: 164px;
    background-color: transparent;
  }
  #contents.introduction .cardBusiness .link:hover, #contents.introduction .cardBusiness .link:focus {
    background-color: #4415a0;
  }
}
@media (max-width: 1024px) {
  #contents.introduction.mainAu .cardIntroduction {
    margin-bottom: 50px !important;
  }
}
#contents.introduction.mainAu .banner .brighten {
  background-image: url("../../resources/images/shinyoung/page/bannerBrighten.png");
  background-position: right center;
}
#contents.introduction.mainAu .banner .gwell .inner + .inner {
  display: none;
}
#contents.introduction.mainAu .banner .gwell.open .blur {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.2);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
#contents.introduction.mainAu .banner .gwell.open .inner {
  display: none;
}
#contents.introduction.mainAu .banner .gwell.open .inner + .inner {
  padding-top: 50px;
  display: block;
}
#contents.introduction.mainAu .banner .gwell .logo {
  height: 30px;
}
#contents.introduction.mainAu .banner .gwell {
  background-image: url("../../resources/images/shinyoung/page/bannerGwell.png");
  background-position: right center;
}
#contents.introduction.mainAu .banner .more,
#contents.introduction.mainAu .banner .close {
  position: relative;
  display: inline-flex;
  width: 28px;
  height: 28px;
  margin-left: 10px;
  vertical-align: middle;
  border-radius: 50%;
  background-color: #4415a0;
}
#contents.introduction.mainAu .banner .close:before,
#contents.introduction.mainAu .banner .more:before,
#contents.introduction.mainAu .banner .more:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  background-color: #fff;
  transform: translate(-50%, -50%);
}
#contents.introduction.mainAu .banner .more:after {
  width: 2px;
  height: 12px;
}
#contents.introduction.mainAu .banner .more .hide,
#contents.introduction.mainAu .banner .close .hide {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#contents.introduction.mainAu .banner .brandGwell {
  margin-top: 30px;
}
#contents.introduction.mainAu .banner .brandGwell li {
  display: flex;
}
#contents.introduction.mainAu .banner .brandGwell .item {
  position: relative;
  padding-left: 30px;
}
#contents.introduction.mainAu .banner .brandGwell .item + .item {
  margin-left: 10px;
}
#contents.introduction.mainAu .banner .brandGwell .item:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 13px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: #4415a0;
  transform: translateY(-50%);
}
#contents.introduction.mainAu .banner .brandGwell .item:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 15px;
  height: 1px;
  background-color: #999;
}
#contents.introduction.mainAu .banner .brandGwell .logoGwell {
  height: 21px;
}
#contents.introduction.mainAu .brandGwell .listBrand {
  position: relative;
  margin-top: 27px;
}
#contents.introduction.mainAu .brandGwell .listBrand:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 51px;
  width: 1px;
  background-color: #999;
}
#contents.introduction.mainAu .brandGwell .listBrand li {
  padding: 23px 0;
}
#contents.introduction.mainAu .brandGwell .listBrand img {
  height: 14px;
}
#contents.introduction.mainAu .brandGwell .listBrand .tit {
  font-size: 16px;
  line-height: 28px;
}
#contents.introduction.mainAu .cardBusiness .cardItem.develop {
  background-image: url("../../resources/images/shinyoung/page/bgDevelop_L.svg");
}
#contents.introduction.mainAu .cardBusiness .cardItem.research {
  background-image: url("../../resources/images/shinyoung/page/bgResearch_L.svg");
}
#contents.introduction.mainAu .chainContainer {
  text-align: center;
}
#contents.introduction.mainAu .chainContainer img {
  margin-top: 40px;
}
@media (min-width: 1025px) {
  #contents.introduction.mainAu .banner .gwell .logo {
    height: 20px;
  }
  #contents.introduction.mainAu .banner .gwell {
    background-image: url("../../resources/images/shinyoung/page/bannerGwell_L.jpg");
  }
  #contents.introduction.mainAu .banner .gwell.open .inner + .inner {
    padding-top: 180px;
  }
  #contents.introduction.mainAu .banner .gwell.open .inner + .inner .tit {
    font-size: 18px;
  }
  #contents.introduction.mainAu .brandGwell .listBrand {
    display: inline-flex;
    margin-top: 35px;
  }
  #contents.introduction.mainAu .brandGwell .listBrand:before {
    display: none;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li {
    position: relative;
    display: block;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:nth-child(2) {
    padding: 23px 27px 23px 102px;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #999;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:first-child:before {
    left: 50%;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:last-child:before {
    right: 50%;
  }
  #contents.introduction.mainAu .banner .brandGwell .item {
    padding-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  #contents.introduction.mainAu .banner .brandGwell .item:before {
    top: -23px;
    left: 50%;
    width: 1px;
    height: 20px;
  }
  #contents.introduction.mainAu .banner .brandGwell .item:after {
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:nth-child(1) .item:before {
    height: 40px;
    margin-top: -20px;
  }
  #contents.introduction.mainAu .brandGwell .listBrand li:nth-child(2) .item:before,
  #contents.introduction.mainAu .brandGwell .listBrand li:nth-child(2) .item:after {
    margin-left: -20px;
  }
  #contents.introduction.mainAu .banner .brandGwell .item + .item {
    margin-left: 0;
  }
  #contents.introduction.mainAu .banner .brandGwell .logoGwell {
    height: 23px;
  }
  #contents.introduction.mainAu .banner .brighten {
    background-image: url("../../resources/images/shinyoung/page/bannerBrighten_L.jpg");
  }
  #contents.introduction.mainAu .cardBusiness .cardItem.develop {
    background-image: url("../../resources/images/shinyoung/page/bgDevelop_L.svg");
  }
  #contents.introduction.mainAu .cardBusiness .cardItem.research {
    border-top: 0;
    background-image: url("../../resources/images/shinyoung/page/bgResearch_L.svg");
  }
  #contents.introduction.mainAu .chainContainer img {
    margin-top: 80px;
  }
}
#contents.introduction.assetAu .cardBusiness .cardItem.develop {
  background-image: url("../../resources/images/shinyoung/page/bgDevelop_L.svg");
}
#contents.introduction.assetAu .cardBusiness .cardItem.research {
  background-image: url("../../resources/images/shinyoung/page/bgResearch_L.svg");
}
#contents.introduction.assetAu .organization {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 113px;
}
#contents.introduction.assetAu .organization:after {
  content: "";
  position: absolute;
  top: -80px;
  left: 50%;
  width: 1px;
  height: 30px;
  background-color: #c8c8c8;
}
#contents.introduction.assetAu .organization:before {
  content: "";
  position: absolute;
  top: -50px;
  left: 30px;
  right: 30px;
  height: 30px;
  border: 1px solid #c8c8c8;
  border-bottom: 0;
}
#contents.introduction.assetAu .organization dt {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
}
#contents.introduction.assetAu .organization dd {
  position: relative;
  padding-left: 12px;
  margin-top: 15px;
  line-height: 26px;
  color: #666;
}
#contents.introduction.assetAu .organization dd:before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #4415a0;
}
#contents.introduction.assetAu .wrapLogo {
  text-align: center;
}
#contents.introduction.assetAu .wrapLogo img {
  max-width: 261px;
}
@media (min-width: 1025px) {
  #contents.introduction.assetAu .heading .cardIntroduction {
    margin-bottom: 20px;
  }
  #contents.introduction.assetAu .organization {
    width: 743px;
    margin: 113px auto 0;
  }
  #contents.introduction.assetAu .organization:before {
    left: 70px;
    right: 70px;
  }
  #contents.introduction.assetAu .organization dt {
    font-size: 22px;
  }
  #contents.introduction.assetAu .wrapLogo {
    margin-top: 25px;
  }
  #contents.introduction.assetAu .wrapLogo img {
    max-width: 326px;
  }
}
#contents.introduction.encAu .cardBusiness .cardItem.develop {
  background-image: url("../../resources/images/shinyoung/page/bgDevelop_L.svg");
}
#contents.introduction.encAu .cardBusiness .cardItem.construct {
  background-image: url("../../resources/images/shinyoung/page/bgResearch_L.svg");
}
#contents.introduction.encAu .cardBusiness .cardItem.housing {
  background-image: url("../../resources/images/shinyoungEnc/page/bgHousing.svg");
}
#contents.introduction.encAu .cardBusiness .cardItem.engineering {
  background-image: url("../../resources/images/shinyoungEnc/page/bgEngineering.svg");
}
@media (min-width: 1025px) {
  #contents.introduction.encAu .container > .inner {
    padding-top: 0;
  }
  #contents.introduction.encAu .cardIntroduction .cardItem {
    flex: none;
    align-items: flex-start;
    width: 33.3333333333% !important;
    min-height: 140px;
    padding: 40px 35px;
    border: 1px solid #c8c8c8;
    border-top: 0 !important;
    border-left: 0 !important;
  }
  #contents.introduction.encAu .cardIntroduction dd + dd {
    margin-top: 10px;
  }
  #contents.introduction.encAu .cardBusiness {
    flex-wrap: wrap;
    margin-top: 20px;
    margin-left: -43px;
  }
  #contents.introduction.encAu .cardBusiness .cardItem {
    display: flex;
    flex-direction: column;
    flex: none;
    width: calc(50% - 43px);
    min-height: 330px;
    padding: 50px 50px 28px;
    margin-left: 43px;
    margin-top: 60px;
    border-top: 0 !important;
  }
  #contents.introduction.encAu .cardBusiness .cardItem.develop {
    background-image: url("../../resources/images/shinyoung/page/bgDevelop_L.svg");
  }
  #contents.introduction.encAu .cardBusiness .cardItem.construct {
    background-image: url("../../resources/images/shinyoung/page/bgResearch_L.svg");
  }
  #contents.introduction.encAu .cardBusiness .cardItem.housing {
    background-image: url("../../resources/images/shinyoungEnc/page/bgHousing_L.svg");
  }
  #contents.introduction.encAu .cardBusiness .cardItem.engineering {
    background-image: url("../../resources/images/shinyoungEnc/page/bgEngineering_L.svg");
  }
}

#contents.license .list {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#contents.license .list li img {
  display: block;
  width: 100%;
  border: 1px solid #c8c8c8;
}
#contents.license .list li strong {
  font-size: 20px;
  line-height: 30px;
  letter-spacing: -0.02em;
}
#contents.license .list li dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
}
#contents.license .list li dl dt {
  width: 76px;
}
#contents.license .list li dl dd {
  position: relative;
  width: calc(100% - 76px);
  padding-left: 10px;
  color: #666;
}
#contents.license .list li dl dd::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 1px;
  height: 14px;
  background: #c8c8c8;
}
@media (min-width: 1025px) {
  #contents.license .list li {
    width: calc(33.3333333333% - 20px);
  }
  #contents.license .list li img {
    margin-bottom: 22px;
  }
  #contents.license .list li dl {
    margin-top: 23px;
  }
  #contents.license .list li:not(:nth-of-type(3n-2)) {
    margin-left: 30px;
  }
  #contents.license .list li + li + li + li {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #contents.license .list li {
    width: calc(50% - 10px);
  }
  #contents.license .list li img {
    margin-bottom: 18px;
  }
  #contents.license .list li dl {
    margin-top: 13px;
  }
  #contents.license .list li:nth-child(even) {
    margin-left: 20px;
  }
  #contents.license .list li + li + li {
    margin-top: 40px;
  }
}
@media (max-width: 640px) {
  #contents.license .list li {
    width: 100%;
    margin-left: 0 !important;
  }
  #contents.license .list li + li {
    margin-top: 40px;
  }
}

#contents.location .tabTarget > h1 {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#contents.location .buttons .navi {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100%;
  height: 44px;
}
#contents.location .buttons .navi::before, #contents.location .buttons .navi::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.location .buttons .navi:not(:disabled):hover, #contents.location .buttons .navi:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.location .buttons .navi:not(:disabled):hover::before, #contents.location .buttons .navi:not(:disabled):hover::after, #contents.location .buttons .navi:not(:disabled):focus::before, #contents.location .buttons .navi:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.location .buttons .navi {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.location .buttons .navi::before {
    margin-right: 10px;
  }
  #contents.location .buttons .navi::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.location .buttons .navi {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.location .buttons .navi::before {
    margin-right: 14px;
  }
  #contents.location .buttons .navi::after {
    margin-left: 18px;
  }
}
#contents.location .tabTarget .container:first-of-type .inner:first-child {
  padding-top: 0;
}
#contents.location .container:first-of-type .inner:first-child {
  padding-top: 0;
}
#contents.location .inner + .inner {
  margin-top: 50px;
  border-top: 1px solid #c8c8c8;
}
#contents.location .info .address {
  font-size: 22px;
  line-height: 32px;
}
@media (max-width: 1024px) {
  #contents.location .info .address {
    margin-top: 10px;
  }
}
#contents.location .info .address .copy {
  filter: grayscale(100);
  opacity: 0.6;
  width: 25px;
  height: 25px;
  background: url("../images/icon/iconCopy.svg");
  background-size: 25px;
  vertical-align: middle;
}
#contents.location .info .copy:hover {
  filter: grayscale(0);
  opacity: 1;
}
#contents.location .info .tel {
  color: #666;
  line-height: 30px;
}
#contents.location .info .navi + .navi {
  margin-top: 15px;
}
#contents.location .info .buttons {
  margin-top: 15px;
}
#contents.location .wrapMap {
  margin-top: 25px;
}
#contents.location .map {
  height: 200px;
  background: rgba(0, 151, 224, 0.3);
}
#contents.location .map .temp {
  width: 100%;
  height: 100%;
}
#contents.location .publicTransport {
  padding-top: 20px;
}
#contents.location .transport + .transport {
  padding-top: 40px;
}
#contents.location .transport .icon,
#contents.location .transport .type {
  vertical-align: middle;
}
#contents.location .transport .type {
  margin-left: 15px;
  font-size: 18px;
  line-height: 28px;
}
#contents.location .transport li {
  position: relative;
  padding-left: 11px;
  margin-top: 10px;
  line-height: 26px;
}
#contents.location .transport li:before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #666;
}
#contents.location .transport .line9:before {
  background-color: #bdb092;
}
#contents.location .transport .line2:before {
  background-color: #00a84d;
}
#contents.location .transport .lineSB:before {
  background-color: #fabe00;
}
#contents.location .info h1 {
  color: #212121;
  font-weight: 400;
}
#contents.location .info h1 .emph {
  color: #4415a0;
  font-weight: 700;
}
@media (min-width: 1025px) {
  #contents.location .tabTarget h1 {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    clip: unset;
  }
  #contents.location .inner {
    display: flex;
    flex-wrap: wrap;
  }
  #contents.location .inner + .inner {
    padding-top: 100px;
  }
  #contents.location .info {
    flex: none;
    width: 345px;
    padding-right: 30px;
  }
  #contents.location .info .address {
    margin-top: 10px;
    font-size: 30px;
    line-height: 42px;
  }
  #contents.location .info .tel {
    line-height: 32px;
  }
  #contents.location .info .buttons {
    margin-top: 40px;
  }
  #contents.location .buttons .navi {
    font-size: 14px;
    max-width: 195px;
  }
  #contents.location .buttons .navi.daenong {
    max-width: 250px;
  }
  #contents.location .wrapMap {
    flex: 1;
    margin-top: 0;
  }
  #contents.location .wrapMap .map {
    height: 350px;
  }
  #contents.location .wrapMap .temp {
    width: 855px;
    height: 350px;
  }
  #contents.location .publicTransport {
    display: flex;
    padding-top: 20px;
  }
}
@media (min-width: 1025px) and (max-width: 1100px) {
  #contents.location .publicTransport {
    flex-wrap: wrap;
  }
}
@media (min-width: 1025px) {
  #contents.location .publicTransport .transport {
    flex: 1;
  }
}
@media (min-width: 1025px) and (max-width: 1100px) {
  #contents.location .publicTransport .transport {
    flex: none;
    width: 100%;
  }
  #contents.location .publicTransport .transport + .transport {
    padding-top: 40px;
  }
}
@media (min-width: 1025px) {
  #contents.location .transport + .transport {
    padding-top: 0;
  }
  #contents.location .transport ul {
    padding-top: 10px;
  }
  #contents.location .transport li {
    margin-top: 8px;
    color: #999;
    font-size: 16px;
    line-height: 26px;
  }
  #contents.location .transport .type {
    margin-left: 20px;
    font-size: 20px;
    line-height: 30px;
  }
}
@media (min-width: 1025px) {
  #contents.location.assetAu .buttons .navi.daenong {
    max-width: 250px;
  }
}

#contents.greetings .container > .inner {
  padding-top: 0;
}
#contents.greetings .tit {
  display: block;
  margin-bottom: 31px;
  font-size: 32px;
  font-weight: 300;
  line-height: 42px;
}
#contents.greetings .tit b {
  font-weight: 400;
}
#contents.greetings .tit .emph {
  color: #4415a0;
}
#contents.greetings .subTit {
  margin-bottom: 21px;
  font-size: 26px;
  font-weight: 300;
  line-height: 36px;
  word-break: keep-all;
}
#contents.greetings .txt {
  margin-bottom: 30px;
  font-size: 16px;
  line-height: 26px;
  word-break: keep-all;
}
#contents.greetings .name {
  font-weight: 700;
  font-size: 18px;
}
#contents.greetings .wrapImg {
  margin-top: 50px;
}
#contents.greetings .wrapImg img {
  max-width: 100%;
}
@media (min-width: 1025px) {
  #contents.greetings .inner {
    display: flex;
  }
  #contents.greetings .tit {
    margin-bottom: 31px;
    font-size: 50px;
    line-height: 65px;
  }
  #contents.greetings .subTit {
    margin-bottom: 30px;
    font-size: 30px;
    line-height: 40px;
  }
  #contents.greetings .txt {
    margin-bottom: 40px;
    font-size: 16px;
    line-height: 28px;
  }
  #contents.greetings .name {
    font-weight: 500;
    font-size: 20px;
  }
  #contents.greetings .wrapImg {
    flex: none;
    padding-left: 80px;
    margin-top: 0;
  }
  #contents.greetings .wrapImg img {
    width: 546px;
  }
}
@media (min-width: 1025px) {
  #contents.greetings.assetAu .container, #contents.greetings.encAu .container {
    background: url("../../resources/images/shinyoungAsset/page/bgGreetings.svg") 100% 100% no-repeat;
  }
  /*추가*/
  /* #contents.au.introduce .greetings {
    margin-top: -125px;
    padding-bottom: 50px;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
  }
  #contents.au.introduce .greetings .txtWrap {
    width: 56%;
    margin-top: 118px;
  }
  #contents.au.introduce .greetings .imgWrap {
    overflow: hidden;
    margin-top: 205px;
    width: 473px;
    height: 531px;
    text-align: center;
  }
  #contents.au.introduce .greetings .imgWrap img{
    transform: translate(-49px, -29px);
  } */
  /*추가*/
}


#contents.vision .container .inner {
  padding-top: 0;
}
#contents.vision .listVision dt {
  padding-top: 40px;
  padding-bottom: 20px;
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
}
#contents.vision .listVision .item:first-of-type dt {
  padding-top: 0;
}
#contents.vision .listVision .emph {
  font-size: 26px;
  line-height: 36px;
}
#contents.vision .listVision .subTxt {
  margin-top: 11px;
  color: #666;
  font-size: 16px;
  line-height: 26px;
}
#contents.vision .listVision .bg {
  padding: 40px 0 50px;
  text-align: center;
}
#contents.vision .listVision .bg img {
  width: 180px;
}
#contents.vision .listVision .item + .item {
  border-top: 1px dashed #dbdbdb;
}
#contents.vision .listVision .mission dt {
  color: #0090ff;
}
#contents.vision .listVision .vision dt {
  color: #4415a0;
}
#contents.vision .listVision .value dt {
  color: #004392;
}
#contents.vision .listVision .value dd {
  display: flex;
  padding: 30px 30px 30px 20px;
  background-color: #f9f9f9;
}
#contents.vision .listVision .value dd + dd {
  margin-top: 15px;
}
#contents.vision .listVision .value .wrapIcon {
  flex: none;
  width: 86px;
}
#contents.vision .listVision .value .valueTit {
  display: block;
  margin-bottom: 11px;
  font-weight: 700;
  font-size: 18px;
  color: #004392;
}
#contents.vision .listVision .value .valueTit + p {
  color: #666;
  line-height: 26px;
}
@media (min-width: 1025px) {
  #contents.vision .heading + .container .inner {
    padding-top: 40px;
  }
  #contents.vision .containerVision {
    padding-bottom: 110px;
  }
  #contents.vision .listVision .item:first-child {
    padding-top: 0;
  }
  #contents.vision .listVision .item {
    display: flex;
    padding: 55px 0 40px;
  }
  #contents.vision .listVision .item + .item {
    padding-top: 80px;
  }
  #contents.vision .listVision dt {
    flex: none;
    width: 318px;
    padding-top: 45px;
    font-size: 40px;
  }
  #contents.vision .listVision .item:first-of-type dt {
    padding-top: 40px;
  }
  #contents.vision .listVision .emph {
    flex: 1;
    padding-top: 40px;
    font-size: 40px;
    font-weight: 700;
    line-height: 56px;
  }
  #contents.vision .listVision .subTxt {
    margin-top: 21px;
    font-weight: 400;
  }
  #contents.vision .listVision .bg {
    padding: 0 40px;
  }
  #contents.vision .listVision .value dt {
    padding-top: 0;
  }
  #contents.vision .listVision .value dd {
    flex: 1;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
  #contents.vision .listVision .value dd + dd {
    margin-top: 0;
    margin-left: 23px;
  }
  #contents.vision .listVision .value .wrapIcon {
    width: 100%;
  }
  #contents.vision .listVision .value .valueTit {
    padding: 15px 0;
    font-size: 22px;
    line-height: 37px;
  }
}

#contents.crList .total {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 700;
  word-break: keep-all;
}
#contents.crList .total em {
  color: #4415a0;
}
#contents.crList .sort {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.crList .sort .selectBox {
  position: relative;
}
#contents.crList .sort .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  color: #212121;
}
#contents.crList .sort .selectBox > button:not(.placeholder):not(.active) {
  font-weight: 700;
}
#contents.crList .sort .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
}
#contents.crList .sort .selectBox > button.placeholder {
  color: #a5a5a5;
}
#contents.crList .sort .selectBox > button.active {
  color: #4415a0;
}
#contents.crList .sort .selectBox > button.active::after {
  border-color: #4415a0;
}
#contents.crList .sort .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#contents.crList .sort .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
}
#contents.crList .sort .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
#contents.crList .sort .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #contents.crList .sort .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  #contents.crList .sort .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  #contents.crList .sort .selectBox > button,
  #contents.crList .sort .selectBox > div button {
    padding-left: 10%;
  }
  #contents.crList .sort .selectBox > button {
    height: 80px;
  }
  #contents.crList .sort .selectBox > button::after {
    right: 10%;
  }
}
@media (max-width: 1024px) {
  #contents.crList .sort .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  #contents.crList .sort .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
  #contents.crList .sort .selectBox > button {
    height: 50px;
  }
  #contents.crList .sort .selectBox > button::after {
    right: 5px;
  }
}
@media (min-width: 1025px) {
  #contents.crList .sort {
    margin-top: 80px;
    margin-bottom: 60px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: stretch;
    align-items: center;
  }
  #contents.crList .sort > * {
    flex-basis: 100%;
  }
}
@media (max-width: 1024px) {
  #contents.crList .sort {
    margin-top: 30px;
    margin-bottom: 40px;
  }
  #contents.crList .sort > * + * {
    margin-top: 10px;
  }
}
#contents.crDetail > section > header {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.crDetail > section > header > h1 {
  padding-bottom: 20px;
  border-bottom: 1px solid #000;
  word-break: keep-all;
}
#contents.crDetail > section > header .utility {
  border-bottom: 1px solid #c8c8c8;
}
#contents.crDetail > section > header .utility dl strong {
  color: #643ce0;
}
#contents.crDetail > section > header .utility > div {
  position: relative;
}
#contents.crDetail > section > header .utility > div > button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30px auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.45;
}
#contents.crDetail > section > header .utility > div > button:hover, #contents.crDetail > section > header .utility > div > button.on {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
#contents.crDetail > section > header .utility > div > button.bookmark {
  background-image: url("../images/icon/iconBookmark.svg");
}
#contents.crDetail > section > header .utility > div > button.print {
  background-image: url("../images/icon/iconPrint2.svg");
}
#contents.crDetail > section > header .utility > div > button.share {
  background-image: url("../images/icon/iconShareBig.svg");
}
#contents.crDetail > section > header .cover {
  background: #EDEDF6 !important;
  color: #212121 !important;
}
#contents.crDetail > section > header .cover em {
  font-weight: 100;
}
#contents.crDetail > section > header .cover h1 {
  word-break: keep-all;
}
#contents.crDetail > section > header .cover p {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.crDetail > section > header .utility {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding: 40px 0;
  }
  #contents.crDetail > section > header .utility dl {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #contents.crDetail > section > header .utility dl strong {
    padding-left: 17px;
  }
  #contents.crDetail > section > header .utility > div > button + button {
    margin-left: 8px;
  }
  #contents.crDetail > section > header .utility > div div.share {
    right: 0;
  }
  #contents.crDetail > section > header .cover {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 60px;
    padding: 73px 50px;
  }
  #contents.crDetail > section > header .cover h1 {
    margin-top: 20px;
  }
  #contents.crDetail > section > header .cover p {
    margin-top: 15px;
    padding-right: 45px;
  }
  #contents.crDetail > section > header .cover img {
    width: 470px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section > header .utility {
    padding: 20px 0 25px;
  }
  #contents.crDetail > section > header .utility dl strong {
    display: block;
    margin-top: 10px;
  }
  #contents.crDetail > section > header .utility > div {
    margin-top: 20px;
  }
  #contents.crDetail > section > header .utility > div .print {
    display: none;
  }
  #contents.crDetail > section > header .utility > div > button + button {
    margin-left: 20px;
  }
  #contents.crDetail > section > header .utility > div div.share {
    left: 0;
  }
  #contents.crDetail > section > header .cover {
    margin-top: 40px;
    padding: 20px 20px 50px;
  }
  #contents.crDetail > section > header .cover h1 {
    margin-top: 13px;
  }
  #contents.crDetail > section > header .cover p {
    margin-top: 10px;
  }
  #contents.crDetail > section > header .cover img {
    display: block;
    margin: 50px auto 0;
    width: calc(100% - 40px);
    max-width: 350px;
  }
}
#contents.crDetail > section img {
  display: block;
}
#contents.crDetail > section > div {text-align:cernter;}
@media (min-width: 1025px) {
  #contents.crDetail > section img {
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    /* max-width: 1200px; */
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section img {
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    max-width: calc(100% - 40px);
  }
}
#contents.crDetail > section .shortcut {
  z-index: 2;
  position: sticky;
  top: 0;
  margin-top: 37px;
  height: 80px;
  border-top: 1px solid #c8c8c8;
  border-bottom: 1px solid #c8c8c8;
  -ms-box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.141);
  -o-box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.141);
  box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.141);
  background: #0f145a;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .shortcut {
    height: 80px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .shortcut {
    height: 59px;
  }
}
#contents.crDetail > section .shortcut > button {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 80px;
  text-align: left;
  color: #fff;
}
@media (max-width: 1024px) {
  #contents.crDetail > section .shortcut > button {
    padding-left: 40px;
    height: 59px;
  }
}
#contents.crDetail > section .shortcut > button::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #fff;
  border-style: solid;
  transform: rotate(-45deg);
  margin-bottom: 3px;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .shortcut > button::after {
    margin-left: 33px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .shortcut > button::after {
    margin-left: 17px;
  }
}
#contents.crDetail > section .shortcut > div {
  display: none;
  padding-bottom: 40px;
  border-bottom: 1px solid #c8c8c8;
  background: #f9f9f9;
}
#contents.crDetail > section .shortcut > div > div {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: -1px;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .shortcut > div > div {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
#contents.crDetail > section .shortcut > div > div button {
  margin-top: 22px;
  text-align: left;
}
@media (max-width: 1024px) {
  #contents.crDetail > section .shortcut > div > div button {
    padding-left: 40px;
  }
}
#contents.crDetail > section .shortcut > div > div button:not(.selected) {
  color: #a5a5a5;
}
#contents.crDetail > section .shortcut > div > div button.selected {
  position: relative;
}
#contents.crDetail > section .shortcut > div > div button.selected::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .shortcut > div > div button.selected::before {
    left: -20px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .shortcut > div > div button.selected::before {
    left: 20px;
  }
}
#contents.crDetail > section .department {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .department {
    padding-top: 70px;
  }
  #contents.crDetail > section .department ~ .department {
    padding-top: 84px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .department {
    padding-top: 55px;
  }
  #contents.crDetail > section .department ~ .department {
    padding-top: 45px;
  }
}
#contents.crDetail > section .department h1 {
  padding-bottom: 18px;
  color: #4415a0;
}
#contents.crDetail > section .department > ul {
  border-top: 2px solid #212121;
}
#contents.crDetail > section .department > ul li + li {
  border-top: 1px solid #a5a5a5;
}
#contents.crDetail > section .department > ul p {
  font-size: 20px;
  line-height: 30px;
  letter-spacing: -0.02em;
}
#contents.crDetail > section .department > ul dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  color: #666;
}
#contents.crDetail > section .department > ul dl > * {
  padding-top: 23px;
  padding-bottom: 17px;
  border-bottom: 1px dashed #e5e5e5;
}
#contents.crDetail > section .department > ul dl dt {
  font-weight: 500;
}
#contents.crDetail > section .department > ul dl dt span {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  position: absolute;
}
#contents.crDetail > section .department > ul dl dt span::before {
  content: "";
  margin-right: 10px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .department > ul li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 40px;
  }
  #contents.crDetail > section .department > ul li + li {
    margin-top: 60px;
  }
  #contents.crDetail > section .department > ul li p {
    width: 20%;
  }
  #contents.crDetail > section .department > ul li dl {
    margin-top: -23px;
    width: 80%;
  }
  #contents.crDetail > section .department > ul li dl dt {
    width: 36%;
  }
  #contents.crDetail > section .department > ul li dl dd {
    width: 64%;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .department > ul li {
    padding-top: 22px;
  }
  #contents.crDetail > section .department > ul li + li {
    margin-top: 30px;
  }
  #contents.crDetail > section .department > ul li dl dt {
    width: 110px;
    padding-left: 10px;
  }
  #contents.crDetail > section .department > ul li dl dd {
    width: calc(100% - 110px);
  }
}
#contents.crDetail > section .department > .table {
  position: relative;
}
#contents.crDetail > section .department > .table table {
  table-layout: fixed;
  width: 100%;
  min-width: 984px;
  border-top: 2px solid #212121;
  word-break: keep-all;
}
#contents.crDetail > section .department > .table table th,
#contents.crDetail > section .department > .table table td {
  padding: 20px 10px;
}
#contents.crDetail > section .department > .table table thead th {
  vertical-align: middle;
  height: 72px;
  border-bottom: 1px solid #c8c8c8;
  background: #f6f6f6;
}
#contents.crDetail > section .department > .table table tbody th {
  font-weight: 400;
}
#contents.crDetail > section .department > .table table tbody th,
#contents.crDetail > section .department > .table table tbody td {
  vertical-align: middle;
  border-bottom: 1px solid #c8c8c8;
  background: #fff;
}
#contents.crDetail > section .department > .table table tbody th:first-child, #contents.crDetail > section .department > .table table tbody th:nth-child(2), #contents.crDetail > section .department > .table table tbody th:nth-child(3), #contents.crDetail > section .department > .table table tbody th:nth-child(4),
#contents.crDetail > section .department > .table table tbody td:first-child,
#contents.crDetail > section .department > .table table tbody td:nth-child(2),
#contents.crDetail > section .department > .table table tbody td:nth-child(3),
#contents.crDetail > section .department > .table table tbody td:nth-child(4) {
  text-align: center;
}
#contents.crDetail > section .department > .table table tbody ul li {
  position: relative;
  padding-left: 8px;
}
#contents.crDetail > section .department > .table table tbody ul li::before {
  content: "·";
  position: absolute;
  left: 0;
}
@media (min-width: 1025px) {
  #contents.crDetail > section .department > .table thead th {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
  #contents.crDetail > section .department > .table tr > *:first-child {
    width: 13.5%;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(2) {
    width: 12%;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(3) {
    width: 8%;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(4) {
    width: 10%;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(6) {
    width: 16%;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section .department > .table {
    overflow-x: auto;
    overflow-y: hidden;
  }
  #contents.crDetail > section .department > .table thead th {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
  #contents.crDetail > section .department > .table th:first-child,
  #contents.crDetail > section .department > .table th:nth-child(2) {
    z-index: 1;
    position: sticky;
  }
  #contents.crDetail > section .department > .table th:first-child {
    left: 0;
  }
  #contents.crDetail > section .department > .table th:nth-child(2) {
    left: 96px;
  }
  #contents.crDetail > section .department > .table tr > *:first-child {
    width: 96px;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(2) {
    width: 70px;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(3) {
    width: 70px;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(4) {
    width: 90px;
  }
  #contents.crDetail > section .department > .table tr > *:nth-child(6) {
    width: 120px;
  }
  #contents.crDetail > section .department > .table thead th:first-child::before {
    z-index: 1;
    content: "";
    position: absolute;
    top: 0;
    left: 166px;
    width: 15px;
    height: 100vh;
    background: linear-gradient(to right, #7c7c7c, #fefefe);
    opacity: 0.1;
  }
}
#contents.crDetail > section dl.info {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.crDetail > section dl.info::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
#contents.crDetail > section dl.info dt {
  font-weight: 700;
}
#contents.crDetail > section dl.info dd {
  position: relative;
  font-size: 16px;
  letter-spacing: -0.015em;
  color: #666;
}
#contents.crDetail > section dl.info dd:not(.diagram) {
  line-height: 28px;
  /*&::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.75em;
    width: 4px;
    height: 4px;
    @include prefix(border-radius, 50%);
    background: $secondary1;
  }*/
}
#contents.crDetail > section dl.info dd.diagram {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  overflow: hidden;
  text-align: center;
  line-height: 1.4;
}
#contents.crDetail > section dl.info dd.diagram p {
  position: relative;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(1) {
  background-image: url("../images/common/imgCr01.svg");
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(2) {
  background-image: url("../images/common/imgCr02.svg");
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(3) {
  background-image: url("../images/common/imgCr03.svg");
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(4) {
  background-image: url("../images/common/imgCr04.svg");
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(5) {
  background-image: url("../images/common/imgCr05.svg");
}
#contents.crDetail > section dl.info dd.diagram p:nth-child(6) {
  background-image: url("../images/common/imgCr06.svg");
}
#contents.crDetail > section dl.info dd.diagram p::before {
  z-index: -1;
  content: "";
  position: absolute;
  left: -100%;
  width: 100%;
  height: 1px;
  background: #c8c8c8;
}
@media (min-width: 1025px) {
  #contents.crDetail > section dl.info {
    padding-top: 20px;
  }
  #contents.crDetail > section dl.info dt {
    clear: both;
    float: left;
    margin-top: 80px;
    width: 200px;
  }
}
@media (min-width: 1025px) and (max-width: 1090px) {
  #contents.crDetail > section dl.info dt {
    width: 150px;
  }
}
@media (min-width: 1025px) {
  #contents.crDetail > section dl.info dt + dd:not(.diagram) {
    margin-top: 80px;
  }
  #contents.crDetail > section dl.info dd {
    /*&:not(.diagram) {*/
    float: right;
    width: calc(100% - 200px);
    padding-left: 19px;
    /*}*/
  }
}
@media (min-width: 1025px) and (max-width: 1090px) {
  #contents.crDetail > section dl.info dd {
    width: calc(100% - 150px);
  }
}
@media (min-width: 1025px) {
  #contents.crDetail > section dl.info dd.diagram {
    padding-top: 45px;
    padding-left: 0;
  }
  #contents.crDetail > section dl.info dd.diagram p {
    width: 130px;
    padding-top: 150px;
  }
  #contents.crDetail > section dl.info dd.diagram p:before {
    top: 65px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section dl.info dt {
    padding-top: 50px;
    margin-bottom: 15px;
  }
  #contents.crDetail > section dl.info dd:not(.diagram) {
    padding-left: 14px;
  }
  #contents.crDetail > section dl.info dd.diagram {
    position: relative;
    margin-top: -40px;
    padding-top: 17px;
    /*@media (min-width: 481px) and (max-width: 690px) {
      @include flexJustify(flex-start);
      p {
        margin-right: 20px;
      }
    }*/
  }
  #contents.crDetail > section dl.info dd.diagram p {
    margin-top: 30px;
    width: 100px;
    padding-top: 120px;
  }
  #contents.crDetail > section dl.info dd.diagram p:before {
    top: 50px;
  }
}
@media (max-width: 1024px) and (max-width: 690px) {
  #contents.crDetail > section dl.info dd.diagram {
    max-width: 360px;
  }
}
#contents.crDetail > section footer.button {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
@media (min-width: 1025px) {
  #contents.crDetail > section footer.button {
    padding-top: 80px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section footer.button {
    padding-top: 45px;
  }
}
#contents.crDetail > section footer.button a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.crDetail > section footer.button a::before, #contents.crDetail > section footer.button a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.crDetail > section footer.button a:not(:disabled):hover, #contents.crDetail > section footer.button a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.crDetail > section footer.button a:not(:disabled):hover::before, #contents.crDetail > section footer.button a:not(:disabled):hover::after, #contents.crDetail > section footer.button a:not(:disabled):focus::before, #contents.crDetail > section footer.button a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.crDetail > section footer.button a {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #contents.crDetail > section footer.button a::before {
    margin-right: 10px;
  }
  #contents.crDetail > section footer.button a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section footer.button a {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #contents.crDetail > section footer.button a::before {
    margin-right: 14px;
  }
  #contents.crDetail > section footer.button a::after {
    margin-left: 18px;
  }
}
@media (max-width: 1024px) {
  #contents.crDetail > section footer.button a {
    min-width: 160px;
  }
}
#contents.crDetail > section footer.button a + a {
  margin-left: 10px;
}

#recruit:not(.case), .recruit:not(.case) {
  background: #f9f9f9;
}
#recruit > preference > h1,
#recruit > preference > header,
#recruit > h1,
#recruit > header, .recruit > preference > h1,
.recruit > preference > header,
.recruit > h1,
.recruit > header {
  border-bottom: 1px solid #e8e8e8;
  background: #fff;
  color: #0f145a;
}
#recruit > preference > h1 div,
#recruit > preference > header div,
#recruit > h1 div,
#recruit > header div, .recruit > preference > h1 div,
.recruit > preference > header div,
.recruit > h1 div,
.recruit > header div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #recruit > preference > h1 div,
  #recruit > preference > header div,
  #recruit > h1 div,
  #recruit > header div, .recruit > preference > h1 div,
  .recruit > preference > header div,
  .recruit > h1 div,
  .recruit > header div {
    font-size: 20px;
    line-height: 90px;
  }
}
@media (max-width: 1024px) {
  #recruit > preference > h1 div,
  #recruit > preference > header div,
  #recruit > h1 div,
  #recruit > header div, .recruit > preference > h1 div,
  .recruit > preference > header div,
  .recruit > h1 div,
  .recruit > header div {
    font-size: 14px;
    line-height: 55px;
  }
}
#recruit > preference > header > div,
#recruit > header > div, .recruit > preference > header > div,
.recruit > header > div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#recruit > preference > header > div > a.close,
#recruit > header > div > a.close, .recruit > preference > header > div > a.close,
.recruit > header > div > a.close {
  position: relative;
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #4415a0;
  top: 0 !important;
  right: 0 !important;
}
@media (min-width: 1025px) {
  #recruit > preference > header > div > a.close,
  #recruit > header > div > a.close, .recruit > preference > header > div > a.close,
  .recruit > header > div > a.close {
    top: 100px;
    right: 107px;
    width: 48px;
    height: 48px;
  }
  #recruit > preference > header > div > a.close::before, #recruit > preference > header > div > a.close::after,
  #recruit > header > div > a.close::before,
  #recruit > header > div > a.close::after, .recruit > preference > header > div > a.close::before, .recruit > preference > header > div > a.close::after,
  .recruit > header > div > a.close::before,
  .recruit > header > div > a.close::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 23px;
    height: 1px;
    background: #fff;
  }
  #recruit > preference > header > div > a.close::before,
  #recruit > header > div > a.close::before, .recruit > preference > header > div > a.close::before,
  .recruit > header > div > a.close::before {
    transform: rotate(45deg);
  }
  #recruit > preference > header > div > a.close::after,
  #recruit > header > div > a.close::after, .recruit > preference > header > div > a.close::after,
  .recruit > header > div > a.close::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  #recruit > preference > header > div > a.close,
  #recruit > header > div > a.close, .recruit > preference > header > div > a.close,
  .recruit > header > div > a.close {
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
  }
  #recruit > preference > header > div > a.close::before, #recruit > preference > header > div > a.close::after,
  #recruit > header > div > a.close::before,
  #recruit > header > div > a.close::after, .recruit > preference > header > div > a.close::before, .recruit > preference > header > div > a.close::after,
  .recruit > header > div > a.close::before,
  .recruit > header > div > a.close::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #fff;
  }
  #recruit > preference > header > div > a.close::before,
  #recruit > header > div > a.close::before, .recruit > preference > header > div > a.close::before,
  .recruit > header > div > a.close::before {
    transform: rotate(45deg);
  }
  #recruit > preference > header > div > a.close::after,
  #recruit > header > div > a.close::after, .recruit > preference > header > div > a.close::after,
  .recruit > header > div > a.close::after {
    transform: rotate(-45deg);
  }
}
#recruit > preference > header > div nav,
#recruit > header > div nav, .recruit > preference > header > div nav,
.recruit > header > div nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
  color: #212121;
}
#recruit > preference > header > div nav a,
#recruit > header > div nav a, .recruit > preference > header > div nav a,
.recruit > header > div nav a {
  font-weight: 700;
}
@media (min-width: 1025px) {
  #recruit > preference > header > div nav a,
  #recruit > header > div nav a, .recruit > preference > header > div nav a,
  .recruit > header > div nav a {
    margin-right: 70px;
    font-size: 16px;
  }
}
@media (max-width: 1024px) {
  #recruit > preference > header > div nav a,
  #recruit > header > div nav a, .recruit > preference > header > div nav a,
  .recruit > header > div nav a {
    margin-right: 35px;
    font-size: 13px;
  }
}
@media screen and (min-width: 641px) {
  #recruit > preference > header > div nav button,
  #recruit > header > div nav button, .recruit > preference > header > div nav button,
  .recruit > header > div nav button {
    width: 30px;
    height: 30px;
    background: url("../images/icon/iconLogout.svg") no-repeat center;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
  }
}
@media (max-width: 640px) {
  #recruit > preference > header > div button.narrowOnly,
  #recruit > header > div button.narrowOnly, .recruit > preference > header > div button.narrowOnly,
  .recruit > header > div button.narrowOnly {
    z-index: 2;
    position: relative;
    display: inline-block;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    font-size: 0.5rem;
  }
  #recruit > preference > header > div button.narrowOnly:not(.active),
  #recruit > header > div button.narrowOnly:not(.active), .recruit > preference > header > div button.narrowOnly:not(.active),
  .recruit > header > div button.narrowOnly:not(.active) {
    margin-right: 8px;
    width: 22px;
    height: 18px;
    border-top: 1px solid #212121;
    border-bottom: 1px solid #212121;
  }
  #recruit > preference > header > div button.narrowOnly:not(.active)::after,
  #recruit > header > div button.narrowOnly:not(.active)::after, .recruit > preference > header > div button.narrowOnly:not(.active)::after,
  .recruit > header > div button.narrowOnly:not(.active)::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    display: block;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #212121;
  }
  #recruit > preference > header > div button.narrowOnly:not(.active) + nav,
  #recruit > header > div button.narrowOnly:not(.active) + nav, .recruit > preference > header > div button.narrowOnly:not(.active) + nav,
  .recruit > header > div button.narrowOnly:not(.active) + nav {
    display: none;
  }
  #recruit > preference > header > div button.narrowOnly.active,
  #recruit > header > div button.narrowOnly.active, .recruit > preference > header > div button.narrowOnly.active,
  .recruit > header > div button.narrowOnly.active {
    width: 40px;
    height: 40px;
  }
  #recruit > preference > header > div button.narrowOnly.active::before, #recruit > preference > header > div button.narrowOnly.active::after,
  #recruit > header > div button.narrowOnly.active::before,
  #recruit > header > div button.narrowOnly.active::after, .recruit > preference > header > div button.narrowOnly.active::before, .recruit > preference > header > div button.narrowOnly.active::after,
  .recruit > header > div button.narrowOnly.active::before,
  .recruit > header > div button.narrowOnly.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 28px;
    height: 1px;
    background: #212121;
  }
  #recruit > preference > header > div button.narrowOnly.active::before,
  #recruit > header > div button.narrowOnly.active::before, .recruit > preference > header > div button.narrowOnly.active::before,
  .recruit > header > div button.narrowOnly.active::before {
    transform: rotate(45deg);
  }
  #recruit > preference > header > div button.narrowOnly.active::after,
  #recruit > header > div button.narrowOnly.active::after, .recruit > preference > header > div button.narrowOnly.active::after,
  .recruit > header > div button.narrowOnly.active::after {
    transform: rotate(-45deg);
  }
  #recruit > preference > header > div nav,
  #recruit > header > div nav, .recruit > preference > header > div nav,
  .recruit > header > div nav {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 56px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    height: calc(100vh - 56px);
    height: calc(var(--vh, 1vh) * 100 - 56px);
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 4px;
    background: #fff;
  }
  #recruit > preference > header > div nav a, #recruit > preference > header > div nav button,
  #recruit > header > div nav a,
  #recruit > header > div nav button, .recruit > preference > header > div nav a, .recruit > preference > header > div nav button,
  .recruit > header > div nav a,
  .recruit > header > div nav button {
    margin-right: 0;
    width: 100%;
    font-size: 20px;
    font-weight: 400;
    line-height: 70px;
    text-align: left;
    background-repeat: no-repeat;
    background-position: right center;
  }
  #recruit > preference > header > div nav a:first-child, #recruit > preference > header > div nav button:first-child,
  #recruit > header > div nav a:first-child,
  #recruit > header > div nav button:first-child, .recruit > preference > header > div nav a:first-child, .recruit > preference > header > div nav button:first-child,
  .recruit > header > div nav a:first-child,
  .recruit > header > div nav button:first-child {
    background-image: url("../images/shinyoungRecruit/iconMobileMenu1.svg");
  }
  #recruit > preference > header > div nav a:nth-child(2), #recruit > preference > header > div nav button:nth-child(2),
  #recruit > header > div nav a:nth-child(2),
  #recruit > header > div nav button:nth-child(2), .recruit > preference > header > div nav a:nth-child(2), .recruit > preference > header > div nav button:nth-child(2),
  .recruit > header > div nav a:nth-child(2),
  .recruit > header > div nav button:nth-child(2) {
    background-image: url("../images/shinyoungRecruit/iconMobileMenu2.svg");
  }
  #recruit > preference > header > div nav a:nth-child(3), #recruit > preference > header > div nav button:nth-child(3),
  #recruit > header > div nav a:nth-child(3),
  #recruit > header > div nav button:nth-child(3), .recruit > preference > header > div nav a:nth-child(3), .recruit > preference > header > div nav button:nth-child(3),
  .recruit > header > div nav a:nth-child(3),
  .recruit > header > div nav button:nth-child(3) {
    background-image: url("../images/shinyoungRecruit/iconMobileMenu3.svg");
  }
  #recruit > preference > header > div nav a:nth-child(4), #recruit > preference > header > div nav button:nth-child(4),
  #recruit > header > div nav a:nth-child(4),
  #recruit > header > div nav button:nth-child(4), .recruit > preference > header > div nav a:nth-child(4), .recruit > preference > header > div nav button:nth-child(4),
  .recruit > header > div nav a:nth-child(4),
  .recruit > header > div nav button:nth-child(4) {
    background-image: url("../images/shinyoungRecruit/iconMobileMenu4.svg");
  }
  #recruit > preference > header > div nav a,
  #recruit > header > div nav a, .recruit > preference > header > div nav a,
  .recruit > header > div nav a {
    border-bottom: 1px solid #f2f2f2;
  }
}
#recruit .container, .recruit .container {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #recruit .container, .recruit .container {
    padding-top: 100px;
  }
}
@media (max-width: 1024px) {
  #recruit .container, .recruit .container {
    padding-top: 47px;
  }
}
#recruit .container h2, .recruit .container h2 {
  font-weight: 400;
}
@media (max-width: 1024px) {
  #recruit .container h2.case, #recruit .container h2.case2, .recruit .container h2.case, .recruit .container h2.case2 {
    font-weight: 700;
  }
  #recruit .container h2.case, .recruit .container h2.case {
    font-size: 26px;
  }
}
#recruit .container .board, .recruit .container .board {
  padding-left: 0;
  padding-right: 0;
}
#recruit .container .board .selectBox, .recruit .container .board .selectBox {
  position: relative;
}
#recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  color: #212121;
}
#recruit .container .board .selectBox > button:not(.placeholder):not(.active), .recruit .container .board .selectBox > button:not(.placeholder):not(.active) {
  font-weight: 700;
}
#recruit .container .board .selectBox > button::after, .recruit .container .board .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
}
#recruit .container .board .selectBox > button.placeholder, .recruit .container .board .selectBox > button.placeholder {
  color: #a5a5a5;
}
#recruit .container .board .selectBox > button.active, .recruit .container .board .selectBox > button.active {
  color: #4415a0;
}
#recruit .container .board .selectBox > button.active::after, .recruit .container .board .selectBox > button.active::after {
  border-color: #4415a0;
}
#recruit .container .board .selectBox > div, .recruit .container .board .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#recruit .container .board .selectBox > div::before, .recruit .container .board .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
}
#recruit .container .board .selectBox > div button, .recruit .container .board .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
#recruit .container .board .selectBox > div button.selected, .recruit .container .board .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .container .board .selectBox > div > button:first-child, .recruit .container .board .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  #recruit .container .board .selectBox > div > button:last-child, .recruit .container .board .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  #recruit .container .board .selectBox > button,
  #recruit .container .board .selectBox > div button, .recruit .container .board .selectBox > button,
  .recruit .container .board .selectBox > div button {
    padding-left: 10%;
  }
  #recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button {
    height: 80px;
  }
  #recruit .container .board .selectBox > button::after, .recruit .container .board .selectBox > button::after {
    right: 10%;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .selectBox > div > button:first-child, .recruit .container .board .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  #recruit .container .board .selectBox > div > button:last-child, .recruit .container .board .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
  #recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button {
    height: 50px;
  }
  #recruit .container .board .selectBox > button::after, .recruit .container .board .selectBox > button::after {
    right: 5px;
  }
}
@media (min-width: 1025px) {
  #recruit .container .board .selectBox, .recruit .container .board .selectBox {
    margin: 37px 0 60px;
    width: 400px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .board .selectBox, .recruit .container .board .selectBox {
    margin: 13px 0 20px;
  }
}
#recruit .container .board .selectBox > button, .recruit .container .board .selectBox > button {
  opacity: 0.7;
  font-weight: 400 !important;
}
#recruit .container .list > li, .recruit .container .list > li {
  position: relative;
  border: 1px solid #c8c8c8;
}
#recruit .container .list > li:hover, .recruit .container .list > li:hover {
  border-color: #4415a0;
}
#recruit .container .list > li > button, .recruit .container .list > li > button {
  position: absolute;
  background: #4415a0;
  text-align: center;
  color: #fff;
}
#recruit .container .list > li > span, .recruit .container .list > li > span {
  color: #212121;
}
#recruit .container .list > li > ul, .recruit .container .list > li > ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  font-weight: 300;
  color: #666;
}
#recruit .container .list > li > ul li, .recruit .container .list > li > ul li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .container .list > li > ul li + li::before, .recruit .container .list > li > ul li + li::before {
  content: "";
  display: block;
  width: 1px;
  background: #707070;
  opacity: 0.5;
}
#recruit .container .list > li > p, .recruit .container .list > li > p {
  word-break: keep-all;
}
#recruit .container .list > li > div, .recruit .container .list > li > div {
  background: #f9f9f9;
}
#recruit .container .list > li > div ul, .recruit .container .list > li > div ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .container .list > li > div ul li, .recruit .container .list > li > div ul li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .container .list > li > div ul li:first-child, .recruit .container .list > li > div ul li:first-child {
  color: #212121;
}
#recruit .container .list > li > div ul li:first-child::after, .recruit .container .list > li > div ul li:first-child::after {
  content: "";
  display: block;
  width: 1px;
  background: #707070;
  opacity: 0.5;
}
#recruit .container .list > li > div div, .recruit .container .list > li > div div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 1025px) {
  #recruit .container .list > li, .recruit .container .list > li {
    padding: 55px 100px 50px;
  }
  #recruit .container .list > li + li, .recruit .container .list > li + li {
    margin-top: 20px;
  }
  #recruit .container .list > li > button, .recruit .container .list > li > button {
    right: 100px;
    top: 50px;
    width: 153px;
    height: 50px;
    border-radius: 25px;
    font-size: 16px;
  }
  #recruit .container .list > li > ul, .recruit .container .list > li > ul {
    margin-top: 33px;
  }
  #recruit .container .list > li > ul li + li::before, .recruit .container .list > li > ul li + li::before {
    margin: 0 15px;
    height: 17px;
  }
  #recruit .container .list > li > p, .recruit .container .list > li > p {
    margin-top: 18px;
  }
  #recruit .container .list > li > p a:hover, .recruit .container .list > li > p a:hover {
    color: #4415a0;
  }
  #recruit .container .list > li > div, .recruit .container .list > li > div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
    padding: 30px 40px;
  }
  #recruit .container .list > li > div ul li::after, .recruit .container .list > li > div ul li::after {
    margin: 0 20px;
    height: 16px;
  }
  #recruit .container .list > li > div div * + *, .recruit .container .list > li > div div * + * {
    margin-left: 33px;
  }
  #recruit .container .list > li > div div *:hover, .recruit .container .list > li > div div *:hover {
    color: #4415a0;
  }
}
@media (max-width: 1024px) {
  #recruit .container .list > li, .recruit .container .list > li {
    padding: 83px 20px 30px;
  }
  #recruit .container .list > li + li, .recruit .container .list > li + li {
    margin-top: 15px;
  }
  #recruit .container .list > li > button, .recruit .container .list > li > button {
    top: 20px;
    right: 20px;
    width: 142px;
    height: 44px;
    border-radius: 22px;
    font-size: 14px;
  }
  #recruit .container .list > li > ul, .recruit .container .list > li > ul {
    margin-top: 18px;
  }
  #recruit .container .list > li > ul li + li::before, .recruit .container .list > li > ul li + li::before {
    margin: 0 10px;
    height: 14px;
  }
  #recruit .container .list > li > p, .recruit .container .list > li > p {
    margin-top: 10px;
  }
  #recruit .container .list > li > div, .recruit .container .list > li > div {
    margin-top: 20px;
    padding: 20px 15px;
  }
  #recruit .container .list > li > div ul li::after, .recruit .container .list > li > div ul li::after {
    margin: 0 10px;
    height: 14px;
  }
  #recruit .container .list > li > div div, .recruit .container .list > li > div div {
    margin-top: 18px;
  }
  #recruit .container .list > li > div div * + *, .recruit .container .list > li > div div * + * {
    margin-left: 40px;
  }
}
#recruit .container .tab, .recruit .container .tab {
  top: 0;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 20px + 20px);
}
@media (min-width: 1025px) {
  #recruit .container .tab, .recruit .container .tab {
    margin-top: 87px;
    margin-bottom: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .tab, .recruit .container .tab {
    margin-top: 30px;
    margin-bottom: 25px;
  }
}
#recruit .container .tabTarget, .recruit .container .tabTarget {
  padding-left: 0;
  padding-right: 0;
}
#recruit .container #faq ul li, .recruit .container #faq ul li {
  border-bottom: 1px solid #c8c8c8;
}
#recruit .container #faq ul li > button, .recruit .container #faq ul li > button {
  position: relative;
  width: 100%;
  text-align: left;
  font-weight: 700;
  word-break: keep-all;
  color: #212121;
}
#recruit .container #faq ul li > button::after, .recruit .container #faq ul li > button::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 18px;
  height: 10px;
  background: url("../images/icon/iconArrow2.svg") no-repeat center;
}
@media (min-width: 1025px) {
  #recruit .container #faq ul li > button::after, .recruit .container #faq ul li > button::after {
    right: 15px;
  }
}
@media (max-width: 1024px) {
  #recruit .container #faq ul li > button::after, .recruit .container #faq ul li > button::after {
    right: 20px;
  }
}
#recruit .container #faq ul li > button:not(.on)::after, .recruit .container #faq ul li > button:not(.on)::after {
  transform: rotate(180deg);
}
@media (min-width: 1025px) {
  #recruit .container #faq ul li > button, .recruit .container #faq ul li > button {
    padding: 40px 55px 40px 0;
  }
}
@media (max-width: 1024px) {
  #recruit .container #faq ul li > button, .recruit .container #faq ul li > button {
    padding: 25px 55px 25px 0;
  }
}
#recruit .container #faq ul li > div, .recruit .container #faq ul li > div {
  display: none;
  border-top: 1px solid #212121;
}
@media (min-width: 1025px) {
  #recruit .container #faq ul li > div, .recruit .container #faq ul li > div {
    padding: 40px 0;
  }
}
@media (max-width: 1024px) {
  #recruit .container #faq ul li > div, .recruit .container #faq ul li > div {
    padding: 20px 0 25px;
  }
}
@media (min-width: 1025px) {
  #recruit .container #inquiry, .recruit .container #inquiry {
    padding-top: 40px;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry, .recruit .container #inquiry {
    padding-top: 20px;
  }
}
#recruit .container #inquiry div.inquiry a, .recruit .container #inquiry div.inquiry a {
  position: relative;
  display: block;
  border: 1px solid #c8c8c8;
}
#recruit .container #inquiry div.inquiry a:hover, .recruit .container #inquiry div.inquiry a:hover {
  border-color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .container #inquiry div.inquiry a, .recruit .container #inquiry div.inquiry a {
    padding: 48px 200px 43px 70px;
  }
  #recruit .container #inquiry div.inquiry a + a, .recruit .container #inquiry div.inquiry a + a {
    margin-top: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry div.inquiry a, .recruit .container #inquiry div.inquiry a {
    padding: 105px 20px 30px;
  }
  #recruit .container #inquiry div.inquiry a + a, .recruit .container #inquiry div.inquiry a + a {
    margin-top: 15px;
  }
}
#recruit .container #inquiry div.inquiry a em, .recruit .container #inquiry div.inquiry a em {
  position: absolute;
  overflow: hidden;
  border-radius: 50%;
  text-align: center;
}
#recruit .container #inquiry div.inquiry a em.type01, .recruit .container #inquiry div.inquiry a em.type01 {
  background: #f9f9f9;
  color: #666;
}
#recruit .container #inquiry div.inquiry a em.type02, .recruit .container #inquiry div.inquiry a em.type02 {
  background: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .container #inquiry div.inquiry a em, .recruit .container #inquiry div.inquiry a em {
    right: 80px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 110px;
    height: 110px;
    font-size: 20px;
    line-height: 110px;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry div.inquiry a em, .recruit .container #inquiry div.inquiry a em {
    top: 30px;
    right: 20px;
    width: 60px;
    height: 60px;
    font-size: 14px;
    line-height: 60px;
  }
}
#recruit .container #inquiry div.inquiry a p, .recruit .container #inquiry div.inquiry a p {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #recruit .container #inquiry div.inquiry a p, .recruit .container #inquiry div.inquiry a p {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry div.inquiry a p, .recruit .container #inquiry div.inquiry a p {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
}
#recruit .container #inquiry div.inquiry a span, .recruit .container #inquiry div.inquiry a span {
  display: block;
  margin-top: 23px;
  color: #666;
}
@media (min-width: 1025px) {
  #recruit .container #inquiry div.inquiry a span, .recruit .container #inquiry div.inquiry a span {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry div.inquiry a span, .recruit .container #inquiry div.inquiry a span {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
}
@media (min-width: 1025px) {
  #recruit .container #inquiry div.inquiry, .recruit .container #inquiry div.inquiry {
    margin-top: 40px;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry div.inquiry, .recruit .container #inquiry div.inquiry {
    margin-top: 20px;
  }
}
#recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry {
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 1025px) {
  #recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry {
    margin-top: 80px;
    padding-top: 88px;
    border-top: 1px solid #c8c8c8;
  }
}
@media (max-width: 1024px) {
  #recruit .container #inquiry form.inquiry, .recruit .container #inquiry form.inquiry {
    padding-top: 44px;
  }
}
#recruit .container .myinfoInfo, .recruit .container .myinfoInfo {
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 1025px) {
  #recruit .container .myinfoInfo, .recruit .container .myinfoInfo {
    padding-top: 100px;
  }
  #recruit .container .myinfoInfo > ul li img, .recruit .container .myinfoInfo > ul li img {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 1024px) {
  #recruit .container .myinfoInfo, .recruit .container .myinfoInfo {
    padding-top: 40px;
  }
}
#recruit .form, .recruit .form {
  padding-left: 0;
  padding-right: 0;
}
#recruit .form .passwordInfo, .recruit .form .passwordInfo {
  background: #f9f9f9;
}
#recruit .form .phone button, .recruit .form .phone button {
  border-radius: 4px;
  background: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .form, .recruit .form {
    margin-top: 88px;
  }
  #recruit .form .passwordInfo, .recruit .form .passwordInfo {
    margin-top: 40px;
    padding: 25px 20px;
  }
  #recruit .form .phone button, .recruit .form .phone button {
    margin-left: 10px;
    width: 120px;
    height: 54px;
  }
}
@media (max-width: 1024px) {
  #recruit .form, .recruit .form {
    margin-top: 45px;
  }
  #recruit .form .passwordInfo, .recruit .form .passwordInfo {
    margin-top: 15px;
    padding: 15px;
  }
  #recruit .form .phone button, .recruit .form .phone button {
    margin-left: 10px;
    width: 110px;
    height: 40px;
  }
}
@media (max-width: 480px) {
  #recruit .form > section .phone, .recruit .form > section .phone {
    flex-wrap: wrap;
  }
  #recruit .form > section .phone button, .recruit .form > section .phone button {
    margin-top: 10px;
    margin-left: 0;
    width: 100%;
  }
}
#recruit .selectjob > header, .recruit .selectjob > header {
  border-bottom: 1px solid #212121;
}
@media (min-width: 1025px) {
  #recruit .selectjob > header, .recruit .selectjob > header {
    padding-bottom: 40px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob > header, .recruit .selectjob > header {
    padding-bottom: 20px;
  }
}
#recruit .selectjob > header h1, .recruit .selectjob > header h1 {
  font-weight: 400;
  word-break: keep-all;
}
#recruit .selectjob > header h1 span, .recruit .selectjob > header h1 span {
  display: block;
}
@media (min-width: 1025px) {
  #recruit .selectjob > header h1 span, .recruit .selectjob > header h1 span {
    margin-top: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob > header h1 span, .recruit .selectjob > header h1 span {
    margin-top: 26px;
  }
}
#recruit .selectjob > header.caseWidth, .recruit .selectjob > header.caseWidth {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 0;
  border-bottom: 0;
}
#recruit .selectjob > header.caseWidth > div, .recruit .selectjob > header.caseWidth > div {
  border-bottom: 1px solid #212121;
  padding-bottom: 20px;
}
@media (min-width: 1025px) {
  #recruit .selectjob > header.caseWidth, .recruit .selectjob > header.caseWidth {
    margin-top: 110px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob > header.caseWidth, .recruit .selectjob > header.caseWidth {
    margin-top: 52px;
  }
}
#recruit .selectjob .form.case, .recruit .selectjob .form.case {
  max-width: unset;
  padding-right: 20px;
  padding-left: 20px;
}
#recruit .selectjob .form.case section, .recruit .selectjob .form.case section {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form.case > section, .recruit .selectjob .form.case > section {
    padding-bottom: 60px;
  }
}
#recruit .selectjob .form .terms section h2, .recruit .selectjob .form .terms section h2 {
  font-size: unset;
  line-height: unset;
}
#recruit .selectjob .form > section::after, .recruit .selectjob .form > section::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
#recruit .selectjob .form .shortcut, .recruit .selectjob .form .shortcut {
  z-index: 2;
  position: sticky;
  top: 0;
  margin-left: -20px;
  margin-right: -20px;
  background: #4b4e83;
}
#recruit .selectjob .form .shortcut .btn, .recruit .selectjob .form .shortcut .btn {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}
#recruit .selectjob .form .shortcut .btn > button, .recruit .selectjob .form .shortcut .btn > button {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  color: #fff;
}
#recruit .selectjob .form .shortcut .btn > button::after, .recruit .selectjob .form .shortcut .btn > button::after {
  content: "";
  display: block;
  background: url("../images/icon/iconArrowInvert.svg") no-repeat center;
  background-size: 100% auto;
}
#recruit .selectjob .form .shortcut .btn > button:not(.on)::after, .recruit .selectjob .form .shortcut .btn > button:not(.on)::after {
  transform: rotate(180deg);
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .shortcut .btn > button, .recruit .selectjob .form .shortcut .btn > button {
    min-width: 100px;
    font-size: 16px;
    line-height: 80px;
  }
  #recruit .selectjob .form .shortcut .btn > button::after, .recruit .selectjob .form .shortcut .btn > button::after {
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .shortcut .btn > button, .recruit .selectjob .form .shortcut .btn > button {
    width: 100%;
    font-size: 18px;
    line-height: 65px;
  }
  #recruit .selectjob .form .shortcut .btn > button::after, .recruit .selectjob .form .shortcut .btn > button::after {
    width: 32px;
    height: 32px;
  }
}
#recruit .selectjob .form .shortcut .toggle, .recruit .selectjob .form .shortcut .toggle {
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .shortcut .btn, .recruit .selectjob .form .shortcut .btn {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #recruit .selectjob .form .shortcut ul.wideOnly, .recruit .selectjob .form .shortcut ul.wideOnly {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    font-size: 16px;
    color: #fff;
  }
  #recruit .selectjob .form .shortcut ul.wideOnly li + li, .recruit .selectjob .form .shortcut ul.wideOnly li + li {
    margin-left: 40px;
    padding-left: 40px;
    border-left: 1px solid #fff;
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button, .recruit .selectjob .form .shortcut ul.wideOnly button {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button::before, .recruit .selectjob .form .shortcut ul.wideOnly button::before {
    content: "";
    margin-right: 15px;
    width: 26px;
    height: 26px;
    background-repeat: no-repeat;
    background-position: center top;
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button.del::before, .recruit .selectjob .form .shortcut ul.wideOnly button.del::before {
    background-image: url("../images/shinyoungRecruit/iconDel.svg");
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button.save::before, .recruit .selectjob .form .shortcut ul.wideOnly button.save::before {
    background-image: url("../images/shinyoungRecruit/iconSave.svg");
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button.preview::before, .recruit .selectjob .form .shortcut ul.wideOnly button.preview::before {
    background-image: url("../images/shinyoungRecruit/iconPreview.svg");
  }
  #recruit .selectjob .form .shortcut ul.wideOnly button.apply::before, .recruit .selectjob .form .shortcut ul.wideOnly button.apply::before {
    background-image: url("../images/shinyoungRecruit/iconApply.svg");
  }
  #recruit .selectjob .form .shortcut .toggle, .recruit .selectjob .form .shortcut .toggle {
    width: 100%;
    background: #f8f8f8;
  }
  #recruit .selectjob .form .shortcut .toggle > div, .recruit .selectjob .form .shortcut .toggle > div {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 14px;
    padding-bottom: 35px;
    font-size: 16px;
  }
  #recruit .selectjob .form .shortcut .toggle > div button, .recruit .selectjob .form .shortcut .toggle > div button {
    position: relative;
    margin-top: 26px;
  }
  #recruit .selectjob .form .shortcut .toggle > div button:not(.selected), .recruit .selectjob .form .shortcut .toggle > div button:not(.selected) {
    opacity: 0.7;
  }
  #recruit .selectjob .form .shortcut .toggle > div button.selected::before, .recruit .selectjob .form .shortcut .toggle > div button.selected::before {
    content: "";
    display: block;
    position: absolute;
    left: -14px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 4px;
    height: 4px;
    background: #4415a0;
    border-radius: 50%;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .shortcut .toggle, .recruit .selectjob .form .shortcut .toggle {
    padding: 26px 20px 30px;
    background: #f8f8f8;
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly, .recruit .selectjob .form .shortcut .toggle ul.middleOnly {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20px;
    border-bottom: 1px dashed rgba(102, 102, 102, 0.5);
    font-size: 14px;
    text-align: center;
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li {
    position: relative;
    width: 80px;
    max-width: 25%;
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li button, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li button {
    padding-top: 45px;
    white-space: nowrap;
    text-align: center;
    background-position: center top;
    background-repeat: no-repeat;
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.del, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.del {
    background-image: url("../images/shinyoungRecruit/iconDel2.svg");
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.save, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.save {
    background-image: url("../images/shinyoungRecruit/iconSave2.svg");
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.preview, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.preview {
    background-image: url("../images/shinyoungRecruit/iconPreview2.svg");
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.apply, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li button.apply {
    background-image: url("../images/shinyoungRecruit/iconApply2.svg");
  }
  #recruit .selectjob .form .shortcut .toggle ul.middleOnly li + li::before, .recruit .selectjob .form .shortcut .toggle ul.middleOnly li + li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 20px;
    background: rgba(102, 102, 102, 0.6);
  }
  #recruit .selectjob .form .shortcut .toggle > div, .recruit .selectjob .form .shortcut .toggle > div {
    margin-top: 30px;
    font-size: 18px;
    overflow: auto;
    max-height: calc(100vh - 215px);
    max-height: calc(var(--vh, 1vh) * 100 - 215px);
  }
  #recruit .selectjob .form .shortcut .toggle > div button, .recruit .selectjob .form .shortcut .toggle > div button {
    position: relative;
    padding-left: 20px;
  }
  #recruit .selectjob .form .shortcut .toggle > div button:not(.selected), .recruit .selectjob .form .shortcut .toggle > div button:not(.selected) {
    opacity: 0.7;
  }
  #recruit .selectjob .form .shortcut .toggle > div button:not(:first-of-type), .recruit .selectjob .form .shortcut .toggle > div button:not(:first-of-type) {
    margin-top: 25px;
  }
  #recruit .selectjob .form .shortcut .toggle > div button.selected::before, .recruit .selectjob .form .shortcut .toggle > div button.selected::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #4415a0;
  }
}
#recruit .selectjob .form .application, .recruit .selectjob .form .application {
  padding-left: 0;
  padding-right: 0;
  max-width: unset;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application > section:first-of-type, .recruit .selectjob .form .application > section:first-of-type {
    margin-top: 60px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application > section:first-of-type, .recruit .selectjob .form .application > section:first-of-type {
    margin-top: 45px;
  }
}
#recruit .selectjob .form .application > section::after, .recruit .selectjob .form .application > section::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
#recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box {
  background: #f9f9f9;
  border-radius: 4px;
}
#recruit .selectjob .form .application .box.case, .recruit .selectjob .form .application .box.case {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .box.case, .recruit .selectjob .form .application .box.case {
    padding: 25px 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .box.case, .recruit .selectjob .form .application .box.case {
    padding: 15px;
  }
}
#recruit .selectjob .form .application .box.case::before, .recruit .selectjob .form .application .box.case::before {
  content: "※";
  margin-right: 10px;
}
#recruit .selectjob .form .application .box .underline, .recruit .selectjob .form .application .box .underline {
  text-decoration: underline;
}
#recruit .selectjob .form .application .box .btn, .recruit .selectjob .form .application .box .btn {
  border: 1px solid #c1c1c1;
  background: #fff;
  text-align: center;
}
#recruit .selectjob .form .application .box .btn:hover, .recruit .selectjob .form .application .box .btn:hover {
  background: #4415a0;
  border-color: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .box .btn, .recruit .selectjob .form .application .box .btn {
    margin-left: 60px;
    width: 150px;
    height: 44px;
    line-height: 42px;
    border-radius: 22px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .box .btn, .recruit .selectjob .form .application .box .btn {
    display: block;
    margin: 13px auto 0;
    width: 128px;
    height: 40px;
    line-height: 38px;
    border-radius: 20px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    padding: 17px 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .box, .recruit .selectjob .form .application .box {
    padding: 15px;
  }
}
#recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2 {
  background: #f9f9f9;
  border-radius: 4px;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2 {
    padding: 25px 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .box2, .recruit .selectjob .form .application .box2 {
    padding: 15px;
  }
}
#recruit .selectjob .form .application .box2 li, .recruit .selectjob .form .application .box2 li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#recruit .selectjob .form .application .box2 li::before, .recruit .selectjob .form .application .box2 li::before {
  content: "※";
  margin-right: 10px;
}
#recruit .selectjob .form .application .box2 li + li, .recruit .selectjob .form .application .box2 li + li {
  margin-top: 10px;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .input + .input, .recruit .selectjob .form .application .input + .input {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .input + .input, .recruit .selectjob .form .application .input + .input {
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application div.case1 .label,
#recruit .selectjob .form .application div.case2 .label, .recruit .selectjob .form .application div.case1 .label,
.recruit .selectjob .form .application div.case2 .label {
  display: block;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application div.case1 .label,
  #recruit .selectjob .form .application div.case2 .label, .recruit .selectjob .form .application div.case1 .label,
  .recruit .selectjob .form .application div.case2 .label {
    margin-top: 20px;
  }
}
#recruit .selectjob .form .application div.case1, .recruit .selectjob .form .application div.case1 {
  position: relative;
}
#recruit .selectjob .form .application div.case1 .photo, .recruit .selectjob .form .application div.case1 .photo {
  position: relative;
  display: block;
  border-radius: 4px;
  border: 1px dashed #c8c8c8;
  font-size: 16px;
  color: #666;
}
#recruit .selectjob .form .application div.case1 .photo input, .recruit .selectjob .form .application div.case1 .photo input {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#recruit .selectjob .form .application div.case1 .photo::before, .recruit .selectjob .form .application div.case1 .photo::before {
  content: "";
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 30px;
  height: 30px;
  background: url("../images/shinyoungRecruit/iconPlus.svg") no-repeat center;
}
#recruit .selectjob .form .application div.case1 .photo p, .recruit .selectjob .form .application div.case1 .photo p {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  line-height: 22px;
  text-align: center;
}
#recruit .selectjob .form .application div.case1 .photo img, .recruit .selectjob .form .application div.case1 .photo img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
#recruit .selectjob .form .application div.case1 .name::after, .recruit .selectjob .form .application div.case1 .name::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application div.case1 .name, .recruit .selectjob .form .application div.case1 .name {
    padding-top: 10px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application div.case1 .name .input, .recruit .selectjob .form .application div.case1 .name .input {
    float: left;
  }
  #recruit .selectjob .form .application div.case1 .name .input:first-of-type, .recruit .selectjob .form .application div.case1 .name .input:first-of-type {
    width: calc(30% - 5px);
  }
  #recruit .selectjob .form .application div.case1 .name .input:last-of-type, .recruit .selectjob .form .application div.case1 .name .input:last-of-type {
    margin-left: 10px;
    width: calc(70% - 5px);
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application div.case1 .name .input + .input, .recruit .selectjob .form .application div.case1 .name .input + .input {
    margin-top: 5px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application div.case1, .recruit .selectjob .form .application div.case1 {
    margin-top: 40px;
    margin-bottom: 45px;
    min-height: 252px;
    padding-left: 220px;
  }
  #recruit .selectjob .form .application div.case1 .photo, .recruit .selectjob .form .application div.case1 .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 252px;
    padding: 25px 20px;
  }
  #recruit .selectjob .form .application div.case1 .personalInfo, .recruit .selectjob .form .application div.case1 .personalInfo {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
  }
  #recruit .selectjob .form .application div.case1 .personalInfo > div, .recruit .selectjob .form .application div.case1 .personalInfo > div {
    float: left;
  }
  #recruit .selectjob .form .application div.case1 .personalInfo > div:first-child, .recruit .selectjob .form .application div.case1 .personalInfo > div:first-child {
    width: 125px;
  }
  #recruit .selectjob .form .application div.case1 .personalInfo > div:nth-child(2), .recruit .selectjob .form .application div.case1 .personalInfo > div:nth-child(2) {
    width: 150px;
  }
  #recruit .selectjob .form .application div.case1 .personalInfo > div:last-child, .recruit .selectjob .form .application div.case1 .personalInfo > div:last-child {
    width: calc(100% - 295px);
  }
  #recruit .selectjob .form .application div.case1 .input, .recruit .selectjob .form .application div.case1 .input {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application div.case1, .recruit .selectjob .form .application div.case1 {
    margin-top: 15px;
  }
  #recruit .selectjob .form .application div.case1 .photo, .recruit .selectjob .form .application div.case1 .photo {
    margin: 0 auto;
    width: 140px;
    height: 200px;
    padding: 15px 10px 20px;
  }
  #recruit .selectjob .form .application div.case1 .input, .recruit .selectjob .form .application div.case1 .input {
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application div.case2::after, .recruit .selectjob .form .application div.case2::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
#recruit .selectjob .form .application .radios,
#recruit .selectjob .form .application .radios2, .recruit .selectjob .form .application .radios,
.recruit .selectjob .form .application .radios2 {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .radios.case,
  #recruit .selectjob .form .application .radios2.case, .recruit .selectjob .form .application .radios.case,
  .recruit .selectjob .form .application .radios2.case {
    padding-bottom: 37px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .radios.case label,
  #recruit .selectjob .form .application .radios2.case label, .recruit .selectjob .form .application .radios.case label,
  .recruit .selectjob .form .application .radios2.case label {
    min-width: 100px;
    max-width: 100px;
    margin-left: 0 !important;
    margin-right: 10px;
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application .radios label,
#recruit .selectjob .form .application .radios2 label, .recruit .selectjob .form .application .radios label,
.recruit .selectjob .form .application .radios2 label {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
  cursor: pointer;
}
#recruit .selectjob .form .application .radios label + label,
#recruit .selectjob .form .application .radios2 label + label, .recruit .selectjob .form .application .radios label + label,
.recruit .selectjob .form .application .radios2 label + label {
  margin-left: 10px;
}
#recruit .selectjob .form .application .radios label input,
#recruit .selectjob .form .application .radios2 label input, .recruit .selectjob .form .application .radios label input,
.recruit .selectjob .form .application .radios2 label input {
  position: absolute;
  display: inline-block;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
#recruit .selectjob .form .application .radios label span,
#recruit .selectjob .form .application .radios2 label span, .recruit .selectjob .form .application .radios label span,
.recruit .selectjob .form .application .radios2 label span {
  display: block;
  width: 100%;
  border: 1px solid #a5a5a5;
  border-radius: 4px;
  text-align: center;
  color: #a5a5a5;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .radios label span,
  #recruit .selectjob .form .application .radios2 label span, .recruit .selectjob .form .application .radios label span,
  .recruit .selectjob .form .application .radios2 label span {
    line-height: 52px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .radios label span,
  #recruit .selectjob .form .application .radios2 label span, .recruit .selectjob .form .application .radios label span,
  .recruit .selectjob .form .application .radios2 label span {
    line-height: 38px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .radios,
  #recruit .selectjob .form .application .radios2, .recruit .selectjob .form .application .radios,
  .recruit .selectjob .form .application .radios2 {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .radios,
  #recruit .selectjob .form .application .radios2, .recruit .selectjob .form .application .radios,
  .recruit .selectjob .form .application .radios2 {
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application .radios input:checked + span, .recruit .selectjob .form .application .radios input:checked + span {
  border-color: #4415a0;
  color: #4415a0;
}
#recruit .selectjob .form .application .radios2 input:checked + span, .recruit .selectjob .form .application .radios2 input:checked + span {
  border-color: #4415a0;
  background-color: #4415a0;
  color: #fff;
}
#recruit .selectjob .form .application .salary, .recruit .selectjob .form .application .salary {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .selectjob .form .application .salary label, #recruit .selectjob .form .application .salary .label, .recruit .selectjob .form .application .salary label, .recruit .selectjob .form .application .salary .label {
  width: 100%;
}
#recruit .selectjob .form .application .salary .input, .recruit .selectjob .form .application .salary .input {
  width: calc(100% - 40px);
}
#recruit .selectjob .form .application .salary span, .recruit .selectjob .form .application .salary span {
  width: 40px;
  text-align: right;
  color: #212121;
}
#recruit .selectjob .form .application p + .half, .recruit .selectjob .form .application p + .half {
  margin-left: 0 !important;
}
#recruit .selectjob .form .application .edu::after, .recruit .selectjob .form .application .edu::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .edu, .recruit .selectjob .form .application .edu {
    margin: 45px 0 60px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .edu, .recruit .selectjob .form .application .edu {
    margin: 20px 0 40px;
  }
}
#recruit .selectjob .form .application .edu h3, .recruit .selectjob .form .application .edu h3 {
  font-weight: 500;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .edu h3, .recruit .selectjob .form .application .edu h3 {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
    padding-bottom: 37px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .edu h3, .recruit .selectjob .form .application .edu h3 {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}
#recruit .selectjob .form .application .edu .half .radios, .recruit .selectjob .form .application .edu .half .radios {
  margin-top: 0 !important;
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .edu .half .half, .recruit .selectjob .form .application .edu .half .half {
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application .edu div.case, .recruit .selectjob .form .application .edu div.case {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#recruit .selectjob .form .application .edu div.case .input,
#recruit .selectjob .form .application .edu div.case .selectBox, .recruit .selectjob .form .application .edu div.case .input,
.recruit .selectjob .form .application .edu div.case .selectBox {
  width: calc(50% - 12px);
}
#recruit .selectjob .form .application .eduBtns, .recruit .selectjob .form .application .eduBtns {
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  background: #f9f9f9;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .eduBtns, .recruit .selectjob .form .application .eduBtns {
    padding: 25px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .eduBtns, .recruit .selectjob .form .application .eduBtns {
    margin-left: -20px;
    margin-right: -20px;
    padding: 30px 20px;
  }
}
#recruit .selectjob .form .application .eduBtns button, .recruit .selectjob .form .application .eduBtns button {
  width: 150px;
  height: 40px;
  border: 1px solid #c8c8c8;
  background: #fff;
  border-radius: 20px;
  font-size: 16px;
}
#recruit .selectjob .form .application .eduBtns button:hover, .recruit .selectjob .form .application .eduBtns button:hover {
  background: #4415a0;
  color: #fff;
  border-color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .eduBtns button + button, .recruit .selectjob .form .application .eduBtns button + button {
    margin-left: 15px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .eduBtns button + button, .recruit .selectjob .form .application .eduBtns button + button {
    margin-left: 10px;
  }
}
#recruit .selectjob .form .application .btnDel, .recruit .selectjob .form .application .btnDel {
  clear: both;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: stretch;
  align-items: center;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .btnDel, .recruit .selectjob .form .application .btnDel {
    padding-top: 40px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .btnDel, .recruit .selectjob .form .application .btnDel {
    padding-top: 30px;
  }
}
#recruit .selectjob .form .application .btnDel button, .recruit .selectjob .form .application .btnDel button {
  width: 108px;
  height: 40px;
  border: 1px solid #c8c8c8;
  border-radius: 20px;
  font-size: 16px;
}
#recruit .selectjob .form .application .btnDel button:hover, .recruit .selectjob .form .application .btnDel button:hover {
  background: #4415a0;
  border-color: #4415a0;
  color: #fff;
}
#recruit .selectjob .form .application .btnDel::after, .recruit .selectjob .form .application .btnDel::after {
  content: "";
  width: calc(100% - 108px);
  height: 1px;
  background: #000;
}
#recruit .selectjob .form .application .languages,
#recruit .selectjob .form .application .licenses,
#recruit .selectjob .form .application .acts,
#recruit .selectjob .form .application .globalExp,
#recruit .selectjob .form .application .prizeExp,
#recruit .selectjob .form .application .expContainer,
#recruit .selectjob .form .application .exps, .recruit .selectjob .form .application .languages,
.recruit .selectjob .form .application .licenses,
.recruit .selectjob .form .application .acts,
.recruit .selectjob .form .application .globalExp,
.recruit .selectjob .form .application .prizeExp,
.recruit .selectjob .form .application .expContainer,
.recruit .selectjob .form .application .exps {
  clear: both;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .languages,
  #recruit .selectjob .form .application .licenses,
  #recruit .selectjob .form .application .acts,
  #recruit .selectjob .form .application .globalExp,
  #recruit .selectjob .form .application .prizeExp,
  #recruit .selectjob .form .application .expContainer,
  #recruit .selectjob .form .application .exps, .recruit .selectjob .form .application .languages,
  .recruit .selectjob .form .application .licenses,
  .recruit .selectjob .form .application .acts,
  .recruit .selectjob .form .application .globalExp,
  .recruit .selectjob .form .application .prizeExp,
  .recruit .selectjob .form .application .expContainer,
  .recruit .selectjob .form .application .exps {
    padding-top: 37px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .languages,
  #recruit .selectjob .form .application .licenses,
  #recruit .selectjob .form .application .acts,
  #recruit .selectjob .form .application .globalExp,
  #recruit .selectjob .form .application .prizeExp,
  #recruit .selectjob .form .application .expContainer,
  #recruit .selectjob .form .application .exps, .recruit .selectjob .form .application .languages,
  .recruit .selectjob .form .application .licenses,
  .recruit .selectjob .form .application .acts,
  .recruit .selectjob .form .application .globalExp,
  .recruit .selectjob .form .application .prizeExp,
  .recruit .selectjob .form .application .expContainer,
  .recruit .selectjob .form .application .exps {
    padding-top: 15px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .languages .box,
  #recruit .selectjob .form .application .languages .box2,
  #recruit .selectjob .form .application .licenses .box,
  #recruit .selectjob .form .application .licenses .box2,
  #recruit .selectjob .form .application .acts .box,
  #recruit .selectjob .form .application .acts .box2,
  #recruit .selectjob .form .application .globalExp .box,
  #recruit .selectjob .form .application .globalExp .box2,
  #recruit .selectjob .form .application .prizeExp .box,
  #recruit .selectjob .form .application .prizeExp .box2,
  #recruit .selectjob .form .application .expContainer .box,
  #recruit .selectjob .form .application .expContainer .box2,
  #recruit .selectjob .form .application .exps .box,
  #recruit .selectjob .form .application .exps .box2, .recruit .selectjob .form .application .languages .box,
  .recruit .selectjob .form .application .languages .box2,
  .recruit .selectjob .form .application .licenses .box,
  .recruit .selectjob .form .application .licenses .box2,
  .recruit .selectjob .form .application .acts .box,
  .recruit .selectjob .form .application .acts .box2,
  .recruit .selectjob .form .application .globalExp .box,
  .recruit .selectjob .form .application .globalExp .box2,
  .recruit .selectjob .form .application .prizeExp .box,
  .recruit .selectjob .form .application .prizeExp .box2,
  .recruit .selectjob .form .application .expContainer .box,
  .recruit .selectjob .form .application .expContainer .box2,
  .recruit .selectjob .form .application .exps .box,
  .recruit .selectjob .form .application .exps .box2 {
    margin-bottom: 40px;
  }
}
#recruit .selectjob .form .application .languages section.lang::after,
#recruit .selectjob .form .application .languages section.lcs::after,
#recruit .selectjob .form .application .languages section.act::after,
#recruit .selectjob .form .application .languages section.global::after,
#recruit .selectjob .form .application .languages section.prize::after,
#recruit .selectjob .form .application .languages section.exp::after,
#recruit .selectjob .form .application .licenses section.lang::after,
#recruit .selectjob .form .application .licenses section.lcs::after,
#recruit .selectjob .form .application .licenses section.act::after,
#recruit .selectjob .form .application .licenses section.global::after,
#recruit .selectjob .form .application .licenses section.prize::after,
#recruit .selectjob .form .application .licenses section.exp::after,
#recruit .selectjob .form .application .acts section.lang::after,
#recruit .selectjob .form .application .acts section.lcs::after,
#recruit .selectjob .form .application .acts section.act::after,
#recruit .selectjob .form .application .acts section.global::after,
#recruit .selectjob .form .application .acts section.prize::after,
#recruit .selectjob .form .application .acts section.exp::after,
#recruit .selectjob .form .application .globalExp section.lang::after,
#recruit .selectjob .form .application .globalExp section.lcs::after,
#recruit .selectjob .form .application .globalExp section.act::after,
#recruit .selectjob .form .application .globalExp section.global::after,
#recruit .selectjob .form .application .globalExp section.prize::after,
#recruit .selectjob .form .application .globalExp section.exp::after,
#recruit .selectjob .form .application .prizeExp section.lang::after,
#recruit .selectjob .form .application .prizeExp section.lcs::after,
#recruit .selectjob .form .application .prizeExp section.act::after,
#recruit .selectjob .form .application .prizeExp section.global::after,
#recruit .selectjob .form .application .prizeExp section.prize::after,
#recruit .selectjob .form .application .prizeExp section.exp::after,
#recruit .selectjob .form .application .expContainer section.lang::after,
#recruit .selectjob .form .application .expContainer section.lcs::after,
#recruit .selectjob .form .application .expContainer section.act::after,
#recruit .selectjob .form .application .expContainer section.global::after,
#recruit .selectjob .form .application .expContainer section.prize::after,
#recruit .selectjob .form .application .expContainer section.exp::after,
#recruit .selectjob .form .application .exps section.lang::after,
#recruit .selectjob .form .application .exps section.lcs::after,
#recruit .selectjob .form .application .exps section.act::after,
#recruit .selectjob .form .application .exps section.global::after,
#recruit .selectjob .form .application .exps section.prize::after,
#recruit .selectjob .form .application .exps section.exp::after, .recruit .selectjob .form .application .languages section.lang::after,
.recruit .selectjob .form .application .languages section.lcs::after,
.recruit .selectjob .form .application .languages section.act::after,
.recruit .selectjob .form .application .languages section.global::after,
.recruit .selectjob .form .application .languages section.prize::after,
.recruit .selectjob .form .application .languages section.exp::after,
.recruit .selectjob .form .application .licenses section.lang::after,
.recruit .selectjob .form .application .licenses section.lcs::after,
.recruit .selectjob .form .application .licenses section.act::after,
.recruit .selectjob .form .application .licenses section.global::after,
.recruit .selectjob .form .application .licenses section.prize::after,
.recruit .selectjob .form .application .licenses section.exp::after,
.recruit .selectjob .form .application .acts section.lang::after,
.recruit .selectjob .form .application .acts section.lcs::after,
.recruit .selectjob .form .application .acts section.act::after,
.recruit .selectjob .form .application .acts section.global::after,
.recruit .selectjob .form .application .acts section.prize::after,
.recruit .selectjob .form .application .acts section.exp::after,
.recruit .selectjob .form .application .globalExp section.lang::after,
.recruit .selectjob .form .application .globalExp section.lcs::after,
.recruit .selectjob .form .application .globalExp section.act::after,
.recruit .selectjob .form .application .globalExp section.global::after,
.recruit .selectjob .form .application .globalExp section.prize::after,
.recruit .selectjob .form .application .globalExp section.exp::after,
.recruit .selectjob .form .application .prizeExp section.lang::after,
.recruit .selectjob .form .application .prizeExp section.lcs::after,
.recruit .selectjob .form .application .prizeExp section.act::after,
.recruit .selectjob .form .application .prizeExp section.global::after,
.recruit .selectjob .form .application .prizeExp section.prize::after,
.recruit .selectjob .form .application .prizeExp section.exp::after,
.recruit .selectjob .form .application .expContainer section.lang::after,
.recruit .selectjob .form .application .expContainer section.lcs::after,
.recruit .selectjob .form .application .expContainer section.act::after,
.recruit .selectjob .form .application .expContainer section.global::after,
.recruit .selectjob .form .application .expContainer section.prize::after,
.recruit .selectjob .form .application .expContainer section.exp::after,
.recruit .selectjob .form .application .exps section.lang::after,
.recruit .selectjob .form .application .exps section.lcs::after,
.recruit .selectjob .form .application .exps section.act::after,
.recruit .selectjob .form .application .exps section.global::after,
.recruit .selectjob .form .application .exps section.prize::after,
.recruit .selectjob .form .application .exps section.exp::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .languages section.lang,
  #recruit .selectjob .form .application .languages section.lcs,
  #recruit .selectjob .form .application .languages section.act,
  #recruit .selectjob .form .application .languages section.global,
  #recruit .selectjob .form .application .languages section.prize,
  #recruit .selectjob .form .application .languages section.exp,
  #recruit .selectjob .form .application .licenses section.lang,
  #recruit .selectjob .form .application .licenses section.lcs,
  #recruit .selectjob .form .application .licenses section.act,
  #recruit .selectjob .form .application .licenses section.global,
  #recruit .selectjob .form .application .licenses section.prize,
  #recruit .selectjob .form .application .licenses section.exp,
  #recruit .selectjob .form .application .acts section.lang,
  #recruit .selectjob .form .application .acts section.lcs,
  #recruit .selectjob .form .application .acts section.act,
  #recruit .selectjob .form .application .acts section.global,
  #recruit .selectjob .form .application .acts section.prize,
  #recruit .selectjob .form .application .acts section.exp,
  #recruit .selectjob .form .application .globalExp section.lang,
  #recruit .selectjob .form .application .globalExp section.lcs,
  #recruit .selectjob .form .application .globalExp section.act,
  #recruit .selectjob .form .application .globalExp section.global,
  #recruit .selectjob .form .application .globalExp section.prize,
  #recruit .selectjob .form .application .globalExp section.exp,
  #recruit .selectjob .form .application .prizeExp section.lang,
  #recruit .selectjob .form .application .prizeExp section.lcs,
  #recruit .selectjob .form .application .prizeExp section.act,
  #recruit .selectjob .form .application .prizeExp section.global,
  #recruit .selectjob .form .application .prizeExp section.prize,
  #recruit .selectjob .form .application .prizeExp section.exp,
  #recruit .selectjob .form .application .expContainer section.lang,
  #recruit .selectjob .form .application .expContainer section.lcs,
  #recruit .selectjob .form .application .expContainer section.act,
  #recruit .selectjob .form .application .expContainer section.global,
  #recruit .selectjob .form .application .expContainer section.prize,
  #recruit .selectjob .form .application .expContainer section.exp,
  #recruit .selectjob .form .application .exps section.lang,
  #recruit .selectjob .form .application .exps section.lcs,
  #recruit .selectjob .form .application .exps section.act,
  #recruit .selectjob .form .application .exps section.global,
  #recruit .selectjob .form .application .exps section.prize,
  #recruit .selectjob .form .application .exps section.exp, .recruit .selectjob .form .application .languages section.lang,
  .recruit .selectjob .form .application .languages section.lcs,
  .recruit .selectjob .form .application .languages section.act,
  .recruit .selectjob .form .application .languages section.global,
  .recruit .selectjob .form .application .languages section.prize,
  .recruit .selectjob .form .application .languages section.exp,
  .recruit .selectjob .form .application .licenses section.lang,
  .recruit .selectjob .form .application .licenses section.lcs,
  .recruit .selectjob .form .application .licenses section.act,
  .recruit .selectjob .form .application .licenses section.global,
  .recruit .selectjob .form .application .licenses section.prize,
  .recruit .selectjob .form .application .licenses section.exp,
  .recruit .selectjob .form .application .acts section.lang,
  .recruit .selectjob .form .application .acts section.lcs,
  .recruit .selectjob .form .application .acts section.act,
  .recruit .selectjob .form .application .acts section.global,
  .recruit .selectjob .form .application .acts section.prize,
  .recruit .selectjob .form .application .acts section.exp,
  .recruit .selectjob .form .application .globalExp section.lang,
  .recruit .selectjob .form .application .globalExp section.lcs,
  .recruit .selectjob .form .application .globalExp section.act,
  .recruit .selectjob .form .application .globalExp section.global,
  .recruit .selectjob .form .application .globalExp section.prize,
  .recruit .selectjob .form .application .globalExp section.exp,
  .recruit .selectjob .form .application .prizeExp section.lang,
  .recruit .selectjob .form .application .prizeExp section.lcs,
  .recruit .selectjob .form .application .prizeExp section.act,
  .recruit .selectjob .form .application .prizeExp section.global,
  .recruit .selectjob .form .application .prizeExp section.prize,
  .recruit .selectjob .form .application .prizeExp section.exp,
  .recruit .selectjob .form .application .expContainer section.lang,
  .recruit .selectjob .form .application .expContainer section.lcs,
  .recruit .selectjob .form .application .expContainer section.act,
  .recruit .selectjob .form .application .expContainer section.global,
  .recruit .selectjob .form .application .expContainer section.prize,
  .recruit .selectjob .form .application .expContainer section.exp,
  .recruit .selectjob .form .application .exps section.lang,
  .recruit .selectjob .form .application .exps section.lcs,
  .recruit .selectjob .form .application .exps section.act,
  .recruit .selectjob .form .application .exps section.global,
  .recruit .selectjob .form .application .exps section.prize,
  .recruit .selectjob .form .application .exps section.exp {
    padding-bottom: 45px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .languages section.lang,
  #recruit .selectjob .form .application .languages section.lcs,
  #recruit .selectjob .form .application .languages section.act,
  #recruit .selectjob .form .application .languages section.global,
  #recruit .selectjob .form .application .languages section.prize,
  #recruit .selectjob .form .application .languages section.exp,
  #recruit .selectjob .form .application .licenses section.lang,
  #recruit .selectjob .form .application .licenses section.lcs,
  #recruit .selectjob .form .application .licenses section.act,
  #recruit .selectjob .form .application .licenses section.global,
  #recruit .selectjob .form .application .licenses section.prize,
  #recruit .selectjob .form .application .licenses section.exp,
  #recruit .selectjob .form .application .acts section.lang,
  #recruit .selectjob .form .application .acts section.lcs,
  #recruit .selectjob .form .application .acts section.act,
  #recruit .selectjob .form .application .acts section.global,
  #recruit .selectjob .form .application .acts section.prize,
  #recruit .selectjob .form .application .acts section.exp,
  #recruit .selectjob .form .application .globalExp section.lang,
  #recruit .selectjob .form .application .globalExp section.lcs,
  #recruit .selectjob .form .application .globalExp section.act,
  #recruit .selectjob .form .application .globalExp section.global,
  #recruit .selectjob .form .application .globalExp section.prize,
  #recruit .selectjob .form .application .globalExp section.exp,
  #recruit .selectjob .form .application .prizeExp section.lang,
  #recruit .selectjob .form .application .prizeExp section.lcs,
  #recruit .selectjob .form .application .prizeExp section.act,
  #recruit .selectjob .form .application .prizeExp section.global,
  #recruit .selectjob .form .application .prizeExp section.prize,
  #recruit .selectjob .form .application .prizeExp section.exp,
  #recruit .selectjob .form .application .expContainer section.lang,
  #recruit .selectjob .form .application .expContainer section.lcs,
  #recruit .selectjob .form .application .expContainer section.act,
  #recruit .selectjob .form .application .expContainer section.global,
  #recruit .selectjob .form .application .expContainer section.prize,
  #recruit .selectjob .form .application .expContainer section.exp,
  #recruit .selectjob .form .application .exps section.lang,
  #recruit .selectjob .form .application .exps section.lcs,
  #recruit .selectjob .form .application .exps section.act,
  #recruit .selectjob .form .application .exps section.global,
  #recruit .selectjob .form .application .exps section.prize,
  #recruit .selectjob .form .application .exps section.exp, .recruit .selectjob .form .application .languages section.lang,
  .recruit .selectjob .form .application .languages section.lcs,
  .recruit .selectjob .form .application .languages section.act,
  .recruit .selectjob .form .application .languages section.global,
  .recruit .selectjob .form .application .languages section.prize,
  .recruit .selectjob .form .application .languages section.exp,
  .recruit .selectjob .form .application .licenses section.lang,
  .recruit .selectjob .form .application .licenses section.lcs,
  .recruit .selectjob .form .application .licenses section.act,
  .recruit .selectjob .form .application .licenses section.global,
  .recruit .selectjob .form .application .licenses section.prize,
  .recruit .selectjob .form .application .licenses section.exp,
  .recruit .selectjob .form .application .acts section.lang,
  .recruit .selectjob .form .application .acts section.lcs,
  .recruit .selectjob .form .application .acts section.act,
  .recruit .selectjob .form .application .acts section.global,
  .recruit .selectjob .form .application .acts section.prize,
  .recruit .selectjob .form .application .acts section.exp,
  .recruit .selectjob .form .application .globalExp section.lang,
  .recruit .selectjob .form .application .globalExp section.lcs,
  .recruit .selectjob .form .application .globalExp section.act,
  .recruit .selectjob .form .application .globalExp section.global,
  .recruit .selectjob .form .application .globalExp section.prize,
  .recruit .selectjob .form .application .globalExp section.exp,
  .recruit .selectjob .form .application .prizeExp section.lang,
  .recruit .selectjob .form .application .prizeExp section.lcs,
  .recruit .selectjob .form .application .prizeExp section.act,
  .recruit .selectjob .form .application .prizeExp section.global,
  .recruit .selectjob .form .application .prizeExp section.prize,
  .recruit .selectjob .form .application .prizeExp section.exp,
  .recruit .selectjob .form .application .expContainer section.lang,
  .recruit .selectjob .form .application .expContainer section.lcs,
  .recruit .selectjob .form .application .expContainer section.act,
  .recruit .selectjob .form .application .expContainer section.global,
  .recruit .selectjob .form .application .expContainer section.prize,
  .recruit .selectjob .form .application .expContainer section.exp,
  .recruit .selectjob .form .application .exps section.lang,
  .recruit .selectjob .form .application .exps section.lcs,
  .recruit .selectjob .form .application .exps section.act,
  .recruit .selectjob .form .application .exps section.global,
  .recruit .selectjob .form .application .exps section.prize,
  .recruit .selectjob .form .application .exps section.exp {
    padding-bottom: 40px;
  }
}
#recruit .selectjob .form .application .languages div.clear,
#recruit .selectjob .form .application .licenses div.clear,
#recruit .selectjob .form .application .acts div.clear,
#recruit .selectjob .form .application .globalExp div.clear,
#recruit .selectjob .form .application .prizeExp div.clear,
#recruit .selectjob .form .application .expContainer div.clear,
#recruit .selectjob .form .application .exps div.clear, .recruit .selectjob .form .application .languages div.clear,
.recruit .selectjob .form .application .licenses div.clear,
.recruit .selectjob .form .application .acts div.clear,
.recruit .selectjob .form .application .globalExp div.clear,
.recruit .selectjob .form .application .prizeExp div.clear,
.recruit .selectjob .form .application .expContainer div.clear,
.recruit .selectjob .form .application .exps div.clear {
  clear: both;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .languages div.clear,
  #recruit .selectjob .form .application .licenses div.clear,
  #recruit .selectjob .form .application .acts div.clear,
  #recruit .selectjob .form .application .globalExp div.clear,
  #recruit .selectjob .form .application .prizeExp div.clear,
  #recruit .selectjob .form .application .expContainer div.clear,
  #recruit .selectjob .form .application .exps div.clear, .recruit .selectjob .form .application .languages div.clear,
  .recruit .selectjob .form .application .licenses div.clear,
  .recruit .selectjob .form .application .acts div.clear,
  .recruit .selectjob .form .application .globalExp div.clear,
  .recruit .selectjob .form .application .prizeExp div.clear,
  .recruit .selectjob .form .application .expContainer div.clear,
  .recruit .selectjob .form .application .exps div.clear {
    padding-top: 45px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .languages div.clear,
  #recruit .selectjob .form .application .licenses div.clear,
  #recruit .selectjob .form .application .acts div.clear,
  #recruit .selectjob .form .application .globalExp div.clear,
  #recruit .selectjob .form .application .prizeExp div.clear,
  #recruit .selectjob .form .application .expContainer div.clear,
  #recruit .selectjob .form .application .exps div.clear, .recruit .selectjob .form .application .languages div.clear,
  .recruit .selectjob .form .application .licenses div.clear,
  .recruit .selectjob .form .application .acts div.clear,
  .recruit .selectjob .form .application .globalExp div.clear,
  .recruit .selectjob .form .application .prizeExp div.clear,
  .recruit .selectjob .form .application .expContainer div.clear,
  .recruit .selectjob .form .application .exps div.clear {
    padding-top: 20px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .application .languages div.clear .textarea,
  #recruit .selectjob .form .application .licenses div.clear .textarea,
  #recruit .selectjob .form .application .acts div.clear .textarea,
  #recruit .selectjob .form .application .globalExp div.clear .textarea,
  #recruit .selectjob .form .application .prizeExp div.clear .textarea,
  #recruit .selectjob .form .application .expContainer div.clear .textarea,
  #recruit .selectjob .form .application .exps div.clear .textarea, .recruit .selectjob .form .application .languages div.clear .textarea,
  .recruit .selectjob .form .application .licenses div.clear .textarea,
  .recruit .selectjob .form .application .acts div.clear .textarea,
  .recruit .selectjob .form .application .globalExp div.clear .textarea,
  .recruit .selectjob .form .application .prizeExp div.clear .textarea,
  .recruit .selectjob .form .application .expContainer div.clear .textarea,
  .recruit .selectjob .form .application .exps div.clear .textarea {
    margin-top: 10px;
  }
  #recruit .selectjob .form .application .languages div.clear .textarea textarea,
  #recruit .selectjob .form .application .licenses div.clear .textarea textarea,
  #recruit .selectjob .form .application .acts div.clear .textarea textarea,
  #recruit .selectjob .form .application .globalExp div.clear .textarea textarea,
  #recruit .selectjob .form .application .prizeExp div.clear .textarea textarea,
  #recruit .selectjob .form .application .expContainer div.clear .textarea textarea,
  #recruit .selectjob .form .application .exps div.clear .textarea textarea, .recruit .selectjob .form .application .languages div.clear .textarea textarea,
  .recruit .selectjob .form .application .licenses div.clear .textarea textarea,
  .recruit .selectjob .form .application .acts div.clear .textarea textarea,
  .recruit .selectjob .form .application .globalExp div.clear .textarea textarea,
  .recruit .selectjob .form .application .prizeExp div.clear .textarea textarea,
  .recruit .selectjob .form .application .expContainer div.clear .textarea textarea,
  .recruit .selectjob .form .application .exps div.clear .textarea textarea {
    height: 58px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form .application .languages div.clear .textarea,
  #recruit .selectjob .form .application .licenses div.clear .textarea,
  #recruit .selectjob .form .application .acts div.clear .textarea,
  #recruit .selectjob .form .application .globalExp div.clear .textarea,
  #recruit .selectjob .form .application .prizeExp div.clear .textarea,
  #recruit .selectjob .form .application .expContainer div.clear .textarea,
  #recruit .selectjob .form .application .exps div.clear .textarea, .recruit .selectjob .form .application .languages div.clear .textarea,
  .recruit .selectjob .form .application .licenses div.clear .textarea,
  .recruit .selectjob .form .application .acts div.clear .textarea,
  .recruit .selectjob .form .application .globalExp div.clear .textarea,
  .recruit .selectjob .form .application .prizeExp div.clear .textarea,
  .recruit .selectjob .form .application .expContainer div.clear .textarea,
  .recruit .selectjob .form .application .exps div.clear .textarea {
    margin-top: 5px;
  }
}
#recruit .selectjob .form .application .languages .period,
#recruit .selectjob .form .application .licenses .period,
#recruit .selectjob .form .application .acts .period,
#recruit .selectjob .form .application .globalExp .period,
#recruit .selectjob .form .application .prizeExp .period,
#recruit .selectjob .form .application .expContainer .period,
#recruit .selectjob .form .application .exps .period, .recruit .selectjob .form .application .languages .period,
.recruit .selectjob .form .application .licenses .period,
.recruit .selectjob .form .application .acts .period,
.recruit .selectjob .form .application .globalExp .period,
.recruit .selectjob .form .application .prizeExp .period,
.recruit .selectjob .form .application .expContainer .period,
.recruit .selectjob .form .application .exps .period {
  position: relative;
}
#recruit .selectjob .form .application .languages .period p,
#recruit .selectjob .form .application .licenses .period p,
#recruit .selectjob .form .application .acts .period p,
#recruit .selectjob .form .application .globalExp .period p,
#recruit .selectjob .form .application .prizeExp .period p,
#recruit .selectjob .form .application .expContainer .period p,
#recruit .selectjob .form .application .exps .period p, .recruit .selectjob .form .application .languages .period p,
.recruit .selectjob .form .application .licenses .period p,
.recruit .selectjob .form .application .acts .period p,
.recruit .selectjob .form .application .globalExp .period p,
.recruit .selectjob .form .application .prizeExp .period p,
.recruit .selectjob .form .application .expContainer .period p,
.recruit .selectjob .form .application .exps .period p {
  color: #4415a0;
  position: absolute;
  right: 0;
  top: 0;
}
#recruit .selectjob .form .application .exp .radios, .recruit .selectjob .form .application .exp .radios {
  margin-top: 0;
}
#recruit .selectjob .form hr, .recruit .selectjob .form hr {
  width: 100%;
  border-bottom: 1px solid #c8c8c8;
}
@media (min-width: 1025px) {
  #recruit .selectjob .form hr, .recruit .selectjob .form hr {
    padding-top: 60px;
  }
}
@media (max-width: 1024px) {
  #recruit .selectjob .form hr, .recruit .selectjob .form hr {
    padding-top: 40px;
  }
}
@media (min-width: 1025px) {
  #recruit .selectjob .form .applicationContent .terms, .recruit .selectjob .form .applicationContent .terms {
    padding-bottom: 37px;
  }
}
#recruit .selectjob .form .applicationContent:last-of-type, .recruit .selectjob .form .applicationContent:last-of-type {
  padding-bottom: 0;
  border-bottom: 0;
}
#recruit .loginWrap, .recruit .loginWrap {
  min-width: 360px;
}
@media (min-width: 1025px) {
  #recruit .loginWrap, .recruit .loginWrap {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    margin: auto;
    max-width: 1600px;
    min-height: calc(100vh - 393px);
    min-height: calc(var(--vh, 1vh) * 100 - 393px);
  }
  #recruit .loginWrap > *, .recruit .loginWrap > * {
    width: 50%;
  }
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login, .recruit .loginWrap .login {
    padding-left: 20px;
    padding-top: 100px;
    padding-bottom: 200px;
  }
  #recruit .loginWrap .login::after, .recruit .loginWrap .login::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login, .recruit .loginWrap .login {
    padding-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
#recruit .loginWrap .login h2, .recruit .loginWrap .login h2 {
  font-weight: 400;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login form, .recruit .loginWrap .login form {
    float: right;
    display: block;
    width: 100%;
    max-width: 600px;
    padding-right: 100px;
  }
}
#recruit .loginWrap .login form label, .recruit .loginWrap .login form label {
  display: block;
}
#recruit .loginWrap .login form label span, .recruit .loginWrap .login form label span {
  position: relative;
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  color: #212121;
}
#recruit .loginWrap .login form label span::before, .recruit .loginWrap .login form label span::before {
  content: "";
  margin-right: 10px;
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login form label.id, .recruit .loginWrap .login form label.id {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form label.id, .recruit .loginWrap .login form label.id {
    margin-top: 40px;
  }
}
#recruit .loginWrap .login form label.id span::before, .recruit .loginWrap .login form label.id span::before {
  background-image: url("../images/icon/iconId.svg");
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login form label.pw, .recruit .loginWrap .login form label.pw {
    margin-top: 23px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form label.pw, .recruit .loginWrap .login form label.pw {
    margin-top: 17px;
  }
}
#recruit .loginWrap .login form label.pw span::before, .recruit .loginWrap .login form label.pw span::before {
  background-image: url("../images/icon/iconPw.svg");
}
#recruit .loginWrap .login form > button, .recruit .loginWrap .login form > button {
  display: inline-block;
  width: 100%;
  border-radius: 25px;
  background: #4415a0;
  text-align: center;
  line-height: 50px;
  color: #fff;
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form > button, .recruit .loginWrap .login form > button {
    font-size: 14px;
  }
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login form > button, .recruit .loginWrap .login form > button {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form > button, .recruit .loginWrap .login form > button {
    margin-top: 40px;
  }
}
#recruit .loginWrap .login form div, .recruit .loginWrap .login form div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .loginWrap .login form div a, .recruit .loginWrap .login form div a {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form div a, .recruit .loginWrap .login form div a {
    font-size: 14px;
  }
}
#recruit .loginWrap .login form div a:hover, .recruit .loginWrap .login form div a:hover {
  background: #4415a0;
  border-color: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .login form div a, .recruit .loginWrap .login form div a {
    margin-top: 20px;
    width: calc(50% - 10px);
  }
  #recruit .loginWrap .login form div a + a, .recruit .loginWrap .login form div a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .login form div a, .recruit .loginWrap .login form div a {
    margin-top: 10px;
    width: calc(50% - 5px);
  }
  #recruit .loginWrap .login form div a + a, .recruit .loginWrap .login form div a + a {
    margin-left: 10px;
  }
}
#recruit .loginWrap .joinInfo, .recruit .loginWrap .joinInfo {
  background-position: center;
  background-repeat: no-repeat;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo, .recruit .loginWrap .joinInfo {
    background-image: url("../images/shinyoungRecruit/bgLogin.svg");
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo, .recruit .loginWrap .joinInfo {
    background-image: url("../images/shinyoungRecruit/bgLogin.png");
    background-size: 100% auto;
  }
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div, .recruit .loginWrap .joinInfo > div {
    max-width: 600px;
    padding: 90px 20px 100px 100px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div, .recruit .loginWrap .joinInfo > div {
    margin-top: 130px;
    padding: 130px 40px 120px;
  }
}
#recruit .loginWrap .joinInfo > div h2, .recruit .loginWrap .joinInfo > div h2 {
  font-weight: 400;
  color: #fff;
}
#recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p {
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p {
    margin-top: 45px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div > p, .recruit .loginWrap .joinInfo > div > p {
    margin-top: 35px;
  }
}
#recruit .loginWrap .joinInfo > div a, .recruit .loginWrap .joinInfo > div a {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div a, .recruit .loginWrap .joinInfo > div a {
    font-size: 14px;
  }
}
#recruit .loginWrap .joinInfo > div a:hover, .recruit .loginWrap .joinInfo > div a:hover {
  background: #4415a0;
  border-color: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div a, .recruit .loginWrap .joinInfo > div a {
    margin-top: 40px;
    width: 300px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div a, .recruit .loginWrap .joinInfo > div a {
    margin-top: 20px;
    width: 200px;
  }
}
#recruit .loginWrap .joinInfo > div .swiper strong, .recruit .loginWrap .joinInfo > div .swiper strong {
  font-weight: normal;
  color: #fff;
}
#recruit .loginWrap .joinInfo > div .swiper p, .recruit .loginWrap .joinInfo > div .swiper p {
  margin-top: 20px;
  color: #fff;
}
#recruit .loginWrap .joinInfo > div .swiper .swiper-pagination, .recruit .loginWrap .joinInfo > div .swiper .swiper-pagination {
  top: 0;
  bottom: unset;
  text-align: left;
}
#recruit .loginWrap .joinInfo > div .swiper .swiper-pagination .swiper-pagination-bullet, .recruit .loginWrap .joinInfo > div .swiper .swiper-pagination .swiper-pagination-bullet {
  width: 5px;
  height: 5px;
  background: rgba(255, 255, 255, 0.5);
}
#recruit .loginWrap .joinInfo > div .swiper .swiper-pagination .swiper-pagination-bullet-active, .recruit .loginWrap .joinInfo > div .swiper .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div .swiper, .recruit .loginWrap .joinInfo > div .swiper {
    margin-top: 80px;
    margin-left: 50%;
    padding-top: 30px;
  }
}
@media (min-width: 1025px) and (max-width: 1210px) {
  #recruit .loginWrap .joinInfo > div .swiper, .recruit .loginWrap .joinInfo > div .swiper {
    margin-left: 40%;
  }
}
@media (min-width: 1025px) {
  #recruit .loginWrap .joinInfo > div .swiper .swiper-wrapper, .recruit .loginWrap .joinInfo > div .swiper .swiper-wrapper {
    left: -5px;
  }
  #recruit .loginWrap .joinInfo > div .swiper .swiper-slide, .recruit .loginWrap .joinInfo > div .swiper .swiper-slide {
    padding-left: 5px;
  }
}
@media (max-width: 1024px) {
  #recruit .loginWrap .joinInfo > div .swiper, .recruit .loginWrap .joinInfo > div .swiper {
    margin-top: 60px;
    margin-left: 55%;
    padding-top: 35px;
  }
}
@media (max-width: 1024px) and (max-width: 550px) {
  #recruit .loginWrap .joinInfo > div .swiper, .recruit .loginWrap .joinInfo > div .swiper {
    margin-left: 37%;
  }
}
@media (max-width: 1024px) and (max-width: 418px) {
  #recruit .loginWrap .joinInfo > div .swiper, .recruit .loginWrap .joinInfo > div .swiper {
    margin-left: 27%;
  }
}
@media (min-width: 1025px) {
  #recruit .find,
  #recruit .join,
  #recruit .complete, .recruit .find,
  .recruit .join,
  .recruit .complete {
    margin: 0 auto;
    width: 600px;
    padding: 110px 0 150px;
  }
}
@media (max-width: 1024px) {
  #recruit .find,
  #recruit .join,
  #recruit .complete, .recruit .find,
  .recruit .join,
  .recruit .complete {
    padding: 47px 20px 80px;
  }
}
@media (max-width: 1024px) {
  #recruit .find h2,
  #recruit .join h2,
  #recruit .complete h2, .recruit .find h2,
  .recruit .join h2,
  .recruit .complete h2 {
    font-size: 26px;
  }
}
@media (min-width: 1025px) {
  #recruit .find h2 + p,
  #recruit .join h2 + p,
  #recruit .complete h2 + p, .recruit .find h2 + p,
  .recruit .join h2 + p,
  .recruit .complete h2 + p {
    padding-top: 30px;
  }
}
@media (max-width: 1024px) {
  #recruit .find h2 + p,
  #recruit .join h2 + p,
  #recruit .complete h2 + p, .recruit .find h2 + p,
  .recruit .join h2 + p,
  .recruit .complete h2 + p {
    padding-top: 14px;
  }
}
#recruit .find h2 + p + p,
#recruit .join h2 + p + p,
#recruit .complete h2 + p + p, .recruit .find h2 + p + p,
.recruit .join h2 + p + p,
.recruit .complete h2 + p + p {
  padding-top: 10px;
}
#recruit .find form, #recruit .find .completeBox,
#recruit .join form,
#recruit .join .completeBox,
#recruit .complete form,
#recruit .complete .completeBox, .recruit .find form, .recruit .find .completeBox,
.recruit .join form,
.recruit .join .completeBox,
.recruit .complete form,
.recruit .complete .completeBox {
  border: 1px solid #c8c8c8;
  background: #fff;
}
#recruit .find form .required, #recruit .find .completeBox .required,
#recruit .join form .required,
#recruit .join .completeBox .required,
#recruit .complete form .required,
#recruit .complete .completeBox .required, .recruit .find form .required, .recruit .find .completeBox .required,
.recruit .join form .required,
.recruit .join .completeBox .required,
.recruit .complete form .required,
.recruit .complete .completeBox .required {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
  color: #4415a0;
}
#recruit .find form .required::before, #recruit .find .completeBox .required::before,
#recruit .join form .required::before,
#recruit .join .completeBox .required::before,
#recruit .complete form .required::before,
#recruit .complete .completeBox .required::before, .recruit .find form .required::before, .recruit .find .completeBox .required::before,
.recruit .join form .required::before,
.recruit .join .completeBox .required::before,
.recruit .complete form .required::before,
.recruit .complete .completeBox .required::before {
  content: "";
  margin-right: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #4415a0;
}
@media (max-width: 1024px) {
  #recruit .find form .required, #recruit .find .completeBox .required,
  #recruit .join form .required,
  #recruit .join .completeBox .required,
  #recruit .complete form .required,
  #recruit .complete .completeBox .required, .recruit .find form .required, .recruit .find .completeBox .required,
  .recruit .join form .required,
  .recruit .join .completeBox .required,
  .recruit .complete form .required,
  .recruit .complete .completeBox .required {
    justify-content: flex-start;
    margin-bottom: 35px;
  }
}
#recruit .find form label:not(.check),
#recruit .find form .label, #recruit .find .completeBox label:not(.check),
#recruit .find .completeBox .label,
#recruit .join form label:not(.check),
#recruit .join form .label,
#recruit .join .completeBox label:not(.check),
#recruit .join .completeBox .label,
#recruit .complete form label:not(.check),
#recruit .complete form .label,
#recruit .complete .completeBox label:not(.check),
#recruit .complete .completeBox .label, .recruit .find form label:not(.check),
.recruit .find form .label, .recruit .find .completeBox label:not(.check),
.recruit .find .completeBox .label,
.recruit .join form label:not(.check),
.recruit .join form .label,
.recruit .join .completeBox label:not(.check),
.recruit .join .completeBox .label,
.recruit .complete form label:not(.check),
.recruit .complete form .label,
.recruit .complete .completeBox label:not(.check),
.recruit .complete .completeBox .label {
  display: block;
}
#recruit .find form label:not(.check) + label, #recruit .find form label:not(.check) + .label,
#recruit .find form .label + label,
#recruit .find form .label + .label, #recruit .find .completeBox label:not(.check) + label, #recruit .find .completeBox label:not(.check) + .label,
#recruit .find .completeBox .label + label,
#recruit .find .completeBox .label + .label,
#recruit .join form label:not(.check) + label,
#recruit .join form label:not(.check) + .label,
#recruit .join form .label + label,
#recruit .join form .label + .label,
#recruit .join .completeBox label:not(.check) + label,
#recruit .join .completeBox label:not(.check) + .label,
#recruit .join .completeBox .label + label,
#recruit .join .completeBox .label + .label,
#recruit .complete form label:not(.check) + label,
#recruit .complete form label:not(.check) + .label,
#recruit .complete form .label + label,
#recruit .complete form .label + .label,
#recruit .complete .completeBox label:not(.check) + label,
#recruit .complete .completeBox label:not(.check) + .label,
#recruit .complete .completeBox .label + label,
#recruit .complete .completeBox .label + .label, .recruit .find form label:not(.check) + label, .recruit .find form label:not(.check) + .label,
.recruit .find form .label + label,
.recruit .find form .label + .label, .recruit .find .completeBox label:not(.check) + label, .recruit .find .completeBox label:not(.check) + .label,
.recruit .find .completeBox .label + label,
.recruit .find .completeBox .label + .label,
.recruit .join form label:not(.check) + label,
.recruit .join form label:not(.check) + .label,
.recruit .join form .label + label,
.recruit .join form .label + .label,
.recruit .join .completeBox label:not(.check) + label,
.recruit .join .completeBox label:not(.check) + .label,
.recruit .join .completeBox .label + label,
.recruit .join .completeBox .label + .label,
.recruit .complete form label:not(.check) + label,
.recruit .complete form label:not(.check) + .label,
.recruit .complete form .label + label,
.recruit .complete form .label + .label,
.recruit .complete .completeBox label:not(.check) + label,
.recruit .complete .completeBox label:not(.check) + .label,
.recruit .complete .completeBox .label + label,
.recruit .complete .completeBox .label + .label {
  margin-top: 20px;
}
#recruit .find form label:not(.check) span,
#recruit .find form .label span, #recruit .find .completeBox label:not(.check) span,
#recruit .find .completeBox .label span,
#recruit .join form label:not(.check) span,
#recruit .join form .label span,
#recruit .join .completeBox label:not(.check) span,
#recruit .join .completeBox .label span,
#recruit .complete form label:not(.check) span,
#recruit .complete form .label span,
#recruit .complete .completeBox label:not(.check) span,
#recruit .complete .completeBox .label span, .recruit .find form label:not(.check) span,
.recruit .find form .label span, .recruit .find .completeBox label:not(.check) span,
.recruit .find .completeBox .label span,
.recruit .join form label:not(.check) span,
.recruit .join form .label span,
.recruit .join .completeBox label:not(.check) span,
.recruit .join .completeBox .label span,
.recruit .complete form label:not(.check) span,
.recruit .complete form .label span,
.recruit .complete .completeBox label:not(.check) span,
.recruit .complete .completeBox .label span {
  display: block;
  color: #212121;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check) input,
  #recruit .find form label:not(.check) .selectBox,
  #recruit .find form .label input,
  #recruit .find form .label .selectBox, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox label:not(.check) .selectBox,
  #recruit .find .completeBox .label input,
  #recruit .find .completeBox .label .selectBox,
  #recruit .join form label:not(.check) input,
  #recruit .join form label:not(.check) .selectBox,
  #recruit .join form .label input,
  #recruit .join form .label .selectBox,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox label:not(.check) .selectBox,
  #recruit .join .completeBox .label input,
  #recruit .join .completeBox .label .selectBox,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form label:not(.check) .selectBox,
  #recruit .complete form .label input,
  #recruit .complete form .label .selectBox,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox label:not(.check) .selectBox,
  #recruit .complete .completeBox .label input,
  #recruit .complete .completeBox .label .selectBox, .recruit .find form label:not(.check) input,
  .recruit .find form label:not(.check) .selectBox,
  .recruit .find form .label input,
  .recruit .find form .label .selectBox, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox label:not(.check) .selectBox,
  .recruit .find .completeBox .label input,
  .recruit .find .completeBox .label .selectBox,
  .recruit .join form label:not(.check) input,
  .recruit .join form label:not(.check) .selectBox,
  .recruit .join form .label input,
  .recruit .join form .label .selectBox,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox label:not(.check) .selectBox,
  .recruit .join .completeBox .label input,
  .recruit .join .completeBox .label .selectBox,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form label:not(.check) .selectBox,
  .recruit .complete form .label input,
  .recruit .complete form .label .selectBox,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox label:not(.check) .selectBox,
  .recruit .complete .completeBox .label input,
  .recruit .complete .completeBox .label .selectBox {
    margin-top: 10px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check) input,
  #recruit .find form label:not(.check) .selectBox,
  #recruit .find form .label input,
  #recruit .find form .label .selectBox, #recruit .find .completeBox label:not(.check) input,
  #recruit .find .completeBox label:not(.check) .selectBox,
  #recruit .find .completeBox .label input,
  #recruit .find .completeBox .label .selectBox,
  #recruit .join form label:not(.check) input,
  #recruit .join form label:not(.check) .selectBox,
  #recruit .join form .label input,
  #recruit .join form .label .selectBox,
  #recruit .join .completeBox label:not(.check) input,
  #recruit .join .completeBox label:not(.check) .selectBox,
  #recruit .join .completeBox .label input,
  #recruit .join .completeBox .label .selectBox,
  #recruit .complete form label:not(.check) input,
  #recruit .complete form label:not(.check) .selectBox,
  #recruit .complete form .label input,
  #recruit .complete form .label .selectBox,
  #recruit .complete .completeBox label:not(.check) input,
  #recruit .complete .completeBox label:not(.check) .selectBox,
  #recruit .complete .completeBox .label input,
  #recruit .complete .completeBox .label .selectBox, .recruit .find form label:not(.check) input,
  .recruit .find form label:not(.check) .selectBox,
  .recruit .find form .label input,
  .recruit .find form .label .selectBox, .recruit .find .completeBox label:not(.check) input,
  .recruit .find .completeBox label:not(.check) .selectBox,
  .recruit .find .completeBox .label input,
  .recruit .find .completeBox .label .selectBox,
  .recruit .join form label:not(.check) input,
  .recruit .join form label:not(.check) .selectBox,
  .recruit .join form .label input,
  .recruit .join form .label .selectBox,
  .recruit .join .completeBox label:not(.check) input,
  .recruit .join .completeBox label:not(.check) .selectBox,
  .recruit .join .completeBox .label input,
  .recruit .join .completeBox .label .selectBox,
  .recruit .complete form label:not(.check) input,
  .recruit .complete form label:not(.check) .selectBox,
  .recruit .complete form .label input,
  .recruit .complete form .label .selectBox,
  .recruit .complete .completeBox label:not(.check) input,
  .recruit .complete .completeBox label:not(.check) .selectBox,
  .recruit .complete .completeBox .label input,
  .recruit .complete .completeBox .label .selectBox {
    margin-top: 5px;
  }
}
#recruit .find form label:not(.check).phone div em,
#recruit .find form .label.phone div em, #recruit .find .completeBox label:not(.check).phone div em,
#recruit .find .completeBox .label.phone div em,
#recruit .join form label:not(.check).phone div em,
#recruit .join form .label.phone div em,
#recruit .join .completeBox label:not(.check).phone div em,
#recruit .join .completeBox .label.phone div em,
#recruit .complete form label:not(.check).phone div em,
#recruit .complete form .label.phone div em,
#recruit .complete .completeBox label:not(.check).phone div em,
#recruit .complete .completeBox .label.phone div em, .recruit .find form label:not(.check).phone div em,
.recruit .find form .label.phone div em, .recruit .find .completeBox label:not(.check).phone div em,
.recruit .find .completeBox .label.phone div em,
.recruit .join form label:not(.check).phone div em,
.recruit .join form .label.phone div em,
.recruit .join .completeBox label:not(.check).phone div em,
.recruit .join .completeBox .label.phone div em,
.recruit .complete form label:not(.check).phone div em,
.recruit .complete form .label.phone div em,
.recruit .complete .completeBox label:not(.check).phone div em,
.recruit .complete .completeBox .label.phone div em {
  text-align: center;
}
#recruit .find form label:not(.check).phone div button,
#recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
#recruit .find .completeBox .label.phone div button,
#recruit .join form label:not(.check).phone div button,
#recruit .join form .label.phone div button,
#recruit .join .completeBox label:not(.check).phone div button,
#recruit .join .completeBox .label.phone div button,
#recruit .complete form label:not(.check).phone div button,
#recruit .complete form .label.phone div button,
#recruit .complete .completeBox label:not(.check).phone div button,
#recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
.recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
.recruit .find .completeBox .label.phone div button,
.recruit .join form label:not(.check).phone div button,
.recruit .join form .label.phone div button,
.recruit .join .completeBox label:not(.check).phone div button,
.recruit .join .completeBox .label.phone div button,
.recruit .complete form label:not(.check).phone div button,
.recruit .complete form .label.phone div button,
.recruit .complete .completeBox label:not(.check).phone div button,
.recruit .complete .completeBox .label.phone div button {
  margin-top: 10px;
  border-radius: 4px;
  background: #4415a0;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).phone div button,
  #recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
  #recruit .find .completeBox .label.phone div button,
  #recruit .join form label:not(.check).phone div button,
  #recruit .join form .label.phone div button,
  #recruit .join .completeBox label:not(.check).phone div button,
  #recruit .join .completeBox .label.phone div button,
  #recruit .complete form label:not(.check).phone div button,
  #recruit .complete form .label.phone div button,
  #recruit .complete .completeBox label:not(.check).phone div button,
  #recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
  .recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
  .recruit .find .completeBox .label.phone div button,
  .recruit .join form label:not(.check).phone div button,
  .recruit .join form .label.phone div button,
  .recruit .join .completeBox label:not(.check).phone div button,
  .recruit .join .completeBox .label.phone div button,
  .recruit .complete form label:not(.check).phone div button,
  .recruit .complete form .label.phone div button,
  .recruit .complete .completeBox label:not(.check).phone div button,
  .recruit .complete .completeBox .label.phone div button {
    width: 120px;
    height: 54px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check).phone div button,
  #recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
  #recruit .find .completeBox .label.phone div button,
  #recruit .join form label:not(.check).phone div button,
  #recruit .join form .label.phone div button,
  #recruit .join .completeBox label:not(.check).phone div button,
  #recruit .join .completeBox .label.phone div button,
  #recruit .complete form label:not(.check).phone div button,
  #recruit .complete form .label.phone div button,
  #recruit .complete .completeBox label:not(.check).phone div button,
  #recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
  .recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
  .recruit .find .completeBox .label.phone div button,
  .recruit .join form label:not(.check).phone div button,
  .recruit .join form .label.phone div button,
  .recruit .join .completeBox label:not(.check).phone div button,
  .recruit .join .completeBox .label.phone div button,
  .recruit .complete form label:not(.check).phone div button,
  .recruit .complete form .label.phone div button,
  .recruit .complete .completeBox label:not(.check).phone div button,
  .recruit .complete .completeBox .label.phone div button {
    width: 100%;
    height: 40px;
  }
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).phone div,
  #recruit .find form .label.phone div, #recruit .find .completeBox label:not(.check).phone div,
  #recruit .find .completeBox .label.phone div,
  #recruit .join form label:not(.check).phone div,
  #recruit .join form .label.phone div,
  #recruit .join .completeBox label:not(.check).phone div,
  #recruit .join .completeBox .label.phone div,
  #recruit .complete form label:not(.check).phone div,
  #recruit .complete form .label.phone div,
  #recruit .complete .completeBox label:not(.check).phone div,
  #recruit .complete .completeBox .label.phone div, .recruit .find form label:not(.check).phone div,
  .recruit .find form .label.phone div, .recruit .find .completeBox label:not(.check).phone div,
  .recruit .find .completeBox .label.phone div,
  .recruit .join form label:not(.check).phone div,
  .recruit .join form .label.phone div,
  .recruit .join .completeBox label:not(.check).phone div,
  .recruit .join .completeBox .label.phone div,
  .recruit .complete form label:not(.check).phone div,
  .recruit .complete form .label.phone div,
  .recruit .complete .completeBox label:not(.check).phone div,
  .recruit .complete .completeBox .label.phone div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #recruit .find form label:not(.check).phone div input,
  #recruit .find form .label.phone div input, #recruit .find .completeBox label:not(.check).phone div input,
  #recruit .find .completeBox .label.phone div input,
  #recruit .join form label:not(.check).phone div input,
  #recruit .join form .label.phone div input,
  #recruit .join .completeBox label:not(.check).phone div input,
  #recruit .join .completeBox .label.phone div input,
  #recruit .complete form label:not(.check).phone div input,
  #recruit .complete form .label.phone div input,
  #recruit .complete .completeBox label:not(.check).phone div input,
  #recruit .complete .completeBox .label.phone div input, .recruit .find form label:not(.check).phone div input,
  .recruit .find form .label.phone div input, .recruit .find .completeBox label:not(.check).phone div input,
  .recruit .find .completeBox .label.phone div input,
  .recruit .join form label:not(.check).phone div input,
  .recruit .join form .label.phone div input,
  .recruit .join .completeBox label:not(.check).phone div input,
  .recruit .join .completeBox .label.phone div input,
  .recruit .complete form label:not(.check).phone div input,
  .recruit .complete form .label.phone div input,
  .recruit .complete .completeBox label:not(.check).phone div input,
  .recruit .complete .completeBox .label.phone div input {
    width: 109px;
  }
  #recruit .find form label:not(.check).phone div em,
  #recruit .find form .label.phone div em, #recruit .find .completeBox label:not(.check).phone div em,
  #recruit .find .completeBox .label.phone div em,
  #recruit .join form label:not(.check).phone div em,
  #recruit .join form .label.phone div em,
  #recruit .join .completeBox label:not(.check).phone div em,
  #recruit .join .completeBox .label.phone div em,
  #recruit .complete form label:not(.check).phone div em,
  #recruit .complete form .label.phone div em,
  #recruit .complete .completeBox label:not(.check).phone div em,
  #recruit .complete .completeBox .label.phone div em, .recruit .find form label:not(.check).phone div em,
  .recruit .find form .label.phone div em, .recruit .find .completeBox label:not(.check).phone div em,
  .recruit .find .completeBox .label.phone div em,
  .recruit .join form label:not(.check).phone div em,
  .recruit .join form .label.phone div em,
  .recruit .join .completeBox label:not(.check).phone div em,
  .recruit .join .completeBox .label.phone div em,
  .recruit .complete form label:not(.check).phone div em,
  .recruit .complete form .label.phone div em,
  .recruit .complete .completeBox label:not(.check).phone div em,
  .recruit .complete .completeBox .label.phone div em {
    margin-top: 10px;
    width: 23px;
  }
  #recruit .find form label:not(.check).phone div button,
  #recruit .find form .label.phone div button, #recruit .find .completeBox label:not(.check).phone div button,
  #recruit .find .completeBox .label.phone div button,
  #recruit .join form label:not(.check).phone div button,
  #recruit .join form .label.phone div button,
  #recruit .join .completeBox label:not(.check).phone div button,
  #recruit .join .completeBox .label.phone div button,
  #recruit .complete form label:not(.check).phone div button,
  #recruit .complete form .label.phone div button,
  #recruit .complete .completeBox label:not(.check).phone div button,
  #recruit .complete .completeBox .label.phone div button, .recruit .find form label:not(.check).phone div button,
  .recruit .find form .label.phone div button, .recruit .find .completeBox label:not(.check).phone div button,
  .recruit .find .completeBox .label.phone div button,
  .recruit .join form label:not(.check).phone div button,
  .recruit .join form .label.phone div button,
  .recruit .join .completeBox label:not(.check).phone div button,
  .recruit .join .completeBox .label.phone div button,
  .recruit .complete form label:not(.check).phone div button,
  .recruit .complete form .label.phone div button,
  .recruit .complete .completeBox label:not(.check).phone div button,
  .recruit .complete .completeBox .label.phone div button {
    margin-left: 9px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check).phone div,
  #recruit .find form .label.phone div, #recruit .find .completeBox label:not(.check).phone div,
  #recruit .find .completeBox .label.phone div,
  #recruit .join form label:not(.check).phone div,
  #recruit .join form .label.phone div,
  #recruit .join .completeBox label:not(.check).phone div,
  #recruit .join .completeBox .label.phone div,
  #recruit .complete form label:not(.check).phone div,
  #recruit .complete form .label.phone div,
  #recruit .complete .completeBox label:not(.check).phone div,
  #recruit .complete .completeBox .label.phone div, .recruit .find form label:not(.check).phone div,
  .recruit .find form .label.phone div, .recruit .find .completeBox label:not(.check).phone div,
  .recruit .find .completeBox .label.phone div,
  .recruit .join form label:not(.check).phone div,
  .recruit .join form .label.phone div,
  .recruit .join .completeBox label:not(.check).phone div,
  .recruit .join .completeBox .label.phone div,
  .recruit .complete form label:not(.check).phone div,
  .recruit .complete form .label.phone div,
  .recruit .complete .completeBox label:not(.check).phone div,
  .recruit .complete .completeBox .label.phone div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: stretch;
    align-items: center;
  }
  #recruit .find form label:not(.check).phone div input,
  #recruit .find form .label.phone div input, #recruit .find .completeBox label:not(.check).phone div input,
  #recruit .find .completeBox .label.phone div input,
  #recruit .join form label:not(.check).phone div input,
  #recruit .join form .label.phone div input,
  #recruit .join .completeBox label:not(.check).phone div input,
  #recruit .join .completeBox .label.phone div input,
  #recruit .complete form label:not(.check).phone div input,
  #recruit .complete form .label.phone div input,
  #recruit .complete .completeBox label:not(.check).phone div input,
  #recruit .complete .completeBox .label.phone div input, .recruit .find form label:not(.check).phone div input,
  .recruit .find form .label.phone div input, .recruit .find .completeBox label:not(.check).phone div input,
  .recruit .find .completeBox .label.phone div input,
  .recruit .join form label:not(.check).phone div input,
  .recruit .join form .label.phone div input,
  .recruit .join .completeBox label:not(.check).phone div input,
  .recruit .join .completeBox .label.phone div input,
  .recruit .complete form label:not(.check).phone div input,
  .recruit .complete form .label.phone div input,
  .recruit .complete .completeBox label:not(.check).phone div input,
  .recruit .complete .completeBox .label.phone div input {
    width: calc(33.3333333333% - 14px);
  }
  #recruit .find form label:not(.check).phone div em,
  #recruit .find form .label.phone div em, #recruit .find .completeBox label:not(.check).phone div em,
  #recruit .find .completeBox .label.phone div em,
  #recruit .join form label:not(.check).phone div em,
  #recruit .join form .label.phone div em,
  #recruit .join .completeBox label:not(.check).phone div em,
  #recruit .join .completeBox .label.phone div em,
  #recruit .complete form label:not(.check).phone div em,
  #recruit .complete form .label.phone div em,
  #recruit .complete .completeBox label:not(.check).phone div em,
  #recruit .complete .completeBox .label.phone div em, .recruit .find form label:not(.check).phone div em,
  .recruit .find form .label.phone div em, .recruit .find .completeBox label:not(.check).phone div em,
  .recruit .find .completeBox .label.phone div em,
  .recruit .join form label:not(.check).phone div em,
  .recruit .join form .label.phone div em,
  .recruit .join .completeBox label:not(.check).phone div em,
  .recruit .join .completeBox .label.phone div em,
  .recruit .complete form label:not(.check).phone div em,
  .recruit .complete form .label.phone div em,
  .recruit .complete .completeBox label:not(.check).phone div em,
  .recruit .complete .completeBox .label.phone div em {
    margin-top: 5px;
    width: 20px;
  }
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).phone.case div input,
  #recruit .find form .label.phone.case div input, #recruit .find .completeBox label:not(.check).phone.case div input,
  #recruit .find .completeBox .label.phone.case div input,
  #recruit .join form label:not(.check).phone.case div input,
  #recruit .join form .label.phone.case div input,
  #recruit .join .completeBox label:not(.check).phone.case div input,
  #recruit .join .completeBox .label.phone.case div input,
  #recruit .complete form label:not(.check).phone.case div input,
  #recruit .complete form .label.phone.case div input,
  #recruit .complete .completeBox label:not(.check).phone.case div input,
  #recruit .complete .completeBox .label.phone.case div input, .recruit .find form label:not(.check).phone.case div input,
  .recruit .find form .label.phone.case div input, .recruit .find .completeBox label:not(.check).phone.case div input,
  .recruit .find .completeBox .label.phone.case div input,
  .recruit .join form label:not(.check).phone.case div input,
  .recruit .join form .label.phone.case div input,
  .recruit .join .completeBox label:not(.check).phone.case div input,
  .recruit .join .completeBox .label.phone.case div input,
  .recruit .complete form label:not(.check).phone.case div input,
  .recruit .complete form .label.phone.case div input,
  .recruit .complete .completeBox label:not(.check).phone.case div input,
  .recruit .complete .completeBox .label.phone.case div input {
    width: 146px;
  }
  #recruit .find form label:not(.check).phone.case div em,
  #recruit .find form .label.phone.case div em, #recruit .find .completeBox label:not(.check).phone.case div em,
  #recruit .find .completeBox .label.phone.case div em,
  #recruit .join form label:not(.check).phone.case div em,
  #recruit .join form .label.phone.case div em,
  #recruit .join .completeBox label:not(.check).phone.case div em,
  #recruit .join .completeBox .label.phone.case div em,
  #recruit .complete form label:not(.check).phone.case div em,
  #recruit .complete form .label.phone.case div em,
  #recruit .complete .completeBox label:not(.check).phone.case div em,
  #recruit .complete .completeBox .label.phone.case div em, .recruit .find form label:not(.check).phone.case div em,
  .recruit .find form .label.phone.case div em, .recruit .find .completeBox label:not(.check).phone.case div em,
  .recruit .find .completeBox .label.phone.case div em,
  .recruit .join form label:not(.check).phone.case div em,
  .recruit .join form .label.phone.case div em,
  .recruit .join .completeBox label:not(.check).phone.case div em,
  .recruit .join .completeBox .label.phone.case div em,
  .recruit .complete form label:not(.check).phone.case div em,
  .recruit .complete form .label.phone.case div em,
  .recruit .complete .completeBox label:not(.check).phone.case div em,
  .recruit .complete .completeBox .label.phone.case div em {
    width: 31px;
  }
}
#recruit .find form label:not(.check).email,
#recruit .find form .label.email, #recruit .find .completeBox label:not(.check).email,
#recruit .find .completeBox .label.email,
#recruit .join form label:not(.check).email,
#recruit .join form .label.email,
#recruit .join .completeBox label:not(.check).email,
#recruit .join .completeBox .label.email,
#recruit .complete form label:not(.check).email,
#recruit .complete form .label.email,
#recruit .complete .completeBox label:not(.check).email,
#recruit .complete .completeBox .label.email, .recruit .find form label:not(.check).email,
.recruit .find form .label.email, .recruit .find .completeBox label:not(.check).email,
.recruit .find .completeBox .label.email,
.recruit .join form label:not(.check).email,
.recruit .join form .label.email,
.recruit .join .completeBox label:not(.check).email,
.recruit .join .completeBox .label.email,
.recruit .complete form label:not(.check).email,
.recruit .complete form .label.email,
.recruit .complete .completeBox label:not(.check).email,
.recruit .complete .completeBox .label.email {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).email input:first-of-type,
  #recruit .find form .label.email input:first-of-type, #recruit .find .completeBox label:not(.check).email input:first-of-type,
  #recruit .find .completeBox .label.email input:first-of-type,
  #recruit .join form label:not(.check).email input:first-of-type,
  #recruit .join form .label.email input:first-of-type,
  #recruit .join .completeBox label:not(.check).email input:first-of-type,
  #recruit .join .completeBox .label.email input:first-of-type,
  #recruit .complete form label:not(.check).email input:first-of-type,
  #recruit .complete form .label.email input:first-of-type,
  #recruit .complete .completeBox label:not(.check).email input:first-of-type,
  #recruit .complete .completeBox .label.email input:first-of-type, .recruit .find form label:not(.check).email input:first-of-type,
  .recruit .find form .label.email input:first-of-type, .recruit .find .completeBox label:not(.check).email input:first-of-type,
  .recruit .find .completeBox .label.email input:first-of-type,
  .recruit .join form label:not(.check).email input:first-of-type,
  .recruit .join form .label.email input:first-of-type,
  .recruit .join .completeBox label:not(.check).email input:first-of-type,
  .recruit .join .completeBox .label.email input:first-of-type,
  .recruit .complete form label:not(.check).email input:first-of-type,
  .recruit .complete form .label.email input:first-of-type,
  .recruit .complete .completeBox label:not(.check).email input:first-of-type,
  .recruit .complete .completeBox .label.email input:first-of-type {
    width: calc(100% - 40px);
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check).email input:first-of-type,
  #recruit .find form .label.email input:first-of-type, #recruit .find .completeBox label:not(.check).email input:first-of-type,
  #recruit .find .completeBox .label.email input:first-of-type,
  #recruit .join form label:not(.check).email input:first-of-type,
  #recruit .join form .label.email input:first-of-type,
  #recruit .join .completeBox label:not(.check).email input:first-of-type,
  #recruit .join .completeBox .label.email input:first-of-type,
  #recruit .complete form label:not(.check).email input:first-of-type,
  #recruit .complete form .label.email input:first-of-type,
  #recruit .complete .completeBox label:not(.check).email input:first-of-type,
  #recruit .complete .completeBox .label.email input:first-of-type, .recruit .find form label:not(.check).email input:first-of-type,
  .recruit .find form .label.email input:first-of-type, .recruit .find .completeBox label:not(.check).email input:first-of-type,
  .recruit .find .completeBox .label.email input:first-of-type,
  .recruit .join form label:not(.check).email input:first-of-type,
  .recruit .join form .label.email input:first-of-type,
  .recruit .join .completeBox label:not(.check).email input:first-of-type,
  .recruit .join .completeBox .label.email input:first-of-type,
  .recruit .complete form label:not(.check).email input:first-of-type,
  .recruit .complete form .label.email input:first-of-type,
  .recruit .complete .completeBox label:not(.check).email input:first-of-type,
  .recruit .complete .completeBox .label.email input:first-of-type {
    width: calc(100% - 25px);
  }
}
#recruit .find form label:not(.check).email em,
#recruit .find form .label.email em, #recruit .find .completeBox label:not(.check).email em,
#recruit .find .completeBox .label.email em,
#recruit .join form label:not(.check).email em,
#recruit .join form .label.email em,
#recruit .join .completeBox label:not(.check).email em,
#recruit .join .completeBox .label.email em,
#recruit .complete form label:not(.check).email em,
#recruit .complete form .label.email em,
#recruit .complete .completeBox label:not(.check).email em,
#recruit .complete .completeBox .label.email em, .recruit .find form label:not(.check).email em,
.recruit .find form .label.email em, .recruit .find .completeBox label:not(.check).email em,
.recruit .find .completeBox .label.email em,
.recruit .join form label:not(.check).email em,
.recruit .join form .label.email em,
.recruit .join .completeBox label:not(.check).email em,
.recruit .join .completeBox .label.email em,
.recruit .complete form label:not(.check).email em,
.recruit .complete form .label.email em,
.recruit .complete .completeBox label:not(.check).email em,
.recruit .complete .completeBox .label.email em {
  font-size: 16px;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).email em,
  #recruit .find form .label.email em, #recruit .find .completeBox label:not(.check).email em,
  #recruit .find .completeBox .label.email em,
  #recruit .join form label:not(.check).email em,
  #recruit .join form .label.email em,
  #recruit .join .completeBox label:not(.check).email em,
  #recruit .join .completeBox .label.email em,
  #recruit .complete form label:not(.check).email em,
  #recruit .complete form .label.email em,
  #recruit .complete .completeBox label:not(.check).email em,
  #recruit .complete .completeBox .label.email em, .recruit .find form label:not(.check).email em,
  .recruit .find form .label.email em, .recruit .find .completeBox label:not(.check).email em,
  .recruit .find .completeBox .label.email em,
  .recruit .join form label:not(.check).email em,
  .recruit .join form .label.email em,
  .recruit .join .completeBox label:not(.check).email em,
  .recruit .join .completeBox .label.email em,
  .recruit .complete form label:not(.check).email em,
  .recruit .complete form .label.email em,
  .recruit .complete .completeBox label:not(.check).email em,
  .recruit .complete .completeBox .label.email em {
    padding-right: 10px;
  }
}
#recruit .find form label:not(.check).email .selectBox,
#recruit .find form .label.email .selectBox, #recruit .find .completeBox label:not(.check).email .selectBox,
#recruit .find .completeBox .label.email .selectBox,
#recruit .join form label:not(.check).email .selectBox,
#recruit .join form .label.email .selectBox,
#recruit .join .completeBox label:not(.check).email .selectBox,
#recruit .join .completeBox .label.email .selectBox,
#recruit .complete form label:not(.check).email .selectBox,
#recruit .complete form .label.email .selectBox,
#recruit .complete .completeBox label:not(.check).email .selectBox,
#recruit .complete .completeBox .label.email .selectBox, .recruit .find form label:not(.check).email .selectBox,
.recruit .find form .label.email .selectBox, .recruit .find .completeBox label:not(.check).email .selectBox,
.recruit .find .completeBox .label.email .selectBox,
.recruit .join form label:not(.check).email .selectBox,
.recruit .join form .label.email .selectBox,
.recruit .join .completeBox label:not(.check).email .selectBox,
.recruit .join .completeBox .label.email .selectBox,
.recruit .complete form label:not(.check).email .selectBox,
.recruit .complete form .label.email .selectBox,
.recruit .complete .completeBox label:not(.check).email .selectBox,
.recruit .complete .completeBox .label.email .selectBox {
  width: 100%;
  position: relative;
}
#recruit .find form label:not(.check).email .selectBox > button,
#recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
#recruit .find .completeBox .label.email .selectBox > button,
#recruit .join form label:not(.check).email .selectBox > button,
#recruit .join form .label.email .selectBox > button,
#recruit .join .completeBox label:not(.check).email .selectBox > button,
#recruit .join .completeBox .label.email .selectBox > button,
#recruit .complete form label:not(.check).email .selectBox > button,
#recruit .complete form .label.email .selectBox > button,
#recruit .complete .completeBox label:not(.check).email .selectBox > button,
#recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
.recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
.recruit .find .completeBox .label.email .selectBox > button,
.recruit .join form label:not(.check).email .selectBox > button,
.recruit .join form .label.email .selectBox > button,
.recruit .join .completeBox label:not(.check).email .selectBox > button,
.recruit .join .completeBox .label.email .selectBox > button,
.recruit .complete form label:not(.check).email .selectBox > button,
.recruit .complete form .label.email .selectBox > button,
.recruit .complete .completeBox label:not(.check).email .selectBox > button,
.recruit .complete .completeBox .label.email .selectBox > button {
  position: relative;
  width: 100%;
  border-bottom: 1px solid #707070;
  text-align: left;
  color: #666;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 30px !important;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
}
#recruit .find form label:not(.check).email .selectBox > button::after,
#recruit .find form .label.email .selectBox > button::after, #recruit .find .completeBox label:not(.check).email .selectBox > button::after,
#recruit .find .completeBox .label.email .selectBox > button::after,
#recruit .join form label:not(.check).email .selectBox > button::after,
#recruit .join form .label.email .selectBox > button::after,
#recruit .join .completeBox label:not(.check).email .selectBox > button::after,
#recruit .join .completeBox .label.email .selectBox > button::after,
#recruit .complete form label:not(.check).email .selectBox > button::after,
#recruit .complete form .label.email .selectBox > button::after,
#recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
#recruit .complete .completeBox .label.email .selectBox > button::after, .recruit .find form label:not(.check).email .selectBox > button::after,
.recruit .find form .label.email .selectBox > button::after, .recruit .find .completeBox label:not(.check).email .selectBox > button::after,
.recruit .find .completeBox .label.email .selectBox > button::after,
.recruit .join form label:not(.check).email .selectBox > button::after,
.recruit .join form .label.email .selectBox > button::after,
.recruit .join .completeBox label:not(.check).email .selectBox > button::after,
.recruit .join .completeBox .label.email .selectBox > button::after,
.recruit .complete form label:not(.check).email .selectBox > button::after,
.recruit .complete form .label.email .selectBox > button::after,
.recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
.recruit .complete .completeBox .label.email .selectBox > button::after {
  position: absolute;
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-45deg);
  right: 20px;
}
#recruit .find form label:not(.check).email .selectBox > button.placeholder,
#recruit .find form .label.email .selectBox > button.placeholder, #recruit .find .completeBox label:not(.check).email .selectBox > button.placeholder,
#recruit .find .completeBox .label.email .selectBox > button.placeholder,
#recruit .join form label:not(.check).email .selectBox > button.placeholder,
#recruit .join form .label.email .selectBox > button.placeholder,
#recruit .join .completeBox label:not(.check).email .selectBox > button.placeholder,
#recruit .join .completeBox .label.email .selectBox > button.placeholder,
#recruit .complete form label:not(.check).email .selectBox > button.placeholder,
#recruit .complete form .label.email .selectBox > button.placeholder,
#recruit .complete .completeBox label:not(.check).email .selectBox > button.placeholder,
#recruit .complete .completeBox .label.email .selectBox > button.placeholder, .recruit .find form label:not(.check).email .selectBox > button.placeholder,
.recruit .find form .label.email .selectBox > button.placeholder, .recruit .find .completeBox label:not(.check).email .selectBox > button.placeholder,
.recruit .find .completeBox .label.email .selectBox > button.placeholder,
.recruit .join form label:not(.check).email .selectBox > button.placeholder,
.recruit .join form .label.email .selectBox > button.placeholder,
.recruit .join .completeBox label:not(.check).email .selectBox > button.placeholder,
.recruit .join .completeBox .label.email .selectBox > button.placeholder,
.recruit .complete form label:not(.check).email .selectBox > button.placeholder,
.recruit .complete form .label.email .selectBox > button.placeholder,
.recruit .complete .completeBox label:not(.check).email .selectBox > button.placeholder,
.recruit .complete .completeBox .label.email .selectBox > button.placeholder {
  color: #a5a5a5;
}
#recruit .find form label:not(.check).email .selectBox > button.active,
#recruit .find form .label.email .selectBox > button.active, #recruit .find .completeBox label:not(.check).email .selectBox > button.active,
#recruit .find .completeBox .label.email .selectBox > button.active,
#recruit .join form label:not(.check).email .selectBox > button.active,
#recruit .join form .label.email .selectBox > button.active,
#recruit .join .completeBox label:not(.check).email .selectBox > button.active,
#recruit .join .completeBox .label.email .selectBox > button.active,
#recruit .complete form label:not(.check).email .selectBox > button.active,
#recruit .complete form .label.email .selectBox > button.active,
#recruit .complete .completeBox label:not(.check).email .selectBox > button.active,
#recruit .complete .completeBox .label.email .selectBox > button.active, .recruit .find form label:not(.check).email .selectBox > button.active,
.recruit .find form .label.email .selectBox > button.active, .recruit .find .completeBox label:not(.check).email .selectBox > button.active,
.recruit .find .completeBox .label.email .selectBox > button.active,
.recruit .join form label:not(.check).email .selectBox > button.active,
.recruit .join form .label.email .selectBox > button.active,
.recruit .join .completeBox label:not(.check).email .selectBox > button.active,
.recruit .join .completeBox .label.email .selectBox > button.active,
.recruit .complete form label:not(.check).email .selectBox > button.active,
.recruit .complete form .label.email .selectBox > button.active,
.recruit .complete .completeBox label:not(.check).email .selectBox > button.active,
.recruit .complete .completeBox .label.email .selectBox > button.active {
  color: #4415a0;
  border-color: #4415a0;
}
#recruit .find form label:not(.check).email .selectBox > button.active::after,
#recruit .find form .label.email .selectBox > button.active::after, #recruit .find .completeBox label:not(.check).email .selectBox > button.active::after,
#recruit .find .completeBox .label.email .selectBox > button.active::after,
#recruit .join form label:not(.check).email .selectBox > button.active::after,
#recruit .join form .label.email .selectBox > button.active::after,
#recruit .join .completeBox label:not(.check).email .selectBox > button.active::after,
#recruit .join .completeBox .label.email .selectBox > button.active::after,
#recruit .complete form label:not(.check).email .selectBox > button.active::after,
#recruit .complete form .label.email .selectBox > button.active::after,
#recruit .complete .completeBox label:not(.check).email .selectBox > button.active::after,
#recruit .complete .completeBox .label.email .selectBox > button.active::after, .recruit .find form label:not(.check).email .selectBox > button.active::after,
.recruit .find form .label.email .selectBox > button.active::after, .recruit .find .completeBox label:not(.check).email .selectBox > button.active::after,
.recruit .find .completeBox .label.email .selectBox > button.active::after,
.recruit .join form label:not(.check).email .selectBox > button.active::after,
.recruit .join form .label.email .selectBox > button.active::after,
.recruit .join .completeBox label:not(.check).email .selectBox > button.active::after,
.recruit .join .completeBox .label.email .selectBox > button.active::after,
.recruit .complete form label:not(.check).email .selectBox > button.active::after,
.recruit .complete form .label.email .selectBox > button.active::after,
.recruit .complete .completeBox label:not(.check).email .selectBox > button.active::after,
.recruit .complete .completeBox .label.email .selectBox > button.active::after {
  border-color: #4415a0;
}
#recruit .find form label:not(.check).email .selectBox > div,
#recruit .find form .label.email .selectBox > div, #recruit .find .completeBox label:not(.check).email .selectBox > div,
#recruit .find .completeBox .label.email .selectBox > div,
#recruit .join form label:not(.check).email .selectBox > div,
#recruit .join form .label.email .selectBox > div,
#recruit .join .completeBox label:not(.check).email .selectBox > div,
#recruit .join .completeBox .label.email .selectBox > div,
#recruit .complete form label:not(.check).email .selectBox > div,
#recruit .complete form .label.email .selectBox > div,
#recruit .complete .completeBox label:not(.check).email .selectBox > div,
#recruit .complete .completeBox .label.email .selectBox > div, .recruit .find form label:not(.check).email .selectBox > div,
.recruit .find form .label.email .selectBox > div, .recruit .find .completeBox label:not(.check).email .selectBox > div,
.recruit .find .completeBox .label.email .selectBox > div,
.recruit .join form label:not(.check).email .selectBox > div,
.recruit .join form .label.email .selectBox > div,
.recruit .join .completeBox label:not(.check).email .selectBox > div,
.recruit .join .completeBox .label.email .selectBox > div,
.recruit .complete form label:not(.check).email .selectBox > div,
.recruit .complete form .label.email .selectBox > div,
.recruit .complete .completeBox label:not(.check).email .selectBox > div,
.recruit .complete .completeBox .label.email .selectBox > div {
  z-index: 3;
  position: absolute;
  display: none;
  width: 100%;
  overflow: auto;
  background: #fff;
  -ms-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  -o-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.102);
}
#recruit .find form label:not(.check).email .selectBox > div::before,
#recruit .find form .label.email .selectBox > div::before, #recruit .find .completeBox label:not(.check).email .selectBox > div::before,
#recruit .find .completeBox .label.email .selectBox > div::before,
#recruit .join form label:not(.check).email .selectBox > div::before,
#recruit .join form .label.email .selectBox > div::before,
#recruit .join .completeBox label:not(.check).email .selectBox > div::before,
#recruit .join .completeBox .label.email .selectBox > div::before,
#recruit .complete form label:not(.check).email .selectBox > div::before,
#recruit .complete form .label.email .selectBox > div::before,
#recruit .complete .completeBox label:not(.check).email .selectBox > div::before,
#recruit .complete .completeBox .label.email .selectBox > div::before, .recruit .find form label:not(.check).email .selectBox > div::before,
.recruit .find form .label.email .selectBox > div::before, .recruit .find .completeBox label:not(.check).email .selectBox > div::before,
.recruit .find .completeBox .label.email .selectBox > div::before,
.recruit .join form label:not(.check).email .selectBox > div::before,
.recruit .join form .label.email .selectBox > div::before,
.recruit .join .completeBox label:not(.check).email .selectBox > div::before,
.recruit .join .completeBox .label.email .selectBox > div::before,
.recruit .complete form label:not(.check).email .selectBox > div::before,
.recruit .complete form .label.email .selectBox > div::before,
.recruit .complete .completeBox label:not(.check).email .selectBox > div::before,
.recruit .complete .completeBox .label.email .selectBox > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 100%;
  height: 2px;
  background: #4415a0;
  display: none;
}
#recruit .find form label:not(.check).email .selectBox > div button,
#recruit .find form .label.email .selectBox > div button, #recruit .find .completeBox label:not(.check).email .selectBox > div button,
#recruit .find .completeBox .label.email .selectBox > div button,
#recruit .join form label:not(.check).email .selectBox > div button,
#recruit .join form .label.email .selectBox > div button,
#recruit .join .completeBox label:not(.check).email .selectBox > div button,
#recruit .join .completeBox .label.email .selectBox > div button,
#recruit .complete form label:not(.check).email .selectBox > div button,
#recruit .complete form .label.email .selectBox > div button,
#recruit .complete .completeBox label:not(.check).email .selectBox > div button,
#recruit .complete .completeBox .label.email .selectBox > div button, .recruit .find form label:not(.check).email .selectBox > div button,
.recruit .find form .label.email .selectBox > div button, .recruit .find .completeBox label:not(.check).email .selectBox > div button,
.recruit .find .completeBox .label.email .selectBox > div button,
.recruit .join form label:not(.check).email .selectBox > div button,
.recruit .join form .label.email .selectBox > div button,
.recruit .join .completeBox label:not(.check).email .selectBox > div button,
.recruit .join .completeBox .label.email .selectBox > div button,
.recruit .complete form label:not(.check).email .selectBox > div button,
.recruit .complete form .label.email .selectBox > div button,
.recruit .complete .completeBox label:not(.check).email .selectBox > div button,
.recruit .complete .completeBox .label.email .selectBox > div button {
  width: 100%;
  line-height: 2.5 !important;
  text-align: left;
}
#recruit .find form label:not(.check).email .selectBox > div button.selected,
#recruit .find form .label.email .selectBox > div button.selected, #recruit .find .completeBox label:not(.check).email .selectBox > div button.selected,
#recruit .find .completeBox .label.email .selectBox > div button.selected,
#recruit .join form label:not(.check).email .selectBox > div button.selected,
#recruit .join form .label.email .selectBox > div button.selected,
#recruit .join .completeBox label:not(.check).email .selectBox > div button.selected,
#recruit .join .completeBox .label.email .selectBox > div button.selected,
#recruit .complete form label:not(.check).email .selectBox > div button.selected,
#recruit .complete form .label.email .selectBox > div button.selected,
#recruit .complete .completeBox label:not(.check).email .selectBox > div button.selected,
#recruit .complete .completeBox .label.email .selectBox > div button.selected, .recruit .find form label:not(.check).email .selectBox > div button.selected,
.recruit .find form .label.email .selectBox > div button.selected, .recruit .find .completeBox label:not(.check).email .selectBox > div button.selected,
.recruit .find .completeBox .label.email .selectBox > div button.selected,
.recruit .join form label:not(.check).email .selectBox > div button.selected,
.recruit .join form .label.email .selectBox > div button.selected,
.recruit .join .completeBox label:not(.check).email .selectBox > div button.selected,
.recruit .join .completeBox .label.email .selectBox > div button.selected,
.recruit .complete form label:not(.check).email .selectBox > div button.selected,
.recruit .complete form .label.email .selectBox > div button.selected,
.recruit .complete .completeBox label:not(.check).email .selectBox > div button.selected,
.recruit .complete .completeBox .label.email .selectBox > div button.selected {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .find form .label.email .selectBox > div > button:first-child, #recruit .find .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .find .completeBox .label.email .selectBox > div > button:first-child,
  #recruit .join form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .join form .label.email .selectBox > div > button:first-child,
  #recruit .join .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .join .completeBox .label.email .selectBox > div > button:first-child,
  #recruit .complete form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .complete form .label.email .selectBox > div > button:first-child,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .complete .completeBox .label.email .selectBox > div > button:first-child, .recruit .find form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .find form .label.email .selectBox > div > button:first-child, .recruit .find .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .find .completeBox .label.email .selectBox > div > button:first-child,
  .recruit .join form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .join form .label.email .selectBox > div > button:first-child,
  .recruit .join .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .join .completeBox .label.email .selectBox > div > button:first-child,
  .recruit .complete form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .complete form .label.email .selectBox > div > button:first-child,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .complete .completeBox .label.email .selectBox > div > button:first-child {
    margin-top: 10px;
  }
  #recruit .find form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .find form .label.email .selectBox > div > button:last-child, #recruit .find .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .find .completeBox .label.email .selectBox > div > button:last-child,
  #recruit .join form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .join form .label.email .selectBox > div > button:last-child,
  #recruit .join .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .join .completeBox .label.email .selectBox > div > button:last-child,
  #recruit .complete form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .complete form .label.email .selectBox > div > button:last-child,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .complete .completeBox .label.email .selectBox > div > button:last-child, .recruit .find form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .find form .label.email .selectBox > div > button:last-child, .recruit .find .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .find .completeBox .label.email .selectBox > div > button:last-child,
  .recruit .join form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .join form .label.email .selectBox > div > button:last-child,
  .recruit .join .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .join .completeBox .label.email .selectBox > div > button:last-child,
  .recruit .complete form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .complete form .label.email .selectBox > div > button:last-child,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .complete .completeBox .label.email .selectBox > div > button:last-child {
    margin-bottom: 10px;
  }
  #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > button {
    height: 54px;
  }
  #recruit .find form label:not(.check).email .selectBox > button::after,
  #recruit .find form .label.email .selectBox > button::after, #recruit .find .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .find .completeBox .label.email .selectBox > button::after,
  #recruit .join form label:not(.check).email .selectBox > button::after,
  #recruit .join form .label.email .selectBox > button::after,
  #recruit .join .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .join .completeBox .label.email .selectBox > button::after,
  #recruit .complete form label:not(.check).email .selectBox > button::after,
  #recruit .complete form .label.email .selectBox > button::after,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .complete .completeBox .label.email .selectBox > button::after, .recruit .find form label:not(.check).email .selectBox > button::after,
  .recruit .find form .label.email .selectBox > button::after, .recruit .find .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .find .completeBox .label.email .selectBox > button::after,
  .recruit .join form label:not(.check).email .selectBox > button::after,
  .recruit .join form .label.email .selectBox > button::after,
  .recruit .join .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .join .completeBox .label.email .selectBox > button::after,
  .recruit .complete form label:not(.check).email .selectBox > button::after,
  .recruit .complete form .label.email .selectBox > button::after,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .complete .completeBox .label.email .selectBox > button::after {
    top: 20px;
  }
  #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form label:not(.check).email .selectBox > div button,
  #recruit .find form .label.email .selectBox > button,
  #recruit .find form .label.email .selectBox > div button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox label:not(.check).email .selectBox > div button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > div button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > div button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join form .label.email .selectBox > div button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > div button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > div button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > div button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete form .label.email .selectBox > div button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div button,
  #recruit .complete .completeBox .label.email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > div button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form label:not(.check).email .selectBox > div button,
  .recruit .find form .label.email .selectBox > button,
  .recruit .find form .label.email .selectBox > div button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox label:not(.check).email .selectBox > div button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > div button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > div button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join form .label.email .selectBox > div button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > div button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > div button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > div button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete form .label.email .selectBox > div button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div button,
  .recruit .complete .completeBox .label.email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > div button {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .find form .label.email .selectBox > div > button:first-child, #recruit .find .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .find .completeBox .label.email .selectBox > div > button:first-child,
  #recruit .join form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .join form .label.email .selectBox > div > button:first-child,
  #recruit .join .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .join .completeBox .label.email .selectBox > div > button:first-child,
  #recruit .complete form label:not(.check).email .selectBox > div > button:first-child,
  #recruit .complete form .label.email .selectBox > div > button:first-child,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div > button:first-child,
  #recruit .complete .completeBox .label.email .selectBox > div > button:first-child, .recruit .find form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .find form .label.email .selectBox > div > button:first-child, .recruit .find .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .find .completeBox .label.email .selectBox > div > button:first-child,
  .recruit .join form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .join form .label.email .selectBox > div > button:first-child,
  .recruit .join .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .join .completeBox .label.email .selectBox > div > button:first-child,
  .recruit .complete form label:not(.check).email .selectBox > div > button:first-child,
  .recruit .complete form .label.email .selectBox > div > button:first-child,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div > button:first-child,
  .recruit .complete .completeBox .label.email .selectBox > div > button:first-child {
    margin-top: 5px;
  }
  #recruit .find form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .find form .label.email .selectBox > div > button:last-child, #recruit .find .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .find .completeBox .label.email .selectBox > div > button:last-child,
  #recruit .join form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .join form .label.email .selectBox > div > button:last-child,
  #recruit .join .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .join .completeBox .label.email .selectBox > div > button:last-child,
  #recruit .complete form label:not(.check).email .selectBox > div > button:last-child,
  #recruit .complete form .label.email .selectBox > div > button:last-child,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div > button:last-child,
  #recruit .complete .completeBox .label.email .selectBox > div > button:last-child, .recruit .find form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .find form .label.email .selectBox > div > button:last-child, .recruit .find .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .find .completeBox .label.email .selectBox > div > button:last-child,
  .recruit .join form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .join form .label.email .selectBox > div > button:last-child,
  .recruit .join .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .join .completeBox .label.email .selectBox > div > button:last-child,
  .recruit .complete form label:not(.check).email .selectBox > div > button:last-child,
  .recruit .complete form .label.email .selectBox > div > button:last-child,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div > button:last-child,
  .recruit .complete .completeBox .label.email .selectBox > div > button:last-child {
    margin-bottom: 5px;
  }
  #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form .label.email .selectBox > button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form .label.email .selectBox > button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > button {
    height: 40px;
  }
  #recruit .find form label:not(.check).email .selectBox > button::after,
  #recruit .find form .label.email .selectBox > button::after, #recruit .find .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .find .completeBox .label.email .selectBox > button::after,
  #recruit .join form label:not(.check).email .selectBox > button::after,
  #recruit .join form .label.email .selectBox > button::after,
  #recruit .join .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .join .completeBox .label.email .selectBox > button::after,
  #recruit .complete form label:not(.check).email .selectBox > button::after,
  #recruit .complete form .label.email .selectBox > button::after,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
  #recruit .complete .completeBox .label.email .selectBox > button::after, .recruit .find form label:not(.check).email .selectBox > button::after,
  .recruit .find form .label.email .selectBox > button::after, .recruit .find .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .find .completeBox .label.email .selectBox > button::after,
  .recruit .join form label:not(.check).email .selectBox > button::after,
  .recruit .join form .label.email .selectBox > button::after,
  .recruit .join .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .join .completeBox .label.email .selectBox > button::after,
  .recruit .complete form label:not(.check).email .selectBox > button::after,
  .recruit .complete form .label.email .selectBox > button::after,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button::after,
  .recruit .complete .completeBox .label.email .selectBox > button::after {
    top: 10px;
  }
  #recruit .find form label:not(.check).email .selectBox > button,
  #recruit .find form label:not(.check).email .selectBox > div button,
  #recruit .find form .label.email .selectBox > button,
  #recruit .find form .label.email .selectBox > div button, #recruit .find .completeBox label:not(.check).email .selectBox > button,
  #recruit .find .completeBox label:not(.check).email .selectBox > div button,
  #recruit .find .completeBox .label.email .selectBox > button,
  #recruit .find .completeBox .label.email .selectBox > div button,
  #recruit .join form label:not(.check).email .selectBox > button,
  #recruit .join form label:not(.check).email .selectBox > div button,
  #recruit .join form .label.email .selectBox > button,
  #recruit .join form .label.email .selectBox > div button,
  #recruit .join .completeBox label:not(.check).email .selectBox > button,
  #recruit .join .completeBox label:not(.check).email .selectBox > div button,
  #recruit .join .completeBox .label.email .selectBox > button,
  #recruit .join .completeBox .label.email .selectBox > div button,
  #recruit .complete form label:not(.check).email .selectBox > button,
  #recruit .complete form label:not(.check).email .selectBox > div button,
  #recruit .complete form .label.email .selectBox > button,
  #recruit .complete form .label.email .selectBox > div button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > button,
  #recruit .complete .completeBox label:not(.check).email .selectBox > div button,
  #recruit .complete .completeBox .label.email .selectBox > button,
  #recruit .complete .completeBox .label.email .selectBox > div button, .recruit .find form label:not(.check).email .selectBox > button,
  .recruit .find form label:not(.check).email .selectBox > div button,
  .recruit .find form .label.email .selectBox > button,
  .recruit .find form .label.email .selectBox > div button, .recruit .find .completeBox label:not(.check).email .selectBox > button,
  .recruit .find .completeBox label:not(.check).email .selectBox > div button,
  .recruit .find .completeBox .label.email .selectBox > button,
  .recruit .find .completeBox .label.email .selectBox > div button,
  .recruit .join form label:not(.check).email .selectBox > button,
  .recruit .join form label:not(.check).email .selectBox > div button,
  .recruit .join form .label.email .selectBox > button,
  .recruit .join form .label.email .selectBox > div button,
  .recruit .join .completeBox label:not(.check).email .selectBox > button,
  .recruit .join .completeBox label:not(.check).email .selectBox > div button,
  .recruit .join .completeBox .label.email .selectBox > button,
  .recruit .join .completeBox .label.email .selectBox > div button,
  .recruit .complete form label:not(.check).email .selectBox > button,
  .recruit .complete form label:not(.check).email .selectBox > div button,
  .recruit .complete form .label.email .selectBox > button,
  .recruit .complete form .label.email .selectBox > div button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > button,
  .recruit .complete .completeBox label:not(.check).email .selectBox > div button,
  .recruit .complete .completeBox .label.email .selectBox > button,
  .recruit .complete .completeBox .label.email .selectBox > div button {
    padding-left: 15px;
    padding-right: 15px;
  }
}
#recruit .find form > button, #recruit .find .completeBox > button,
#recruit .join form > button,
#recruit .join .completeBox > button,
#recruit .complete form > button,
#recruit .complete .completeBox > button, .recruit .find form > button, .recruit .find .completeBox > button,
.recruit .join form > button,
.recruit .join .completeBox > button,
.recruit .complete form > button,
.recruit .complete .completeBox > button {
  display: inline-block;
  width: 100%;
  border-radius: 25px;
  background: #4415a0;
  text-align: center;
  line-height: 50px;
  color: #fff;
}
@media (max-width: 1024px) {
  #recruit .find form > button, #recruit .find .completeBox > button,
  #recruit .join form > button,
  #recruit .join .completeBox > button,
  #recruit .complete form > button,
  #recruit .complete .completeBox > button, .recruit .find form > button, .recruit .find .completeBox > button,
  .recruit .join form > button,
  .recruit .join .completeBox > button,
  .recruit .complete form > button,
  .recruit .complete .completeBox > button {
    font-size: 14px;
  }
}
@media (min-width: 1025px) {
  #recruit .find form > button, #recruit .find .completeBox > button,
  #recruit .join form > button,
  #recruit .join .completeBox > button,
  #recruit .complete form > button,
  #recruit .complete .completeBox > button, .recruit .find form > button, .recruit .find .completeBox > button,
  .recruit .join form > button,
  .recruit .join .completeBox > button,
  .recruit .complete form > button,
  .recruit .complete .completeBox > button {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form > button, #recruit .find .completeBox > button,
  #recruit .join form > button,
  #recruit .join .completeBox > button,
  #recruit .complete form > button,
  #recruit .complete .completeBox > button, .recruit .find form > button, .recruit .find .completeBox > button,
  .recruit .join form > button,
  .recruit .join .completeBox > button,
  .recruit .complete form > button,
  .recruit .complete .completeBox > button {
    margin-top: 40px;
  }
}
@media (min-width: 1025px) {
  #recruit .find form .btn, #recruit .find .completeBox .btn,
  #recruit .join form .btn,
  #recruit .join .completeBox .btn,
  #recruit .complete form .btn,
  #recruit .complete .completeBox .btn, .recruit .find form .btn, .recruit .find .completeBox .btn,
  .recruit .join form .btn,
  .recruit .join .completeBox .btn,
  .recruit .complete form .btn,
  .recruit .complete .completeBox .btn {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form .btn, #recruit .find .completeBox .btn,
  #recruit .join form .btn,
  #recruit .join .completeBox .btn,
  #recruit .complete form .btn,
  #recruit .complete .completeBox .btn, .recruit .find form .btn, .recruit .find .completeBox .btn,
  .recruit .join form .btn,
  .recruit .join .completeBox .btn,
  .recruit .complete form .btn,
  .recruit .complete .completeBox .btn {
    margin-top: 40px;
  }
}
#recruit .find form .btn a,
#recruit .find form .btn button, #recruit .find .completeBox .btn a,
#recruit .find .completeBox .btn button,
#recruit .join form .btn a,
#recruit .join form .btn button,
#recruit .join .completeBox .btn a,
#recruit .join .completeBox .btn button,
#recruit .complete form .btn a,
#recruit .complete form .btn button,
#recruit .complete .completeBox .btn a,
#recruit .complete .completeBox .btn button, .recruit .find form .btn a,
.recruit .find form .btn button, .recruit .find .completeBox .btn a,
.recruit .find .completeBox .btn button,
.recruit .join form .btn a,
.recruit .join form .btn button,
.recruit .join .completeBox .btn a,
.recruit .join .completeBox .btn button,
.recruit .complete form .btn a,
.recruit .complete form .btn button,
.recruit .complete .completeBox .btn a,
.recruit .complete .completeBox .btn button {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .find form .btn a,
  #recruit .find form .btn button, #recruit .find .completeBox .btn a,
  #recruit .find .completeBox .btn button,
  #recruit .join form .btn a,
  #recruit .join form .btn button,
  #recruit .join .completeBox .btn a,
  #recruit .join .completeBox .btn button,
  #recruit .complete form .btn a,
  #recruit .complete form .btn button,
  #recruit .complete .completeBox .btn a,
  #recruit .complete .completeBox .btn button, .recruit .find form .btn a,
  .recruit .find form .btn button, .recruit .find .completeBox .btn a,
  .recruit .find .completeBox .btn button,
  .recruit .join form .btn a,
  .recruit .join form .btn button,
  .recruit .join .completeBox .btn a,
  .recruit .join .completeBox .btn button,
  .recruit .complete form .btn a,
  .recruit .complete form .btn button,
  .recruit .complete .completeBox .btn a,
  .recruit .complete .completeBox .btn button {
    font-size: 14px;
  }
}
#recruit .find form .btn a:hover,
#recruit .find form .btn button:hover, #recruit .find .completeBox .btn a:hover,
#recruit .find .completeBox .btn button:hover,
#recruit .join form .btn a:hover,
#recruit .join form .btn button:hover,
#recruit .join .completeBox .btn a:hover,
#recruit .join .completeBox .btn button:hover,
#recruit .complete form .btn a:hover,
#recruit .complete form .btn button:hover,
#recruit .complete .completeBox .btn a:hover,
#recruit .complete .completeBox .btn button:hover, .recruit .find form .btn a:hover,
.recruit .find form .btn button:hover, .recruit .find .completeBox .btn a:hover,
.recruit .find .completeBox .btn button:hover,
.recruit .join form .btn a:hover,
.recruit .join form .btn button:hover,
.recruit .join .completeBox .btn a:hover,
.recruit .join .completeBox .btn button:hover,
.recruit .complete form .btn a:hover,
.recruit .complete form .btn button:hover,
.recruit .complete .completeBox .btn a:hover,
.recruit .complete .completeBox .btn button:hover {
  border-color: #4415a0;
  color: #4415a0;
}
#recruit .find form .btns, #recruit .find .completeBox .btns,
#recruit .join form .btns,
#recruit .join .completeBox .btns,
#recruit .complete form .btns,
#recruit .complete .completeBox .btns, .recruit .find form .btns, .recruit .find .completeBox .btns,
.recruit .join form .btns,
.recruit .join .completeBox .btns,
.recruit .complete form .btns,
.recruit .complete .completeBox .btns {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .find form .btns a, #recruit .find .completeBox .btns a,
#recruit .join form .btns a,
#recruit .join .completeBox .btns a,
#recruit .complete form .btns a,
#recruit .complete .completeBox .btns a, .recruit .find form .btns a, .recruit .find .completeBox .btns a,
.recruit .join form .btns a,
.recruit .join .completeBox .btns a,
.recruit .complete form .btns a,
.recruit .complete .completeBox .btns a {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .find form .btns a, #recruit .find .completeBox .btns a,
  #recruit .join form .btns a,
  #recruit .join .completeBox .btns a,
  #recruit .complete form .btns a,
  #recruit .complete .completeBox .btns a, .recruit .find form .btns a, .recruit .find .completeBox .btns a,
  .recruit .join form .btns a,
  .recruit .join .completeBox .btns a,
  .recruit .complete form .btns a,
  .recruit .complete .completeBox .btns a {
    font-size: 14px;
  }
}
#recruit .find form .btns a:hover, #recruit .find .completeBox .btns a:hover,
#recruit .join form .btns a:hover,
#recruit .join .completeBox .btns a:hover,
#recruit .complete form .btns a:hover,
#recruit .complete .completeBox .btns a:hover, .recruit .find form .btns a:hover, .recruit .find .completeBox .btns a:hover,
.recruit .join form .btns a:hover,
.recruit .join .completeBox .btns a:hover,
.recruit .complete form .btns a:hover,
.recruit .complete .completeBox .btns a:hover {
  border-color: #4415a0;
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find form .btns a, #recruit .find .completeBox .btns a,
  #recruit .join form .btns a,
  #recruit .join .completeBox .btns a,
  #recruit .complete form .btns a,
  #recruit .complete .completeBox .btns a, .recruit .find form .btns a, .recruit .find .completeBox .btns a,
  .recruit .join form .btns a,
  .recruit .join .completeBox .btns a,
  .recruit .complete form .btns a,
  .recruit .complete .completeBox .btns a {
    margin-top: 50px;
    width: calc(50% - 10px);
  }
  #recruit .find form .btns a + a, #recruit .find .completeBox .btns a + a,
  #recruit .join form .btns a + a,
  #recruit .join .completeBox .btns a + a,
  #recruit .complete form .btns a + a,
  #recruit .complete .completeBox .btns a + a, .recruit .find form .btns a + a, .recruit .find .completeBox .btns a + a,
  .recruit .join form .btns a + a,
  .recruit .join .completeBox .btns a + a,
  .recruit .complete form .btns a + a,
  .recruit .complete .completeBox .btns a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form .btns a, #recruit .find .completeBox .btns a,
  #recruit .join form .btns a,
  #recruit .join .completeBox .btns a,
  #recruit .complete form .btns a,
  #recruit .complete .completeBox .btns a, .recruit .find form .btns a, .recruit .find .completeBox .btns a,
  .recruit .join form .btns a,
  .recruit .join .completeBox .btns a,
  .recruit .complete form .btns a,
  .recruit .complete .completeBox .btns a {
    margin-top: 40px;
    width: calc(50% - 5px);
  }
  #recruit .find form .btns a + a, #recruit .find .completeBox .btns a + a,
  #recruit .join form .btns a + a,
  #recruit .join .completeBox .btns a + a,
  #recruit .complete form .btns a + a,
  #recruit .complete .completeBox .btns a + a, .recruit .find form .btns a + a, .recruit .find .completeBox .btns a + a,
  .recruit .join form .btns a + a,
  .recruit .join .completeBox .btns a + a,
  .recruit .complete form .btns a + a,
  .recruit .complete .completeBox .btns a + a {
    margin-left: 10px;
  }
}
@media (min-width: 1025px) {
  #recruit .find form, #recruit .find .completeBox,
  #recruit .join form,
  #recruit .join .completeBox,
  #recruit .complete form,
  #recruit .complete .completeBox, .recruit .find form, .recruit .find .completeBox,
  .recruit .join form,
  .recruit .join .completeBox,
  .recruit .complete form,
  .recruit .complete .completeBox {
    margin-top: 40px;
    padding: 30px 50px 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .find form, #recruit .find .completeBox,
  #recruit .join form,
  #recruit .join .completeBox,
  #recruit .complete form,
  #recruit .complete .completeBox, .recruit .find form, .recruit .find .completeBox,
  .recruit .join form,
  .recruit .join .completeBox,
  .recruit .complete form,
  .recruit .complete .completeBox {
    margin-top: 20px;
    padding: 40px 20px;
  }
}
#recruit .find.result > p,
#recruit .join.result > p,
#recruit .complete.result > p, .recruit .find.result > p,
.recruit .join.result > p,
.recruit .complete.result > p {
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find.result > p,
  #recruit .join.result > p,
  #recruit .complete.result > p, .recruit .find.result > p,
  .recruit .join.result > p,
  .recruit .complete.result > p {
    padding-top: 30px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > p,
  #recruit .join.result > p,
  #recruit .complete.result > p, .recruit .find.result > p,
  .recruit .join.result > p,
  .recruit .complete.result > p {
    padding-top: 14px;
  }
}
#recruit .find.result > div,
#recruit .join.result > div,
#recruit .complete.result > div, .recruit .find.result > div,
.recruit .join.result > div,
.recruit .complete.result > div {
  border: 1px solid #c8c8c8;
  background-color: #fff;
}
#recruit .find.result > div:not(.logout),
#recruit .join.result > div:not(.logout),
#recruit .complete.result > div:not(.logout), .recruit .find.result > div:not(.logout),
.recruit .join.result > div:not(.logout),
.recruit .complete.result > div:not(.logout) {
  background-image: url("../images/shinyoungRecruit/imgResult.png");
  background-repeat: no-repeat;
  background-size: 80px auto;
}
#recruit .find.result > div.withdrawal,
#recruit .join.result > div.withdrawal,
#recruit .complete.result > div.withdrawal, .recruit .find.result > div.withdrawal,
.recruit .join.result > div.withdrawal,
.recruit .complete.result > div.withdrawal {
  font-weight: 700;
  background-image: url("../images/shinyoungRecruit/imgWithdrawal.png");
}
#recruit .find.result > div p strong,
#recruit .join.result > div p strong,
#recruit .complete.result > div p strong, .recruit .find.result > div p strong,
.recruit .join.result > div p strong,
.recruit .complete.result > div p strong {
  color: #4415a0;
}
#recruit .find.result > div span,
#recruit .join.result > div span,
#recruit .complete.result > div span, .recruit .find.result > div span,
.recruit .join.result > div span,
.recruit .complete.result > div span {
  display: block;
}
@media (min-width: 1025px) {
  #recruit .find.result > div span,
  #recruit .join.result > div span,
  #recruit .complete.result > div span, .recruit .find.result > div span,
  .recruit .join.result > div span,
  .recruit .complete.result > div span {
    margin-top: 16px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div span,
  #recruit .join.result > div span,
  #recruit .complete.result > div span, .recruit .find.result > div span,
  .recruit .join.result > div span,
  .recruit .complete.result > div span {
    margin-top: 20px;
  }
}
@media (min-width: 1025px) {
  #recruit .find.result > div span + dl,
  #recruit .join.result > div span + dl,
  #recruit .complete.result > div span + dl, .recruit .find.result > div span + dl,
  .recruit .join.result > div span + dl,
  .recruit .complete.result > div span + dl {
    margin-top: 6px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div span + dl,
  #recruit .join.result > div span + dl,
  #recruit .complete.result > div span + dl, .recruit .find.result > div span + dl,
  .recruit .join.result > div span + dl,
  .recruit .complete.result > div span + dl {
    margin-top: 13px;
  }
}
#recruit .find.result > div dl,
#recruit .join.result > div dl,
#recruit .complete.result > div dl, .recruit .find.result > div dl,
.recruit .join.result > div dl,
.recruit .complete.result > div dl {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 20px;
}
#recruit .find.result > div dl dt::after,
#recruit .join.result > div dl dt::after,
#recruit .complete.result > div dl dt::after, .recruit .find.result > div dl dt::after,
.recruit .join.result > div dl dt::after,
.recruit .complete.result > div dl dt::after {
  content: "ㅣ";
  padding: 0 10px;
  color: #c8c8c8;
}
#recruit .find.result > div .btns,
#recruit .join.result > div .btns,
#recruit .complete.result > div .btns, .recruit .find.result > div .btns,
.recruit .join.result > div .btns,
.recruit .complete.result > div .btns {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#recruit .find.result > div .btns a:first-child,
#recruit .join.result > div .btns a:first-child,
#recruit .complete.result > div .btns a:first-child, .recruit .find.result > div .btns a:first-child,
.recruit .join.result > div .btns a:first-child,
.recruit .complete.result > div .btns a:first-child {
  display: inline-block;
  width: 100%;
  border: 1px solid #4415a0;
  border-radius: 25px;
  background: #4415a0;
  text-align: center;
  line-height: 50px;
  color: #fff;
}
@media (max-width: 1024px) {
  #recruit .find.result > div .btns a:first-child,
  #recruit .join.result > div .btns a:first-child,
  #recruit .complete.result > div .btns a:first-child, .recruit .find.result > div .btns a:first-child,
  .recruit .join.result > div .btns a:first-child,
  .recruit .complete.result > div .btns a:first-child {
    font-size: 14px;
  }
}
#recruit .find.result > div .btns a:last-child,
#recruit .join.result > div .btns a:last-child,
#recruit .complete.result > div .btns a:last-child, .recruit .find.result > div .btns a:last-child,
.recruit .join.result > div .btns a:last-child,
.recruit .complete.result > div .btns a:last-child {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .find.result > div .btns a:last-child,
  #recruit .join.result > div .btns a:last-child,
  #recruit .complete.result > div .btns a:last-child, .recruit .find.result > div .btns a:last-child,
  .recruit .join.result > div .btns a:last-child,
  .recruit .complete.result > div .btns a:last-child {
    font-size: 14px;
  }
}
#recruit .find.result > div .btns a:last-child:hover,
#recruit .join.result > div .btns a:last-child:hover,
#recruit .complete.result > div .btns a:last-child:hover, .recruit .find.result > div .btns a:last-child:hover,
.recruit .join.result > div .btns a:last-child:hover,
.recruit .complete.result > div .btns a:last-child:hover {
  border-color: #4415a0;
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find.result > div .btns a,
  #recruit .join.result > div .btns a,
  #recruit .complete.result > div .btns a, .recruit .find.result > div .btns a,
  .recruit .join.result > div .btns a,
  .recruit .complete.result > div .btns a {
    margin-top: 50px;
    width: calc(50% - 10px);
  }
  #recruit .find.result > div .btns a + a,
  #recruit .join.result > div .btns a + a,
  #recruit .complete.result > div .btns a + a, .recruit .find.result > div .btns a + a,
  .recruit .join.result > div .btns a + a,
  .recruit .complete.result > div .btns a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div .btns a,
  #recruit .join.result > div .btns a,
  #recruit .complete.result > div .btns a, .recruit .find.result > div .btns a,
  .recruit .join.result > div .btns a,
  .recruit .complete.result > div .btns a {
    margin-top: 40px;
    width: calc(50% - 5px);
    font-size: 14px;
  }
  #recruit .find.result > div .btns a + a,
  #recruit .join.result > div .btns a + a,
  #recruit .complete.result > div .btns a + a, .recruit .find.result > div .btns a + a,
  .recruit .join.result > div .btns a + a,
  .recruit .complete.result > div .btns a + a {
    margin-left: 10px;
  }
}
#recruit .find.result > div.logout.case,
#recruit .join.result > div.logout.case,
#recruit .complete.result > div.logout.case, .recruit .find.result > div.logout.case,
.recruit .join.result > div.logout.case,
.recruit .complete.result > div.logout.case {
  background-image: url("../images/shinyoungRecruit/imgLogout.png");
  background-repeat: no-repeat;
  background-size: 80px auto;
}
@media (min-width: 1025px) {
  #recruit .find.result > div.logout.case,
  #recruit .join.result > div.logout.case,
  #recruit .complete.result > div.logout.case, .recruit .find.result > div.logout.case,
  .recruit .join.result > div.logout.case,
  .recruit .complete.result > div.logout.case {
    padding-top: 156px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div.logout.case,
  #recruit .join.result > div.logout.case,
  #recruit .complete.result > div.logout.case, .recruit .find.result > div.logout.case,
  .recruit .join.result > div.logout.case,
  .recruit .complete.result > div.logout.case {
    padding-top: 145px;
  }
}
#recruit .find.result > div.logout.case > strong,
#recruit .join.result > div.logout.case > strong,
#recruit .complete.result > div.logout.case > strong, .recruit .find.result > div.logout.case > strong,
.recruit .join.result > div.logout.case > strong,
.recruit .complete.result > div.logout.case > strong {
  color: #212121;
}
#recruit .find.result > div.logout > button,
#recruit .join.result > div.logout > button,
#recruit .complete.result > div.logout > button, .recruit .find.result > div.logout > button,
.recruit .join.result > div.logout > button,
.recruit .complete.result > div.logout > button {
  position: relative;
  width: 100%;
  text-align: left;
  color: #212121;
}
#recruit .find.result > div.logout > button:hover,
#recruit .join.result > div.logout > button:hover,
#recruit .complete.result > div.logout > button:hover, .recruit .find.result > div.logout > button:hover,
.recruit .join.result > div.logout > button:hover,
.recruit .complete.result > div.logout > button:hover {
  font-weight: 700;
  color: #4415a0;
}
#recruit .find.result > div.logout > button:hover::after,
#recruit .join.result > div.logout > button:hover::after,
#recruit .complete.result > div.logout > button:hover::after, .recruit .find.result > div.logout > button:hover::after,
.recruit .join.result > div.logout > button:hover::after,
.recruit .complete.result > div.logout > button:hover::after {
  border-color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find.result > div.logout > button + button,
  #recruit .join.result > div.logout > button + button,
  #recruit .complete.result > div.logout > button + button, .recruit .find.result > div.logout > button + button,
  .recruit .join.result > div.logout > button + button,
  .recruit .complete.result > div.logout > button + button {
    margin-top: 38px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div.logout > button + button,
  #recruit .join.result > div.logout > button + button,
  #recruit .complete.result > div.logout > button + button, .recruit .find.result > div.logout > button + button,
  .recruit .join.result > div.logout > button + button,
  .recruit .complete.result > div.logout > button + button {
    margin-top: 20px;
  }
}
#recruit .find.result > div.logout > button::after,
#recruit .join.result > div.logout > button::after,
#recruit .complete.result > div.logout > button::after, .recruit .find.result > div.logout > button::after,
.recruit .join.result > div.logout > button::after,
.recruit .complete.result > div.logout > button::after {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#recruit .find.result > div.logout .btnsCase a,
#recruit .join.result > div.logout .btnsCase a,
#recruit .complete.result > div.logout .btnsCase a, .recruit .find.result > div.logout .btnsCase a,
.recruit .join.result > div.logout .btnsCase a,
.recruit .complete.result > div.logout .btnsCase a {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .find.result > div.logout .btnsCase a,
  #recruit .join.result > div.logout .btnsCase a,
  #recruit .complete.result > div.logout .btnsCase a, .recruit .find.result > div.logout .btnsCase a,
  .recruit .join.result > div.logout .btnsCase a,
  .recruit .complete.result > div.logout .btnsCase a {
    font-size: 14px;
  }
}
#recruit .find.result > div.logout .btnsCase a:hover,
#recruit .join.result > div.logout .btnsCase a:hover,
#recruit .complete.result > div.logout .btnsCase a:hover, .recruit .find.result > div.logout .btnsCase a:hover,
.recruit .join.result > div.logout .btnsCase a:hover,
.recruit .complete.result > div.logout .btnsCase a:hover {
  border-color: #4415a0;
  color: #4415a0;
}
@media (min-width: 1025px) {
  #recruit .find.result > div.logout .btnsCase,
  #recruit .join.result > div.logout .btnsCase,
  #recruit .complete.result > div.logout .btnsCase, .recruit .find.result > div.logout .btnsCase,
  .recruit .join.result > div.logout .btnsCase,
  .recruit .complete.result > div.logout .btnsCase {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 50px;
  }
  #recruit .find.result > div.logout .btnsCase a,
  #recruit .join.result > div.logout .btnsCase a,
  #recruit .complete.result > div.logout .btnsCase a, .recruit .find.result > div.logout .btnsCase a,
  .recruit .join.result > div.logout .btnsCase a,
  .recruit .complete.result > div.logout .btnsCase a {
    width: calc(50% - 10px);
  }
  #recruit .find.result > div.logout .btnsCase a + a,
  #recruit .join.result > div.logout .btnsCase a + a,
  #recruit .complete.result > div.logout .btnsCase a + a, .recruit .find.result > div.logout .btnsCase a + a,
  .recruit .join.result > div.logout .btnsCase a + a,
  .recruit .complete.result > div.logout .btnsCase a + a {
    margin-left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div.logout .btnsCase,
  #recruit .join.result > div.logout .btnsCase,
  #recruit .complete.result > div.logout .btnsCase, .recruit .find.result > div.logout .btnsCase,
  .recruit .join.result > div.logout .btnsCase,
  .recruit .complete.result > div.logout .btnsCase {
    margin-top: 40px;
  }
  #recruit .find.result > div.logout .btnsCase a + a,
  #recruit .join.result > div.logout .btnsCase a + a,
  #recruit .complete.result > div.logout .btnsCase a + a, .recruit .find.result > div.logout .btnsCase a + a,
  .recruit .join.result > div.logout .btnsCase a + a,
  .recruit .complete.result > div.logout .btnsCase a + a {
    margin-top: 10px;
  }
}
@media (min-width: 1025px) {
  #recruit .find.result > div,
  #recruit .join.result > div,
  #recruit .complete.result > div, .recruit .find.result > div,
  .recruit .join.result > div,
  .recruit .complete.result > div {
    margin-top: 40px;
    padding: 150px 50px 50px;
    background-position: 50px 50px;
  }
  #recruit .find.result > div.logout,
  #recruit .join.result > div.logout,
  #recruit .complete.result > div.logout, .recruit .find.result > div.logout,
  .recruit .join.result > div.logout,
  .recruit .complete.result > div.logout {
    padding-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .find.result > div,
  #recruit .join.result > div,
  #recruit .complete.result > div, .recruit .find.result > div,
  .recruit .join.result > div,
  .recruit .complete.result > div {
    margin-top: 20px;
    padding: 145px 20px 40px;
    background-position: 20px 40px;
  }
  #recruit .find.result > div.logout,
  #recruit .join.result > div.logout,
  #recruit .complete.result > div.logout, .recruit .find.result > div.logout,
  .recruit .join.result > div.logout,
  .recruit .complete.result > div.logout {
    padding-top: 40px;
  }
}
@media (min-width: 1025px) {
  #recruit .completeBox h3, .recruit .completeBox h3 {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
@media (max-width: 1024px) {
  #recruit .completeBox h3, .recruit .completeBox h3 {
    text-align: center;
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
  }
}
#recruit .completeBox p, .recruit .completeBox p {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
}
@media (min-width: 1025px) {
  #recruit .completeBox p, .recruit .completeBox p {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #recruit .completeBox p, .recruit .completeBox p {
    margin-top: 15px;
  }
}
#recruit .completeBox p a, .recruit .completeBox p a {
  font-weight: 700;
  text-decoration: underline;
}
#recruit .completeBox dl, .recruit .completeBox dl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#recruit .completeBox dl dt, .recruit .completeBox dl dt {
  width: 145px;
}
#recruit .completeBox dl dd, .recruit .completeBox dl dd {
  width: calc(100% - 145px);
  font-weight: 700;
  color: #212121;
}
@media (min-width: 1025px) {
  #recruit .completeBox dl, .recruit .completeBox dl {
    margin-top: 20px;
  }
  #recruit .completeBox dl > *, .recruit .completeBox dl > * {
    margin-top: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .completeBox dl, .recruit .completeBox dl {
    margin-top: 8px;
  }
  #recruit .completeBox dl > *, .recruit .completeBox dl > * {
    margin-top: 12px;
  }
}
@media (min-width: 1025px) {
  #recruit .join form, .recruit .join form {
    padding-top: 56px;
  }
}
@media (max-width: 1024px) {
  #recruit .join form, .recruit .join form {
    padding-top: 45px;
  }
}
@media (min-width: 1025px) {
  #recruit .join section + section, #recruit .join #phoneCertify + section, .recruit .join section + section, .recruit .join #phoneCertify + section {
    margin-top: 66px;
  }
}
@media (max-width: 1024px) {
  #recruit .join section + section, #recruit .join #phoneCertify + section, .recruit .join section + section, .recruit .join #phoneCertify + section {
    margin-top: 55px;
  }
}
@media (min-width: 1025px) {
  #recruit .join section header, .recruit .join section header {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
  }
  #recruit .join section header .required, .recruit .join section header .required {
    padding-top: 4px;
  }
}
@media (max-width: 1024px) {
  #recruit .join section header .required, .recruit .join section header .required {
    padding-top: 13px;
  }
}
#recruit .join .agreement, .recruit .join .agreement {
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 18px 15px;
  border: 1px solid #c8c8c8;
  overflow: auto;
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0;
}
#recruit .join .agreement > * + *, .recruit .join .agreement > * + * {
  margin-top: 10px;
}
@media (min-width: 1025px) {
  #recruit .join .agreement, .recruit .join .agreement {
    height: 202px;
  }
}
@media (max-width: 1024px) {
  #recruit .join .agreement, .recruit .join .agreement {
    height: 222px;
  }
}
#recruit .join .agreement > ol, .recruit .join .agreement > ol {
  padding-left: 20px;
}
#recruit .join .agreement > ol > li + li, .recruit .join .agreement > ol > li + li {
  margin-top: 5px;
}
#recruit .join .agreement h4, .recruit .join .agreement h4 {
  font-weight: 400;
  color: #212121;
}
#recruit .join .agreement h4:not(:first-of-type), .recruit .join .agreement h4:not(:first-of-type) {
  margin-top: 23px;
}
#recruit .join .agreement > *:not(h4), .recruit .join .agreement > *:not(h4) {
  font-weight: 300;
  color: #666;
}
#recruit .join .agreement > *:not(h4) b, .recruit .join .agreement > *:not(h4) b {
  font-weight: 400;
}
#recruit .join .phoneCertify, .recruit .join .phoneCertify {
  border-radius: 4px;
  background: #f9f9f9;
}
#recruit .join .phoneCertify p, .recruit .join .phoneCertify p {
  background-image: url("../images/shinyoungRecruit/iconCertify.png");
  background-repeat: no-repeat;
  word-break: keep-all;
}
#recruit .join .phoneCertify p strong, .recruit .join .phoneCertify p strong {
  display: block;
  margin-bottom: 5px;
  color: #212121;
}
#recruit .join .phoneCertify button, .recruit .join .phoneCertify button {
  display: inline-block;
  width: 100%;
  border: 1px solid #c8c8c8;
  border-radius: 25px;
  background: #fff;
  text-align: center;
  line-height: 50px;
  color: #212121;
}
@media (max-width: 1024px) {
  #recruit .join .phoneCertify button, .recruit .join .phoneCertify button {
    font-size: 14px;
  }
}
#recruit .join .phoneCertify button:hover, .recruit .join .phoneCertify button:hover {
  border-color: #4415a0;
  color: #4415a0;
}
#recruit .join .phoneCertify > strong, .recruit .join .phoneCertify > strong {
  display: block;
  margin: 10px 0;
  background: url("../images/shinyoungRecruit/iconChecked.png") no-repeat center top;
  text-align: center;
  color: #212121;
}
@media (min-width: 1025px) {
  #recruit .join .phoneCertify, .recruit .join .phoneCertify {
    padding: 40px 50px;
  }
  #recruit .join .phoneCertify p, .recruit .join .phoneCertify p {
    padding-left: 80px;
    background-size: 50px auto;
    background-position: 10px 5px;
  }
  #recruit .join .phoneCertify button, .recruit .join .phoneCertify button {
    margin-top: 30px;
  }
  #recruit .join .phoneCertify strong, .recruit .join .phoneCertify strong {
    padding-top: 80px;
    background-size: 60px auto;
  }
}
@media (max-width: 1024px) {
  #recruit .join .phoneCertify, .recruit .join .phoneCertify {
    padding: 20px;
  }
  #recruit .join .phoneCertify p, .recruit .join .phoneCertify p {
    padding-left: 50px;
    background-size: 40px auto;
    background-position: left 3px;
  }
  #recruit .join .phoneCertify button, .recruit .join .phoneCertify button {
    margin-top: 20px;
  }
  #recruit .join .phoneCertify strong, .recruit .join .phoneCertify strong {
    padding-top: 60px;
    background-size: 40px auto;
  }
}
@media (max-width: 1024px) {
  #recruit .join label.check span, .recruit .join label.check span {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
}
#recruit .question,
#recruit .answer, .recruit .question,
.recruit .answer {
  position: relative;
}
@media (max-width: 1024px) {
  #recruit .question,
  #recruit .answer, .recruit .question,
  .recruit .answer {
    padding-top: 107px;
  }
}
#recruit .question .name,
#recruit .answer .name, .recruit .question .name,
.recruit .answer .name {
  position: absolute;
}
@media (min-width: 1025px) {
  #recruit .question .name,
  #recruit .answer .name, .recruit .question .name,
  .recruit .answer .name {
    width: 80px;
    text-align: center;
    word-spacing: 9999px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
  }
  #recruit .question .name img,
  #recruit .answer .name img, .recruit .question .name img,
  .recruit .answer .name img {
    display: block;
    margin-bottom: 15px;
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 1024px) {
  #recruit .question .name,
  #recruit .answer .name, .recruit .question .name,
  .recruit .answer .name {
    top: 47px;
    font-size: 18px;
    line-height: 50px;
  }
  #recruit .question .name img,
  #recruit .answer .name img, .recruit .question .name img,
  .recruit .answer .name img {
    width: 50px;
    height: 50px;
  }
}
#recruit .question h1,
#recruit .answer h1, .recruit .question h1,
.recruit .answer h1 {
  background: #4415a0;
  text-align: center;
  font-weight: 400;
  color: #fff;
}
@media (min-width: 1025px) {
  #recruit .question h1,
  #recruit .answer h1, .recruit .question h1,
  .recruit .answer h1 {
    width: 142px;
    font-size: 24px;
    line-height: 54px;
    border-radius: 27px;
  }
}
@media (max-width: 1024px) {
  #recruit .question h1,
  #recruit .answer h1, .recruit .question h1,
  .recruit .answer h1 {
    width: 80px;
    font-size: 14px;
    line-height: 30px;
    border-radius: 15px;
  }
}
@media (min-width: 1025px) {
  #recruit .question dl,
  #recruit .answer dl, .recruit .question dl,
  .recruit .answer dl {
    font-size: 18px;
    line-height: 28px;
    letter-spacing: -0.015em;
  }
}
@media (max-width: 1024px) {
  #recruit .question dl,
  #recruit .answer dl, .recruit .question dl,
  .recruit .answer dl {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
}
#recruit .question dt,
#recruit .answer dt, .recruit .question dt,
.recruit .answer dt {
  font-weight: 700;
}
#recruit .question dd,
#recruit .answer dd, .recruit .question dd,
.recruit .answer dd {
  color: #666;
}
#recruit .question .info,
#recruit .answer .info, .recruit .question .info,
.recruit .answer .info {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  background: #f9f9f9;
  border-radius: 8px;
  -ms-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
  -o-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
  box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
  word-break: break-all;
}
#recruit .question .info a:hover,
#recruit .question .info a:focus,
#recruit .answer .info a:hover,
#recruit .answer .info a:focus, .recruit .question .info a:hover,
.recruit .question .info a:focus,
.recruit .answer .info a:hover,
.recruit .answer .info a:focus {
  text-decoration: underline;
}
@media (min-width: 1025px) {
  #recruit .question .info,
  #recruit .answer .info, .recruit .question .info,
  .recruit .answer .info {
    margin-top: 25px;
    width: 375px;
    padding: 40px;
  }
  #recruit .question .info > *:not(:first-of-type),
  #recruit .answer .info > *:not(:first-of-type), .recruit .question .info > *:not(:first-of-type),
  .recruit .answer .info > *:not(:first-of-type) {
    margin-top: 25px;
  }
  #recruit .question .info dt,
  #recruit .answer .info dt, .recruit .question .info dt,
  .recruit .answer .info dt {
    width: 135px;
  }
  #recruit .question .info dd,
  #recruit .answer .info dd, .recruit .question .info dd,
  .recruit .answer .info dd {
    width: calc(100% - 135px);
  }
}
@media (max-width: 1024px) {
  #recruit .question .info,
  #recruit .answer .info, .recruit .question .info,
  .recruit .answer .info {
    margin-top: 18px;
    width: 260px;
    padding: 20px;
  }
  #recruit .question .info > *:not(:first-of-type),
  #recruit .answer .info > *:not(:first-of-type), .recruit .question .info > *:not(:first-of-type),
  .recruit .answer .info > *:not(:first-of-type) {
    margin-top: 9px;
  }
  #recruit .question .info dt,
  #recruit .answer .info dt, .recruit .question .info dt,
  .recruit .answer .info dt {
    width: 90px;
  }
  #recruit .question .info dd,
  #recruit .answer .info dd, .recruit .question .info dd,
  .recruit .answer .info dd {
    width: calc(100% - 90px);
  }
}
#recruit .question .content,
#recruit .answer .content, .recruit .question .content,
.recruit .answer .content {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #recruit .question .content,
  #recruit .answer .content, .recruit .question .content,
  .recruit .answer .content {
    margin-top: 30px;
    max-width: 575px;
    padding: 40px;
    background: #f9f9f9;
    border-radius: 8px;
    -ms-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    -o-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    word-break: break-all;
  }
  #recruit .question .content dd,
  #recruit .answer .content dd, .recruit .question .content dd,
  .recruit .answer .content dd {
    margin-top: 22px;
  }
  #recruit .question .content dl:not(:first-of-type),
  #recruit .answer .content dl:not(:first-of-type), .recruit .question .content dl:not(:first-of-type),
  .recruit .answer .content dl:not(:first-of-type) {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px dashed #c8c8c8;
  }
}
@media (max-width: 1024px) {
  #recruit .question .content,
  #recruit .answer .content, .recruit .question .content,
  .recruit .answer .content {
    text-align: right;
  }
  #recruit .question .content span,
  #recruit .answer .content span, .recruit .question .content span,
  .recruit .answer .content span {
    display: block;
  }
  #recruit .question .content dl,
  #recruit .answer .content dl, .recruit .question .content dl,
  .recruit .answer .content dl {
    display: inline-flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 18px;
    max-width: 90%;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 8px;
    -ms-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    -o-box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.129);
    text-align: left;
  }
  #recruit .question .content dl dd,
  #recruit .answer .content dl dd, .recruit .question .content dl dd,
  .recruit .answer .content dl dd {
    margin-top: 5px;
  }
  #recruit .question .content dl::after,
  #recruit .answer .content dl::after, .recruit .question .content dl::after,
  .recruit .answer .content dl::after {
    content: "";
    display: block;
    width: 1px;
    height: 0;
  }
}
#recruit .question, .recruit .question {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-end;
}
@media (min-width: 1025px) {
  #recruit .question, .recruit .question {
    padding-right: 140px;
  }
  #recruit .question .name, .recruit .question .name {
    right: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .question .name, .recruit .question .name {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #recruit .question .name img, .recruit .question .name img {
    margin-left: 10px;
  }
}
#recruit .answer, .recruit .answer {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}
@media (min-width: 1025px) {
  #recruit .answer, .recruit .answer {
    padding-left: 140px;
    padding-bottom: 150px;
  }
  #recruit .answer .name, .recruit .answer .name {
    left: 20px;
  }
}
@media (max-width: 1024px) {
  #recruit .answer, .recruit .answer {
    padding-bottom: 80px;
  }
  #recruit .answer .name, .recruit .answer .name {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #recruit .answer .name img, .recruit .answer .name img {
    margin-right: 10px;
  }
  #recruit .answer .info, .recruit .answer .info {
    width: 160px;
  }
  #recruit .answer .info dt, .recruit .answer .info dt {
    width: 45px;
  }
  #recruit .answer .info dd, .recruit .answer .info dd {
    width: calc(100% - 45px);
  }
}
#recruit .applicationBtn, .recruit .applicationBtn {
  border-top: 1px solid #c8c8c8;
  text-align: center;
}
#recruit .applicationBtn p, .recruit .applicationBtn p {
  color: #4415a0;
}
#recruit .applicationBtn a, .recruit .applicationBtn a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#recruit .applicationBtn a::before, #recruit .applicationBtn a::after, .recruit .applicationBtn a::before, .recruit .applicationBtn a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#recruit .applicationBtn a:not(:disabled):hover, #recruit .applicationBtn a:not(:disabled):focus, .recruit .applicationBtn a:not(:disabled):hover, .recruit .applicationBtn a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#recruit .applicationBtn a:not(:disabled):hover::before, #recruit .applicationBtn a:not(:disabled):hover::after, #recruit .applicationBtn a:not(:disabled):focus::before, #recruit .applicationBtn a:not(:disabled):focus::after, .recruit .applicationBtn a:not(:disabled):hover::before, .recruit .applicationBtn a:not(:disabled):hover::after, .recruit .applicationBtn a:not(:disabled):focus::before, .recruit .applicationBtn a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #recruit .applicationBtn a, .recruit .applicationBtn a {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  #recruit .applicationBtn a::before, .recruit .applicationBtn a::before {
    margin-right: 10px;
  }
  #recruit .applicationBtn a::after, .recruit .applicationBtn a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #recruit .applicationBtn a, .recruit .applicationBtn a {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  #recruit .applicationBtn a::before, .recruit .applicationBtn a::before {
    margin-right: 14px;
  }
  #recruit .applicationBtn a::after, .recruit .applicationBtn a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #recruit .applicationBtn, .recruit .applicationBtn {
    margin-top: 60px;
    padding-top: 85px;
    padding-bottom: 100px;
  }
  #recruit .applicationBtn a, .recruit .applicationBtn a {
    margin-top: 30px;
    width: 255px;
  }
}
@media (max-width: 1024px) {
  #recruit .applicationBtn, .recruit .applicationBtn {
    margin-top: 40px;
    padding-top: 45px;
    padding-bottom: 80px;
  }
  #recruit .applicationBtn button, .recruit .applicationBtn button {
    margin-top: 20px;
    width: 200px;
  }
}

.recruit .selectjob {
  padding-top: 112px;
}
.recruit .selectjob .form {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#recruitFooter {
  background: #141642;
}
#recruitFooter div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#recruitFooter button {
  font-size: 16px;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-weight: 700;
  color: #fff;
}
#recruitFooter p {
  font-size: 13px;
  line-height: 22px;
  color: #949494;
}
@media (min-width: 1025px) {
  #recruitFooter {
    padding: 120px 0;
  }
  #recruitFooter div {
    position: relative;
    padding-left: 105px;
  }
  #recruitFooter div img {
    position: absolute;
    top: 0;
    left: 20px;
  }
  #recruitFooter div button {
    margin-top: 2px;
  }
  #recruitFooter div p {
    margin-top: 18px;
  }
}
@media (max-width: 1024px) {
  #recruitFooter {
    padding: 70px 0 65px;
  }
  #recruitFooter img {
    display: block;
    margin-bottom: 30px;
    width: 27px;
    height: 27px;
  }
  #recruitFooter p {
    margin-top: 10px;
  }
}

#contents.hr .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.hr .heading h1 + p,
#contents.hr .heading p:first-child {
  word-break: keep-all;
}
#contents.hr .heading p + p {
  color: #666;
}
@media (max-width: 640px) {
  #contents.hr .heading p + p br {
    display: none;
  }
}
#contents.hr .heading .tit {
  display: block;
  margin-bottom: 16px;
  font-size: 26px;
  font-weight: 700;
  line-height: 36px;
}
#contents.hr .heading .tit .emph {
  color: #4415a0;
}
#contents.hr .heading .desc {
  line-height: 26px;
}
@media (min-width: 1025px) {
  #contents.hr .tabTarget h1 {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    clip: unset;
  }
  #contents.hr .heading h1 + p {
    margin-top: 45px;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
  #contents.hr .heading p + p {
    margin-top: 30px;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.02em;
    font-weight: 300;
    line-height: 32px;
  }
  #contents.hr .heading + .container .inner {
    padding-top: 0;
  }
  #contents.hr .listHR {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-left: -30px;
  }
  #contents.hr .listHR > li {
    flex: 1;
    margin-top: 30px;
    margin-left: 30px;
    padding: 50px 40px;
    font-size: 18px;
    line-height: 30px;
  }
  #contents.hr .listHR .tit {
    margin: 50px 0 20px;
    font-size: 24px;
    line-height: 36px;
  }
  #contents.hr .wrapIcon img {
    width: 80px;
  }
  #contents.hr p + .dot {
    margin-top: 20px;
  }
  #contents.hr .dot li {
    font-size: 18px;
  }
  #contents.hr .dot li:before {
    top: 12px;
    width: 5px;
    height: 5px;
  }
  #contents.hr #philosophy .listHR > li,
  #contents.hr #system .listHR > li {
    flex: none;
    width: calc(50% - 30px);
  }
}
#contents.hr.encAu .container > .inner {
  padding-top: 0;
}
#contents.hr.encAu .container > .inner > .tit {
  padding-top: 40px;
  padding-bottom: 20px;
}
#contents.hr.encAu .container > .inner > .tit:first-child {
  padding-top: 0;
}
#contents.hr.encAu .imgRank {
  overflow: hidden;
  position: relative;
  margin-bottom: 20px;
  padding: 20px 0;
}
#contents.hr.encAu .imgRank .dimmed {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.6);
}
#contents.hr.encAu .imgRank .dimmed .bar {
  position: relative;
  width: 185px;
  height: 30px;
  margin-bottom: 20px;
  border-radius: 15px;
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 5%, rgb(255, 255, 255) 100%);
}
#contents.hr.encAu .imgRank .dimmed .bar:after {
  content: "";
  position: absolute;
  top: 7px;
  left: 20px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #fff;
  animation: slide 3s 0.5s infinite ease-in;
}
@keyframes slide {
  0% {
    transform: translateX(0);
  }
  50%, 100% {
    transform: translateX(140px);
  }
}
#contents.hr.encAu .imgRank.active {
  overflow: auto;
  transition: all 0.3s;
}
#contents.hr.encAu .imgRank.active .dimmed {
  z-index: -1;
  opacity: 0;
  transition: all 0.3s;
}
#contents.hr.encAu .listCard {
  margin-top: 0;
}
@media (min-width: 1025px) {
  #contents.hr.encAu .container > .inner {
    margin-top: -10px;
  }
  #contents.hr.encAu .container > .inner > .tit {
    padding-bottom: 0;
  }
  #contents.hr.encAu .listHR {
    margin-top: 0;
  }
  #contents.hr.encAu .listHR + .tit {
    margin-top: 80px;
  }
  #contents.hr.encAu .wrapIcon img {
    width: 80px;
  }
  #contents.hr.encAu p + .dot {
    margin-top: 20px;
  }
  #contents.hr.encAu .dot li {
    font-size: 18px;
  }
  #contents.hr.encAu .dot li:before {
    top: 12px;
    width: 5px;
    height: 5px;
  }
  #contents.hr.encAu #qualified .listHR > li,
  #contents.hr.encAu #system .listHR > li {
    flex: none;
    width: calc(50% - 30px);
  }
  #contents.hr.encAu .imgRank {
    margin: 40px 0 100px;
  }
  #contents.hr.encAu .imgRank .dimmed {
    display: none;
  }
  #contents.hr.encAu #reward-system .listHR > li {
    flex: none;
    width: calc(33.3333333333% - 30px);
  }
}

#contents.jobinfo .heading {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.jobinfo .heading h1 + p,
#contents.jobinfo .heading p:first-child {
  word-break: keep-all;
}
@media (max-width: 640px) {
  #contents.jobinfo .heading h1 + p br,
  #contents.jobinfo .heading p:first-child br {
    display: none;
  }
}
#contents.jobinfo .collapse li {
  border-bottom: 1px solid #c8c8c8;
}
#contents.jobinfo .collapse li > button {
  position: relative;
  width: 100%;
  text-align: left;
  font-weight: 700;
  word-break: keep-all;
  color: #212121;
}
#contents.jobinfo .collapse li > button::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 18px;
  height: 10px;
  background: url("../images/icon/iconArrow2.svg") no-repeat center;
}
@media (min-width: 1025px) {
  #contents.jobinfo .collapse li > button::after {
    right: 15px;
  }
}
@media (max-width: 1024px) {
  #contents.jobinfo .collapse li > button::after {
    right: 20px;
  }
}
#contents.jobinfo .collapse li > button:not(.on)::after {
  transform: rotate(180deg);
}
@media (min-width: 1025px) {
  #contents.jobinfo .collapse li > button {
    padding: 40px 55px 40px 0;
  }
}
@media (max-width: 1024px) {
  #contents.jobinfo .collapse li > button {
    padding: 25px 55px 25px 0;
  }
}
#contents.jobinfo .collapse li > div {
  display: none;
  border-top: 1px solid #212121;
}
@media (min-width: 1025px) {
  #contents.jobinfo .collapse li > div {
    padding: 40px 0;
  }
}
@media (max-width: 1024px) {
  #contents.jobinfo .collapse li > div {
    padding: 20px 0 25px;
  }
}
#contents.jobinfo .collapse li > button {
  padding: 20px 55px 20px 0;
  display: inline-flex;
  align-items: center;
}
#contents.jobinfo .collapse {
  margin-top: -10px !important;
  word-break: keep-all;
}
#contents.jobinfo .collapse button {
  display: inline-flex;
  align-items: center;
  font-size: 22px;
}
#contents.jobinfo .collapse button img {
  margin-right: 15px;
}
#contents.jobinfo .collapse div .emph {
  display: block;
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 400;
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.jobinfo .heading h1 + p {
    margin-top: 45px;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
    line-height: 42px;
  }
  #contents.jobinfo .collapse {
    margin-top: 0;
  }
  #contents.jobinfo .collapse li {
    position: relative;
  }
  #contents.jobinfo .collapse li:before, #contents.jobinfo .collapse li:last-child::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 320px;
    background-color: #c8c8c8;
    height: 1px;
  }
  #contents.jobinfo .collapse li:last-child::after {
    top: unset;
    bottom: 0;
  }
  #contents.jobinfo .collapse:first-of-type::before {
    display: none;
  }
  #contents.jobinfo .collapse > button {
    font-size: 30px;
    padding: 40px 55px 40px 0;
  }
  #contents.jobinfo .collapse > div {
    position: relative;
    border-top: 0;
  }
  #contents.jobinfo .collapse > div:before {
    content: "";
    position: absolute;
    top: 0;
    left: 320px;
    right: 0;
    height: 1px;
    background-color: #212121;
  }
  #contents.jobinfo .collapse button .emph {
    position: absolute;
    flex: none;
    width: 100% !important;
    padding-left: 320px;
    padding-right: 40px;
    margin-left: auto;
    margin-bottom: 0;
    font-weight: 400;
    font-size: 22px;
    line-height: 34px;
  }
  #contents.jobinfo .collapse .accordion + div .emph {
    display: none;
  }
  #contents.jobinfo .collapse .txt {
    padding-left: 320px;
  }
}
#contents.benefits > .shortcutMiddle {
  margin-bottom: 40px;
}
#contents.benefits .detailContainer > header {
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.benefits .detailContainer > header > div {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 100px 0;
}
#contents.benefits .detailContainer > header button {
  text-align: left;
  font-size: 30px;
  line-height: 40px;
  letter-spacing: -0.025em;
}
#contents.benefits .detailContainer > header button + button {
  margin-top: 20px;
}
#contents.benefits .detailContainer > header button:not(.active) {
  font-weight: 300;
  color: #b2b2b2;
}
#contents.benefits .detailContainer > header button.active {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  color: #4415a0;
}
#contents.benefits .detailContainer > header button.active::after {
  content: "";
  margin-left: 17px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #4415a0;
}
#contents.benefits .detailContainer > section > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.benefits .detailContainer > section .title {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.benefits .detailContainer > section > div {
    padding-left: 335px;
  }
  #contents.benefits .detailContainer > section h1 {
    position: absolute;
    display: inline-block;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
  }
  #contents.benefits .detailContainer > section .title {
    font-size: 36px;
    line-height: 48px;
    letter-spacing: -0.03em;
    font-weight: 400;
  }
}
@media (max-width: 1024px) {
  #contents.benefits .detailContainer > header {
    display: none;
  }
  #contents.benefits .detailContainer > section h1 {
    margin-bottom: 23px;
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: #4415a0;
  }
  #contents.benefits .detailContainer > section .title {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 400;
  }
}
@media (max-width: 1024px) and (max-width: 480px) {
  #contents.benefits .detailContainer > section .title {
    width: 250px;
  }
}
#contents.benefits .detailContainer > section:first-of-type {
  padding-top: 0;
}
@media (min-width: 1025px) {
  #contents.benefits > header hgroup {
    padding-bottom: 0;
  }
  #contents.benefits .detailContainer > section:first-of-type {
    padding-top: 100px;
  }
  #contents.benefits .listCard {
    margin-top: 10px;
  }
}

@media (max-width: 1024px) {
  #contents.recruitProcess .container .inner {
    padding-top: 0 !important;
  }
}
#contents.recruitProcess .infoProcess {
  overflow: hidden;
  position: relative;
  margin-top: 40px;
  border-radius: 10px;
}
#contents.recruitProcess .infoProcess:after {
  content: "";
  position: absolute;
  top: 43px;
  left: 37px;
  bottom: 43px;
  width: 1px;
  background-color: #fff;
}
#contents.recruitProcess .infoProcess:before {
  content: "";
  position: absolute;
  bottom: 44px;
  left: 32px;
  width: 11px;
  height: 11px;
  border: 1px solid #fff;
  border-width: 0 0 1px 1px;
  transform: rotate(-45deg);
}
#contents.recruitProcess .infoProcess .step {
  display: flex;
  align-items: center;
  padding: 35px 70px 30px;
  background-color: #f4f1fb;
}
#contents.recruitProcess .infoProcess li:nth-child(2) .step {
  background-color: #d0c5e7;
}
#contents.recruitProcess .infoProcess li:nth-child(3) .step {
  color: #fff;
  background-color: #a18acf;
}
#contents.recruitProcess .infoProcess li:nth-child(4) .step {
  color: #fff;
  background-color: #724fb7;
}
#contents.recruitProcess .infoProcess li:nth-child(5) .step {
  color: #fff;
  background-color: #4415a0;
}
#contents.recruitProcess .infoProcess .tit {
  position: relative;
  flex: none;
  width: 110px;
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
}
#contents.recruitProcess .infoProcess .tit:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -39px;
  width: 15px;
  height: 15px;
  margin-top: -7px;
  border: 5px solid rgba(150, 128, 193, 0.3);
  border-radius: 50%;
  background-color: #fff;
  z-index: 1;
}
#contents.recruitProcess .infoProcess .wrapImg {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  width: 100%;
  text-align: center;
}
#contents.recruitProcess .infoProcess .detail {
  padding: 20px 20px 20px 42px;
}
#contents.recruitProcess .infoProcess .detail > div {
  display: flex;
  align-items: flex-start;
}
#contents.recruitProcess .infoProcess .detail > div:only-child ul {
  padding-top: 0;
}
#contents.recruitProcess .infoProcess .detail > div + div {
  margin-top: 15px;
}
#contents.recruitProcess .infoProcess .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 5px 22px;
  margin-right: 20px;
  color: #a18acf;
  border: 1px solid #a18acf;
  border-radius: 22px;
}
#contents.recruitProcess .infoProcess .detail span:empty {
  min-width: 70px;
  margin-right: 20px;
}
#contents.recruitProcess .infoProcess .detail ul {
  padding-top: 7px;
}
#contents.recruitProcess .infoProcess .detail .num {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
  border-radius: 50%;
  background-color: #a18acf;
}
#contents.recruitProcess .infoProcess .detail li {
  font-size: 16px;
  line-height: 26px;
}
#contents.recruitProcess .infoProcess .detail li + li {
  margin-top: 10px;
}
#contents.recruitProcess .recruitment {
  margin-top: 50px;
}
#contents.recruitProcess .recruitment .tit {
  font-size: 22px;
  font-weight: 700;
  line-height: 32px;
}
@media (min-width: 1025px) {
  #contents.recruitProcess .recruitment .tit {
    font-size: 30px;
    line-height: 42px;
  }
}
@media (min-width: 1025px) {
  #contents.recruitProcess .container > .inner {
    padding-top: 0;
  }
  #contents.recruitProcess .infoProcess:after {
    top: 70px;
    left: 40px;
    right: 40px;
    width: auto;
    height: 1px;
    bottom: unset;
  }
  #contents.recruitProcess .infoProcess:before {
    top: 65px;
    left: unset;
    right: 39px;
    bottom: unset;
    transform: rotate(-135deg);
  }
  #contents.recruitProcess .infoProcess ul {
    display: flex;
  }
  #contents.recruitProcess .infoProcess ul > li {
    flex: 1;
  }
  #contents.recruitProcess .infoProcess .step {
    flex-direction: column;
    min-height: 227px;
    padding: 22px 20px 37px 20px;
    text-align: center;
  }
  #contents.recruitProcess .infoProcess ul > li:first-of-type .step {
    border-radius: 0 0 0 10px;
  }
  #contents.recruitProcess .infoProcess ul > li:last-of-type .step {
    border-radius: 0 0 10px 0;
  }
  #contents.recruitProcess .infoProcess .wrapImg {
    margin-top: 40px;
  }
  #contents.recruitProcess .infoProcess .wrapImg .txt {
    display: block;
    margin-bottom: 4px;
  }
  #contents.recruitProcess .infoProcess .tit:before {
    top: 100%;
    left: 50%;
    margin-top: 13px;
    margin-left: -7px;
  }
  #contents.recruitProcess .infoProcess .wrapImg img {
    width: 80px;
  }
  #contents.recruitProcess .infoProcess .detail {
    padding-left: 30px;
  }
  #contents.recruitProcess .infoProcess .detail > div {
    display: block;
  }
  #contents.recruitProcess .infoProcess .detail > div + div {
    margin-top: 40px;
  }
  #contents.recruitProcess .infoProcess .detail ul {
    display: block;
  }
  #contents.recruitProcess .infoProcess .detail span:empty {
    display: none;
  }
  #contents.recruitProcess .infoProcess .badge {
    min-height: 28px;
    padding: 5px 14px;
    font-weight: 500;
  }
  #contents.recruitProcess .infoProcess .detail li {
    font-size: 18px;
  }
  #contents.recruitProcess .listCard {
    margin-top: 10px;
  }
  #contents.recruitProcess .listCard > li {
    padding-right: 30px;
  }
}
#contents.recruitProcess.encAu .banner .qna {
  background-image: url("../../resources/images/shinyoungEnc/page/bannerQna.jpg");
  background-position: right bottom;
}
#contents.recruitProcess.encAu .banner > ul > li:after {
  background-color: rgba(0, 0, 0, 0.5);
}
@media (min-width: 1025px) {
  #contents.recruitProcess.encAu .container:last-of-type {
    padding-top: 150px;
    padding-bottom: 0;
  }
  #contents.recruitProcess.encAu .infoProcess .detail span:empty {
    display: none;
  }
}

#contents.recruitInfo .copyText {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 300;
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.recruitInfo .copyText {
    margin-bottom: 57px;
  }
}
@media (max-width: 1024px) {
  #contents.recruitInfo .copyText {
    margin-bottom: 47px;
  }
}
#contents.recruitInfo .recruitList {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  word-break: keep-all;
}
#contents.recruitInfo .recruitList a {
  position: relative;
  border: 1px solid #c8c8c8;
  border-radius: 8px;
}
#contents.recruitInfo .recruitList a:hover, #contents.recruitInfo .recruitList a:focus {
  border-color: #4415a0;
}
#contents.recruitInfo .recruitList a strong {
  display: block;
}
@media (min-width: 1025px) {
  #contents.recruitInfo .recruitList a {
    width: calc(33.3333333333% - 20px);
    padding: 150px 40px 52px;
  }
  #contents.recruitInfo .recruitList a + a + a + a {
    margin-top: 30px;
  }
  #contents.recruitInfo .recruitList a img {
    position: absolute;
    left: 40px;
    top: 50px;
    width: 182px;
  }
  #contents.recruitInfo .recruitList a img.slp {
    width: 75px;
  }
  #contents.recruitInfo .recruitList a strong {
    margin-bottom: 17px;
  }
  #contents.recruitInfo .recruitList a p {
    letter-spacing: -0.025em;
  }
}
@media (max-width: 1024px) {
  #contents.recruitInfo .recruitList a {
    width: 100%;
    padding: 30px 25px;
  }
  #contents.recruitInfo .recruitList a + a {
    margin-top: 15px;
  }
  #contents.recruitInfo .recruitList a img {
    width: 153px;
  }
  #contents.recruitInfo .recruitList a img.slp {
    width: 65px;
  }
  #contents.recruitInfo .recruitList a strong {
    margin-top: 15px;
  }
  #contents.recruitInfo .recruitList a p {
    margin-top: 30px;
  }
}

@media (min-width: 1025px) {
  .inquiry.groupCr {
    margin-top: 150px !important;
  }
}
@media (max-width: 1024px) {
  .inquiry.groupCr {
    margin-top: 90px !important;
  }
}

#contents.special .swiper {
  margin: 0 -20px;
  padding: 0 20px;
}
#contents.special .swiper-button-prev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
}
#contents.special .swiper-button-prev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.special .swiper-button-prev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.special .swiper-button-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#contents.special .swiper-button-prev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
#contents.special .swiper-button-next {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
}
#contents.special .swiper-button-next:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.special .swiper-button-next:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.special .swiper-button-next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#contents.special .swiper-button-next::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
#contents.special .swiper-button-disabled {
  display: none !important;
}
#contents.special .swiper .swiper-button-prev,
#contents.special .swiper .swiper-button-next {
  position: absolute;
  top: 0;
  bottom: 26px;
  margin: auto;
  z-index: 1;
}
#contents.special .swiper .swiper-button-prev {
  left: 9px;
}
#contents.special .swiper .swiper-button-next {
  right: 9px;
}
#contents.special .swiper img {
  width: 100%;
  height: auto;
}
#contents.special .swiper-pagination {
  position: static;
  margin-top: 10px;
  text-align: right;
}
#contents.special .swiper-pagination-current {
  color: #4415a0;
}
#contents.special .hero {
  position: relative;
  margin: 50px -20px;
  padding: 10px 20px 30px;
  color: #fff;
  background: url("../images/shinyoung/page/bgDeveloperSY.jpg") 50% 50%;
  background-size: cover;
  word-break: keep-all;
}
#contents.special .hero::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: linear-gradient(81deg, #0097e0 -12%, #0070a5 28%, #000 158%);
  opacity: 0.8;
}
#contents.special .hero > div {
  position: relative;
  z-index: 1;
}
#contents.special .hero .tit .emph {
  color: #fff;
  font-weight: 500;
}
#contents.special .hero .desc {
  padding-top: 10px;
  line-height: 26px;
}
#contents.special .hero .desc .emph {
  display: block;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #fff;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
}
#contents.special .info .emph {
  font-size: 22px;
  line-height: 32px;
}
#contents.special .info .desc {
  margin: 20px 0;
  line-height: 26px;
}
#contents.special .info .card {
  display: flex;
  flex-direction: column;
}
#contents.special .info .card img {
  vertical-align: top;
  margin: 0;
}
#contents.special .info .card .item {
  padding: 50px 20px 30px;
  border: 1px solid #c8c8c8;
  border-radius: 8px;
}
#contents.special .info .card .item + .item {
  margin-top: 15px;
}
#contents.special .info .card .tit {
  display: inline-block;
  margin: 27px 0 0;
  font-size: 22px;
  line-height: 1.4;
  background: linear-gradient(to right, #4415a0, #0097e0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#contents.special .banner .develop {
  background-image: url(../images/shinyoung/page/bannerDevelop.jpg);
}
#contents.special .banner .research {
  background-image: url(../images/shinyoung/page/bannerResearch.jpg);
}
@media (min-width: 1025px) {
  #contents.special > header .vi .desc {
    line-height: 30px;
    font-weight: 400;
  }
  #contents.special .swiper {
    margin-left: auto;
    margin-right: auto;
  }
  #contents.special .hero {
    margin: 80px 0 100px;
    padding: 110px 0;
    background-image: url("https://main.shinyoung21.com/resources/images/shinyoung/page/bgDeveloperSY_L.jpg");
    background-size: auto 100%;
  }
  #contents.special .hero .inner {
    display: flex;
    align-items: center;
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  #contents.special .hero .tit,
  #contents.special .hero .desc {
    margin: 0;
    padding: 0;
    font-size: 18px;
  }
  #contents.special .hero .desc {
    width: calc(100% - 460px);
  }
  #contents.special .hero .tit .txt {
    font-size: 40px;
  }
  #contents.special .hero .desc .emph {
    display: inline-block;
    font-size: 24px;
  }
  #contents.special .hero .desc .emph br {
    display: none;
  }
  #contents.special .info {
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  #contents.special .info .emph {
    font-size: 30px;
  }
  #contents.special .info .desc {
    margin: 25px 0 60px;
  }
  #contents.special .info .card {
    flex-direction: row;
  }
  #contents.special .info .card .item {
    flex: 1;
    padding: 40px 40px 55px 40px;
  }
  #contents.special .info .card .item + .item {
    margin: 0 0 0 30px;
  }
  #contents.special .info .card .tit br {
    display: none;
  }
  #contents.special .info .card .desc {
    margin: 20px 0 0 0;
  }
}
#contents.special.mainSt > header .vi {
  background-image: url("https://main.shinyoung21.com/resources/images/shinyoung/vi/viSpecial.jpg");
}
#contents.special.mainSt .developer {
  padding: 0 20px;
  letter-spacing: -0.05em;
}
#contents.special.mainSt .developer .tit {
  margin: 40px 0 20px;
}
#contents.special.mainSt .developer .tit.case {
  margin-bottom: 0 !important;
}
#contents.special.mainSt .developer .tit .emph {
  color: #4415a0;
}
#contents.special.mainSt .developer .tit .desc {
  line-height: 26px;
  color: #666;
  margin-top: 50px;
}
@media (max-width: 1024px) {
  #contents.special.mainSt .developer .tit .desc {
    margin-top: 20px;
  }
}
#contents.special.mainSt .developer .tit .txt {
  margin-top: 20px;
  font-size: 26px;
  line-height: 1.4;
}
#contents.special.mainSt .developer .world {
  position: relative;
  margin-top: 20px !important;
}
#contents.special.mainSt .developer .world:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(33, 33, 33, 0.4);
}
#contents.special.mainSt .developer .world:before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 20px;
  bottom: 20px;
  left: 20px;
  width: 1px;
  background-color: #fff;
  opacity: 0.5;
}
#contents.special.mainSt .developer .world .item {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: 30px 50px;
  color: rgba(249, 249, 249, 0.7);
  transition: all 0.3s;
}
#contents.special.mainSt .developer .world .item.active,
#contents.special.mainSt .developer .world .item:hover {
  background-color: rgba(33, 33, 33, 0.5);
  color: rgb(249, 249, 249);
  transition: all 0.3s;
}
#contents.special.mainSt .developer .world .item dt {
  order: 1;
  margin-top: 8px;
  font-size: 14px;
  line-height: 24px;
}
#contents.special.mainSt .developer .world .item dd {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 300;
}
#contents.special.mainSt .developer .world .bgImg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: -1;
  display: flex;
  align-items: flex-end;
  background-color: #4f6884;
}
#contents.special.mainSt .developer .world .bgImg > div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#contents.special.mainSt .developer .world .bgImg img {
  width: 100%;
  height: 618px;
  -o-object-fit: cover;
     object-fit: cover;
  min-width: 360px;
  opacity: 0;
}
#contents.special.mainSt .developer .world .bgImg .active img {
  opacity: 1;
}
#contents.special.mainSt .developer .world .bar {
  position: absolute;
  top: 50px;
  left: 19px;
  width: 3px;
  height: 100px;
  border-radius: 2px;
  background-color: #fff;
  z-index: 1;
  transition: all 0.3s;
}
#contents.special.mainSt .developer .content {
  color: #666;
}
#contents.special.mainSt .developer .content .desc {
  margin-bottom: 20px;
  line-height: 26px;
}
#contents.special.mainSt .banner {
  margin: 50px -20px 0;
}
#contents.special.mainSt .banner p {
  position: relative;
  z-index: 1;
}
#contents.special.mainSt .hero .tit .emph {
  color: #fff;
}
@media (min-width: 1025px) {
  #contents.special.mainSt .developer {
    padding: 0;
  }
  #contents.special.mainSt .developer .content .desc {
    margin-bottom: 50px !important;
  }
  #contents.special.mainSt .developer > .tit {
    max-width: 1240px;
    padding: 0 20px;
    margin: 100px auto 30px;
  }
  #contents.special.mainSt .developer > .tit .emph {
    font-size: 18px;
    font-weight: 700;
  }
  #contents.special.mainSt .developer > .tit .txt {
    margin-top: 5px;
    font-size: 40px;
  }
  #contents.special.mainSt .developer .world dl {
    display: flex;
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  #contents.special.mainSt .developer .world:before {
    top: 195px;
    right: 0;
    left: 0;
    bottom: unset;
    width: auto;
    height: 1px;
  }
  #contents.special.mainSt .developer .world .item {
    flex: 1;
    padding: 120px 50px;
  }
  #contents.special.mainSt .developer .world .item dt {
    position: relative;
    order: 0;
    margin: 0 0 40px;
    font-size: 18px;
  }
  #contents.special.mainSt .developer .world .item dt:after {
    content: "";
    position: absolute;
    bottom: -28px;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #fff;
    border-radius: 2px;
  }
  #contents.special.mainSt .developer .world .item dd {
    font-size: 24px;
  }
  #contents.special.mainSt .developer .world .bgImg img {
    height: 450px;
  }
  #contents.special.mainSt .developer .world .bar {
    display: none;
  }
  #contents.special.mainSt .developer .developerSY > p.desc {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.special.mainSt .developer .developerSY img {
    width: 100%;
  }
  #contents.special.mainSt .developer .swiper {
    padding: 0 !important;
    margin: 0 !important;
  }
  #contents.special.mainSt .developer .swiper .swiper-slide {
    width: 100%;
    max-width: 1200px;
  }
  #contents.special.mainSt .developer .swiperContainer .buttonWrap {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 26px;
    margin: auto;
  }
  #contents.special.mainSt .developer .swiperContainer .buttonWrap div {
    cursor: pointer;
  }
  #contents.special.mainSt .developer .swiperContainer .swiper-pagination {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.special.mainSt .hero {
    margin: 80px 0 100px;
    padding: 110px 0;
    background-image: url("../images/shinyoung/page/bgDeveloperSY_L.jpg");
    background-size: auto 100%;
  }
  #contents.special.mainSt .hero .inner {
    display: flex;
    align-items: center;
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  #contents.special.mainSt .hero .tit,
  #contents.special.mainSt .hero .desc {
    margin: 0;
    padding: 0;
    font-size: 18px;
  }
  #contents.special.mainSt .hero .tit {
    margin-right: 68px;
  }
  #contents.special.mainSt .hero .tit .txt {
    font-size: 40px;
  }
  #contents.special.mainSt .hero .desc .emph {
    display: inline-block;
    font-size: 24px;
  }
  #contents.special.mainSt .hero .desc .emph br {
    display: none;
  }
  #contents.special.mainSt .info {
    max-width: 1240px;
    padding: 0 20px;
    margin: 0 auto;
  }
  #contents.special.mainSt .info .emph {
    font-size: 30px;
  }
  #contents.special.mainSt .info .desc {
    margin: 25px 0 60px;
  }
  #contents.special.mainSt .info .card {
    flex-direction: row;
  }
  #contents.special.mainSt .info .card .item {
    flex: 1;
    padding: 40px 40px 55px 40px;
  }
  #contents.special.mainSt .info .card .item + .item {
    margin: 0 0 0 30px;
  }
  #contents.special.mainSt .info .card .tit br {
    display: none;
  }
  #contents.special.mainSt .info .card .desc {
    margin: 20px 0 0 0;
    font-size: 18px;
    line-height: 30px;
    color: #666;
    word-break: keep-all;
  }
  #contents.special.mainSt .banner {
    margin: 150px 0 0 0;
  }
  #contents.special.mainSt .banner ul {
    flex-direction: row;
    width: 100%;
    min-height: 200px;
  }
  #contents.special.mainSt .banner li {
    display: flex;
    flex: 1;
  }
  #contents.special.mainSt .banner .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 600px;
    padding: 0 20px;
    font-size: 24px;
  }
  #contents.special.mainSt .banner li:first-child {
    justify-content: flex-end;
  }
  #contents.special.mainSt .banner .link {
    font-size: 16px;
  }
}
#contents.special.assetSt > header .vi {
  background-image: url("../../resources/images/shinyoungAsset/vi/viSt.jpg");
}
#contents.special.assetSt .heading .tit {
  font-size: 16px;
  line-height: 26px;
  color: #4415a0;
}
#contents.special.assetSt .consulting .content {
  background-size: cover;
  background-position: center;
}
#contents.special.assetSt .consulting.firstActive .content {
  background-image: url(../../resources/images/shinyoungAsset/page/tileConsulting_L.jpg);
}
#contents.special.assetSt .consulting.lastActive .content {
  background-image: url(../../resources/images/shinyoungAsset/page/tileConsulting.jpg);
}
#contents.special.assetSt .consulting .item {
  height: 200px;
  justify-content: center;
  font-weight: 300;
}
#contents.special.assetSt .consultant {
  line-height: 30px;
  padding: 50px 0;
  background-color: #f6f6f6;
}
#contents.special.assetSt .consultant .tit {
  display: inline-block !important;
  margin-bottom: 20px;
  font-size: 22px;
  line-height: 1.4;
  background: linear-gradient(to right, #4415a0, #0097e0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#contents.special.assetSt .consultant .name {
  margin-top: 20px;
  font-weight: 500;
  line-height: 28px;
}
#contents.special.assetSt .trust > .inner:first-of-type {
  padding-top: 50px;
}
#contents.special.assetSt .trust p.emph {
  display: block;
  margin-bottom: 40px;
  font-size: 22px;
  line-height: 32px;
}
@media (min-width: 1025px) {
  #contents.special.assetSt .trust p.emph {
    padding-left: 20px;
  }
}
#contents.special.assetSt .trust .tit {
  font-weight: 500;
  font-size: 22px;
  line-height: 32px;
  color: #4415a0;
}
#contents.special.assetSt .trust p {
  font-size: 18px;
  line-height: 28px;
}
#contents.special.assetSt .trust .wrapImg {
  padding-top: 20px;
}
#contents.special.assetSt .trust .wrapImg + p {
  margin-top: 30px;
}
#contents.special.assetSt .trust img {
  max-width: 100%;
}
#contents.special.assetSt .hero {
  position: relative;
  margin: 50px 0 0;
  padding: 50px 20px;
  color: #fff;
  background: url("../../resources/images/shinyoungAsset/page/bgHero.jpg") 50% 50%;
  background-size: cover;
}
@media (min-width: 1025px) {
  #contents.special.assetSt .listCard {
    margin-top: -50px;
    margin-bottom: -50px;
  }
  #contents.special.assetSt .listCard li {
    position: relative;
    padding-left: 160px;
  }
  #contents.special.assetSt .listCard .wrapIcon {
    position: absolute;
    top: 50px;
    left: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.special.assetSt .listCard {
    margin-top: -30px;
    margin-bottom: -30px;
  }
}
#contents.special.assetSt .listCard .tit {
  display: inline-block;
  background: linear-gradient(to right, #4415a0, #0097e0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#contents.special.assetSt .listCard .name {
  margin-top: 20px;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  color: #212121;
}
#contents.special.assetSt .containerBanner {
  padding-top: 80px;
  padding-bottom: 0;
}
#contents.special.assetSt .banner .invest {
  background-image: url("../../resources/images/shinyoungAsset/page/bannerInvest.jpg");
}
#contents.special.assetSt .banner .lease {
  background-image: url("../../resources/images/shinyoungAsset/page/bannerLease.jpg");
}
@media (min-width: 1025px) {
  #contents.special.assetSt .heading .tit {
    font-size: 18px;
    line-height: 32px;
  }
  #contents.special.assetSt .consulting {
    height: 450px;
    margin-top: 60px;
  }
  #contents.special.assetSt .storyTile:before,
  #contents.special.assetSt .storyTile:after {
    display: none;
  }
  #contents.special.assetSt .consulting .content {
    position: absolute;
    top: 0;
    left: 50%;
    right: 0;
    display: flex;
    margin-left: -600px;
    background-size: cover;
    background-position: center;
  }
  #contents.special.assetSt .consulting.firstActive .content {
    background-image: url(../../resources/images/shinyoungAsset/page/tileConsulting_L.jpg);
  }
  #contents.special.assetSt .consulting.lastActive .content {
    background-image: url(../../resources/images/shinyoungAsset/page/tileConsulting2_L.jpg);
  }
}
@media (min-width: 1025px) and (min-width: 1025px) {
  #contents.special.assetSt .consulting .bar {
    display: none !important;
  }
}
@media (min-width: 1025px) and (min-width: 1025px) and (max-width: 1240px) {
  #contents.special.assetSt .consulting {
    margin-left: 20px;
  }
  #contents.special.assetSt .consulting .content {
    margin-left: -50%;
  }
}
@media (min-width: 1025px) {
  #contents.special.assetSt .consulting .content:before {
    content: "";
    position: absolute;
    top: 196px;
    left: 0;
    width: 1200px;
    height: 1px;
    background-color: #fff;
    opacity: 0.5;
  }
  #contents.special.assetSt .consulting .content:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(33, 33, 33, 0.4);
  }
  #contents.special.assetSt .consulting .item {
    flex: 1;
    height: 450px;
    padding-left: 50px;
    padding-top: 110px;
    font-size: 24px;
    line-height: 36px;
  }
  #contents.special.assetSt .consulting .item:first-of-type {
    flex: none;
    width: 600px;
  }
  #contents.special.assetSt .consulting .item:before {
    content: "";
    position: absolute;
    top: 195px;
    left: 50px;
    width: 300px;
    height: 2px;
    border-radius: 2px;
    background-color: #fff;
  }
  #contents.special.assetSt .consultant {
    margin-top: 100px;
    padding-bottom: 100px;
  }
  #contents.special.assetSt .consultant .inner {
    padding-top: 50px;
  }
  #contents.special.assetSt .consultant .tit {
    font-size: 30px;
    line-height: 42px;
  }
  #contents.special.assetSt .consultant .name {
    font-size: 22px;
    line-height: 34px;
  }
  #contents.special.assetSt .trust > .inner:first-of-type {
    padding-top: 100px;
  }
  #contents.special.assetSt .trust > .inner {
    position: relative;
    padding-left: 315px;
  }
  #contents.special.assetSt .trust p.emph {
    position: absolute;
    top: 100px;
    left: 0;
    font-size: 30px;
    line-height: 42px;
  }
  #contents.special.assetSt .trust .tit {
    font-size: 36px;
    line-height: 48px;
    font-weight: 400;
  }
  #contents.special.assetSt .trust p {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
  }
  #contents.special.assetSt .trust .wrapImg {
    padding-top: 40px;
  }
  #contents.special.assetSt .trust .wrapImg + p {
    margin-top: 60px;
  }
  #contents.special.assetSt .hero {
    margin-top: 100px;
    background-image: url("../../resources/images/shinyoungAsset/page/bgHero_L.jpg");
  }
  #contents.special.assetSt .hero .inner {
    display: flex;
    align-items: center;
    min-height: 280px;
  }
  #contents.special.assetSt .hero .inner .tit {
    flex: none;
    min-width: 460px;
    margin-right: 0;
  }
  #contents.special.assetSt .hero .tit .emph {
    font-size: 18px;
    line-height: 30px;
  }
  #contents.special.assetSt .hero .tit .txt {
    margin-top: 20px;
    line-height: 56px;
  }
  #contents.special.assetSt .hero .desc {
    font-size: 18px;
    line-height: 30px;
  }
  #contents.special.assetSt .listCard > li {
    margin-top: 0;
    padding-top: 40px;
    padding-bottom: 40px;
  }
  #contents.special.assetSt .listCard .tit {
    margin-top: 20px;
  }
  #contents.special.assetSt .banner > ul > li {
    line-height: 36px;
    font-weight: 300;
  }
  #contents.special.assetSt .containerBanner {
    padding-top: 150px;
  }
}

.storyTile {
  position: relative;
  margin-top: 40px;
}
.storyTile:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(33, 33, 33, 0.4);
}
.storyTile:before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 20px;
  bottom: 20px;
  left: 20px;
  width: 1px;
  background-color: #fff;
  opacity: 0.5;
}
.storyTile .item {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  padding: 30px 50px;
  font-size: 20px;
  line-height: 1.5;
  font-weight: 300;
  color: rgba(249, 249, 249, 0.7);
  transition: all 0.3s;
}
.storyTile .item:hover, .storyTile .item.active {
  background-color: rgba(33, 33, 33, 0.5);
  color: rgb(249, 249, 249);
  transition: all 0.3s;
}
.storyTile .item dt {
  order: 1;
  margin-top: 8px;
  font-size: 14px;
  line-height: 24px;
}
.storyTile .bgImg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: -1;
  display: flex;
  align-items: flex-end;
  background-color: #4f6884;
}
.storyTile .bgImg > div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.storyTile .bgImg img {
  width: 100%;
  min-width: 360px;
  opacity: 0;
}
.storyTile .bgImg .active img {
  opacity: 1;
}
.storyTile .bar {
  position: absolute;
  top: 50px;
  left: 19px;
  width: 3px;
  height: 100px;
  border-radius: 2px;
  background-color: #fff;
  z-index: 1;
  transition: all 0.3s;
}

#contents.groupSt {
  /*
  >header .vi p,
  >section header:not(.case),
  .challenge section h3,
  .challenge section p,
  .vision>div {
    @include wide {
      @media (max-width: 1357px) {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 70px !important;
      }
    }
  }
  */
}
@media (min-width: 1025px) and (max-width: 1357px) {
  #contents.groupSt .value {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
  }
}
#contents.groupSt > header .vi {
  flex-direction: column;
  justify-content: center;
}
#contents.groupSt > header .vi p.desc {
  font-size: 18px;
  line-height: 28px;
  letter-spacing: -0.015em;
}
#contents.groupSt .pageNav {
  z-index: 10;
}
#contents.groupSt > section header:not(.case), #contents.groupSt section.swiper-slide header:not(.case) {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.groupSt > section header:not(.case) h1, #contents.groupSt section.swiper-slide header:not(.case) h1 {
  color: #4415a0;
}
#contents.groupSt > section header:not(.case) h2, #contents.groupSt section.swiper-slide header:not(.case) h2 {
  margin-top: 14px;
  font-weight: 400;
}
@media (min-width: 1025px) {
  #contents.groupSt > section header:not(.case) h2, #contents.groupSt section.swiper-slide header:not(.case) h2 {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt > section header:not(.case) h2, #contents.groupSt section.swiper-slide header:not(.case) h2 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
}
@media (min-width: 1025px) {
  #contents.groupSt > section header:not(.case) p, #contents.groupSt section.swiper-slide header:not(.case) p {
    margin-top: 27px;
    height: 60px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt > section header:not(.case) p, #contents.groupSt section.swiper-slide header:not(.case) p {
    margin-top: 12px;
    height: 52px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .challenge {
    margin-top: 40px;
  }
}
#contents.groupSt .challenge header {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
}
@media (min-width: 1025px) {
  #contents.groupSt .challenge header {
    height: calc(100vh - 542px);
    height: calc(var(--vh, 1vh) * 100 - 542px);
    min-height: 260px;
  }
}
#contents.groupSt .challenge section {
  width: 100%;
  max-width: 2400px;
  background: url("../images/shinyoungGroup/page/bgHero.jpg") no-repeat center top;
  background-size: cover;
}
#contents.groupSt .challenge section h3, #contents.groupSt .challenge section p {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  color: #fff;
}
@media (min-width: 1025px) {
  #contents.groupSt .challenge section {
    height: 542px;
    padding-top: 187px;
  }
  #contents.groupSt .challenge section h3 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
  #contents.groupSt .challenge section p {
    margin-top: 36px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .challenge section {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    margin-top: 45px;
    height: 457px;
    padding-bottom: 50px;
    background-position: left top;
  }
  #contents.groupSt .challenge section h3 {
    font-size: 26px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 400;
  }
  #contents.groupSt .challenge section p {
    margin-top: 20px;
  }
}
#contents.groupSt .vision {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: flex-start;
  background: #f9f9f9;
}
@media (min-width: 1025px) {
  #contents.groupSt .vision {
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 800px;
  }
  #contents.groupSt .vision > div {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 55px;
  }
  #contents.groupSt .vision > div div {
    position: relative;
    overflow: hidden;
    height: 500px;
  }
  #contents.groupSt .vision > div div img {
    position: absolute;
    left: 50%;
    margin-left: -600px;
    width: 1200px;
    max-width: unset;
    height: 500px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .vision {
    padding-top: 50px;
  }
  #contents.groupSt .vision img {
    margin-top: 45px;
    width: 100%;
  }
}
@media (max-width: 1024px) and (max-width: 640px) {
  #contents.groupSt .vision img:not(.narrowOnly) {
    display: none;
  }
}
#contents.groupSt .value {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 1025px) {
  #contents.groupSt .value {
    margin-left: auto;
    margin-right: auto;
    max-width: 1240px;
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 600px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
#contents.groupSt .value section.swiper-slide {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide {
    padding-right: 650px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide {
    padding-right: 430px;
  }
}
@media (max-width: 768px) {
  #contents.groupSt .value section.swiper-slide {
    padding-right: 310px;
  }
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide {
    padding-right: unset;
  }
}
#contents.groupSt .value section.swiper-slide header {
  position: relative;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header {
    min-height: 426px;
  }
}
#contents.groupSt .value section.swiper-slide header .pagination span {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 50%;
}
#contents.groupSt .value section.swiper-slide header .pagination span:hover::before {
  opacity: 0;
}
#contents.groupSt .value section.swiper-slide header .pagination span::before, #contents.groupSt .value section.swiper-slide header .pagination span::after {
  z-index: 1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  transition: opacity 0.3s;
}
#contents.groupSt .value section.swiper-slide header .pagination span::before {
  background: rgba(0, 0, 0, 0.53);
}
#contents.groupSt .value section.swiper-slide header .pagination span::after {
  max-width: 0;
  background: rgba(0, 151, 224, 0.47);
}
#contents.groupSt .value section.swiper-slide header .pagination span.swiper-pagination-bullet-active::before {
  display: none;
}
@keyframes maxWidthKey {
  to {
    max-width: 100%;
  }
}
#contents.groupSt .value section.swiper-slide header .pagination span.swiper-pagination-bullet-active::after {
  max-width: 0;
  animation: maxWidthKey 10s 0s forwards;
}
#contents.groupSt .value section.swiper-slide header .pagination span + span {
  margin-left: 10px;
}
#contents.groupSt .value section.swiper-slide header .pagination span img {
  display: block;
  width: 100%;
  height: 100%;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header .pagination span {
    width: 53px;
    height: 53px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide header .pagination span {
    width: 40px;
    height: 40px;
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header h1 {
    margin-top: 45px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide header h1 {
    margin-top: 30px;
  }
}
#contents.groupSt .value section.swiper-slide header .buttonWrap {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  margin-left: 20px;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext {
    width: 40px;
    height: 40px;
  }
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext {
    width: 35px;
    height: 35px;
  }
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valueNext::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev {
    width: 40px;
    height: 40px;
  }
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev {
    width: 35px;
    height: 35px;
  }
  #contents.groupSt .value section.swiper-slide header .buttonWrap .valuePrev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap {
    margin-top: 45px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide header .buttonWrap {
    margin-top: 35px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper {
  position: absolute;
  right: 20px;
  top: 0;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper {
    width: 610px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper {
    width: 410px;
    margin-top: 30px;
  }
}
@media (max-width: 768px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper {
    width: 300px;
  }
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper {
    position: relative;
    right: unset;
    width: unset;
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > p {
    margin-top: -31px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > p {
    margin-top: -27px;
  }
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > p {
    padding-left: 20px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button {
  z-index: 1;
  position: absolute !important;
  top: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > button {
    bottom: 53px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > button {
    bottom: 34px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  left: -10px;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > button.insidePrev {
    left: 10px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
  right: -10px;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
#contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper > button.insideNext {
    right: 10px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper .inside {
  position: relative;
}
@media (max-width: 640px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper .inside {
    margin: 0 auto !important;
    width: calc(100% - 40px);
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn {
  float: right;
  width: unset !important;
  color: #212121;
}
@media (min-width: 1025px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn {
    margin-top: 23px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn {
    margin-top: 8px;
  }
}
#contents.groupSt .value section.swiper-slide .imgWrapper .inside .insidePgn .swiper-pagination-current {
  font-weight: 600;
  color: #4415a0;
}
#contents.groupSt .value section.swiper-slide .imgWrapper .inside li img {
  display: block;
  width: 100%;
}
#contents.groupSt .developer {
  background: #f9f9f9;
}
#contents.groupSt .developer > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative;
}
@media (min-width: 1025px) {
  #contents.groupSt .developer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-end;
    height: calc(100vh + 0px);
    height: calc(var(--vh, 1vh) * 100 + 0px);
    min-height: 720px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer {
    padding-top: 55px;
  }
}
@media (min-width: 1025px) and (max-width: 1357px) {
  #contents.groupSt .developer header {
    padding-left: 50px;
  }
}
#contents.groupSt .developer header h1 {
  font-weight: 400;
}
@media (min-width: 1025px) {
  #contents.groupSt .developer header h1 {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -0.03em;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer header h1 {
    font-size: 30px;
    line-height: 40px;
    letter-spacing: -0.025em;
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .developer header p {
    margin-top: 27px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer header p {
    margin-top: 17px;
  }
}
#contents.groupSt .developer ul {
  position: relative;
  padding-bottom: 50px;
  text-align: center;
}
@media (min-width: 1025px) {
  #contents.groupSt .developer ul {
    margin: 85px auto 0;
    width: 850px;
    height: 440px;
    overflow: hidden;
  }
  #contents.groupSt .developer ul::before {
    z-index: 0;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 36px;
    margin: auto;
    width: 769px;
    height: 769px;
    border: 76px solid #fff;
    border-radius: 50%;
  }
  #contents.groupSt .developer ul li button {
    z-index: 1;
    position: absolute;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    -ms-box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.07);
    -o-box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.07);
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.07);
    background: #fff;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: -0.015em;
    font-weight: 600;
    transition: all 0.3s;
  }
  #contents.groupSt .developer ul li.active button {
    -ms-box-shadow: unset;
    -o-box-shadow: unset;
    box-shadow: unset;
    background: #4415a0;
    color: #fff;
  }
  #contents.groupSt .developer ul li:first-child button {
    left: 0;
    bottom: 38px;
  }
  #contents.groupSt .developer ul li:nth-child(2) button {
    left: 94px;
    bottom: 229px;
  }
  #contents.groupSt .developer ul li:nth-child(3) button {
    left: 280px;
    top: 0;
  }
  #contents.groupSt .developer ul li:nth-child(4) button {
    right: 280px;
    top: 0;
  }
  #contents.groupSt .developer ul li:nth-child(5) button {
    right: 94px;
    bottom: 229px;
  }
  #contents.groupSt .developer ul li:last-child button {
    right: 0;
    bottom: 38px;
  }
  #contents.groupSt .developer ul li div {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100px;
    margin: auto;
    width: 285px;
    height: 125px;
    transition: opacity 0.3s;
  }
  #contents.groupSt .developer ul li div p {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    font-size: 24px;
    line-height: 36px;
    letter-spacing: -0.02em;
    font-weight: 600;
  }
  #contents.groupSt .developer ul li.active div {
    opacity: 1;
  }
  #contents.groupSt .developer ul li:not(.active) div {
    opacity: 0;
  }
  #contents.groupSt .developer ul li:first-child img, #contents.groupSt .developer ul li:nth-child(2) img, #contents.groupSt .developer ul li:nth-child(3) img {
    width: 270px;
  }
  #contents.groupSt .developer ul li:nth-child(4) img {
    width: 242px;
  }
  #contents.groupSt .developer ul li:nth-child(5) img {
    width: 214px;
  }
  #contents.groupSt .developer ul li:nth-child(6) img {
    width: 148px;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    margin: 50px auto 0;
    max-width: 600px;
  }
  #contents.groupSt .developer ul::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(50% + 25px);
    width: 100%;
    height: 0;
    border-top: 1px dashed #c8c8c8;
  }
  #contents.groupSt .developer ul li {
    position: relative;
    margin-left: 30px;
    width: calc(33.3333333333% - 20px);
  }
  #contents.groupSt .developer ul li:nth-child(3n-2) {
    margin-left: 0;
  }
  #contents.groupSt .developer ul li:nth-child(2) {
    padding-bottom: 38px;
  }
  #contents.groupSt .developer ul li:nth-child(6) {
    padding-bottom: 31px;
  }
  #contents.groupSt .developer ul li + li + li + li {
    margin-top: 25px;
    padding-top: 25px;
  }
  #contents.groupSt .developer ul li button {
    display: none;
  }
  #contents.groupSt .developer ul li img {
    max-width: 100%;
  }
  #contents.groupSt .developer ul li:nth-child(6) img {
    max-width: 70px;
  }
  #contents.groupSt .developer ul li p {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
  }
}
@media (max-width: 380px) {
  #contents.groupSt .developer ul li {
    margin-left: 0 !important;
    width: 85px;
    max-width: 33.3333333333%;
  }
  #contents.groupSt .developer ul li:first-child img, #contents.groupSt .developer ul li:nth-child(2) img, #contents.groupSt .developer ul li:nth-child(3) img {
    width: 85px;
  }
  #contents.groupSt .developer ul li:nth-child(4) img {
    width: 76px;
  }
  #contents.groupSt .developer ul li:nth-child(5) img {
    width: 77px;
  }
  #contents.groupSt .developer ul li:nth-child(6) img {
    width: 50px;
  }
}
#contents.groupSt .developer > div > p {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 44px;
  margin: auto;
  width: 90px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 1024px) {
  #contents.groupSt .developer > div > p {
    display: none !important;
  }
}
#contents.groupSt .developer > div > p .developPrev {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.groupSt .developer > div > p .developPrev:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .developer > div > p .developPrev:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .developer > div > p .developPrev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  #contents.groupSt .developer > div > p .developPrev {
    width: 40px;
    height: 40px;
  }
  #contents.groupSt .developer > div > p .developPrev::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer > div > p .developPrev {
    width: 35px;
    height: 35px;
  }
  #contents.groupSt .developer > div > p .developPrev::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
#contents.groupSt .developer > div > p .developPrev::after {
  right: 7px;
}
#contents.groupSt .developer > div > p .developNext {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
#contents.groupSt .developer > div > p .developNext:not(:disabled):hover {
  border-color: #4415a0;
}
#contents.groupSt .developer > div > p .developNext:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
#contents.groupSt .developer > div > p .developNext::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  #contents.groupSt .developer > div > p .developNext {
    width: 40px;
    height: 40px;
  }
  #contents.groupSt .developer > div > p .developNext::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .developer > div > p .developNext {
    width: 35px;
    height: 35px;
  }
  #contents.groupSt .developer > div > p .developNext::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
#contents.groupSt .developer > div > p .developNext::after {
  left: 7px;
}
#contents.groupSt .developer > div > p .developPrev, #contents.groupSt .developer > div > p .developNext {
  width: 32px;
  height: 32px;
}
#contents.groupSt .developer > div > p .developPrev::after, #contents.groupSt .developer > div > p .developNext::after {
  width: 10px;
  height: 10px;
}
#contents.groupSt .banner > ul li::after {
  display: none;
}
#contents.groupSt .banner > ul p {
  font-weight: 300;
}
@media (min-width: 1025px) {
  #contents.groupSt .banner > ul p {
    max-width: calc(100% - 170px);
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .banner .case1 {
    background-image: url("../images/shinyoung/page/bgBannerInquiry.png");
    background-position: center;
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .banner .case1 {
    background-image: url("../images/shinyoung/page/bgBannerInquiryMobile.png");
  }
}
@media (min-width: 1025px) {
  #contents.groupSt .banner .case2 {
    background-image: url("../images/shinyoungGroup/page/bgBannerHistory.png");
  }
}
@media (max-width: 1024px) {
  #contents.groupSt .banner .case2 {
    background-image: url("../images/shinyoungGroup/page/bgBannerHistoryMobile.png");
  }
}

@media (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer {
    margin-top: 50px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer {
    margin-top: 20px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide div {
    margin-bottom: 35px;
  }
}
#contents.groupBd .recommend .swiperContainer .swiper-slide strong {
  font-weight: 400;
}
#contents.groupBd .recommend .swiperContainer .swiper-slide p {
  word-break: keep-all;
}
@media (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide p {
    margin-top: 25px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide p {
    margin-top: 20px;
  }
}
#contents.groupBd .recommend .swiperContainer .swiper-slide span {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100px !important;
}
#contents.groupBd .recommend .swiperContainer .swiper-slide span::before, #contents.groupBd .recommend .swiperContainer .swiper-slide span::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):hover, #contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):hover::before, #contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):hover::after, #contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):focus::before, #contents.groupBd .recommend .swiperContainer .swiper-slide span:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide span {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span::before {
    margin-right: 10px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide span {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span::before {
    margin-right: 14px;
  }
  #contents.groupBd .recommend .swiperContainer .swiper-slide span::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide span {
    margin-top: 35px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .recommend .swiperContainer .swiper-slide span {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline.case {
    margin-bottom: 80px;
  }
}
#contents.groupBd .headline > h3 {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.groupBd .headline > h3 {
    margin-bottom: 80px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline > h3 {
    margin-bottom: 50px;
  }
}
#contents.groupBd .headline > header {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.groupBd .headline > header a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.groupBd .headline > header a::before, #contents.groupBd .headline > header a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.groupBd .headline > header a:not(:disabled):hover, #contents.groupBd .headline > header a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.groupBd .headline > header a:not(:disabled):hover::before, #contents.groupBd .headline > header a:not(:disabled):hover::after, #contents.groupBd .headline > header a:not(:disabled):focus::before, #contents.groupBd .headline > header a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .headline > header a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupBd .headline > header a::before {
    margin-right: 10px;
  }
  #contents.groupBd .headline > header a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline > header a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupBd .headline > header a::before {
    margin-right: 14px;
  }
  #contents.groupBd .headline > header a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .headline > header {
    margin-bottom: 80px;
  }
  #contents.groupBd .headline > header a {
    width: 160px;
    margin-left: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline > header {
    margin-bottom: 50px;
  }
  #contents.groupBd .headline > header a {
    width: 158px;
    margin-left: 30px;
  }
}
@media (max-width: 480px) {
  #contents.groupBd .headline > header {
    flex-direction: column;
    align-items: flex-start;
  }
  #contents.groupBd .headline > header a {
    margin-top: 10px;
    margin-left: 0;
  }
}
#contents.groupBd .headline ul .img {
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#contents.groupBd .headline ul .summary em,
#contents.groupBd .headline ul .summary .type,
#contents.groupBd .headline ul .summary .period {
  display: block;
}
#contents.groupBd .headline ul .summary em {
  word-break: keep-all;
}
#contents.groupBd .headline ul .summary .info span,
#contents.groupBd .headline ul .summary .period {
  color: #212121;
}
#contents.groupBd .headline ul .summary .info span + span {
  position: relative;
  margin-left: 1em;
  padding-left: 1em;
}
#contents.groupBd .headline ul .summary .info span + span::before {
  content: "";
  left: 0;
  display: block;
  width: 1px;
  height: 1em;
  background: #c8c8c8;
}
#contents.groupBd .headline ul .summary p {
  word-break: keep-all;
}
#contents.groupBd .headline ul .summary a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.groupBd .headline ul .summary a::before, #contents.groupBd .headline ul .summary a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.groupBd .headline ul .summary a:not(:disabled):hover, #contents.groupBd .headline ul .summary a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.groupBd .headline ul .summary a:not(:disabled):hover::before, #contents.groupBd .headline ul .summary a:not(:disabled):hover::after, #contents.groupBd .headline ul .summary a:not(:disabled):focus::before, #contents.groupBd .headline ul .summary a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .headline ul .summary a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupBd .headline ul .summary a::before {
    margin-right: 10px;
  }
  #contents.groupBd .headline ul .summary a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline ul .summary a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupBd .headline ul .summary a::before {
    margin-right: 14px;
  }
  #contents.groupBd .headline ul .summary a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .headline ul li {
    position: relative;
  }
  #contents.groupBd .headline ul li::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
  #contents.groupBd .headline ul li .img {
    position: relative;
    width: calc(100% - ((100% - 1200px) / 2 + 500px));
    height: 570px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  #contents.groupBd .headline ul li .summary {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1240px;
    min-width: 315px;
    padding-left: 20px;
    padding-right: 20px;
  }
  #contents.groupBd .headline ul li .summary::after {
    content: "";
    display: block;
    height: 0;
    clear: both;
  }
  #contents.groupBd .headline ul li .summary > div {
    width: 500px;
    padding-top: 95px;
  }
  #contents.groupBd .headline ul li .summary > div .type,
  #contents.groupBd .headline ul li .summary > div p {
    margin-top: 15px;
  }
  #contents.groupBd .headline ul li .summary > div .info {
    margin-top: 23px;
  }
  #contents.groupBd .headline ul li .summary > div .period {
    margin-top: 35px;
  }
  #contents.groupBd .headline ul li .summary > div p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 8.35em;
    line-height: 1.67 !important;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  #contents.groupBd .headline ul li .summary > div a {
    margin-top: 40px;
  }
}
@media (min-width: 1025px) and (max-width: 1239px) {
  #contents.groupBd .headline ul li .summary > div {
    width: calc(100% - ((100% - 1200px) / 2 + 700px));
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .headline ul li:nth-child(odd) .summary > div {
    float: right;
    padding-left: 60px;
  }
  #contents.groupBd .headline ul li:nth-child(even) .summary > div {
    padding-right: 60px;
  }
  #contents.groupBd .headline ul li:nth-child(even) .img {
    float: right;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .headline ul li .summary .type,
  #contents.groupBd .headline ul li .summary p {
    margin-top: 10px;
  }
  #contents.groupBd .headline ul li .summary .info {
    margin-top: 15px;
  }
  #contents.groupBd .headline ul li .summary .period {
    margin-top: 25px;
  }
  #contents.groupBd .headline ul li .summary a {
    margin-top: 30px;
  }
}
@media (max-width: 1024px) and (min-width: 881px) {
  #contents.groupBd .headline ul li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }
  #contents.groupBd .headline ul li .img {
    width: 55%;
    height: 380px;
  }
  #contents.groupBd .headline ul li .img img {
    width: unset;
    height: 380px;
  }
  #contents.groupBd .headline ul li .summary {
    width: 45%;
  }
  #contents.groupBd .headline ul li .summary p {
    display: block;
    display: -ms-flexbox;
    display: -moz-box;
    display: -webkit-box;
    -ms-box-align: center;
    -o-box-align: center;
    box-align: center;
    max-height: 4.2em;
    line-height: 1.4 !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
  }
  #contents.groupBd .headline ul li:nth-child(odd) .summary {
    padding-left: 30px;
    padding-right: 20px;
  }
  #contents.groupBd .headline ul li:nth-child(even) .img {
    order: 1;
  }
  #contents.groupBd .headline ul li:nth-child(even) .summary {
    padding-left: 20px;
    padding-right: 30px;
  }
}
@media (max-width: 1024px) and (max-width: 880px) {
  #contents.groupBd .headline ul li + li {
    margin-top: 50px;
  }
  #contents.groupBd .headline ul li .img {
    height: 0;
    padding-bottom: 63.3333%;
  }
  #contents.groupBd .headline ul li .summary {
    margin-top: 35px;
    padding-left: 20px;
    padding-right: 20px;
  }
}
#contents.groupBd .ongoing {
  background: #f9f9f9;
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing {
    margin-top: 50px;
  }
}
#contents.groupBd .ongoing > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 40px;
  padding-bottom: 40px;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing > div {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
  }
  #contents.groupBd .ongoing > div div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }
}
@media (max-width: 1024px) and (max-width: 360px) {
  #contents.groupBd .ongoing > div div {
    width: 100%;
  }
}
#contents.groupBd .ongoing h3 {
  font-weight: 400;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing h3 {
    width: calc(100% - 262px);
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing h3 {
    margin-bottom: 23px;
    width: 100%;
  }
}
#contents.groupBd .ongoing p {
  font-weight: 300;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing p + p {
    margin-top: 5px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing p + p {
    margin-left: 20px;
  }
}
#contents.groupBd .ongoing a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  width: 100px;
}
#contents.groupBd .ongoing a::before, #contents.groupBd .ongoing a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.groupBd .ongoing a:not(:disabled):hover, #contents.groupBd .ongoing a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.groupBd .ongoing a:not(:disabled):hover::before, #contents.groupBd .ongoing a:not(:disabled):hover::after, #contents.groupBd .ongoing a:not(:disabled):focus::before, #contents.groupBd .ongoing a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupBd .ongoing a::before {
    margin-right: 10px;
  }
  #contents.groupBd .ongoing a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupBd .ongoing a::before {
    margin-right: 14px;
  }
  #contents.groupBd .ongoing a::after {
    margin-left: 18px;
  }
}
@media (max-width: 360px) {
  #contents.groupBd .ongoing a {
    margin-top: 10px;
  }
}
#contents.groupBd .ongoing ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.groupBd .ongoing ul li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing ul li + li {
    margin-left: 50px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing ul li {
    margin-right: 37px;
  }
}
@media (max-width: 480px) {
  #contents.groupBd .ongoing ul li {
    margin-right: 0;
    width: 100%;
    justify-content: space-between;
  }
}
#contents.groupBd .ongoing ul li a {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 20px;
  height: 20px;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
}
#contents.groupBd .ongoing ul li a::after {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
  left: -2px;
}
#contents.groupBd .ongoing ul li a:hover {
  border-color: #212121;
}
#contents.groupBd .ongoing ul li a:hover::after {
  border-color: #212121;
}
@media (min-width: 1025px) {
  #contents.groupBd .ongoing ul li a {
    margin-left: 34px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .ongoing ul li a {
    margin-left: 20px;
  }
}

#contents.groupBd .intro, #contents.groupGr .intro {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro, #contents.groupGr .intro {
    margin-bottom: 150px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro, #contents.groupGr .intro {
    margin-bottom: 50px;
  }
}
#contents.groupBd .intro > header, #contents.groupGr .intro > header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
#contents.groupBd .intro > header a::before, #contents.groupBd .intro > header a::after, #contents.groupGr .intro > header a::before, #contents.groupGr .intro > header a::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
#contents.groupBd .intro > header a:not(:disabled):hover, #contents.groupBd .intro > header a:not(:disabled):focus, #contents.groupGr .intro > header a:not(:disabled):hover, #contents.groupGr .intro > header a:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
#contents.groupBd .intro > header a:not(:disabled):hover::before, #contents.groupBd .intro > header a:not(:disabled):hover::after, #contents.groupBd .intro > header a:not(:disabled):focus::before, #contents.groupBd .intro > header a:not(:disabled):focus::after, #contents.groupGr .intro > header a:not(:disabled):hover::before, #contents.groupGr .intro > header a:not(:disabled):hover::after, #contents.groupGr .intro > header a:not(:disabled):focus::before, #contents.groupGr .intro > header a:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  #contents.groupBd .intro > header a::before, #contents.groupGr .intro > header a::before {
    margin-right: 10px;
  }
  #contents.groupBd .intro > header a::after, #contents.groupGr .intro > header a::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  #contents.groupBd .intro > header a::before, #contents.groupGr .intro > header a::before {
    margin-right: 14px;
  }
  #contents.groupBd .intro > header a::after, #contents.groupGr .intro > header a::after {
    margin-left: 18px;
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .intro > header, #contents.groupGr .intro > header {
    margin-bottom: 30px;
  }
  #contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
    width: 160px;
    margin-left: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro > header, #contents.groupGr .intro > header {
    margin-bottom: 16px;
  }
  #contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
    width: 158px;
    margin-left: 30px;
  }
}
@media (max-width: 480px) {
  #contents.groupBd .intro > header, #contents.groupGr .intro > header {
    flex-direction: column;
    align-items: flex-start;
  }
  #contents.groupBd .intro > header a, #contents.groupGr .intro > header a {
    margin-top: 10px;
    margin-left: 0;
  }
}
#contents.groupBd .intro > p, #contents.groupGr .intro > p {
  word-break: keep-all;
  color: #666;
}
#contents.groupBd .intro > p span, #contents.groupGr .intro > p span {
  display: block;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro > p, #contents.groupGr .intro > p {
    font-weight: 300;
    letter-spacing: -0.04em;
  }
}
#contents.groupBd .intro .info, #contents.groupGr .intro .info {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
#contents.groupBd .intro .info .logo, #contents.groupGr .intro .info .logo {
  position: relative;
  width: 50%;
  border-right: 1px solid #c8c8c8;
}
#contents.groupBd .intro .info .logo img, #contents.groupGr .intro .info .logo img {
  max-width: 97%;
}
@media (max-width: 1024px) {
  #contents.groupBd .intro .info .logo.slp img, #contents.groupGr .intro .info .logo.slp img {
    max-width: 67px !important;
  }
}
#contents.groupBd .intro .info .address, #contents.groupGr .intro .info .address {
  background-image: url("../images/shinyoungGroup/page/iconPin.svg");
}
#contents.groupBd .intro .info .ceo, #contents.groupGr .intro .info .ceo {
  background-image: url("../images/shinyoungGroup/page/iconCeo.svg");
}
#contents.groupBd .intro .info .phone, #contents.groupGr .intro .info .phone {
  background-image: url("../images/shinyoungGroup/page/iconPhone.svg");
}
#contents.groupBd .intro .info .fax, #contents.groupGr .intro .info .fax {
  background-image: url("../images/shinyoungGroup/page/iconFax.svg");
}
#contents.groupBd .intro .info p, #contents.groupGr .intro .info p {
  position: relative;
  font-weight: 500;
  word-break: keep-all;
  color: #212121;
  background-repeat: no-repeat;
}
#contents.groupBd .intro .info p span, #contents.groupGr .intro .info p span {
  display: block;
  font-weight: 400;
}
@media (min-width: 1025px) {
  #contents.groupBd .intro .info, #contents.groupGr .intro .info {
    margin-top: 80px;
  }
  #contents.groupBd .intro .info .logo, #contents.groupGr .intro .info .logo {
    height: 80px;
  }
  #contents.groupBd .intro .info.type01 .address, #contents.groupGr .intro .info.type01 .address {
    width: 50%;
  }
  #contents.groupBd .intro .info.type01 p:not(:first-of-type), #contents.groupGr .intro .info.type01 p:not(:first-of-type) {
    margin-top: 70px;
  }
  #contents.groupBd .intro .info.type01 p:not(:first-of-type)::before, #contents.groupGr .intro .info.type01 p:not(:first-of-type)::before {
    content: "";
    position: absolute;
    top: -35px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #c8c8c8;
  }
  #contents.groupBd .intro .info.type02 .logo, #contents.groupBd .intro .info.type02 .address, #contents.groupGr .intro .info.type02 .logo, #contents.groupGr .intro .info.type02 .address {
    width: 100%;
  }
  #contents.groupBd .intro .info.type02 .logo, #contents.groupGr .intro .info.type02 .logo {
    border-right: none;
  }
  #contents.groupBd .intro .info.type02 .address, #contents.groupGr .intro .info.type02 .address {
    margin-top: 35px;
    margin-bottom: 35px;
    padding-top: 35px;
    padding-bottom: 30px;
    border-top: 1px solid #c8c8c8;
    border-bottom: 1px solid #c8c8c8;
  }
  #contents.groupBd .intro .info.type01 p:not(:first-of-type), #contents.groupBd .intro .info.type02 p:not(:first-of-type), #contents.groupGr .intro .info.type01 p:not(:first-of-type), #contents.groupGr .intro .info.type02 p:not(:first-of-type) {
    width: 33.3333333333%;
    min-height: 80px;
  }
  #contents.groupBd .intro .info.type01 p:not(:first-of-type) + p, #contents.groupBd .intro .info.type02 p:not(:first-of-type) + p, #contents.groupGr .intro .info.type01 p:not(:first-of-type) + p, #contents.groupGr .intro .info.type02 p:not(:first-of-type) + p {
    border-left: 1px solid #c8c8c8;
  }
  #contents.groupBd .intro .info p, #contents.groupGr .intro .info p {
    min-height: 50px;
    padding-left: 100px;
    background-position: 30px center;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .intro .info, #contents.groupGr .intro .info {
    margin-top: 50px;
  }
  #contents.groupBd .intro .info .logo, #contents.groupGr .intro .info .logo {
    margin-top: 20px;
    height: 50px;
  }
  #contents.groupBd .intro .info .logo img, #contents.groupGr .intro .info .logo img {
    width: 120px;
  }
  #contents.groupBd .intro .info .logo + p + p, #contents.groupGr .intro .info .logo + p + p {
    width: 50%;
  }
  #contents.groupBd .intro .info .logo + p + p + p, #contents.groupGr .intro .info .logo + p + p + p {
    margin-top: 40px !important;
  }
  #contents.groupBd .intro .info .address, #contents.groupGr .intro .info .address {
    order: -1;
    width: 100%;
    padding-bottom: 25px;
    border-bottom: 1px solid #c8c8c8;
  }
  #contents.groupBd .intro .info p, #contents.groupGr .intro .info p {
    min-height: 36px;
    padding-left: 71px;
    background-size: 36px auto;
    background-position: 20px top;
  }
  #contents.groupBd .intro .info p:not(.address), #contents.groupGr .intro .info p:not(.address) {
    margin-top: 20px;
  }
  #contents.groupBd .intro .info p + p + p, #contents.groupGr .intro .info p + p + p {
    width: 100%;
  }
  #contents.groupBd .intro .info p + p + p:not(:last-of-type), #contents.groupGr .intro .info p + p + p:not(:last-of-type) {
    padding-bottom: 20px;
  }
  #contents.groupBd .intro .info p + p + p::before, #contents.groupGr .intro .info p + p + p::before {
    content: "";
    position: absolute;
    top: -20px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #c8c8c8;
  }
}
#contents.groupBd .category, #contents.groupGr .category {
  background: #f9f9f9;
}
@media (min-width: 1025px) {
  #contents.groupBd .category, #contents.groupGr .category {
    padding-bottom: 100px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .category, #contents.groupGr .category {
    padding-bottom: 50px;
  }
}
#contents.groupBd .category > div, #contents.groupGr .category > div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1240px;
  min-width: 315px;
  padding-left: 20px;
  padding-right: 20px;
}
#contents.groupBd .category ul li, #contents.groupBd .category ul a, #contents.groupBd .category > div > div li, #contents.groupBd .category > div > div a, #contents.groupGr .category ul li, #contents.groupGr .category ul a, #contents.groupGr .category > div > div li, #contents.groupGr .category > div > div a {
  border: 1px solid #c8c8c8;
  border-radius: 8px;
  background: #fff;
}
#contents.groupBd .category ul li div, #contents.groupBd .category ul a div, #contents.groupBd .category > div > div li div, #contents.groupBd .category > div > div a div, #contents.groupGr .category ul li div, #contents.groupGr .category ul a div, #contents.groupGr .category > div > div li div, #contents.groupGr .category > div > div a div {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
  margin-bottom: 20px;
}
#contents.groupBd .category ul li div strong, #contents.groupBd .category ul a div strong, #contents.groupBd .category > div > div li div strong, #contents.groupBd .category > div > div a div strong, #contents.groupGr .category ul li div strong, #contents.groupGr .category ul a div strong, #contents.groupGr .category > div > div li div strong, #contents.groupGr .category > div > div a div strong {
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.02em;
}
@media (min-width: 1025px) {
  #contents.groupBd .category ul li div.block, #contents.groupBd .category ul a div.block, #contents.groupBd .category > div > div li div.block, #contents.groupBd .category > div > div a div.block, #contents.groupGr .category ul li div.block, #contents.groupGr .category ul a div.block, #contents.groupGr .category > div > div li div.block, #contents.groupGr .category > div > div a div.block {
    display: block;
  }
  #contents.groupBd .category ul li div.block strong, #contents.groupBd .category ul a div.block strong, #contents.groupBd .category > div > div li div.block strong, #contents.groupBd .category > div > div a div.block strong, #contents.groupGr .category ul li div.block strong, #contents.groupGr .category ul a div.block strong, #contents.groupGr .category > div > div li div.block strong, #contents.groupGr .category > div > div a div.block strong {
    display: block;
    margin-top: 35px;
    font-size: 22px;
    line-height: 32px;
    letter-spacing: -0.02em;
    letter-spacing: -0.03em;
  }
}
#contents.groupBd .category ul li p, #contents.groupBd .category ul a p, #contents.groupBd .category > div > div li p, #contents.groupBd .category > div > div a p, #contents.groupGr .category ul li p, #contents.groupGr .category ul a p, #contents.groupGr .category > div > div li p, #contents.groupGr .category > div > div a p {
  font-size: 18px;
  line-height: 28px;
  letter-spacing: -0.015em;
  word-break: keep-all;
  color: #666;
}
#contents.groupBd .category ul a, #contents.groupBd .category > div > div a, #contents.groupGr .category ul a, #contents.groupGr .category > div > div a {
  position: relative;
}
@media (min-width: 1025px) {
  #contents.groupBd .category ul a, #contents.groupBd .category > div > div a, #contents.groupGr .category ul a, #contents.groupGr .category > div > div a {
    padding-bottom: 105px !important;
  }
}
#contents.groupBd .category ul a::after, #contents.groupBd .category > div > div a::after, #contents.groupGr .category ul a::after, #contents.groupGr .category > div > div a::after {
  content: "";
  display: block;
  width: 32px;
  height: 30px;
  background: url("../images/shinyoungGroup/page/iconArr.svg") no-repeat center;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.45;
}
@media (min-width: 1025px) {
  #contents.groupBd .category ul a::after, #contents.groupBd .category > div > div a::after, #contents.groupGr .category ul a::after, #contents.groupGr .category > div > div a::after {
    position: absolute;
    bottom: 50px;
    left: 40px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .category ul a::after, #contents.groupBd .category > div > div a::after, #contents.groupGr .category ul a::after, #contents.groupGr .category > div > div a::after {
    margin-top: 25px;
  }
}
#contents.groupBd .category ul a:hover, #contents.groupBd .category > div > div a:hover, #contents.groupGr .category ul a:hover, #contents.groupGr .category > div > div a:hover {
  border-color: #4415a0;
}
#contents.groupBd .category ul a:hover::after, #contents.groupBd .category > div > div a:hover::after, #contents.groupGr .category ul a:hover::after, #contents.groupGr .category > div > div a:hover::after {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
@media (min-width: 1025px) {
  #contents.groupBd .category ul, #contents.groupBd .category > div > div, #contents.groupGr .category ul, #contents.groupGr .category > div > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    margin-top: 50px;
  }
  #contents.groupBd .category ul li, #contents.groupBd .category ul a, #contents.groupBd .category > div > div li, #contents.groupBd .category > div > div a, #contents.groupGr .category ul li, #contents.groupGr .category ul a, #contents.groupGr .category > div > div li, #contents.groupGr .category > div > div a {
    width: calc(50% - 15px);
    min-height: 345px;
    padding: 50px 40px 55px;
  }
  #contents.groupBd .category ul li + li + li, #contents.groupBd .category ul li + a + a, #contents.groupBd .category ul a + li + li, #contents.groupBd .category ul a + a + a, #contents.groupBd .category > div > div li + li + li, #contents.groupBd .category > div > div li + a + a, #contents.groupBd .category > div > div a + li + li, #contents.groupBd .category > div > div a + a + a, #contents.groupGr .category ul li + li + li, #contents.groupGr .category ul li + a + a, #contents.groupGr .category ul a + li + li, #contents.groupGr .category ul a + a + a, #contents.groupGr .category > div > div li + li + li, #contents.groupGr .category > div > div li + a + a, #contents.groupGr .category > div > div a + li + li, #contents.groupGr .category > div > div a + a + a {
    margin-top: 30px;
  }
  #contents.groupBd .category ul li div img, #contents.groupBd .category ul a div img, #contents.groupBd .category > div > div li div img, #contents.groupBd .category > div > div a div img, #contents.groupGr .category ul li div img, #contents.groupGr .category ul a div img, #contents.groupGr .category > div > div li div img, #contents.groupGr .category > div > div a div img {
    margin-right: 20px;
  }
}
@media (max-width: 1024px) {
  #contents.groupBd .category ul, #contents.groupBd .category > div > div, #contents.groupGr .category ul, #contents.groupGr .category > div > div {
    margin-top: 20px;
  }
  #contents.groupBd .category ul li, #contents.groupBd .category ul a, #contents.groupBd .category > div > div li, #contents.groupBd .category > div > div a, #contents.groupGr .category ul li, #contents.groupGr .category ul a, #contents.groupGr .category > div > div li, #contents.groupGr .category > div > div a {
    display: block;
    padding: 35px 25px 40px;
  }
  #contents.groupBd .category ul li + li, #contents.groupBd .category ul li + a, #contents.groupBd .category ul a + li, #contents.groupBd .category ul a + a, #contents.groupBd .category > div > div li + li, #contents.groupBd .category > div > div li + a, #contents.groupBd .category > div > div a + li, #contents.groupBd .category > div > div a + a, #contents.groupGr .category ul li + li, #contents.groupGr .category ul li + a, #contents.groupGr .category ul a + li, #contents.groupGr .category ul a + a, #contents.groupGr .category > div > div li + li, #contents.groupGr .category > div > div li + a, #contents.groupGr .category > div > div a + li, #contents.groupGr .category > div > div a + a {
    margin-top: 25px;
  }
  #contents.groupBd .category ul li div img, #contents.groupBd .category ul a div img, #contents.groupBd .category > div > div li div img, #contents.groupBd .category > div > div a div img, #contents.groupGr .category ul li div img, #contents.groupGr .category ul a div img, #contents.groupGr .category > div > div li div img, #contents.groupGr .category > div > div a div img {
    margin-right: 10px;
    width: 60px;
    height: 60px;
  }
}
@media (min-width: 1025px) {
  #contents.groupBd .category.triple li, #contents.groupBd .category.triple a, #contents.groupGr .category.triple li, #contents.groupGr .category.triple a {
    width: calc(33.3333333333% - 20px);
    margin-top: 0 !important;
  }
}

.guideBtnEx01 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx01::before, .guideBtnEx01::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx01:not(:disabled):hover, .guideBtnEx01:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx01:not(:disabled):hover::before, .guideBtnEx01:not(:disabled):hover::after, .guideBtnEx01:not(:disabled):focus::before, .guideBtnEx01:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx01 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx01::before {
    margin-right: 10px;
  }
  .guideBtnEx01::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx01 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx01::before {
    margin-right: 14px;
  }
  .guideBtnEx01::after {
    margin-left: 18px;
  }
}

.guideBtnEx02 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
  min-width: 100px;
}
.guideBtnEx02::before, .guideBtnEx02::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx02:not(:disabled):hover, .guideBtnEx02:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx02:not(:disabled):hover::before, .guideBtnEx02:not(:disabled):hover::after, .guideBtnEx02:not(:disabled):focus::before, .guideBtnEx02:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx02 {
    font-size: 16px;
    font-size: 14px;
    min-width: 100px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx02::before {
    margin-right: 10px;
  }
  .guideBtnEx02::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx02 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx02::before {
    margin-right: 14px;
  }
  .guideBtnEx02::after {
    margin-left: 18px;
  }
}

.guideBtnEx03 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx03::before, .guideBtnEx03::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx03:not(:disabled):hover, .guideBtnEx03:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx03:not(:disabled):hover::before, .guideBtnEx03:not(:disabled):hover::after, .guideBtnEx03:not(:disabled):focus::before, .guideBtnEx03:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx03 {
    font-size: 16px;
    min-width: 180px;
    height: 60px;
    padding: 0 20px;
    border-radius: 30px;
  }
  .guideBtnEx03::before {
    margin-right: 10px;
  }
  .guideBtnEx03::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx03 {
    font-size: 14px;
    min-width: 180px;
    font-size: 16px;
    height: 50px;
    padding: 0 18px;
    border-radius: 25px;
  }
  .guideBtnEx03::before {
    margin-right: 14px;
  }
  .guideBtnEx03::after {
    margin-left: 18px;
  }
}

.guideBtnEx04 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx04::before, .guideBtnEx04::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx04::before {
  content: "";
  background-image: url("../images/icon/iconWeb.svg");
}
.guideBtnEx04:not(:disabled):hover, .guideBtnEx04:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx04:not(:disabled):hover::before, .guideBtnEx04:not(:disabled):hover::after, .guideBtnEx04:not(:disabled):focus::before, .guideBtnEx04:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx04 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx04::before {
    margin-right: 10px;
  }
  .guideBtnEx04::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx04 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx04::before {
    margin-right: 14px;
  }
  .guideBtnEx04::after {
    margin-left: 18px;
  }
}

.guideBtnEx05 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx05::before, .guideBtnEx05::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx05::before {
  content: "";
  background-image: url("../images/icon/iconCall.svg");
}
.guideBtnEx05:not(:disabled):hover, .guideBtnEx05:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx05:not(:disabled):hover::before, .guideBtnEx05:not(:disabled):hover::after, .guideBtnEx05:not(:disabled):focus::before, .guideBtnEx05:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx05 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx05::before {
    margin-right: 10px;
  }
  .guideBtnEx05::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx05 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx05::before {
    margin-right: 14px;
  }
  .guideBtnEx05::after {
    margin-left: 18px;
  }
}

.guideBtnEx06 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx06::before, .guideBtnEx06::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx06::after {
  content: "";
  background-image: url("../images/icon/iconArrow.svg");
}
.guideBtnEx06:not(:disabled):hover, .guideBtnEx06:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx06:not(:disabled):hover::before, .guideBtnEx06:not(:disabled):hover::after, .guideBtnEx06:not(:disabled):focus::before, .guideBtnEx06:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx06 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx06::before {
    margin-right: 10px;
  }
  .guideBtnEx06::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx06 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx06::before {
    margin-right: 14px;
  }
  .guideBtnEx06::after {
    margin-left: 18px;
  }
}

.guideBtnEx07 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx07::before, .guideBtnEx07::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx07::after {
  content: "";
  margin-top: -2px !important;
  background-image: url("../images/icon/iconDownload2.svg");
}
.guideBtnEx07:not(:disabled):hover, .guideBtnEx07:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx07:not(:disabled):hover::before, .guideBtnEx07:not(:disabled):hover::after, .guideBtnEx07:not(:disabled):focus::before, .guideBtnEx07:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx07 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx07::before {
    margin-right: 10px;
  }
  .guideBtnEx07::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx07 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx07::before {
    margin-right: 14px;
  }
  .guideBtnEx07::after {
    margin-left: 18px;
  }
}

.guideBtnEx08 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #c8c8c8;
  background-color: #fff;
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.2;
  word-break: keep-all;
  color: #666;
}
.guideBtnEx08::before, .guideBtnEx08::after {
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.7;
}
.guideBtnEx08::after {
  content: "";
  background-image: url("../images/icon/iconZoom.svg");
}
.guideBtnEx08:not(:disabled):hover, .guideBtnEx08:not(:disabled):focus {
  border-color: #4415a0;
  background: #4415a0;
  color: #fff;
}
.guideBtnEx08:not(:disabled):hover::before, .guideBtnEx08:not(:disabled):hover::after, .guideBtnEx08:not(:disabled):focus::before, .guideBtnEx08:not(:disabled):focus::after {
  -moz-filter: grayscale(1) brightness(100);
  -ms-filter: grayscale(1) brightness(100);
  -o-filter: grayscale(1) brightness(100);
  filter: grayscale(1) brightness(100);
  opacity: 1;
}
@media (min-width: 1025px) {
  .guideBtnEx08 {
    font-size: 16px;
    height: 44px;
    padding: 0 20px;
    border-radius: 22px;
  }
  .guideBtnEx08::before {
    margin-right: 10px;
  }
  .guideBtnEx08::after {
    margin: 0 2px 0 15px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx08 {
    font-size: 14px;
    height: 40px;
    padding: 0 18px;
    border-radius: 20px;
  }
  .guideBtnEx08::before {
    margin-right: 14px;
  }
  .guideBtnEx08::after {
    margin-left: 18px;
  }
}

.guideBtnEx09 {
  display: inline-block;
  width: 100%;
  border: 1px solid #000;
  border-radius: 25px;
  background: #ccc;
  text-align: center;
  line-height: 50px;
  color: #555;
}
@media (max-width: 1024px) {
  .guideBtnEx09 {
    font-size: 14px;
  }
}

.guideBtnEx10 {
  display: inline-block;
  width: 100%;
  border-radius: 25px;
  background: #ccc;
  text-align: center;
  line-height: 50px;
  color: #555;
}
@media (max-width: 1024px) {
  .guideBtnEx10 {
    font-size: 14px;
  }
}

.guideBtnEx13 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx13:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx13:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx13::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (min-width: 1025px) {
  .guideBtnEx13 {
    width: 40px;
    height: 40px;
  }
  .guideBtnEx13::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}
@media (max-width: 1024px) {
  .guideBtnEx13 {
    width: 35px;
    height: 35px;
  }
  .guideBtnEx13::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
  }
}

.guideBtnEx14 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx14:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx14:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx14::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 10px;
}
@media (min-width: 1025px) {
  .guideBtnEx14 {
    width: 40px;
    height: 40px;
  }
  .guideBtnEx14::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}
@media (max-width: 1024px) {
  .guideBtnEx14 {
    width: 35px;
    height: 35px;
  }
  .guideBtnEx14::after {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
  }
}

.guideBtnEx15 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx15:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx15:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx15::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  .guideBtnEx15 {
    width: 37px;
    height: 37px;
  }
  .guideBtnEx15::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 8px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx15 {
    width: 25px;
    height: 25px;
  }
  .guideBtnEx15::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 6px;
  }
}

.guideBtnEx16 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx16:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx16:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx16::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  .guideBtnEx16 {
    width: 37px;
    height: 37px;
  }
  .guideBtnEx16::after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 8px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx16 {
    width: 25px;
    height: 25px;
  }
  .guideBtnEx16::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 6px;
  }
}

.guideBtnEx17 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
}
.guideBtnEx17:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx17:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx17::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 4px;
}
.guideBtnEx17::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(45deg);
}
.guideBtnEx18 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
  background: #fff;
  width: 22px;
  height: 22px;
}
.guideBtnEx18:not(:disabled):hover {
  border-color: #4415a0;
}
.guideBtnEx18:not(:disabled):hover::after {
  border-color: #4415a0 !important;
}
.guideBtnEx18::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 4px;
}
.guideBtnEx18::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #212121;
  border-style: solid;
  transform: rotate(-135deg);
}
.guideBtnEx19 {
  position: relative;
  width: 40px;
  height: 40px;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
}
.guideBtnEx19::after {
  content: "";
  display: block;
  width: 11px;
  height: 11px;
  border-width: 0 0 1px 1px;
  border-color: #fff;
  border-style: solid;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 11px;
}
.guideBtnEx19:not(:disabled):hover, .guideBtnEx19:not(:disabled):focus {
  border-color: #0097e0;
}
.guideBtnEx19:not(:disabled):hover::after, .guideBtnEx19:not(:disabled):focus::after {
  border-color: #0097e0;
}

.guideBtnEx20 {
  position: relative;
  width: 40px;
  height: 40px;
  border: 1px solid #c1c1c1;
  border-radius: 50%;
}
.guideBtnEx20::after {
  content: "";
  display: block;
  width: 11px;
  height: 11px;
  border-width: 0 0 1px 1px;
  border-color: #fff;
  border-style: solid;
  transform: rotate(-135deg);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 11px;
}
.guideBtnEx20:not(:disabled):hover, .guideBtnEx20:not(:disabled):focus {
  border-color: #0097e0;
}
.guideBtnEx20:not(:disabled):hover::after, .guideBtnEx20:not(:disabled):focus::after {
  border-color: #0097e0;
}

.guideBtnEx21 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx21:hover, .guideBtnEx21:focus {
  border-color: #4415a0;
}
.guideBtnEx21:hover::after, .guideBtnEx21:focus::after {
  border-color: #4415a0;
}
.guideBtnEx21::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  .guideBtnEx21 {
    width: 40px;
    height: 40px;
  }
  .guideBtnEx21::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 11px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx21 {
    width: 30px;
    height: 30px;
  }
  .guideBtnEx21::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(45deg);
    right: 9px;
  }
}

.guideBtnEx22 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border: 1px solid #c8c8c8;
  border-radius: 50%;
  background: #fff;
}
.guideBtnEx22:hover, .guideBtnEx22:focus {
  border-color: #4415a0;
}
.guideBtnEx22:hover::after, .guideBtnEx22:focus::after {
  border-color: #4415a0;
}
.guideBtnEx22::after {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (min-width: 1025px) {
  .guideBtnEx22 {
    width: 40px;
    height: 40px;
  }
  .guideBtnEx22::after {
    content: "";
    display: block;
    width: 11px;
    height: 11px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 11px;
  }
}
@media (max-width: 1024px) {
  .guideBtnEx22 {
    width: 30px;
    height: 30px;
  }
  .guideBtnEx22::after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    border-width: 0 0 1px 1px;
    border-color: #212121;
    border-style: solid;
    transform: rotate(-135deg);
    left: 9px;
  }
}

.guideBtnEx23 {
  position: relative;
  z-index: 2;
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  border-radius: 50%;
  background: #4415a0;
}
@media (min-width: 1025px) {
  .guideBtnEx23 {
    top: 100px;
    right: 107px;
    width: 48px;
    height: 48px;
  }
  .guideBtnEx23::before, .guideBtnEx23::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 23px;
    height: 1px;
    background: #fff;
  }
  .guideBtnEx23::before {
    transform: rotate(45deg);
  }
  .guideBtnEx23::after {
    transform: rotate(-45deg);
  }
}
@media (max-width: 1024px) {
  .guideBtnEx23 {
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
  }
  .guideBtnEx23::before, .guideBtnEx23::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 15px;
    height: 1px;
    background: #fff;
  }
  .guideBtnEx23::before {
    transform: rotate(45deg);
  }
  .guideBtnEx23::after {
    transform: rotate(-45deg);
  }
}

.guideArrEx01 {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 23px;
  height: 23px;
}
.guideArrEx01::before, .guideArrEx01::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 23px;
  height: 1px;
  background: #000;
}
.guideArrEx01::after {
  transform: rotate(90deg);
}

.guideArrEx03 {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 23px;
  height: 23px;
}
.guideArrEx03::before, .guideArrEx03::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 23px;
  height: 1px;
  background: #000;
}

.guideArrEx02 {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 23px;
  height: 23px;
}
.guideArrEx02::before, .guideArrEx02::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 15px;
  height: 1px;
  background: red;
}
.guideArrEx02::before {
  transform: rotate(45deg);
}
.guideArrEx02::after {
  transform: rotate(-45deg);
}

.guideTriEx01 {
  display: inline-block;
  margin-top: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 8px;
  border-color: transparent transparent #000 transparent;
}

.guideTriEx02 {
  display: inline-block;
  margin-top: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 7px;
  border-color: transparent transparent transparent red;
}

.guideBraEx01 {
  display: inline-block !important;
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-width: 0 0 1px 1px;
  border-color: #000;
  border-style: solid;
  transform: rotate(-45deg);
}

.guideBraEx02 {
  display: inline-block !important;
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  border-width: 0 0 2px 2px;
  border-color: red;
  border-style: solid;
  transform: rotate(45deg);
}

.guidePagination {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.guidePagination .button {
  display: inline-block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  font-size: 0.5rem;
  width: 32px;
  height: 32px;
  overflow: hidden;
  border-radius: 50%;
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.45;
}
.guidePagination .button.next, .guidePagination .button.prev {
  background: url("../images/icon/iconNext.svg") no-repeat center;
}
.guidePagination .button.last, .guidePagination .button.first {
  background: url("../images/icon/iconLast.svg") no-repeat center;
}
.guidePagination .button.prev, .guidePagination .button.first {
  transform: rotate(180deg);
}
.guidePagination .button:disabled {
  opacity: 0.2;
}
.guidePagination .button:not(:disabled):hover, .guidePagination .button:not(:disabled):focus {
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
  opacity: 1;
}
.guidePagination .current {
  font-weight: 700;
  color: #4415a0;
}
.guidePagination button:not(.button):hover, .guidePagination button:not(.button):focus {
  color: #4415a0;
}
@media (min-width: 1025px) {
  .guidePagination .button {
    margin: 0 7.5px;
  }
  .guidePagination button:not(.button) + button:not(.button) {
    margin-left: 47px;
  }
  .guidePagination .prev {
    margin-right: 32px;
  }
  .guidePagination .next {
    margin-left: 32px;
  }
}
@media (max-width: 1024px) {
  .guidePagination {
    justify-content: space-evenly;
    width: calc(100% - 140px);
    margin-left: auto;
    margin-right: auto;
  }
  .guidePagination .button {
    position: absolute;
  }
  .guidePagination .button.first {
    left: 20px;
  }
  .guidePagination .button.last {
    right: 20px;
  }
  .guidePagination .button.prev {
    left: 60px;
  }
  .guidePagination .button.next {
    right: 60px;
  }
}
@media (max-width: 640px) {
  .guidePagination {
    justify-content: center;
  }
  .guidePagination button:not(.button) {
    display: none;
  }
  .guidePagination .button {
    position: unset;
    margin: 0 5px;
  }
}