/* common */ .sub-visual .bg{ padding: 13% 0 3%; } .sub-visual .text{ color: #fff; } .sub-visual .text h5{ font-family: var(--Mukta); font-size: 2.8rem; font-weight: 600; } .sub-visual .text h3{ font-size: 8.4rem; font-weight: 700; margin: 20px 0 60px; } .sub-visual .text h3.long{ font-size: 5.6rem; } .sub-visual .text h3.small{ font-size: 7rem; margin-bottom: 15px; } /* lnb */ .sub-visual .lnb ul li a{ display: inline-block; font-size: 2rem; font-weight: 700; color: #fff; padding: 22.5px; opacity: 0.5; } .sub-visual .lnb ul li.on a{ opacity: 1; } .sub-visual .lnb .moblie{ display: none; } /* lnb - pc */ .sub-visual .lnb .pc ul{ display: flex; margin-left: -22.5px; } .sub-visual .lnb .pc ul li{ position: relative; } .sub-visual .lnb .pc ul li::after{ content: ""; width: 1px; height: 16px; background-color: #fff; opacity: 0.5; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .sub-visual .lnb .pc ul li:last-of-type::after{ display: none; } /* lnb - moblie */ .sub-visual .lnb .moblie{ max-width: 300px; width: 100%; display: none; position: relative; } .sub-visual .lnb .moblie p{ font-size: 1.8rem; font-weight: 700; padding: 10px 15px; border-bottom: 1px solid #fff; position: relative; cursor: pointer; } .sub-visual .lnb .moblie p::after{ content: "\e942"; font-family:'xeicon'; font-weight: normal; font-style: normal; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); transition: 0.5s; } .sub-visual .lnb .moblie p.on::after{ transform: translateY(-50%) scaleY(-1); } .sub-visual .lnb .moblie ul{ width: 100%; display: none; position: absolute; top: calc(100% + 10px); z-index: 10; background-color: #fff; margin-left: 0; padding: 10px 0; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); overflow: hidden; } .sub-visual .lnb .moblie ul li a{ width: 100%; font-size: 1.8rem; font-weight: 700; color: #333; padding: 10px 15px; } .sub-visual .lnb .moblie ul li:hover a{ opacity: 1; } /* 개인정보처리방침 */ .sub-visual .bg5{ padding: 10% 0 3%; } .sub-visual .bg5 .text{ color: #333; } .sub-visual .bg5 .text h3{ color: #333; margin: 20px 0 ; } .sub-visual .lnb5 .pc{ display: none; } .sub-visual .lnb5 .moblie{ display: block; } .sub-visual .lnb5 .moblie p{ border-bottom: 1px solid #333; } .sub-content{ padding-top: 150px; } .sub-content section{ position: relative; padding-bottom: 150px; overflow: hidden; } .sub-content h4{ font-size: 4rem; font-weight: 700; color: #111; padding-bottom: 80px; } .sub-content .blue{ font-weight: 700; color: var(--blue); } .button{ display: flex; justify-content: center; align-items: center; width: 300px; height: 80px; border-radius: 100px; position: relative; } .button::before{ display: inline-block; margin-right: 15px; } .button::after{ display: inline-block; margin-left: 15px; } .blue-btn{ font-size: 1.8rem; font-weight: 600; color: #fff; background-color: var(--blue); } .blue-btn.download::before{ content: url("/img/sub/download_icon.png"); } .blue-btn.shopping::before{ content: url("/img/sub/shopping_icon.png"); } .tab-menu ul{ display: flex; margin-left: -30px; } .tab-menu ul li{ font-size: 4rem; font-weight: 700; color: #ccc; padding: 0 30px; position: relative; cursor: pointer; } .tab-menu ul li a{ color: #ccc; } .tab-menu ul li::after{ content: ""; width: 4px; height: 30px; background-color: #ddd; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .tab-menu ul li:last-of-type::after{ display: none; } .tab-menu ul li.active{ color: var(--blue); } .tab-menu ul li.active a{ color: var(--blue); } /* 개인정보처리방침 2024.09.03 bsc 추가*/ .prTable th {border: 1px solid; text-align: center; background-color: #ccc;} .prTable .prCenter {text-align: center;} .prTable tr td{border: 1px solid;} @media screen and (max-width: 1250px){ .sub-visual .text h5{ font-size: 2rem; } .sub-visual .text h3{ font-size: 6rem; } .sub-visual .text h3.long{ font-size: 4.6rem; } .sub-visual .text h3.small{ font-size: 5rem; } .sub-visual .text p{ font-size: 2rem; } .sub-visual .lnb ul li a{ font-size: 1.8rem; } .sub-content{ padding-top: 60px; } .sub-content h4{ font-size: 3.3rem; padding-bottom: 30px; } .sub-content section{ padding-bottom: 100px; } .button{ width: 230px; height: 70px; } .tab-menu ul li{ font-size: 3.2rem; } } @media screen and (max-width: 1100px){ .sub-visual .lnb .pc{ display: none; } .sub-visual .lnb .moblie{ display: block; } .sub-visual .lnb5 .moblie{ display: inline-block; } } @media screen and (max-width: 700px){ .sub-visual .text{ padding-top: 50px; } .button{ width: 190px; height: 55px; } .blue-btn{ font-size: 1.6rem; } } @media screen and (max-width: 600px){ .sub-visual .text h3{ font-size: 4rem; margin: 10px 0 20px; } .sub-visual .text h3.long{ font-size: 3rem; } .sub-visual .text h3.small{ font-size: 3.5rem; margin-bottom: 10px; } .sub-visual .text p{ font-size: 1.8rem; margin-bottom: 20px; } .sub-content h4{ font-size: 3rem; } .sub-visual .lnb5 .moblie ul{ top: 90%; } } /* 핵심가치 리스트 */ .core-list{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: -20px; } .core-list li{ display: flex; flex-direction: column; justify-content: space-between; width: calc((100% - 60px) / 4); background-color: var(--blue); border-radius: 20px; padding: 80px 20px 20px; color: #fff; margin-bottom: 20px; } .core-list li .text{ padding: 0 20px; } .core-list li h6{ font-family: var(--Mukta); font-size: 3.2rem; font-weight: 700; margin-bottom: 40px; } .core-list li p{ font-size: 1.8rem; font-weight: 300; line-height: 1.5777; opacity: 0.6; } .core-list li figure{ width: 100%; text-align: right; } @media screen and (max-width: 1540px){ .core-list li .text{ padding: 0; } .core-list li .text br{ display: none; } } @media screen and (max-width: 1250px){ .core-list li{ padding: 50px 20px 20px; } .core-list li h6{ font-size: 2.8rem; margin-bottom: 20px; } .core-list li p{ font-size: 1.6rem; } } @media screen and (max-width: 1200px){ .core-list li{ width: calc((100% - 20px) / 2); } } @media screen and (max-width: 700px){ .core-list li{ width: 100%; } } /* sub-visual - bg */ /* WHO WE ARE */ .bg1.intro{ background: url("/img/sub/greeting_bg.jpg") no-repeat center center / cover; } .bg1.project{ background: url("/img/sub/project_bg.jpg") no-repeat center center / cover; } .bg1.location{ background: url("/img/sub/location_bg.jpg") no-repeat center center / cover; } /* WHAT WE DO */ .bg2{ background: url("/img/sub/multisource_bg.jpg") no-repeat center center / cover; } .bg2.leadership{ background: url("/img/sub/leadership_bg.jpg") no-repeat center center / cover; } .bg2.aptitude{ background: url("/img/sub/aptitude02_bg.jpg") no-repeat center center / cover; } .bg2.personality{ background: url("/img/sub/aptitude_bg.jpg") no-repeat center center / cover; } .bg2.biodata{ background: url("/img/sub/ai_bg.jpg") no-repeat center center / cover; } .bg2.screening{ background: url("/img/sub/document_bg.jpg") no-repeat center center / cover; } .bg2.interview{ background: url("/img/sub/interview_bg.jpg") no-repeat center center / cover; } .bg2.agency{ background: url("/img/sub/recruit_bg.jpg") no-repeat center center / cover; } .bg2.reference{ background: url("/img/sub/repute_bg.jpg") no-repeat center center / cover; } /* FORUM */ .bg3.notice, .bg3.notice_view{ background: url("/img/sub/notice_bg.jpg") no-repeat center center / cover; } .bg3.blog, .bg3.blog_view{ background: url("/img/sub/blog_bg.jpg") no-repeat center center / cover; } .bg3.brochure{ background: url("/img/sub/brochure_bg.jpg") no-repeat center center / cover; } .bg3.news{ background: url("/img/sub/brochure_bg.jpg") no-repeat center center / cover; } .bg3.recruit{ background: url("/img/sub/recruit2_bg.jpg") no-repeat center center / cover; } /* CONTACT US */ .bg4.inquiry{ background: url("/img/sub/recruit2_bg.jpg") no-repeat center center / cover; } /* paging */ .paging{ display: flex; align-items: center; justify-content: center; margin-top: 80px; } .paging .arr{ display: flex; } .paging .arr a{ display: flex; padding: 10px; border: none; color: var(--blue); } .paging ul{ display: flex; margin: 0 10px; } .paging ul li:not(:last-of-type){ margin-right: 5px; } .paging ul li a{ display: inline-block; width: 48px; height: 48px; font-family: var(--Mukta); font-size: 1.6rem; font-weight: 400; color: #ccc; border: 1px solid #ccc; text-align: center; line-height: 48px; } .paging ul li.on a{ color: var(--blue); border: 1px solid var(--blue); background: none; } @media screen and (max-width: 1250px){ .paging{ margin-top: 40px; } .paging ul li a{ width: 40px; height: 40px; line-height: 40px; } } /* WHO WE ARE */ /* 핵심가치 */ #greeting .mission .flex-box{ display: flex; align-items: center; } #greeting .mission figure{ overflow: hidden; border-radius: 20px; } #greeting .mission .text-box{ padding-left: 80px; } #greeting .mission .text-box h5{ font-size: 3.6rem; font-weight: 700; color: var(--blue); margin-bottom: 60px; } #greeting .mission .text-box p{ font-size: 2rem; font-weight: 300; color: #555; line-height: 1.8; } #greeting .core-list li h6{ font-family: var(--baseFont); } #greeting .history h4{ position: absolute; } #greeting .history-list ul li{ display: flex; position: relative; } #greeting .history-list ul li:not(:last-of-type){ padding-bottom: 120px; } #greeting .history-list ul li::before{ content: ""; width: 2px; height: calc(100% - 30px); background-color: #e5e5e5; position: absolute; top: calc(50% + 35px); left: 50%; transform: translate(-50%, -50%); } #greeting .history-list ul li:last-of-type::before{ display: none; } #greeting .history-list ul li::after{ content: ""; width: 8px; height: 8px; border-radius: 50%; background-color: var(--blue); position: absolute; top: 30px; left: 50%; transform: translateX(-50%); } #greeting .history-list span{ display: inline-block; font-family: var(--Mukta); font-size: 6.4rem; font-weight: 500; color: var(--blue); width: 50%; padding: 0 80px; } #greeting .history-list dl{ width: 50%; /* padding: 0 80px; */ padding-top: 15px; } #greeting .history-list dl dd{ font-size: 2.2rem; font-weight: 300; color: #555; line-height: 1.9818; position: relative; } #greeting .history-list ul li b{ font-weight: 600; } #greeting .history-list ul li:nth-of-type(odd){ flex-direction: row-reverse; } #greeting .history-list ul li:nth-of-type(odd) dl{ text-align: right; padding-right: 80px; } #greeting .history-list ul li:nth-of-type(odd) dl dd{ padding-right: 15px; } #greeting .history-list ul li:nth-of-type(odd) dl dd::after{ content: "-"; display: inline-block; position: absolute; top: 0; right: 0; } #greeting .history-list ul li:nth-of-type(even) span{ text-align: right; } #greeting .history-list ul li:nth-of-type(even) dl{ padding-left: 80px; } #greeting .history-list ul li:nth-of-type(even) dl dd{ padding-left: 15px; } #greeting .history-list ul li:nth-of-type(even) dl dd::before{ content: "-"; display: inline-block; margin-right: 5px; position: absolute; top: 0; left: 0; } @media screen and (max-width: 1400px){ #greeting .mission .flex-box{ justify-content: space-between; } #greeting .mission figure{ width: calc(50% - 80px); } #greeting .mission .text-box{ width: 50%; padding-left: 0; } #greeting .mission .text-box br{ display: none; } } @media screen and (max-width: 1250px){ #greeting .mission .text-box h5{ font-size: 3rem; margin-bottom: 30px; } #greeting .mission .text-box p{ font-size: 1.8rem; } #greeting .history-list span{ font-size: 5rem; } #greeting .history-list dl{ padding-top: 15px; } #greeting .history-list dl dd{ font-size: 1.9rem; } } @media screen and (max-width: 1200px){ #greeting .history h4{ position: static; } #greeting .history-list ul li:nth-of-type(odd) dl{ padding-left: 0; } #greeting .history-list ul li:nth-of-type(even) dl{ padding-right: 0; } } @media screen and (max-width: 1000px){ #greeting .mission .flex-box{ flex-direction: column; } #greeting .mission figure{ max-width: 720px; width: 100%; } #greeting .mission .text-box{ width: 100%; padding-top: 30px; } /* #greeting .value ul li{ width: 100%; } #greeting .value ul li:nth-of-type(3), #greeting .value ul li:nth-of-type(4){ flex-direction: column; padding-bottom: 40px; } #greeting .value ul li:nth-of-type(3) .icon, #greeting .value ul li:nth-of-type(4) .icon{ padding-bottom: 0; padding-top: 20px; } */ } @media screen and (max-width: 900px){ #greeting .history-list ul li span{ font-size: 4rem; } #greeting .history-list dl dd{ font-size: 1.7rem; } #greeting .history-list ul li:not(:last-of-type){ padding-bottom: 60px; } #greeting .history-list ul li:nth-of-type(odd){ flex-direction: row; } #greeting .history-list ul li::after{ top: 25px; left: 115px; } #greeting .history-list ul li::before{ top: calc(50% + 28px); left: 115px; } #greeting .history-list ul li span{ width: 150px; padding: 0; } #greeting .history-list ul li:nth-of-type(even) span{ text-align: left; } #greeting .history-list dl{ width: calc(100% - 150px); padding-top: 10px; } #greeting .history-list ul li:nth-of-type(odd) dl{ text-align: left; } #greeting .history-list ul li:nth-of-type(even) dl{ padding: 0; padding-top: 10px; } #greeting .history-list ul li:nth-of-type(odd) dl dd{ padding-right: 0; padding-left: 15px; } #greeting .history-list ul li:nth-of-type(odd) dl dd::after{ right: calc(100% - 5px); } } /* 고객 · 주요 사업 */ #project .flex-box{ display: flex; } #project section .side{ width: 400px; } #project section .side ul li{ width: 250px; font-size: 2.2rem; font-weight: 700; color: #ccc; position: relative; cursor: pointer; } #project section .side ul li::after{ content: ""; width: 7px; height: 12px; background: url("/img/sub/company/project_after01.png") no-repeat center center / auto; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } #project section .side ul li:not(:last-of-type){ margin-bottom: 20px; } #project section .side ul li.active{ font-size: 3.4rem; color: var(--blue); } #project .section-wrap{ width: calc(100% - 400px); } #project section .side ul li.active::after{ background: url("/img/sub/company/project_after01_active.png") no-repeat center center / auto; } #project .client ul{ display: flex; flex-wrap: wrap; margin-bottom: -22px; } #project .client ul:not(:first-of-type){ display: none; } #project .client .section-wrap ul li{ width: calc((100% - 66px) / 4); margin-right: 22px; margin-bottom: 22px; } #project .client .section-wrap ul li:nth-of-type(4n){ margin-right: 0; } #project .client .section-wrap ul li figure{ width: 100%; height: 100px; displaY: flex; justify-content: center; align-items: center; } #project .business ul{ border-top: 1px solid #000; } #project .business ul li{ border-bottom: 1px solid #ddd; padding: 80px 20px; } #project .business dt{ font-size: 3.2rem; font-weight: 700; color: var(--blue); margin-bottom: 20px; } #project .business dd{ font-size: 2rem; font-weight: 300; color: #555; line-height: 1.8; padding-left: 15px; position: relative; } #project .business dd::before{ content: "-"; position: absolute; top: 0; left: 0; } @media screen and (max-width: 1540px){ #project section .side{ width: 250px; } #project .section-wrap{ width: calc(100% - 250px); } } @media screen and (max-width: 1400px){ #project .client .section-wrap ul li{ width: calc((100% - 44px) / 3); } #project .client .section-wrap ul li:nth-of-type(4n){ margin-right: 22px; } #project .client .section-wrap ul li:nth-of-type(3n){ margin-right: 0; } } @media screen and (max-width: 1250px){ #project section .side ul li.active{ font-size: 2.8rem; } #project section .side ul li{ font-size: 2rem; } #project .business ul li{ padding: 40px 20px; } #project .business dt{ font-size: 2.8rem; } #project .business dd{ font-size: 1.8rem; } } @media screen and (max-width: 1000px){ #project .client .section-wrap ul li{ width: calc((100% - 22px) / 2); } #project .client .section-wrap ul li:nth-of-type(4n){ margin-right: 0; } #project .client .section-wrap ul li:nth-of-type(odd){ margin-right: 22px; } #project .client .section-wrap ul li:nth-of-type(even){ margin-right: 0; } } @media screen and (max-width: 750px){ #project .flex-box{ flex-direction: column; } #project section .side{ width: 100%; } #project section .side ul{ margin-bottom: 30px; } #project section .side ul li{ width: 100%; } #project section .side ul li:not(:last-of-type){ margin-bottom: 10px; } #project section .section-wrap{ width: 100%; } } @media screen and (max-width: 600px){ #project section .side ul li.active{ font-size: 2.5rem; } #project section .side ul li{ font-size: 1.9rem; } #project .business ul li{ padding: 30px 20px; } #project .business dt{ font-size: 2.2rem; margin-bottom: 10px; } #project .business dd{ font-size: 1.6rem; } } /* 찾아오시는 길 */ #location p.title{ font-size: 2.4rem; font-weight: 300; color: #333; text-align: center; line-height: 1.7166; margin-bottom: 80px; } #location .info-box{ display: flex; justify-content: space-between; align-items: center; background-color: #F8F8F8; font-size: 2.2rem; padding: 60px 100px; margin-bottom: 80px; } #location .info-box img{width: 174px} #location .info-box dl{ display: flex; } #location .info-box dt{ font-weight: 600; color: #111; margin-right: 30px; } #location .info-box dd{ font-weight: 300; color: #555; } #location .blue-btn{ margin: 0 auto; } @media screen and (max-width: 1400px){ #location .info-box{ padding: 60px; } } @media screen and (max-width: 1250px){ #location p.title{ font-size: 2rem; margin-bottom: 50px; } #location .info-box{ font-size: 1.9rem; margin-bottom: 40px; } } @media screen and (max-width: 1200px){ #location .info-box{ flex-wrap: wrap; padding: 40px; } #location .info-box figure{ width: 100%; } #location .info-box dl{ margin-top: 30px; } } @media screen and (max-width: 950px){ #location .info-box dl{ width: 100%; } #location .info-box{ padding: 30px 20px; } } @media screen and (max-width: 600px){ #location .info-box{ font-size: 1.7rem; } #location .info-box dl{ margin-top: 20px; } #location .info-box dl:first-of-type{ margin-top: 40px; } } /* WHAT WE DO */ /* 메인 */ .bg2.list{ background: url("/img/sub/do_list_bg.jpg") no-repeat center center / cover; } #do-list ul{ display: flex; flex-wrap: wrap; margin-bottom: -60px; } #do-list ul li{ max-width: 720px; width: calc((100% - 60px) / 2); position: relative; margin-right: 60px; margin-bottom: 60px; } #do-list ul li:nth-of-type(even){ margin-right: 0; } #do-list ul li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 58%; border-radius: 20px; } #do-list ul li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #do-list ul li span{ display: inline-block; font-size: 3.6rem; font-weight: 700; color: #fff; position: absolute; bottom: 40px; left: 60px; padding-right: 70px; } #do-list ul li span::after{ content: ""; width: 50px; height: 50px; border: 1px solid #fff; border-radius: 50%; background: url("/img/sub/what/list_after.png") no-repeat center center / auto; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } #do-list ul li a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; } #do-list ul li:hover span::after{ animation: 0.3s ease-out infinite alternate move_arrow; } @keyframes move_arrow { 0% { margin-right: 0; } 100% { margin-right: -10px; } } @media screen and (max-width: 1250px){ #do-list ul li span{ font-size: 2.6rem; left: 30px; bottom: 25px; padding-right: 50px; } #do-list ul li span::after{ width: 35px; height: 35px; } } @media screen and (max-width: 1000px){ #do-list ul{ margin-bottom: -25px; } #do-list ul li{ width: calc((100% - 30px) / 2); margin-right: 30px; margin-bottom: 25px; } } @media screen and (max-width: 800px){ .bg2.list h3 br{ display: none; } #do-list ul{ justify-content: center; } #do-list ul li{ width: 100%; margin-right: 0; } } /* WHAT WE DO 공통 */ #evaluation .tab-menu{ padding-bottom: 60px; } #evaluation .tab-content .tab-box:not(:first-of-type){ display: none; } #evaluation h4.icon::before{ display: inline-block; content: var(--img-url); position: relative; top: 10px; margin-right: 25px; } #evaluation .intro h4{ padding-bottom: 60px; } #evaluation .intro h5{ font-size: 3.2rem; font-weight: 700; color: #111; padding-bottom: 60px; } #evaluation .intro p{ font-size: 2.2rem; font-weight: 300; color: #333; line-height: 1.7545; } #evaluation .intro p span{ font-weight: 700; } #evaluation .intro p span.blue{ color: var(--blue); } #evaluation .intro ul{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 60px; padding-bottom: 150px; } #evaluation .intro ul li{ display: inline-block; font-size: 1.8rem; font-weight: 700; color: var(--blue); padding: 15px 30px; border: 2px solid var(--blue); border-radius: 100px; } #evaluation .center{ overflow: hidden; } #evaluation .intro figure{ display: block; width: 100%; position: relative; margin: 0 auto; } #evaluation .intro figure img{ width: 100%; position: absolute; } #evaluation .good .feature-list{ display: flex; justify-content: space-between; } #evaluation .good .feature-list li{ width: calc((100% - 110px) / 3); position: relative; } #evaluation .good .feature-list li p{ font-size: 3.2rem; font-weight: 700; color: #111; margin: 40px 0; } #evaluation .good .feature-list li dl{ font-size: 2rem; font-weight: 300; color: #333; } #evaluation .good .feature-list li dl dd{ line-height: 1.8; padding-left: 15px; position: relative; } #evaluation .good .feature-list li dl dd::before{ content: "-"; position: absolute; top: 0; left: 0; } #evaluation .good .feature-list li dl span{ font-weight: 700; } #evaluation .good .feature-list li dl span.blue{ color: var(--blue); } #evaluation .good .review-list{ display: flex; justify-content: space-between; margin-top: 150px; } #evaluation .good .review-list li{ display: flex; align-items: center; width: calc((100% - 60px) / 2); border: 1px solid #ddd; border-radius: 20px; padding: 40px; } #evaluation .good .review-list li::before{ margin-right: 22px; } #evaluation .good .review-list li:first-of-type::before{ content: url("/img/sub/what/evaluation_img01.png"); } #evaluation .good .review-list li:last-of-type::before{ content: url("/img/sub/what/evaluation_img02.png"); } #evaluation .good .review-list p{ font-size: 2rem; font-weight: 400; color: #555; line-height: 1.8; padding-left: 25px; position: relative; } #evaluation .good .review-list p::before{ content: url("/img/sub/what/evaluation_icon01.png"); position: absolute; top: -10px; left: 0; } #evaluation .good .review-list p::after{ content: url("/img/sub/what/evaluation_icon02.png"); position: relative; top: -10px; margin-left: 5px; } #evaluation .good .review-list p span{ font-weight: 700; } #evaluation .text .box:not(:last-of-type){ margin-bottom: 120px; } #evaluation .text p{ font-size: 2.2rem; font-weight: 300; color: #333; line-height: 1.7545; } #evaluation .text p span{ font-weight: 700; } #evaluation .faq ul{ margin-bottom: -10px; } #evaluation .faq ul li{ background-color: #f8f8f8; border-radius: 10px; padding: 35px 45px; margin-bottom: 10px; cursor: pointer; } #evaluation .faq ul li .title{ position: relative; } #evaluation .faq ul li .title p{ font-size: 2rem; font-weight: 500; color: #333; padding: 0 35px; position: relative; transition: 0.5s; } #evaluation .faq ul li .title p::before{ content: "Q"; font-size: 2rem; font-weight: 700; color: var(--blue); position: absolute; top: 0; left: 0; } #evaluation .faq ul li .title button{ position: absolute; top: -6px; right: -13px; z-index: 5; padding: 20px; border: none; background: url("/img/sub/what/evaluation_icon03.png") no-repeat center center / auto; transform-origin: center center; transition: all 0.5s; cursor: pointer; } #evaluation .faq ul li .answer{ background-color: #fff; padding: 30px 60px; border-radius: 10px; display: none; overflow: hidden; margin-bottom: 35px; position: relative; top: 35px; cursor: default; } #evaluation .faq ul li .answer p{ font-size: 1.8rem; font-weight: 300; color: #555; letter-spacing: -0.01em; line-height: 1.9444; position: relative; } #evaluation .faq ul li .answer p::before{ content: "A"; font-size: 2rem; font-weight: 700; color: #ddd; position: absolute; top: -2px; left: -30px; } #evaluation .faq ul li .answer p:not(:first-of-type)::before{ display: none; } #evaluation .faq ul li.on .title button{ transform: scaleY(-1); } #evaluation .slide{ padding-top: 150px; background-color: #F8F8F8; overflow: hidden; } #evaluation .slide > div{ position: relative; } #evaluation .slide .link-wrapper{ overflow: hidden; } #evaluation .slide .link-wrapper .slick-list{ margin-right: -33px; } #evaluation .slide .link{ position: relative; margin-right: 33px; } #evaluation .slide .link figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 58%; border-radius: 20px; } #evaluation .slide .link figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #evaluation .slide .link span{ font-size: 3.2rem; font-weight: 700; color: #fff; position: absolute; bottom: 40px; left: 40px; } #evaluation .slide .link a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; } #evaluation .slide .btn button{ border: none; background: none; position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; } #evaluation .slide .btn button.prev{ left: -60px; } #evaluation .slide .btn button.next{ right: -60px; } @media screen and (max-width: 1250px){ #evaluation .intro h4{ padding-bottom: 30px; } #evaluation .intro h5{ padding-bottom: 30px; } #evaluation .intro p{ font-size: 2rem; } #evaluation .intro ul{ margin-top: 40px; padding-bottom: 60px; } #evaluation .intro ul li{ font-size: 1.6rem; padding: 10px 25px; } #evaluation .tab-menu{ padding-bottom: 30px; } #evaluation .good .feature-list li p{ font-size: 2.8rem; margin: 20px 0; } #evaluation .good .feature-list li dd{ font-size: 1.7rem; } #evaluation .good .review-list{ margin-top: 100px; } #evaluation .good .review-list li{ padding: 30px; padding-bottom: 25px; } #evaluation .good .review-list p{ font-size: 1.8rem; } #evaluation .text .box:not(:last-of-type){ margin-bottom: 80px; } #evaluation .text p{ font-size: 2rem; } #evaluation .faq ul li{ padding: 30px; } #evaluation .faq ul li .title p{ font-size: 1.8rem; } #evaluation .faq ul li .answer{ padding: 20px 50px; margin-bottom: 20px; top: 20px; } #evaluation .faq ul li .answer p{ font-size: 1.6rem; } #evaluation .slide{ padding-top: 100px; } #evaluation .slide .link span{ font-size: 2.5rem; bottom: 30px; left: 30px; } } @media screen and (max-width: 1100px){ #evaluation .good .review-list{ flex-direction: column; margin-bottom: -20px; } #evaluation .good .review-list li{ width: 100%; margin-bottom: 20px; } } @media screen and (max-width: 1000px){ #evaluation .good .feature-list{ flex-wrap: wrap; margin-bottom: -50px; } #evaluation .good .feature-list li{ width: calc((100% - 55px) / 2); margin-bottom: 50px; } } @media screen and (max-width: 750px){ #evaluation .good .feature-list li{ width: 100%; } #evaluation .slide{ padding-top: 50px; padding-bottom: 50px; } } @media screen and (max-width: 600px){ #evaluation .intro h5{ font-size: 2.6rem; } #evaluation .intro p{ font-size: 1.8rem; } #evaluation h4.icon::before{ top: 12px; transform: scale(0.8); margin-right: 10px; } #evaluation .good .feature-list li p{ font-size: 2.3rem; margin: 20px 0 15px; } #evaluation .good .review-list li{ flex-direction: column; } #evaluation .good .review-list li::before{ margin-right: 0; margin-bottom: 20px; } #evaluation .text p{ font-size: 1.8rem; } #evaluation .faq ul li{ padding: 25px; } #evaluation .faq ul li .answer{ margin-bottom: 20px; top: 20px; } } /* 다면평가 */ #evaluation.multisource .intro figure{ max-width: 814px; width: 100%; padding-bottom: 525px; } @media screen and (max-width: 1000px){ #evaluation.multisource .intro p br{ display: none; } } @media screen and (max-width: 900px){ #evaluation.multisource .intro figure{ padding-bottom: 65%; } } /* 리더십진단평가 */ #evaluation.leadership .intro figure{ max-width: 848px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 700px){ #evaluation.leadership p br{ display: none; } } @media screen and (max-width: 920px){ #evaluation.leadership .intro figure{ padding-bottom: 65%; } } /* 인·적성검사 */ #evaluation.aptitude .intro01 figure{ max-width: 816px; width: 100%; padding-bottom: 524px; } #evaluation.aptitude .intro02 figure{ max-width: 865px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 1300px){ #evaluation.aptitude p br{ display: none; } } @media screen and (max-width: 940px){ #evaluation.aptitude .intro02 figure{ padding-bottom: 65%; } } @media screen and (max-width: 920px){ #evaluation.aptitude .intro01 figure{ padding-bottom: 65%; } } /* AI바이오데이터 */ #evaluation.ai .intro figure{ max-width: 836px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 1010px){ #evaluation.ai p br{ display: none; } } @media screen and (max-width: 900px){ #evaluation.ai .intro figure{ padding-bottom: 65%; } } /* 서류전형컨설팅 */ #evaluation.document .good .review-list{ margin-top: 0; } #evaluation.document .intro figure{ max-width: 721px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 900px){ #evaluation.document .intro p br{ display: none; } } @media screen and (max-width: 800px){ #evaluation.document .intro figure{ padding-bottom: 73%; } } /* 면접컨설팅 */ #evaluation.interview .good .review-list{ margin-top: 0; } #evaluation.interview .intro figure{ max-width: 816px; width: 100%; padding-bottom: 524px; } #evaluation.interview h4.icon{ padding-bottom: 60px; } #evaluation.interview .image-list{ display: flex; flex-wrap: wrap; margin-bottom: -30px; padding-top: 60px; } #evaluation.interview .image-list li{ width: calc((100% - 30px) / 2); margin-right: 30px; margin-bottom: 30px; } #evaluation.interview .image-list li:nth-of-type(2n){ margin-right: 0; } #evaluation.interview .image-list li figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 56%; border-radius: 20px 20px 0 0; margin-bottom: -5px; } #evaluation.interview .image-list li figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #evaluation.interview .image-list li .txt{ border: 1px solid #ddd; border-top: none; border-radius: 0 0 20px 20px; padding: 30px; } #evaluation.interview .image-list li dt{ font-size: 2rem; font-weight: 700; color: #111; } #evaluation.interview .image-list li dd{ font-size: 1.8rem; font-weight: 400; color: rgba(51, 51, 51, 0.5); margin-top: 10px; } #evaluation.interview .image-list li p{ font-size: 1.8rem; font-weight: 400; color: #333; margin-top: 30px; } #evaluation.interview .image-list li p span{ font-weight: 400; color: #111; } #evaluation.interview .icon-list{ padding-top: 60px; } #evaluation.interview .icon-list li{ display: flex; align-items: center; padding: 30px 0; } #evaluation.interview .icon-list li.underline{ padding: 0; margin: 20px 0; height: 1px; background: #ddd; } #evaluation.interview .icon-list .icon{ width: 210px; display: flex; flex-direction: column; justify-content: center; align-items: center; } #evaluation.interview .icon-list .icon span{ font-size: 2rem; font-weight: 700; color: #111; margin-top: 10px; text-align: center; } #evaluation.interview .icon-list .txt{ width: calc(100% - 210px); padding-left: 25px; } #evaluation.interview .icon-list .txt h6{ font-size: 2rem; font-weight: 700; color: var(--blue); } #evaluation.interview .icon-list .txt p{ font-size: 1.8rem; font-weight: 400; color: #333; margin-top: 10px; } @media screen and (max-width: 900px){ #evaluation.interview .intro p br{ display: none; } #evaluation.interview .intro figure{ padding-bottom: 65%; } } /* 채용대행 */ #evaluation.recruit .intro01 figure{ max-width: 745px; width: 100%; padding-bottom: 524px; } #evaluation.recruit .intro02 figure{ max-width: 747px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 1270px){ #evaluation.interview .image-list li dt{ font-size: 1.8rem; } #evaluation.interview .image-list li dd{ font-size: 1.6rem; } #evaluation.interview .image-list li p{ font-size: 1.6rem; margin-top: 15px; } } @media screen and (max-width: 1250px){ #evaluation.interview h4.icon{ padding-bottom: 30px; } #evaluation.interview .icon-list{ padding-top: 30px; } #evaluation.interview .icon-list li{ padding: 20px 0; } #evaluation.interview .icon-list .icon{ width: 150px; } #evaluation.interview .icon-list .icon span{ font-size: 1.8rem; } #evaluation.interview .icon-list .txt{ width: calc(100% - 150px); } #evaluation.interview .icon-list .txt h6{ font-size: 1.8rem; } #evaluation.interview .icon-list .txt p{ font-size: 1.6rem; } } @media screen and (max-width: 1500px){ #evaluation.recruit .intro02 p br{ display: none; } } @media screen and (max-width: 1151px){ #evaluation.interview .image-list li .txt{ height: 44%; } } @media screen and (max-width: 1100px){ #evaluation.recruit .intro01 p br{ display: none; } } @media screen and (max-width: 900px){ #evaluation.interview .image-list{ align-items: center; } #evaluation.interview .image-list li{ max-width: 843px; width: 100%; margin-right: 0; } #evaluation.interview .image-list li .txt{ height: auto; } } @media screen and (max-width: 850px){ #evaluation.recruit .intro01 figure{ padding-bottom: 71%; } } @media screen and (max-width: 810px){ #evaluation.recruit .intro02 figure{ padding-bottom: 71%; } } @media screen and (max-width: 630px){ #evaluation.interview .icon-list li{ flex-direction: column; align-items: flex-start; } #evaluation.interview .icon-list .icon{ align-items: flex-start; width: auto; margin-bottom: 20px; } #evaluation.interview .icon-list .txt{ width: 100%; padding-left: 0; } } /* 평판조회 */ #evaluation.repute .intro figure{ max-width: 734px; width: 100%; padding-bottom: 524px; } @media screen and (max-width: 1440px){ #evaluation.repute .intro p br{ display: none; } } @media screen and (max-width: 850px){ #evaluation.repute .intro figure{ padding-bottom: 71%; } } /* 게시판 list 공통 */ #board .search-box{ display: flex; justify-content: space-between; flex-wrap: wrap; background-color: #F8F8F8; padding: 30px; margin-bottom: 80px; } #board .search-box *{ height: 70px; font-family: var(--baseFont); font-size: 1.6rem; } #board .search-box select{ width: 300px; font-weight: 400; color: #111; border: 1px solid #ddd; padding: 0 55px 0 30px; appearance: none; -moz-appearance: none; -webkit-appearance: none; background: #fff url("/img/sub/select_icon.png") no-repeat center right 32px; } #board .search-box input{ width: calc(100% - 560px); border: 1px solid #ddd; font-size: 1.6rem; font-weight: 400; padding: 0 30px; } #board .search-box input::placeholder{ color: #ccc; } #board .search-box.no-select input{ width: calc(100% - 250px); } #board .search-box button{ width: 240px; border: none; background-color: #333; font-weight: 600; color: #fff; cursor: pointer; } #board .search-box button::before{ content: url("/img/sub/search_icon.png"); margin-right: 10px; position: relative; top: 4px; } #board .table-box{ border-top: 1px solid #111; } #board .table-box tr{ border-bottom: 1px solid #ddd; } #board .table-box thead tr{ background-color: #F8F8F8; } #board .table-box thead tr th{ padding: 27px 0; font-size: 2rem; font-weight: 600; color: #111; } #board .table-box thead th.small{ width: 10%; } #board .table-box thead th.medium{ width: 20%; } #board .table-box tbody td{ padding: 30px 0; font-size: 1.8rem; font-weight: 300; color: #333; position: relative; } #board .table-box tbody td p{ width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } #board .table-box tbody td a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; } #board .table-box.basic tbody td:not(:nth-of-type(3)){ text-align: center; } @media screen and (max-width: 1250px){ #board .search-box{ margin-bottom: 40px; } #board .search-box *{ height: 55px; } #board .search-box select{ width: 200px; } #board .search-box input{ width: calc(100% - 400px); } #board .search-box.no-select input{ width: calc(100% - 190px); } #board .search-box button{ width: 180px; line-height: 55px; } #board .table-box thead tr th{ font-size: 1.8rem; padding: 18px 0; } #board .table-box tbody td{ font-size: 1.6rem; padding: 22px 0; } } @media screen and (max-width: 1000px){ #board .search-box select{ width: 170px; } #board .search-box input{ width: calc(100% - 340px); } #board .search-box.no-select input{ width: calc(100% - 160px); } #board .search-box button{ width: 150px; } } @media screen and (max-width: 800px){ #board .search-box select{ width: 100%; margin-bottom: 10px; } #board .search-box input{ width: calc(100% - 160px); } #board .table-box.basic thead{ display: none; } /* #board .table-box tbody tr{ display: flex; flex-wrap: wrap; } */ #board .table-box tbody td{ padding: 10px 0; } #board .table-box.basic tbody td{ display: inline-block; } #board .table-box.basic tbody td:nth-of-type(1){ display: none; } #board .table-box.basic tbody td:nth-of-type(2){ width: 100px; padding: 10px 0; position: relative; } #board .table-box.basic tbody td:nth-of-type(2)::before{ content: "["; position: absolute; top: 48%; left: 0; transform: translateY(-50%); } #board .table-box.basic tbody td:nth-of-type(2)::after{ content: "]"; position: absolute; top: 48%; right: 0; transform: translateY(-50%); } #board .table-box.basic tbody td:nth-of-type(3){ width: calc(100% - 100px); padding: 15px 0; padding-left: 15px; } #board .table-box.basic tbody td:nth-of-type(4){ padding-right: 15px; padding-top: 0; position: relative; } #board .table-box.basic tbody td:nth-of-type(4)::after{ content: ""; width: 1px; height: 12px; background-color: #333; position: absolute; top: 4px; right: 0; } #board .table-box.basic tbody td:nth-of-type(5){ padding-left: 15px; padding-top: 0; } } @media screen and (max-width: 600px){ #board .search-box{ padding: 20px; } #board .search-box input{ width: calc(100% - 110px); padding: 0 20px; } #board .search-box.no-select input{ width: calc(100% - 110px); } #board .search-box button{ width: 100px; } #board .search-box select{ padding: 0 40px 0 20px; background-position: center right 20px; } } /* 게시판 상세 */ #view .border-box{ border-top: 1px solid #000; border-bottom: 1px solid #000; } #view .title-box{ padding: 60px 20px; position: relative; border-bottom: 1px solid #ddd; } #view .title-box h5{ font-size: 2.8rem; font-weight: 600; color: #111; text-align: center; } #view .title-box ul{ display: flex; position: absolute; bottom: 20px; right: 0; } #view .title-box ul li{ font-size: 1.5rem; font-weight: 500; color: #aaa; padding: 0 10px; position: relative; } #view .title-box ul li:first-of-type{ padding-left: 0; } #view .title-box ul li::after{ content: ""; width: 1px; height: 10px; background-color: #ddd; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } #view .title-box ul li:last-of-type::before{ display: inline-block; content: url("/img/sub/view_icon.png"); margin-right: 5px; } #view .title-box ul li:last-of-type::after{ display: none; } #view .content-box{ padding: 80px 0; } /* #view .content-box *{ font-family: "돋움", "Pretendard"; } */ #view .content-box ol, #view .content-box ol li{ list-style: inside; list-style-type: decimal; } #view .content-box ul, #view .content-box ul li{ list-style: inside; } #view .content-box table{ width: -webkit-fill-available; width: fill-available; } #view .link-box{ border-top: 1px solid #000; } #view .link-box ul li{ display: flex; } #view .link-box ul li:first-of-type{ border-bottom: 1px solid #ddd; } #view .link-box .title{ width: 160px; padding: 20px 40px 20px 30px; position: relative; } #view .link-box .title::after{ content: ""; width: 1px; height: 14px; background-color: #ddd; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } #view .link-box .title span{ display: inline-block; width: 100%; font-size: 1.5rem; font-weight: 400; color: #333; text-align: right; position: relative; } #view .link-box .title span::before{ position: absolute; top: 43%; left: 0; transform: translateY(-50%); } #view .link-box .title span.prev::before{ content: url("/img/sub/view_before01.png"); } #view .link-box .title span.next::before{ content: url("/img/sub/view_before02.png"); } #view .link-box .content{ width: calc(100% - 200px); position: relative; } #view .link-box .content{ font-size: 1.5rem; font-weight: 400; color: #999; padding: 20px 30px 20px 40px; } #view .link-box .content p{ width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #view .link-box .content a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; } #view .center{ padding-top: 80px; } #view .center a{ margin: 0 auto; } @media screen and (max-width: 1250px){ #view .title-box{ padding: 40px 20px 45px; } #view .title-box h5{ font-size: 2.5rem; } #view .title-box ul{ bottom: 10px; } #view .content-box{ padding: 40px 0; } #view .link-box .title{ width: 120px; padding: 20px; padding-right: 30px; } #view .link-box .content{ width: calc(100% - 120px); padding: 20px; padding-left: 30px; } #view .center{ padding-top: 40px; } } @media screen and (max-width: 600px){ #view .title-box{ padding: 30px 20px 45px; } #view .title-box h5{ font-size: 2.2rem; } #view .content-box{ padding: 20px 0; } } /* blog */ @media screen and (max-width: 750px){ .sub-visual .bg3 .text h3 br{ display: none; } } /* forum */ /* 안내자료 */ #brochure .tab-menu{ padding-bottom: 80px; } #brochure .tab-menu ul{ justify-content: center; } #brochure.brochure .tab-content{ margin-bottom: -80px; } #brochure.brochure .box{ display: flex; margin-bottom: 80px; } #brochure.brochure .box .image{ width: 786px; display: flex; flex-direction: column; justify-content: center; } #brochure.brochure .box figure{ width: 100%; position: relative; overflow: hidden; padding-bottom: 69%; border-radius: 20px; } #brochure.brochure .box figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #brochure.brochure .box .info{ width: calc(100% - 786px); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 50px; text-align: center; color: #555; } #brochure.brochure .box .info .title{ color: #111; } #brochure.brochure .box .info .title span{ display: inline-block; font-size: 2.4rem; font-weight: 300; margin-bottom: 20px; } #brochure.brochure .box .info h5{ font-size: 2.4rem; font-weight: 700; padding-bottom: 10px; } #brochure.brochure .box .info h4{ font-size: 5.2rem; padding-bottom: 30px; } #brochure.brochure .box .info > span{ display: inline-block; width: 100%; font-size: 2.8rem; font-weight: 300; margin-bottom: 30px; } #brochure.brochure .box .info img{ margin-bottom: 80px; } #brochure.brochure .box .info p{ font-size: 2rem; font-weight: 300; line-height: 1.8; margin-bottom: 60px; } #brochure.news .table-box td:not(:nth-of-type(2)){ text-align: center; } #brochure.news .table-box td a{ width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; border-radius: 50%; position: static; background-color: var(--blue); margin: 0 auto; } @media screen and (max-width: 1540px){ #brochure.brochure .box .image{ width: 50%; } #brochure.brochure .box .info{ width: 50%; padding: 0 30px; } } @media screen and (max-width: 1250px){ #brochure .tab-menu{ padding-bottom: 30px; } #brochure.brochure .box .info h5{ font-size: 2rem; } #brochure.brochure .box .info h4{ font-size: 4.5rem; padding-bottom: 15px; } #brochure.brochure .box .info > span{ font-size: 2.2em; } #brochure.brochure .box .info img{ margin-bottom: 40px; } #brochure.brochure .box .info p{ font-size: 1.8rem; margin-bottom: 30px; } #brochure.brochure .box .info p br{ display: none; } #brochure.brochure .box .info .title span{ font-size: 2.2rem; } } @media screen and (max-width: 1100px){ #brochure.brochure .box{ flex-direction: column; align-items: center; } #brochure.brochure .box .image{ max-width: 786px; width: 100%; } #brochure.brochure .box .info{ width: 100%; padding: 0; padding-top: 40px; } } @media screen and (max-width: 800px){ #brochure.news .table-box th.small{ width: 15%; } #brochure.news .table-box td{ padding: 10px; } } @media screen and (max-width: 600px){ #brochure.brochure .box .info h4{ font-size: 3.8rem; } #brochure.brochure .box .info > span{ font-size: 2rem; } #brochure.brochure .box .info .title span{ font-size: 2rem; } } /* 인재채용 */ #recruit .sec01 p{ font-size: 2rem; font-weight: 300; color: #333; line-height: 1.8; } #recruit .welfare ul{ display: flex; flex-wrap: wrap; margin-bottom: -100px; } #recruit .welfare ul li{ width: calc(100% / 5); text-align: center; margin-bottom: 100px; } #recruit .welfare ul li figure{ display: flex; justify-content: center; align-items: center; width: 150px; height: 150px; background-color: #F8F8F8; border-radius: 50%; margin: 0 auto; margin-bottom: 40px; } #recruit .welfare ul li span{ display: inline-block; font-size: 2rem; font-weight: 500; color: #333; line-height: 1.55; } #recruit .apply a{ background-color: #000; font-size: 2rem; font-weight: 700; color: #fff; margin: 0 auto; } #recruit .apply a::after{ content: url("/img/sub/go_icon.png"); margin-left: 10px; } @media screen and (max-width: 1300px){ #recruit .welfare ul li{ width: calc(100% / 4); } } @media screen and (max-width: 1250px){ #recruit .sec01 p{ font-size: 1.8rem; } #recruit .welfare ul li figure{ margin-bottom: 20px; } #recruit .welfare ul li span{ font-size: 1.8rem; } #recruit .apply a{ font-size: 1.7rem; } #recruit .apply a::after{ transform: scale(0.8); transform-origin: right; } } @media screen and (max-width: 900px){ #recruit .welfare ul{ margin-bottom: -30px; } #recruit .welfare ul li{ width: calc(100% / 3); margin-bottom: 30px; } } @media screen and (max-width: 700px){ #recruit .sec01 p br{ display: none; } #recruit .welfare ul li{ width: calc(100% / 2); } #recruit .apply a{ font-size: 1.5rem; } #recruit .apply a::after{ transform: scale(0.7); margin: 0; } } /* CONTACT US */ #inquiry .section{ padding-bottom: 50px; } #inquiry .section span{ display: inline-block; width: 100%; font-size: 2rem; font-weight: 500; color: #111; margin-bottom: 15px; } #inquiry .section.margin span{ margin-bottom: 40px; } #inquiry .form-box input[type="text"], #inquiry .form-box textarea{ width: 100%; background-color: #fff; border: 1px solid #ddd; font-size: 1.8rem; font-weight: 400; } #inquiry .form-box input[type="text"]::placeholder, #inquiry .form-box textarea::placeholder{ color: #aaa; } #inquiry .form-box input[type="text"]{ height: 60px; padding: 0 30px; } #inquiry .form-box textarea{ height: 400px; padding: 20px 30px; } #inquiry .form-box input[type="checkbox"]{ display: none; } #inquiry .form-box input[type="checkbox"] + label{ display: inline-block; font-size: 1.8rem; font-weight: 400; color: #555; position: relative; padding-left: 25px; cursor: pointer; } #inquiry .form-box input[type="checkbox"] + label::before{ content: ""; width: 15px; height: 15px; border: 1px solid #ddd; position: absolute; top: 3px; left: 0; } #inquiry .form-box input[type="checkbox"]:checked + label::after{ content: ""; width: 15px; height: 15px; border: 1px solid #000; position: absolute; top: 3px; left: 0; background: url("/img/sub/checkbox_icon.png") no-repeat center center / auto; } #inquiry .form-box .flex{ display: flex; justify-content: space-between; } #inquiry .form-box .flex > div{ width: calc((100% - 50px) / 2); } #inquiry .form-box .section ul{ display: flex; flex-wrap: wrap; gap: 30px 100px; } #inquiry .form-box .section ul li.etc{ width: 100%; display: flex; align-items: center; } #inquiry .form-box .section ul li.etc input[type="text"]{ width: 650px; height: auto; border: none; border-bottom: 1px solid #000; padding: 10px 0; margin-left: 20px; } #inquiry .form-box .section .agree{ margin-top: 30px; } #inquiry .form-box .section.auto .input{ display: flex; align-items: center; } #inquiry .form-box .section.auto input{ width: 500px; height: 50px; margin: 0 10px; } #inquiry .form-box .section.auto button{ width: 50px; height: 50px; border: none; background: #111; font-size: 2rem; color: #fff; } #inquiry input[type="submit"]{ border: none; -webkit-appearance: none; margin: 30px auto 0; cursor: pointer; } @media screen and (max-width: 1250px){ #inquiry .section{ padding-bottom: 30px; } #inquiry .section span{ font-size: 1.8rem; } #inquiry .form-box input[type="text"], #inquiry .form-box textarea{ font-size: 1.6rem; } #inquiry .form-box input[type="text"]{ padding: 0 15px; height: 50px; } #inquiry .form-box textarea{ height: 250px; } #inquiry .form-box input[type="checkbox"] + label{ font-size: 1.6rem; } #inquiry .form-box input[type="checkbox"] + label::before{ top: 1px; } #inquiry .form-box input[type="checkbox"]:checked + label::after{ top: 1px; } #inquiry .form-box .section .agree{ margin-top: 15px; } } @media screen and (max-width: 930px){ #inquiry .form-box .section ul{ gap: 20px 0; } #inquiry .form-box .section ul li{ width: calc(100% / 3); } #inquiry .form-box .section ul li.etc{ margin-top: -10px; } } @media screen and (max-width: 900px){ #inquiry .section{ padding-bottom: 20px; } #inquiry .section span{ margin-bottom: 10px; } #inquiry .section.margin{ padding-top: 10px; } #inquiry .section.margin span{ margin-bottom: 20px; } #inquiry .form-box input[type="text"]{ height: 45px; } #inquiry .form-box .flex{ flex-direction: column; } #inquiry .form-box .flex > div{ width: 100%; } } @media screen and (max-width: 695px){ #inquiry .form-box .section.auto input{ width: calc(100% - 195px); } } @media screen and (max-width: 600px){ #inquiry .form-box .section ul li{ width: calc(100% / 2); } } /* 개인정보처리방침 */ .sub-visual .bg6 .text{ color: #111; } .sub-visual .bg6{ padding: 8% 0 0; } .sub-visual .bg6 .lnb{ display: none; } #privacy{ padding-top: 0; padding-bottom: 150px; } @media screen and (max-width: 1250px){ #privacy{ padding-bottom: 55px; } } .newAptBtn{display: flex; background: #3f579e; width: 533px; height: 102px; text-align: center; margin: 60px auto 0; color: #fff; font-weight: 600; font-size: 3rem; justify-content:center; align-items:center; border-radius: 50px } .newAptBox01 span{border-bottom: #3f579e 5px solid; width: 111px; display: inline-block} .newAptBox01 dl{color: #666666; font-size: 3.2rem; margin: 25px 0 10px; font-weight: 600 } .newAptBox01 dt{font-size: 4.0rem; font-weight: 600; margin-bottom: 60px; color: #111111} .newAptBox02{position: relative; min-height: 573px; margin-bottom: 140px} .newAptBox02 img{position: absolute; right: 0; top: 0} .newAptBox03 dt{ font-size: 2.2rem; font-weight: 600; color: #111111; padding-bottom:20px } .newAptBox03 dl{background: url("/img/sub/what/new_aptitude_img01.png") 5px 12px no-repeat; padding-left: 20px; color: #333333; font-size: 2.2rem; margin-top: 15px; font-weight: 300 } .newAptBox04{background: #000; padding-top: 120px} .newAptBox04 h4{ font-size: 4.0rem; font-weight: 600; color: #fff !important; padding-bottom: 50px; } .newAptBox04 p{ font-size: 2.2rem; font-weight: 600; color: #fff; line-height: 1.7545; } .newAptBox04b {min-height: 976px} .newAptBox04b img{position: absolute; right: 0; bottom: 80px} .newAptBox05{margin-top: 25px; position: relative; min-height: 553px;padding-left: 950px; padding-top: 265px;} .newAptBox05 img{position: absolute; left: 0; top: 0} .newAptBox05 ul {border-left: #fff 5px solid} .newAptBox05 ul li{ color: #fff; display: inline-block; width: 170px; font-size: 2.2rem; position: relative; text-align: center; line-height: 100%} .newAptBox05 ul li:nth-child(2){width: 300px; font-size: 6.0rem; font-weight: 600; border-left: none} .newAptBox05 ul li:nth-child(2) span{font-size: 2.2rem; position: absolute; right: 0; top: 25px; font-weight: 400} .newAptBox05 ul.l1 li{padding-bottom:70px !important; margin-bottom: -20px} .newAptBox06{margin-top: 140px; text-align: center} .newAptBox06 dl{font-size: 4.0rem; font-weight: 600; color: #3f579e; margin-bottom: 40px} .newAptBox06 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:80px; padding: 0 20px} .newAptBox06 dt.t1{ margin-bottom:40px; margin-top: 150px} .newAptBox06 dd{width: 1172px; line-height: 99px; text-align: left; padding-left: 466px; border: #ededed 1px solid; border-radius: 20px; position: relative; font-size: 2.2rem; margin: 0 auto 20px} .newAptBox06 dd span{position: absolute; left: 0; width: 426px; line-height: 101px; background: #ebeef5; border:#ededed 1px solid; border-radius: 20px; font-size: 3.2rem; color: #3f579e; font-weight: 600; text-align: center} .newAptBox06 dd.l1 span{background: #3f579e; border: none; color: #fff} .newAptBox06 dd.l2{ margin: 0 auto 150px} .newAptBox06 p{font-size: 2.2rem; font-weight: 300} .newAptBox06 img.img01{padding-top: 95px} .newAptBox06b{margin-top: 0} .newAptBox07{width: 1100px; height: auto; box-shadow: 0px 0px 8px #dedede; margin: 70px auto 0; border-radius: 30px; border: #e9e9e9 1px solid; padding-top: 100px; padding-bottom: 100px} .newAptBox07 dl{margin: 0 auto; width: 560px; line-height: 1.4; padding-bottom: 5px; text-align: left; background: url("/img/sub/what/new_aptitude_img05.png") 50px 8px no-repeat;color: #111; font-size: 3.2rem; margin-top: 0px; background-size: 30px auto; min-height: 30px} .newAptBox07 dl + dl{margin-top: 20px} .newAptBox07b dl{margin: 0 auto; width: 980px; padding-left:107px; padding-top: 0px; min-height: 65px; line-height: 1.4; padding-bottom: 5px; text-align: left; background: url("/img/sub/what/new_aptitude_img05.png") 50px 8px no-repeat; color: #111; font-size: 3.2rem; margin-top: 0px; background-size: 30px auto} .newAptBox07b dl:nth-child(2){padding-top: 0; background: url("/img/sub/what/new_aptitude_img05.png") 50px 8px no-repeat; background-size: 30px auto} .newAptBox07c dl{margin: 0 auto; width: 980px; padding-left:107px; padding-top: 0px; min-height: 65px; line-height: 1.4; padding-bottom: 5px; text-align: left; background: url("/img/sub/what/new_aptitude_img05.png") 50px 8px no-repeat; color: #111; font-size: 3.2rem; margin-top: 0px; background-size: 30px auto} .newAptBox07c dl:nth-child(2){ background: url("/img/sub/what/new_aptitude_img05.png") 50px 8px no-repeat; background-size: 30px auto} .newAptBox07d dl{text-align: left; padding-left: 170px} .newAptBox08{background: url("/img/sub/what/new_aptitude_img07.png") left top no-repeat; text-align: center; height: 450px; padding-top: 120px; margin-bottom: 210px} .newAptBox08 dt{font-size: 4.0rem; font-weight: 600; color: #111} .newAptBox08 a{display: inline-block; width: 300px; line-height: 82px; margin: 70px auto 0; text-align: center; border: #111 1px solid; border-radius: 30px; font-weight: 600; color: #111; font-size: 3.2rem} .newAptBox09{padding-top: 220px; border-top: #dedede 1px solid; margin-bottom: 100px} .newAptBox09 dl{font-size: 2.2rem; font-weight: 600; color: #3f579e; margin-bottom: 20px} .newAptBox09 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:60px} .newAptBox09 ul li{display: inline-block; width: 461px; height: 432px; padding:194px 0px 0 54px; color: #333333; font-size: 2.2rem; background: url("/img/sub/what/new_aptitude_img08.png") 54px 60px no-repeat; border: #dddddd 1px solid; border-radius: 30px; vertical-align: top; font-weight: 200; line-height: 1.6} .newAptBox09 ul li b{font-weight: 600 !important} .newAptBox09 ul li dd{position: absolute; width: 100%; text-align: center; left: 0; bottom: 50px; font-weight: 600; } .newAptBox09 ul li + li{margin-left: 55px} .newAptBox10 {background: url("/img/sub/what/new_aptitude_img09.png") center top no-repeat; height: 854px; margin-top: 100px; color: #fff; text-align: center} .newAptBox10 dt{font-size: 4.0rem; font-weight: 600; margin: 80px auto 5px} .newAptBox10 dt b{color: #51ddff} .newAptBox10 dl{font-size: 3.2rem; font-weight: 600} .newAptBox10 a{display: inline-block; width: 335px; line-height: 86px; color: #3f579e; font-size: 3.0rem; background: #fff; border-radius: 50px; font-weight: 600; position: relative; margin-top: 30px} .newAptBox10 a span{position: relative; right: -30px} .newAptBox10 ul{text-align: center; margin-top: 60px; margin-bottom: -20px} .newAptBox10 ul li{display: inline-block; width: 490px; height: 260px; font-size: 13.0rem; font-style: italic; background: #51ddff; font-weight: 600 ; padding-top: 40px; line-height: 100%;} .newAptBox10 ul li + li{margin-left: 15px} .newAptBox10 ul li span{display: block; font-size: 3.2rem; margin-bottom: 10px} .newAptBox10 ul li span.s1{display: inline-block; font-size:7.0rem} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display: inline-block; width: 463px; height: 305px; color: #fff; font-weight: 600; padding: 235px 30px 0; font-size: 3.2rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat;} .newAptBox11 a + a{margin-left: 52.5px} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat;} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat;} .newAptBox11b a{background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat;} .newAptBox11b a:nth-child(2){background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat;} .newAptBox11b a:nth-child(3){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat;} .newBioBox01{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 60px; color: #000} .newBioBox02{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 30px; color: #3f579e} .newBioBox03{margin-bottom: 135px; margin-top: -150px} .newBioBox03 ul{text-align: center; font-size: 0; } .newBioBox03 ul li{display: inline-block; width: 720px; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 3.2rem; font-weight: 600; color: #000; padding-left: 20px; padding-right: 20px } .newBioBox03 ul li + li{margin-left: 60px} .newBioBox03 ul li img{display: block; margin: 0 auto 50px} .newBioBox04{margin: 0 auto; width: 1500px; box-shadow: 0px 0px 10px #c9c9c9; height: 310px; border: #dedede 1px solid;border-radius: 300px; margin-top: -100px } .newBioBox04 ul{text-align: center; font-size: 0; } .newBioBox04 ul li{display: inline-block; width: 35%;font-size: 3.2rem; font-weight: 600; color: #000; padding-top: 95px; text-align: center; position: relative; vertical-align: top; padding-left:20px; padding-right: 20px } .newBioBox04 ul li:nth-child(2){width: 30%; padding-left:0px; padding-right: 0px} .newBioBox04 ul li:nth-child(2) img{position: absolute; margin-top: -40px; left:0; top:0} .newBioBox04 ul li:nth-child(3){padding-top: 115px} .mobile{display: none} @media screen and (max-width: 1400px){ .newAptBox02{position: relative; min-height: 273px; margin-bottom: 140px; padding-right: 40%} .newAptBox02 img{position: absolute; right: 0; top: 0; width: 40%} .newAptBox03 dt{ font-size: 2.2rem; font-weight: 600; color: #111111; padding-bottom:20px } .newAptBox03 dl{background: url("/img/sub/what/new_aptitude_img01.png") 5px 12px no-repeat; padding-left: 20px; color: #333333; font-size: 2.2rem; margin-top: 15px; font-weight: 300 } .newAptBox04{background: #000; padding-top: 120px} .newAptBox04 h4{ font-size: 4.0rem; font-weight: 600; color: #fff !important; padding-bottom: 50px; } .newAptBox04 p{ font-size: 2.2rem; font-weight: 600; color: #fff; line-height: 1.7545; } .newAptBox04b {min-height: 876px} .newAptBox04b img{position: absolute; right: 0; bottom: 80px; height: 65%} .newAptBox05{margin-top: 25px; position: relative; min-height: 553px;padding-left: 50%; padding-top: 265px;} .newAptBox05 img{position: absolute; left: 0; top: 0} .newAptBox05 ul {border-left: #fff 5px solid} .newAptBox05 ul li{ color: #fff; display: inline-block; width: 170px; font-size: 2.2rem; position: relative; text-align: center; line-height: 100%} .newAptBox05 ul li:nth-child(2){width: 300px; font-size: 6.0rem; font-weight: 600; border-left: none} .newAptBox05 ul li:nth-child(2) span{font-size: 2.2rem; position: absolute; right: 0; top: 25px; font-weight: 400} .newAptBox05 ul.l1 li{padding-bottom:70px !important; margin-bottom: -20px} .newAptBox06{margin-top: 140px; text-align: center} .newAptBox06 dl{font-size: 4.0rem; font-weight: 600; color: #3f579e; margin-bottom: 40px} .newAptBox06 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:80px} .newAptBox06 dt.t1{ margin-bottom:40px; margin-top: 150px} .newAptBox06 dd{width: 1172px; line-height: 99px; text-align: left; padding-left: 466px; border: #ededed 1px solid; border-radius: 20px; position: relative; font-size: 2.2rem; margin: 0 auto 20px} .newAptBox06 dd span{position: absolute; left: 0; width: 426px; line-height: 101px; background: #ebeef5; border:#ededed 1px solid; border-radius: 20px; font-size: 3.2rem; color: #3f579e; font-weight: 600; text-align: center} .newAptBox06 dd.l1 span{background: #3f579e; border: none; color: #fff} .newAptBox06 dd.l2{ margin: 0 auto 150px} .newAptBox06 p{font-size: 2.2rem; font-weight: 300} .newAptBox06 img.img01{padding-top: 95px} .newAptBox07{width: 100%; height: auto; box-shadow: 0px 0px 8px #dedede; margin: 70px auto 0; border-radius: 30px; border: #e9e9e9 1px solid; padding-top: 50px; padding-bottom: 30px} .newAptBox07 dl{margin: 0 auto; width: 90%; color: #111 !important; font-size: 2.8rem !important;} .newAptBox07b dl{margin: 0 auto; width: 90%;} .newAptBox07c dl{margin: 0 auto; width: 90%; } .newAptBox08{background: url("/img/sub/what/new_aptitude_img07.png") left top no-repeat; text-align: center; height: 450px; padding-top: 120px; margin-bottom: 210px} .newAptBox08 dt{font-size: 4.0rem; font-weight: 600; color: #111} .newAptBox08 a{display: inline-block; width: 300px; line-height: 82px; margin: 70px auto 0; text-align: center; border: #111 1px solid; border-radius: 30px; font-weight: 600; color: #111; font-size: 3.2rem} .newAptBox10 {background: url("/img/sub/what/new_aptitude_img09.png") center top no-repeat; height: 854px; margin-top: 100px; color: #fff; text-align: center} .newAptBox10 dt{font-size: 4.0rem; font-weight: 600; margin: 80px auto 5px} .newAptBox10 dt b{color: #51ddff} .newAptBox10 dl{font-size: 3.2rem; font-weight: 600} .newAptBox10 a{display: inline-block; width: 335px; line-height: 86px; color: #3f579e; font-size: 3.0rem; background: #fff; border-radius: 50px; font-weight: 600; position: relative; margin-top: 30px} .newAptBox10 a span{position: relative; right: -30px} .newAptBox10 ul{text-align: center; margin-top: 60px; margin-bottom: -20px} .newAptBox10 ul li{display: inline-block; width: 490px; height: 260px; font-size: 13.0rem; font-style: italic; background: #51ddff; font-weight: 600 ; padding-top: 40px; line-height: 100%;} .newAptBox10 ul li + li{margin-left: 15px} .newAptBox10 ul li span{display: block; font-size: 3.2rem; margin-bottom: 10px} .newAptBox10 ul li span.s1{display: inline-block; font-size:7.0rem} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display: inline-block; width: 32%; height: 305px; color: #fff; font-weight: 600; padding: 190px 30px 0; font-size: 3.2rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a + a{margin-left: 1.6%} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat; background-size: 100% auto} .newBioBox01{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 60px; color: #000} .newBioBox02{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 30px; color: #3f579e} .newBioBox03{margin-bottom: 135px; margin-top: -150px} .newBioBox03 ul{text-align: center; font-size: 0; } .newBioBox03 ul li{display: inline-block; width: 47.5%; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 3.2rem; font-weight: 600; color: #000 } .newBioBox03 ul li + li{margin-left: 5%} .newBioBox03 ul li img{display: block; margin: 0 auto 50px} .newBioBox04{margin: 0 auto; width: 100%; box-shadow: 0px 0px 10px #c9c9c9; height: 280px; border: #dedede 1px solid;border-radius: 300px; margin-top: -100px } .newBioBox04 ul{text-align: center; font-size: 0; } .newBioBox04 ul li{display: inline-block; width: 35%;font-size:2.2rem; font-weight: 600; color: #000; padding-top: 95px; text-align: center; position: relative; vertical-align: top} .newBioBox04 ul li:nth-child(2){width: 30%;} .newBioBox04 ul li:nth-child(2) img{position: absolute; margin-top: -40px; left:0; top:0} .newBioBox04 ul li:nth-child(3){padding-top: 115px} } @media screen and (max-width: 1280px){ .web{display: none} .mobile{display: block} .newAptBtn{display: flex; background: #3f579e; width: 533px; height: 102px; text-align: center; margin: 60px auto 0; color: #fff; font-weight: 600; font-size: 3rem; justify-content:center; align-items:center; border-radius: 50px } .newAptBox01 span{border-bottom: #3f579e 5px solid; width: 111px; display: inline-block} .newAptBox01 dl{color: #666666; font-size: 3.2rem; margin: 25px 0 10px; font-weight: 600 } .newAptBox01 dt{font-size: 4.0rem; font-weight: 600; margin-bottom: 60px; color: #111111} .newAptBox02{position: relative; min-height: 273px; margin-bottom: 140px; padding-right: 40%} .newAptBox02 img{position: absolute; right: 0; top: 0; width: 40%} .newAptBox03 dt{ font-size: 2.2rem; font-weight: 600; color: #111111; padding-bottom:20px } .newAptBox03 dl{background: url("/img/sub/what/new_aptitude_img01.png") 5px 12px no-repeat; padding-left: 20px; color: #333333; font-size: 2.2rem; margin-top: 15px; font-weight: 300 } .newAptBox04{background: #000; padding-top: 120px} .newAptBox04 h4{ font-size: 4.0rem; font-weight: 600; color: #fff !important; padding-bottom: 50px; } .newAptBox04 p{ font-size: 2.2rem; font-weight: 600; color: #fff; line-height: 1.7545; } .newAptBox04b {min-height: 876px} .newAptBox04b img{position: absolute; right: 0; bottom: 80px; height: 65%} .newAptBox05{margin-top: 25px; position: relative; min-height: 553px;padding-left: 50%; padding-top: 265px;} .newAptBox05 img{position: absolute; left: 0; top: 0} .newAptBox05 ul {border-left: #fff 5px solid} .newAptBox05 ul li{ color: #fff; display: inline-block; width: 170px; font-size: 2.2rem; position: relative; text-align: center; line-height: 100%} .newAptBox05 ul li:nth-child(2){width: 300px; font-size: 6.0rem; font-weight: 600; border-left: none} .newAptBox05 ul li:nth-child(2) span{font-size: 2.2rem; position: absolute; right: 0; top: 25px; font-weight: 400} .newAptBox05 ul.l1 li{padding-bottom:70px !important; margin-bottom: -20px} .newAptBox06{margin-top: 140px; text-align: center} .newAptBox06 dl{font-size: 4.0rem; font-weight: 600; color: #3f579e; margin-bottom: 40px} .newAptBox06 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:80px} .newAptBox06 dt.t1{ margin-bottom:40px; margin-top: 150px} .newAptBox06 dd{width: 1172px; line-height: 99px; text-align: left; padding-left: 466px; border: #ededed 1px solid; border-radius: 20px; position: relative; font-size: 2.2rem; margin: 0 auto 20px} .newAptBox06 dd span{position: absolute; left: 0; width: 426px; line-height: 101px; background: #ebeef5; border:#ededed 1px solid; border-radius: 20px; font-size: 3.2rem; color: #3f579e; font-weight: 600; text-align: center} .newAptBox06 dd.l1 span{background: #3f579e; border: none; color: #fff} .newAptBox06 dd.l2{ margin: 0 auto 150px} .newAptBox06 p{font-size: 2.2rem; font-weight: 300} .newAptBox06 img.img01{padding-top: 95px} .newAptBox08{background: url("/img/sub/what/new_aptitude_img07.png") left top no-repeat; text-align: center; height: 450px; padding-top: 120px; margin-bottom: 210px} .newAptBox08 dt{font-size: 4.0rem; font-weight: 600; color: #111} .newAptBox08 a{display: inline-block; width: 300px; line-height: 82px; margin: 70px auto 0; text-align: center; border: #111 1px solid; border-radius: 30px; font-weight: 600; color: #111; font-size: 3.2rem} .newAptBox10 {background: url("/img/sub/what/new_aptitude_img09.png") center top no-repeat; height: 854px; margin-top: 100px; color: #fff; text-align: center} .newAptBox10 dt{font-size: 4.0rem; font-weight: 600; margin: 80px auto 5px} .newAptBox10 dt b{color: #51ddff} .newAptBox10 dl{font-size: 3.2rem; font-weight: 600} .newAptBox10 a{display: inline-block; width: 335px; line-height: 86px; color: #3f579e; font-size: 3.0rem; background: #fff; border-radius: 50px; font-weight: 600; position: relative; margin-top: 30px} .newAptBox10 a span{position: relative; right: -30px} .newAptBox10 ul{text-align: center; margin-top: 60px; margin-bottom: -20px} .newAptBox10 ul li{display: inline-block; width: 490px; height: 260px; font-size: 13.0rem; font-style: italic; background: #51ddff; font-weight: 600 ; padding-top: 40px; line-height: 100%;} .newAptBox10 ul li + li{margin-left: 15px} .newAptBox10 ul li span{display: block; font-size: 3.2rem; margin-bottom: 10px} .newAptBox10 ul li span.s1{display: inline-block; font-size:7.0rem} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display: inline-block; width: 32%; height: 305px; color: #fff; font-weight: 600; padding: 190px 30px 0; font-size: 3.2rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a + a{margin-left: 1.6%} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat; background-size: 100% auto} .newBioBox01{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 60px; color: #000} .newBioBox02{font-size: 3.2rem; text-align: center; font-weight: 600; margin-top: 30px; color: #3f579e} .newBioBox03{margin-bottom: 135px; margin-top: -150px} .newBioBox03 ul{text-align: center; font-size: 0; } .newBioBox03 ul li{display: inline-block; width: 47.5%; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 3.2rem; font-weight: 600; color: #000 } .newBioBox03 ul li + li{margin-left: 5%} .newBioBox03 ul li img{display: block; margin: 0 auto 50px} .newBioBox04{margin: 0 auto; width: 100%; box-shadow: 0px 0px 10px #c9c9c9; height: auto; border: #dedede 1px solid;border-radius: 300px; margin-top: -100px } .newBioBox04 ul{text-align: center; font-size: 0; } .newBioBox04 ul li{display: inline-flex;justify-content:center; align-items:center; height: 30vw; width: 35%;font-size:2.2rem; font-weight: 600; color: #000; padding-top: 0vw; padding-bottom: 0vw; text-align: center; position: relative; vertical-align: top} .newBioBox04 ul li:nth-child(2){width: 30%;} .newBioBox04 ul li:nth-child(2) img{position: absolute; margin-top: -40px; left:0; top:0} .newBioBox04 ul li:nth-child(3){padding-top: 0vw} } @media screen and (max-width: 1600px){ .newAptBox09{padding-top: 220px; border-top: #dedede 1px solid; margin-bottom: 100px} .newAptBox09 dl{font-size: 2.2rem; font-weight: 600; color: #3f579e; margin-bottom: 20px} .newAptBox09 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:60px} .newAptBox09 ul li{display: inline-block; width: 32%; height: 432px; padding:15vw 20px 0 20px; color: #333333; font-size: 2.0rem; background: url("/img/sub/what/new_aptitude_img08.png") 54px 60px no-repeat; border: #dddddd 1px solid; border-radius: 30px; vertical-align: top; font-weight: 200; line-height: 1.6; background-size: 30% auto} .newAptBox09 ul li b{font-weight: 600 !important} .newAptBox09 ul li dd{position: absolute; width: 100%; text-align: center; left: 0; bottom: 50px; font-weight: 600; } .newAptBox09 ul li + li{margin-left: 1.6%} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display: inline-block; width: 32%; height: 32vw; color: #fff; font-weight: 600; padding: 20vw 30px 0; font-size: 3.2rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100% } .newAptBox11 a + a{margin-left: 1.6%} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat; background-size: 100%} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat; background-size: 100%} } @media screen and (max-width: 1250px){ .newAptBox11 a{display: inline-block; width: 31.5%; height: 20vw; color: #fff; font-weight: 600; padding: 16vw 20px 0; font-size: 2.0rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100%; vertical-align: top } .newAptBox09{padding-top: 220px; border-top: #dedede 1px solid; margin-bottom: 100px} .newAptBox09 dl{font-size: 2.2rem; font-weight: 600; color: #3f579e; margin-bottom: 20px} .newAptBox09 dt{font-size: 4.0rem; font-weight: 600; color: #111111; margin-bottom:60px} .newAptBox09 ul li b{font-weight: 600 !important} .newAptBox09 ul li dd{position: absolute; width: 100%; text-align: center; left: 0; bottom: 30px !important; font-weight: 600; } .newAptBox09 ul li + li{margin-left: 1.6%} } @media screen and (max-width: 930px){ .web{display: none} .mobile{display: block} .newAptBox09{padding-top: 220px; border-top: #dedede 1px solid; margin-bottom: 100px} .newAptBox09 dl{font-size: 1.7rem; font-weight: 600; color: #3f579e; margin-bottom: 20px} .newAptBox09 dt{font-size: 3.0rem; font-weight: 600; color: #111111; margin-bottom:60px} .newAptBox09 ul li{display: block; width: 100%; height:auto; padding:194px 54px 100px 54px; color: #333333; font-size: 2.2rem; background: url("/img/sub/what/new_aptitude_img08.png") 54px 60px no-repeat; border: #dddddd 1px solid; border-radius: 30px; vertical-align: top; font-weight: 200; line-height: 1.6; background-size: 30% auto} .newAptBox09 ul li b{font-weight: 600 !important} .newAptBox09 ul li dd{position: absolute; width: 100%; text-align: center; left: 0; bottom: 50px; font-weight: 600; } .newAptBox09 ul li + li{margin-left: 0px; margin-top: 30px} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display: inline-block; width: 31.5%; height: 20vw; color: #fff; font-weight: 600; padding: 12vw 20px 0; font-size: 2.0rem;background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100%; vertical-align: top } .newAptBox11 a + a{margin-left: 1.6%} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat; background-size: 100%} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat; background-size: 100%} .newAptBox06 dd{width: 100%; line-height: 1.6; text-align: left; padding-left: 0px; padding: 130px 30px 30px; } .newAptBox06 dd span{position: absolute; left: 0; top:0; width: 100%; } .newAptBox06 dd.l1 span{background: #3f579e; border: none; color: #fff} .newAptBox06 dd.l2{ margin: 0 auto 150px} .newAptBox06 p{font-size: 2.2rem; font-weight: 300} .newAptBox06 img.img01{padding-top: 95px} .newAptBox06 dl{font-size: 3.0rem;} .newAptBox06 dt{font-size: 3.0rem; } .newAptBox06 dd{ font-size: 1.7rem; } .newAptBox06 dd span{ font-size: 2.7rem; } .newAptBox06 p{font-size: 1.7rem; } .newBioBox03{margin-bottom: 135px; margin-top: -100px; padding: 0; display: block; width: 90%; margin: -100px auto 135px} .newBioBox03 ul{text-align: center; font-size: 0; } .newBioBox03 ul li{display: block; width: 100%; height: auto; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 2.7rem; font-weight: 600; color: #000; margin: 0 auto; padding: 70px 30px} .newBioBox03 ul li + li{margin-left: 0px !important; margin: 30px auto 0} .newBioBox03 ul li img{display: block; margin: 0 auto 50px} .newBioBox04{margin: 0 auto;display: block; position: relative; width: 90%; box-shadow: 0px 0px 10px #c9c9c9; height: auto; border: #dedede 1px solid;border-radius: 600px; margin-top: -100px; padding-bottom: 100px; overflow: hidden; padding: -100px 0 100px} .newBioBox04 ul{text-align: center; font-size: 0; } .newBioBox04 ul li{display: block; width: 100%;font-size: 2.7rem;height:auto; font-weight: 600; color: #000; padding-top: 0vw; padding: 20vw 13vw 0; text-align: center; position: relative; vertical-align: top} .newBioBox04 ul li:nth-child(2){width: 100%;} .newBioBox04 ul li:nth-child(2) img{position: relative; margin-top: -00px; left:0; top:0} .newBioBox04 ul li:nth-child(3){padding-top: 10vw} } @media screen and (max-width: 600px){ .web{display: none} .mobile{display: block} .newAptBtn{width:80%; height: 80px; font-size: 2.5rem;} .newAptBox01 dl{ font-size: 2.7rem; } .newAptBox01 dt{font-size: 3.5rem; } .newAptBox02{margin-bottom: 100px; padding-right: 0} .newAptBox02 img{position: relative; margin-top: 50px; width: 100%;} .newAptBox03 dt{ font-size: 1.7rem; font-weight: 600; color: #111111; padding-bottom:20px } .newAptBox03 dl{background: url("/img/sub/what/new_aptitude_img01.png") 5px 12px no-repeat; padding-left: 20px; color: #333333; font-size: 1.7rem; margin-top: 15px; font-weight: 300 } .newAptBox04 h4{ font-size: 3.5rem; } .newAptBox04 p{ font-size: 1.7rem; } .newAptBox04b {min-height: 776px} .newAptBox04b img{position: absolute; right: 0; bottom: 80px; height: 45%} .newAptBox05{padding-left: 0px; padding-top: 0px; min-height: 253px;} .newAptBox05 img{position: absolute; left: 0; top: 0; width: 40%} .newAptBox05 ul {margin-left: 50%; border: none} .newAptBox05 ul li{display:block; width: 100%; font-size: 1.7rem; text-align: left; line-height: 1.6} .newAptBox05 ul li:nth-child(2){font-size: 5.0rem; width: 100%; margin-top: -10px; } .newAptBox05 ul li:nth-child(2) span{font-size: 1.7rem; top: 30px; } .newAptBox05 ul.l1 li{padding-bottom:0px !important; margin-bottom: 0px} .newAptBox05 ul.l1 {margin-bottom: 20px} .newAptBox06 dd{width: 100%; line-height: 1.6; text-align: left; padding-left: 0px; padding: 130px 30px 30px; } .newAptBox06 dd span{position: absolute; left: 0; top:0; width: 100%; } .newAptBox06 dd.l1 span{background: #3f579e; border: none; color: #fff} .newAptBox06 dd.l2{ margin: 0 auto 150px} .newAptBox06 p{font-size: 2.2rem; font-weight: 300} .newAptBox06 img.img01{padding-top: 95px} .newAptBox06 dl{font-size: 3.0rem;} .newAptBox06 dt{font-size: 3.0rem; } .newAptBox06 dd{ font-size: 1.7rem; } .newAptBox06 dd span{ font-size: 2.7rem; } .newAptBox06 p{font-size: 1.7rem; } .newAptBox07{width: 100%; height: auto; box-shadow: 0px 0px 8px #dedede; margin: 70px auto 0; border-radius: 30px; border: #e9e9e9 1px solid; padding-top: 50px; padding-bottom: 20px} .newAptBox07 dl{margin: 0 auto; width: 94%; line-height: 1.4; padding-bottom: 30px; text-align: left; background: url("/img/sub/what/new_aptitude_img05.png") 10px 8px no-repeat; color: #111; font-size: 2.7rem; margin-top: 0px; padding-left: 50px; padding-top: 2px; background-size: 28px auto} .newAptBox07b dl{margin: 0 auto; width: 94%; padding-left:50px; padding-top: 2px; text-align: left} .newAptBox07b dl:nth-child(2){padding-top:2px; background: url("/img/sub/what/new_aptitude_img05.png") 10px 8px no-repeat;background-size: 28px auto} .newAptBox07c dl{margin: 0 auto; width: 94%; padding-left:50px; padding-top: 2px; text-align: left} .newAptBox07c dl:nth-child(2){padding-top:2px; background: url("/img/sub/what/new_aptitude_img05.png") 10px 8px no-repeat; background-size: 28px auto} .newAptBox07d dl{ padding-left: 80px; } .newAptBox08{background: url("/img/sub/what/new_aptitude_img07.png") left top no-repeat; text-align: center; height: 450px; padding-top: 120px; margin-bottom: 210px} .newAptBox08 dt{font-size: 4.0rem; font-weight: 600; color: #111} .newAptBox08 a{display: inline-block; width: 300px; line-height: 82px; margin: 70px auto 0; text-align: center; border: #111 1px solid; border-radius: 30px; font-weight: 600; color: #111; font-size: 3.2rem} .newAptBox08{background: url("/img/sub/what/new_aptitude_img07.png") center top no-repeat; height: 300px; padding-top:60px } .newAptBox08 dt{font-size: 3.5rem; } .newAptBox08 a{font-size: 2.7rem; width: 50%; line-height: 62px; margin: 30px auto 0;} .newAptBox09 ul li{display: block; width: 100%; height: 432px; } .newAptBox09 dl{font-size: 1.7rem;} .newAptBox09 dt{font-size: 3.5rem; } .newAptBox09 ul li{font-size: 1.7rem;} .newAptBox09 ul li + li{margin-left: 0px; margin-top: 50px} .newAptBox10 {height: auto; background-size: auto 100% } .newAptBox10 a{ width: 80%;} .newAptBox10 ul li{ width: 100%; font-size: 13.0rem;} .newAptBox10 ul li + li{margin-left: 0px; margin-top: 20px} .newAptBox10 ul li span{ font-size: 2.7rem; } .newAptBox10 ul li span.s1{ font-size:6.5rem} .newAptBox11{margin-top: 100px; margin-bottom: 100px} .newAptBox11 a{display:block; width: 100%; height: 305px; color: #fff; font-weight: 600; padding: 235px 30px 0; font-size: 2.7rem; background: url("/img/sub/what/new_aptitude_img10.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a + a{margin-left: 0; margin-top: 50px} .newAptBox11 a:nth-child(2){background: url("/img/sub/what/new_aptitude_img11.png") left top no-repeat; background-size: 100% auto} .newAptBox11 a:nth-child(3){background: url("/img/sub/what/new_aptitude_img12.png") left top no-repeat; background-size: 100% auto} .leadership2{width: 100%; overflow-x: hidden} .newBioBox01{font-size: 2.7rem; text-align: center; font-weight: 600; margin-top: 60px; color: #000} .newBioBox02{font-size: 2.7rem; text-align: center; font-weight: 600; margin-top: 30px; color: #3f579e} .newBioBox03{margin-bottom: 135px; margin-top: -100px; padding: 0; display: block; width: 90%; margin: -100px auto 135px} .newBioBox03 ul{text-align: center; font-size: 0; } .newBioBox03 ul li{display: block; width: 100%; height: auto; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 2.7rem; font-weight: 600; color: #000; margin: 0 auto; padding: 70px 30px} .newBioBox03 ul li + li{margin-left: 0px !important; margin: 30px auto 0} .newBioBox03 ul li img{display: block; margin: 0 auto 50px} } .new360feedbackBox01{border:#dedede 1px solid; padding: 50px 0 70px; border-radius: 30px} .new360feedbackBox01 ul{font-size: 0; text-align: center} .new360feedbackBox01 ul li{display: inline-block; width: 33.333%; font-size: 2.2rem ; padding: 30px 20px 0; vertical-align: top} .new360feedbackBox01 ul li img{display: block; margin: 0 auto 30px} .new360feedbackBox01 ul li + li{background: url("/img/sub/what/new_360feedback_img14.png") left center repeat-y} .mt0{margin-top: 0 !important} .new360feedbackBox02{margin-top: 60px} .new360feedbackBox02 ul{text-align: center; font-size: 0; } .new360feedbackBox02 ul li{display: inline-block; width: 720px; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 3.2rem; color: #000; padding-left: 20px; padding-right: 20px } .new360feedbackBox02 ul li + li{margin-left: 60px} .new360feedbackBox02 ul li img{display: block; margin: 0 auto 80px} .new360feedbackBox02 ul li b{display: block} .new360feedbackBox03{font-size: 3.2rem; margin-top: -20px; font-weight: 300; color: #000} .new360feedbackBox03b{font-size: 2.2rem; margin-top: -20px; font-weight: 300; color: #000} .new360feedbackBox04{margin-top: 30px} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: inline-block; width: 460px; border:#dedede 1px solid; padding: 110px 20px 70px; border-radius: 30px; height: 514px; font-size: 2.2rem; vertical-align: top} .new360feedbackBox04 ul li img{display: block; margin: 0 auto 75px;} .new360feedbackBox04 ul li + li{margin-left: 60px} .new360feedbackBox05{margin-top: 90px; font-size: 0} .new360feedbackBox05 article{display: inline-block; background: #282828; border-radius: 30px; width: 390px; height: 693px; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 3.2rem; display: block; margin-bottom: 30px; cursor: pointer;} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 1072px; margin-left: 38px; text-align: center; padding: 10px 70px} .newleadershipBox01 article{height: 492px} .newleadershipBox01 article:nth-child(2){display: inline-flex; justify-content:center; align-items:center;} .newleadershipBox02{min-height: 604px; position: relative; margin-bottom: 140px; margin-top: -100px; padding-top: 80px} .newleadershipBox02 dl{box-shadow: 0px 0px 10px #c9c9c9; border-radius: 100px; display: flex; align-items:center; height: 200px; font-size: 3.2rem; width: 1200px; margin-left: 300px; text-align: left; color: #000; padding-left: 390px} .newleadershipBox02 img{position: absolute; z-index: 9; top:0; left:0} .newleadershipBox02 dl + dl{margin-top: 40px} .newpersonalityBox01{padding-bottom: 0 !important; } .newpersonalityBox01 img{margin-top: 55px} .newpersonalityBox01 ul li:nth-child(1) img{margin: 0 auto 75px} @media screen and (max-width: 1600px){ .new360feedbackBox04{margin-top: 30px} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: inline-block; width: 31%; border:#dedede 1px solid; padding: 110px 20px 70px; border-radius: 30px; height: 514px; font-size: 2.2rem; vertical-align: top} .new360feedbackBox04 ul li + li{margin-left: 1.6%} .newpersonalityBox01{padding-bottom: 0 !important; } .newpersonalityBox01 ul li:nth-child(1) img{margin: 0 auto 75px !important} .new360feedbackBox02{margin-top: 60px} .new360feedbackBox02 ul{text-align: center; font-size: 0; } .new360feedbackBox02 ul li{display: inline-block; width: 49%; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 3.2rem; color: #000 } .new360feedbackBox02 ul li + li{margin-left: 1.6%} .new360feedbackBox02 ul li img{display: block; margin: 0 auto 80px} .new360feedbackBox02 ul li b{display: block} .new360feedbackBox05{margin-top: 90px; font-size: 0} .new360feedbackBox05 article{display: inline-block; background: #282828; border-radius: 30px; width: 25%; height: 693px; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 3.2rem; display: block; margin-bottom: 30px; cursor: pointer;} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 72%; margin-left: 3%; text-align: center; padding: 10px 70px} .new360feedbackBox01{border:#dedede 1px solid; padding: 50px 0 70px; border-radius: 30px} .new360feedbackBox01 ul{font-size: 0; text-align: center} .new360feedbackBox01 ul li{display: inline-block; width: 33.333%; font-size: 2.2rem; padding: 30px 20px 0} .new360feedbackBox01 ul li img{display: block; margin: 0 auto 30px} .new360feedbackBox01 ul li + li{background: url("/img/sub/what/new_360feedback_img14.png") left center no-repeat} .newleadershipBox02{min-height: 35vw; position: relative; margin-bottom: 140px; margin-top: -100px; padding-top: 4vw} .newleadershipBox02 dl{box-shadow: 0px 0px 10px #c9c9c9; border-radius: 100px; display: flex; align-items:center; height: auto; font-size: 2.7rem; width: 80%; margin-left:20% ; text-align: left; color: #000; padding-left: 13vw; padding-top: 30px; padding-bottom: 30px} .newleadershipBox02 img{position: absolute; z-index: 9; top:50%; left:0; height: 30vw; margin-top: -15vw} .newleadershipBox02 dl + dl{margin-top: 40px} } @media screen and (max-width: 1400px){ .new360feedbackBox05{margin-top: 90px; font-size: 0} .new360feedbackBox05 article{display: inline-block; background: #282828; border-radius: 30px; width: 25%; height: 45vw; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 2.7rem; display: block; margin-bottom: 30px; cursor: pointer; line-height: 1.4} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 72%; margin-left: 3%; text-align: center; padding: 10px 70px} .new360feedbackBox04{margin-top: 30px} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: inline-block; width: 31%; border:#dedede 1px solid; padding: 110px 20px 70px; border-radius: 30px; height: 514px; font-size: 2.2rem; vertical-align: top} .new360feedbackBox04 ul li + li{margin-left: 1.6%} } @media screen and (max-width: 980px){ .new360feedbackBox02{margin-top: 60px} .new360feedbackBox02 ul{text-align: center; font-size: 0; } .new360feedbackBox02 ul li{display: inline-block; width: 49%; height: 518px; box-shadow: 0px 0px 10px #c9c9c9; vertical-align: top; text-align: center; border: #dedede 1px solid;border-radius: 30px; padding-top: 70px ;font-size: 2.7rem; color: #000 } .new360feedbackBox02 ul li + li{margin-left: 1.6%} .new360feedbackBox02 ul li img{display: block; margin: 0 auto 40px} .new360feedbackBox02 ul li b{display: block} .new360feedbackBox04{margin-top: 30px} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: inline-block; width: 32%; border:#dedede 1px solid; padding: 10vw 20px 70px !important; border-radius: 30px; height: 55vw !important; font-size: 2.0rem !important; vertical-align: top} .new360feedbackBox04 ul li img{display: block; margin: 0 auto 50px !important; height: 20vw} .new360feedbackBox04 ul li + li{margin-left: 1.6%} .new360feedbackBox05{margin-top: 90px; font-size: 0} .new360feedbackBox05{margin-top: 90px; font-size: 0 ; } .new360feedbackBox05 article{display: block; background: #282828; border-radius: 30px; width: 100%; height: auto; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 2.2rem; display: block; margin-bottom: 30px; cursor: pointer;} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 100%; margin-left: 0px; text-align: center; padding: 50px 30px; margin-top: 20px} } @media screen and (max-width: 800px){ .new360feedbackBox01{border:#dedede 1px solid; padding: 0px 0 0px; border-radius: 30px;} .new360feedbackBox01 ul li{display: block; width: 100%; font-size: 2.2rem; padding: 50px} .new360feedbackBox01 ul li img{display: block; margin: 0 auto 30px; position: relative; width: 30%} .new360feedbackBox01 ul li + li{background: url("/img/sub/what/new_360feedback_img14m.png") center top no-repeat} .mt0{margin-top: 0 !important} .new360feedbackBox02{margin-top: 60px; overflow-x: hidden} .new360feedbackBox02 ul{text-align: center; font-size: 0; } .new360feedbackBox02 ul li{display: block; width: 90%; height: auto; padding-top: 70px ;font-size: 2.2rem; margin-left: 5%; padding-bottom: 50px ; padding-left: 50px; padding-right: 50px} .new360feedbackBox02 ul li + li{margin-left: 5%; margin-top: 50px} .new360feedbackBox02 ul li img{display: block; margin: 0 auto 40px; width: 30%} .new360feedbackBox02 ul li b{display: block} .new360feedbackBox03{font-size: 3.2rem; margin-top: -20px; font-weight: 300; color: #000} .new360feedbackBox04{margin-top: 30px;} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: block ; width: 96%; padding: 50px 50px 50px !important; height: auto !important; font-size: 2.2rem; margin-left: 2%} .new360feedbackBox04 ul li img{display: block; margin: 0 auto 40px; width: 30%} .new360feedbackBox04 ul li + li{margin-left: 2%; margin-top: 50px} .new360feedbackBox05{margin-top: 90px; font-size: 0 ; } .new360feedbackBox05 article{display: block; background: #282828; border-radius: 30px; width: 100%; height: auto; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 2.2rem; display: block; margin-bottom: 30px; cursor: pointer;} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 100%; margin-left: 0px; text-align: center; padding: 50px 30px; margin-top: 20px} } @media screen and (max-width: 600px){ .new360feedbackBox01{border:#dedede 1px solid; padding: 0px 0 0px; border-radius: 30px;} .new360feedbackBox01 ul li{display: block; width: 100%; font-size: 2.2rem; padding: 50px} .new360feedbackBox01 ul li img{display: block; margin: 0 auto 30px; position: relative; width: 30%} .new360feedbackBox01 ul li + li{background: url("/img/sub/what/new_360feedback_img14m.png") center top no-repeat} .mt0{margin-top: 0 !important} .new360feedbackBox02{margin-top: 60px; overflow-x: hidden} .new360feedbackBox02 ul{text-align: center; font-size: 0; } .new360feedbackBox02 ul li{display: block; width: 90%; height: auto; padding-top: 70px ;font-size: 2.2rem; margin-left: 5%; padding-bottom: 50px ; padding-left: 50px; padding-right: 50px} .new360feedbackBox02 ul li + li{margin-left: 5%; margin-top: 50px} .new360feedbackBox02 ul li img{display: block; margin: 0 auto 40px; width: 30%} .new360feedbackBox02 ul li b{display: block} .new360feedbackBox03{font-size: 3.2rem; margin-top: -20px; font-weight: 300; color: #000} .new360feedbackBox04{margin-top: 30px;} .new360feedbackBox04 ul{font-size: 0; text-align: center} .new360feedbackBox04 ul li{display: block ; width: 96%; padding: 50px 50px 50px !important; height: auto !important; font-size: 2.2rem; margin-left: 2%} .new360feedbackBox04 ul li img{display: block; margin: 0 auto 40px; width: 30%} .new360feedbackBox04 ul li + li{margin-left: 2%; margin-top: 50px} .new360feedbackBox05{margin-top: 90px; font-size: 0 ; } .new360feedbackBox05 article{display: block; background: #282828; border-radius: 30px; width: 100%; height: auto; color: #fff; vertical-align: top; padding: 40px 35px;overflow: hidden} .new360feedbackBox05 article a{font-size: 2.2rem; display: block; margin-bottom: 30px; cursor: pointer;} .new360feedbackBox05 article a.on{font-weight: 600; text-decoration: underline; text-underline-offset : 10px;} .new360feedbackBox05 article:nth-child(2){width: 100%; margin-left: 0px; text-align: center; padding: 50px 30px; margin-top: 20px} .newleadershipBox02{min-height: 50vw; position: relative; margin-bottom: 70px; margin-top: -100px; padding-top: 0px; } .newleadershipBox02 dl{box-shadow: 0px 0px 10px #c9c9c9; border-radius: 20px; display: flex; align-items:center; height: 200px; font-size: 2.2rem; width: 80%; margin-left: 10%; text-align: left; color: #000; padding-left: 20%; padding-right: 10%} .newleadershipBox02 img{position: absolute; z-index: 9; top:50%; left:0; height: 30vw; margin-top: -15vw} .newleadershipBox02 dl + dl{margin-top: 40px} } /* 240226 */ .newscreeningBox01{background: #f8f8f8; padding: 120px 0 80px; text-align: center; color: #000} .newscreeningBox01 dt{font-size: 4.0rem; margin-bottom: 40px; text-align: left} .newscreeningBox01 dl{font-size: 3.2rem;text-align: left; margin-bottom: 10px} .newscreeningBox01 dd{font-size: 2.2rem; font-weight: 600; margin-bottom:100px; text-align: left} .newscreeningBox02{margin: 90px auto 145px; width: 1240px;text-align: center} .newscreeningBox02 ul{font-size: 0; text-align: center} .newscreeningBox02 ul li{display: inline-block; width: 500px; height: 522px; color: #3f579e; font-size: 3.2rem; vertical-align: top; padding-top: 222px} .newscreeningBox02 ul li + li {margin-left: 240px; padding-top: 195px} .newscreeningBox03{text-align: center; margin: 80px auto 130px} .newscreeningBox03 dl{color: #3f579e; font-size: 3.2rem; margin-bottom: 20px; font-weight: 600} .newscreeningBox04{margin: 80px auto 150px;} .newinterviewBox01{background: #000; color: #fff; padding: 120px 0 170px} .newinterviewBox01 dt{font-size: 4.0rem; font-weight: 600; margin-bottom: 110px} .newinterviewBox01 ol{margin-left: 70px; width: 840px; padding: 60px 0} .newinterviewBox01 ol + ol{border-top: #f5f5f5 1px solid} .newinterviewBox01 ol dl{color: #0084ff; font-size: 4.0rem; font-weight: 600; margin-bottom: 20px } .newinterviewBox01 ol dd{font-size: 2.2rem; font-weight: 600; line-height: 200%} .newinterviewBox02{padding-bottom: 130px !important; margin-top: 90px } .newinterviewBox02 img{margin: 0 auto 75px} .newinterviewBox02 ul li:nth-child(3) img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(1) img{margin: 0 auto 75px} .newinterviewBox03 {margin-bottom: 135px} .newinterviewBox03 ul{font-size: 0; text-align: center} .newinterviewBox03 ul li{display: inline-block; width: 33.333%; vertical-align: top; color: #3f579e; font-size: 3.2rem; font-weight: 600; padding-top: 190px} .newinterviewBox03 ul li:nth-child(2){padding-top: 0} .newinterviewBox04 ul li{box-shadow: 0px 0px 0px #c9c9c9; } .newinterviewBox05 {margin-top:90px; margin-bottom: 180px} .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: inline-block; width: 770px; height: 416px; vertical-align: top; padding-left: 60px; padding-top: 60px} .newinterviewBox05 ul li:nth-child(1){width: 710px; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center} .newinterviewBox05 ul li dt{font-size: 3.2rem; color: #000; font-weight: 600; text-align: left} .newinterviewBox05 ul li dt + dt{margin-top: 95px} .newreferenceBox01{margin-top: 90px} .newreferenceBox01 ul{font-size: 0; text-align: center} .newreferenceBox01 ul li{display: inline-block; width: 32%; border:#dedede 1px solid; padding: 65px 20px 0px; border-radius: 30px; height: 443px; font-size: 2.7rem; vertical-align: top; box-shadow: 0px 0px 10px #c9c9c9;} .newreferenceBox01 ul li img{display: block; margin: 0 auto 55px; } .newreferenceBox01 ul li + li{margin-left: 1.6%} .newagencyBox01{ min-height: 597px; } .newagencyBox02{margin-top: 80px; position: relative; min-height: 442px; margin-bottom: 140px} .newagencyBox02 img{position: absolute; right: 0; top: 0} .newagencyBox02 dl{font-size: 3.2rem; padding-left: 30px; margin-bottom: 40px; color: #000} .newagencyBox02 dl span{position: absolute; margin-left: -30px; font-size: 2.8rem} .newagencyBox03{margin: 50px auto 230px; } .newreferenceBox01{margin-top: 90px} .newreferenceBox01 ul{font-size: 0; text-align: center} .newreferenceBox01 ul li{display: inline-block; width: 460px; border:#dedede 1px solid; padding: 65px 20px 0px; border-radius: 30px; height: 443px; font-size: 2.7rem; vertical-align: top; box-shadow: 0px 0px 10px #c9c9c9;} .newreferenceBox01 ul li img{display: block; margin: 0 auto 55px; } .newreferenceBox01 ul li + li{margin-left: 60px} .newreferenceBox02{width: 1200px; margin: 100px auto 0; padding-top: 170px; position: relative; padding-left: 540px; min-height: 464px} .newreferenceBox02 img{position: absolute; left:0; top:0;} .newreferenceBox02 dl{color: #3f579e; font-weight: 600; font-size: 2.7rem; margin-bottom: 40px} .newreferenceBox03{margin: 90px auto 150px; } .newnewsBox01{font-size: 2.2rem; text-align: center; margin-bottom: -50px; color: #000} .newnewsBox01 dt{font-size: 5.2rem; margin-bottom: 90px; font-weight: 600} .newnewsBox02{text-align: center; color: #3f579e; font-size: 2.2rem; margin-bottom: 140px} .newnewsBox02 a{display: inline-block; width: 300px; line-height: 80px; border-radius: 50px; background: #eeeeee; cursor:pointer} .newnewsBox02 a + a{margin-left: 40px} .newnewsBox02 a:hover, .newnewsBox02 a.on{background: #3f579e; color: #fff} .newnewsBox03{font-size: 4.0rem; text-align: center; margin-bottom: 80px; color: #000; font-weight: 600} .newnewsBox04{width: 518px; margin: 0 auto; padding-bottom: 200px; background: #fff } .newnewsBox04img{position: absolute; z-index: 9 !important} .newnewsBox04 .flex-control-paging{ bottom:-70px} #evaluation .faq2 ul{ margin-bottom: -40px; } #evaluation .faq2 ul li{ background-color: #fff; margin-bottom: 40px; cursor: pointer; border: #dedede 1px solid; border-radius: 20px} #evaluation .faq2 ul li .title{ position: relative; } #evaluation .faq2 ul li .title p{ font-size: 2.2rem; font-weight: 500; color: #3f579e; padding: 0 140px; position: relative; transition: 0.5s; } #evaluation .faq2 ul li .title p::before{ content: "Q"; font-size: 3.2rem; font-weight: 700; color: var(--blue); position: absolute; top: -5px; left: 60px; } #evaluation .faq2 ul li .answer{ background-color: #fff; padding: 30px 50px; border-radius: 10px; display: none; overflow: hidden; margin-bottom: 35px; position: relative; top: 35px; cursor: default; } #evaluation .faq2 ul li .answer p{ font-size: 1.8rem; font-weight: 300; color: #555; letter-spacing: -0.01em; line-height: 1.9444; position: relative; } #evaluation .faq2 ul li .answer p::before{ content: ""; font-size: 2rem; font-weight: 700; color: #ddd; position: absolute; top: -2px; left: -30px; } #evaluation .faq2 ul li .answer p:not(:first-of-type)::before{ display: none; } #evaluation .faq2 h4{text-align: center} .newnewsBox05{margin-bottom: 100px} @media screen and (max-width: 1600px){ .newinterviewBox01{background: #000; color: #fff; padding: 120px 0 170px} .newinterviewBox01 dt{font-size: 4.0rem; font-weight: 600; margin-bottom: 110px} .newinterviewBox01 ol{margin-left: 5%; width: 90%; padding: 60px 0px 0 } .newinterviewBox01 ol + ol{border-top: #f5f5f5 1px solid} .newinterviewBox01 ol dl{color: #0084ff; font-size: 4.0rem; font-weight: 600; margin-bottom: 20px } .newinterviewBox01 ol dd{font-size: 2.2rem; font-weight: 600; line-height: 200%} .newinterviewBox05 {margin-top:90px; margin-bottom: 180px} .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: inline-block; width:50%; height: auto; vertical-align: top; padding-left: 60px; padding-top: 60px} .newinterviewBox05 ul li:nth-child(1){width: 50%; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center} .newinterviewBox05 ul li dt{font-size: 3.2rem; color: #000; font-weight: 600; text-align: left} .newinterviewBox05 ul li dt + dt{margin-top: 95px} .newreferenceBox01{margin-top: 90px} .newreferenceBox01 ul{font-size: 0; text-align: center} .newreferenceBox01 ul li{display: inline-block; width:32%; border:#dedede 1px solid; padding: 65px 20px 0px; border-radius: 30px; height: 443px; font-size: 2.7rem; vertical-align: top; box-shadow: 0px 0px 10px #c9c9c9;} .newreferenceBox01 ul li img{display: block; margin: 0 auto 55px; } .newreferenceBox01 ul li + li{margin-left: 1.6%} .newreferenceBox02{width: 100%; margin: 100px auto 0; padding-top: 10vw; position: relative; padding-left: 50%; min-height: 464px} .newreferenceBox02 img{position: absolute; left:0; top:0; width: 40%} .newreferenceBox02 dl{color: #3f579e; font-weight: 600; font-size: 2.7rem; margin-bottom: 40px} .newinterviewBox02{padding-bottom: 130px !important; margin-top: 90px } .newinterviewBox02 img{margin: 0 auto 75px} .newinterviewBox02 ul li:nth-child(3) img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(1) img{margin: 0 auto 75px} .newinterviewBox02 ul li:nth-child(2) img{margin: 0 auto 75px} } @media screen and (max-width: 1280px){ .newscreeningBox02{margin: 90px auto 145px; width: 100%;text-align: center} .newscreeningBox02 ul{font-size: 0; text-align: center} .newscreeningBox02 ul li{display: inline-block; width: 40%; height: auto; color: #3f579e; font-size: 2.5rem; vertical-align: top; padding-top: 15vw} .newscreeningBox02 ul li + li {margin-left: 10%; padding-top:10vw} .newscreeningBox02 img{width: 100%} .newinterviewBox05 {margin-top:90px; margin-bottom: 180px} .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: inline-block; width:50%; height: auto; vertical-align: top; padding-left: 60px; padding-top: 4vw} .newinterviewBox05 ul li:nth-child(1){width: 50%; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center; overflow: hidden} .newinterviewBox05 ul li dt{font-size: 2.7rem; color: #000; font-weight: 600; text-align: left} .newinterviewBox05 ul li dt + dt{margin-top: 4vw} } @media screen and (max-width: 930px){ .newscreeningBox02{margin: 90px auto 145px; width: 100%; } .newscreeningBox02 ul{font-size: 0; text-align: center} .newscreeningBox02 ul li{display: inline-block; width: 40%; height: auto; color: #3f579e; font-size: 2.5rem; vertical-align: top; padding-top: 15vw} .newscreeningBox02 ul li + li {margin-left: 10%; padding-top:10vw} .newinterviewBox02{padding-bottom: 50px !important; margin-top: 90px } .newinterviewBox02 img{margin: 0 auto 50px} .newinterviewBox02 ul li:nth-child(3) img{margin: 0 auto 50px} .newinterviewBox02 ul li:nth-child(1) img{margin: 0 auto 50px} .newinterviewBox03 {margin-bottom: 135px} .newinterviewBox03 ul{font-size: 0; text-align: center} .newinterviewBox03 ul li{display: inline-block; width: 33.333%; vertical-align: top; color: #3f579e; font-size: 2.7rem; font-weight: 600; padding-top: 6vw !important; } .newinterviewBox03 ul li:nth-child(2){padding-top: 0 !important} .newinterviewBox03 ul li img{width: 80%} .newagencyBox03{margin: 50px auto 230px; } .newagencyBox02{margin-top: 80px; position: relative; min-height: 442px; margin-bottom: 140px; padding-right: 40%} .newagencyBox02 img{position: absolute; right: 0; top: 0; width: 35%} .newagencyBox02 dl{font-size: 3.2rem; padding-left: 30px; margin-bottom: 40px; color: #000} .newagencyBox02 dl span{position: absolute; margin-left: -30px; font-size: 2.8rem} .newinterviewBox05 {margin-top:90px; margin-bottom: 180px} .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: inline-block; width:50%; height: auto; vertical-align: top; padding-left: 40px; padding-top: 3vw} .newinterviewBox05 ul li:nth-child(1){width: 50%; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center; overflow: hidden} .newinterviewBox05 ul li dt{font-size: 2.7rem; color: #000; font-weight: 600; text-align: left} .newinterviewBox05 ul li dt + dt{margin-top: 3vw} } @media screen and (max-width: 800px){ html, body{width: 100%; overflow-x: hidden} .newscreeningBox01{background: #f8f8f8; padding: 120px 0 80px; text-align: center; color: #000; display: block; overflow-x: hidden} .newscreeningBox01 dt{font-size: 3.0rem; margin-bottom: 40px; text-align: left} .newscreeningBox01 dl{font-size: 2.2rem;text-align: left; margin-bottom: 10px} .newscreeningBox01 dd{font-size: 1.8rem; font-weight: 600; margin-bottom:100px; text-align: left} .newscreeningBox01 img{width: 80%;} .newscreeningBox02{margin: 90px auto 145px; width: 100%;text-align: center} .newscreeningBox02 ul{font-size: 0; text-align: center} .newscreeningBox02 ul li{display: inline-block; width: 40%; height: auto; color: #3f579e; font-size: 2.0rem; vertical-align: top; padding-top: 12vw} .newscreeningBox02 ul li + li {margin-left: 10%; padding-top:9vw} .newscreeningBox03{text-align: center; margin: 80px auto 130px;} .newscreeningBox03 dl{color: #3f579e; font-size: 2.2rem; margin-bottom: 20px; font-weight: 600} .newscreeningBox04{margin: 80px auto 150px; } .newinterviewBox01{background: #000; color: #fff; padding: 60px 0 80px;} .newinterviewBox01 dt{font-size: 3.0rem; font-weight: 600; margin-bottom: 50px} .newinterviewBox01 ol{margin-left: 10%; width: 90%; padding: 60px 0} .newinterviewBox01 ol + ol{border-top: #f5f5f5 1px solid} .newinterviewBox01 ol dl{color: #0084ff; font-size: 3.0rem; font-weight: 600; margin-bottom: 20px } .newinterviewBox01 ol dd{font-size: 1.7rem; font-weight: 600; line-height: 200%} .newinterviewBox02{padding-bottom: 130px !important; margin-top: 90px ; } .newinterviewBox02 img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(3) img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(1) img{margin: 0 auto 55px} .newinterviewBox03 {margin-bottom: 135px; } .newinterviewBox03 ul{font-size: 0; text-align: center} .newinterviewBox03 ul li{display: block; width: 100%; vertical-align: top; color: #3f579e; font-size: 2.7rem; font-weight: 600; padding-top: 0px} .newinterviewBox03 ul li:nth-child(2){padding-top: 0; margin: 50px 0 } .newinterviewBox03 ul li:nth-child(2) img{width: 60%} .newinterviewBox05 {margin-top:90px; margin-bottom: 180px; } .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: block; width: 100%; height: auto; vertical-align: top; padding-left: 20px; padding-top: 60px} .newinterviewBox05 ul li:nth-child(1){width: 100%; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center} .newinterviewBox05 ul li dt{font-size: 2.2rem; color: #000; font-weight: 600; text-align: center} .newinterviewBox05 ul li dt + dt{margin-top: 25px} .newinterviewBox05 ul li:nth-child(1) img{width: 80%} .newagencyBox01{ min-height: auto; } .newagencyBox02{margin-top: 80px; position: relative; min-height: 442px; margin-bottom: 140px; padding-right: 0%} .newagencyBox02 img{position: relative; right: 0; top: 0; width: 50%; margin-left: 25%} .newagencyBox02 dl{font-size: 2.2rem; padding-left: 30px; margin-bottom: 40px; color: #000} .newagencyBox02 dl span{position: absolute; margin-left: -30px; font-size: 1.8rem} .newagencyBox03{margin: 50px auto 230px;} .newreferenceBox01{margin-top: 90px} .newreferenceBox01 ul{font-size: 0; text-align: center} .newreferenceBox01 ul li{display: block; width: 90%; border:#dedede 1px solid; padding: 65px 20px 60px; border-radius: 30px; height: auto; font-size: 2.2rem; vertical-align: top; box-shadow: 0px 0px 10px #c9c9c9; margin-left: 5%} .newreferenceBox01 ul li img{display: block; margin: 0 auto 55px} .newreferenceBox01 ul li + li{margin-left: 5%; margin-top: 30px} .newreferenceBox02{width: 100%; margin: 100px auto 0; padding-top: 0px; position: relative; padding-left: 0; min-height: auto} .newreferenceBox02 img{position: relative; left:0; top:0; width:60%; margin-left: 20%; margin-bottom: 30px} .newreferenceBox02 dl{color: #3f579e; font-weight: 600; font-size: 2.2rem; margin-bottom: 40px} .newreferenceBox03{margin: 90px auto 150px; } .newnewsBox01{font-size: 1.7rem; margin-bottom: -30px;} .newnewsBox01 dt{font-size: 3.2rem; margin-bottom: 90px;} .newnewsBox02{font-size: 2.2rem; margin-bottom: 140px} .newnewsBox02 a{display: inline-block; width: 45%; line-height: 80px; border-radius: 50px; background: #eeeeee; cursor:pointer} .newnewsBox02 a + a{margin-left: 6%} .newnewsBox02 a:hover, .newnewsBox02 a.on{background: #3f579e; color: #fff} .newnewsBox03{font-size: 3.0rem; text-align: center; margin-bottom: 80px; color: #000; font-weight: 600} .newnewsBox04{width: 100%; margin: 0 auto; padding-bottom: 200px; overflow-x: hidden;} .newnewsBox04img{position: absolute; z-index: 9 !important; width: 92% !important} #evaluation .faq2 ul li .title p{ font-size: 2.2rem; font-weight: 500; color: #3f579e; padding: 0 40px; position: relative; transition: 0.5s; } #evaluation .faq2 ul li .title p::before{ content: "Q"; font-size: 3.2rem; font-weight: 700; color: var(--blue); position: absolute; top: -5px; left: 0px; } #evaluation .faq2 ul li .answer{ background-color: #fff; padding: 30px 30px; border-radius: 10px; display: none; overflow: hidden; margin-bottom: 35px; position: relative; top: 35px; cursor: default; } } @media screen and (max-width: 600px){ html, body{width: 100%; overflow-x: hidden} .newscreeningBox01{background: #f8f8f8; padding: 120px 0 80px; text-align: center; color: #000; display: block; overflow-x: hidden} .newscreeningBox01 dt{font-size: 3.0rem; margin-bottom: 40px; text-align: left} .newscreeningBox01 dl{font-size: 2.2rem;text-align: left; margin-bottom: 10px} .newscreeningBox01 dd{font-size: 1.8rem; font-weight: 600; margin-bottom:100px; text-align: left} .newscreeningBox01 img{width: 80%;} .newscreeningBox02{margin: 90px auto 145px; width: 100%;text-align: center} .newscreeningBox02 ul{font-size: 0; text-align: center} .newscreeningBox02 ul li{display: inline-block; width: 40%; height: auto; color: #3f579e; font-size: 2.0rem; vertical-align: top; padding-top: 12vw} .newscreeningBox02 ul li + li {margin-left: 10%; padding-top:9vw} .newscreeningBox03{text-align: center; margin: 80px auto 130px;} .newscreeningBox03 dl{color: #3f579e; font-size: 2.2rem; margin-bottom: 20px; font-weight: 600} .newscreeningBox04{margin: 80px auto 150px; } .newinterviewBox01{background: #000; color: #fff; padding: 60px 0 80px;} .newinterviewBox01 dt{font-size: 3.0rem; font-weight: 600; margin-bottom: 50px} .newinterviewBox01 ol{margin-left: 10%; width: 90%; padding: 60px 0} .newinterviewBox01 ol + ol{border-top: #f5f5f5 1px solid} .newinterviewBox01 ol dl{color: #0084ff; font-size: 3.0rem; font-weight: 600; margin-bottom: 20px } .newinterviewBox01 ol dd{font-size: 1.7rem; font-weight: 600; line-height: 200%} .newinterviewBox02{padding-bottom: 130px !important; margin-top: 90px ; } .newinterviewBox02 img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(3) img{margin: 0 auto 55px} .newinterviewBox02 ul li:nth-child(1) img{margin: 0 auto 55px} .newinterviewBox03 {margin-bottom: 135px; } .newinterviewBox03 ul{font-size: 0; text-align: center} .newinterviewBox03 ul li{display: block; width: 100%; vertical-align: top; color: #3f579e; font-size: 2.7rem; font-weight: 600; padding-top: 0px} .newinterviewBox03 ul li:nth-child(2){padding-top: 0; margin: 50px 0 } .newinterviewBox03 ul li:nth-child(2) img{width: 60%} .newinterviewBox05 {margin-top:90px; margin-bottom: 180px; } .newinterviewBox05 ul{font-size: 0; text-align: center} .newinterviewBox05 ul li{display: block; width: 100%; height: auto; vertical-align: top; padding-left: 20px; padding-top: 60px} .newinterviewBox05 ul li:nth-child(1){width: 100%; padding-left: 0; padding-top: 29px; box-shadow: 0px 0px 10px #c9c9c9; border-radius: 30px; text-align: center} .newinterviewBox05 ul li dt{font-size: 2.2rem; color: #000; font-weight: 600; text-align: center} .newinterviewBox05 ul li dt + dt{margin-top: 25px} .newinterviewBox05 ul li:nth-child(1) img{width: 80%} .newagencyBox01{ min-height: auto; } .newagencyBox02{margin-top: 80px; position: relative; min-height: 442px; margin-bottom: 140px; padding-right: 0%} .newagencyBox02 img{position: relative; right: 0; top: 0; width: 50%; margin-left: 25%} .newagencyBox02 dl{font-size: 2.2rem; padding-left: 30px; margin-bottom: 40px; color: #000} .newagencyBox02 dl span{position: absolute; margin-left: -30px; font-size: 1.8rem} .newagencyBox03{margin: 50px auto 230px;} .newreferenceBox01{margin-top: 90px} .newreferenceBox01 ul{font-size: 0; text-align: center} .newreferenceBox01 ul li{display: block; width: 90%; border:#dedede 1px solid; padding: 65px 20px 60px; border-radius: 30px; height: auto; font-size: 2.2rem; vertical-align: top; box-shadow: 0px 0px 10px #c9c9c9; margin-left: 5%} .newreferenceBox01 ul li img{display: block; margin: 0 auto 55px} .newreferenceBox01 ul li + li{margin-left: 5%; margin-top: 30px} .newreferenceBox02{width: 100%; margin: 100px auto 0; padding-top: 0px; position: relative; padding-left: 0; min-height: auto} .newreferenceBox02 img{position: relative; left:0; top:0; width:60%; margin-left: 20%; margin-bottom: 30px} .newreferenceBox02 dl{color: #3f579e; font-weight: 600; font-size: 2.2rem; margin-bottom: 40px} .newreferenceBox03{margin: 90px auto 150px; } .newnewsBox01{font-size: 1.7rem; margin-bottom: -30px;} .newnewsBox01 dt{font-size: 3.2rem; margin-bottom: 90px;} .newnewsBox02{font-size: 2.2rem; margin-bottom: 140px} .newnewsBox02 a{display: inline-block; width: 45%; line-height: 80px; border-radius: 50px; background: #eeeeee; cursor:pointer} .newnewsBox02 a + a{margin-left: 6%} .newnewsBox02 a:hover, .newnewsBox02 a.on{background: #3f579e; color: #fff} .newnewsBox03{font-size: 3.0rem; text-align: center; margin-bottom: 80px; color: #000; font-weight: 600} .newnewsBox04{width: 100%; margin: 0 auto; padding-bottom: 200px; overflow-x: hidden;} .newnewsBox04img{position: absolute; z-index: 9 !important; width: 92% !important} #evaluation .faq2 ul li .title p{ font-size: 2.2rem; font-weight: 500; color: #3f579e; padding: 0 40px; position: relative; transition: 0.5s; } #evaluation .faq2 ul li .title p::before{ content: "Q"; font-size: 3.2rem; font-weight: 700; color: var(--blue); position: absolute; top: -5px; left: 0px; } #evaluation .faq2 ul li .answer{ background-color: #fff; padding: 30px 30px; border-radius: 10px; display: none; overflow: hidden; margin-bottom: 35px; position: relative; top: 35px; cursor: default; } }