@charset "UTF-8";

@media print, screen and (min-width: 1200px) {

#kvWrap {
position: relative;
background: url("../img/kv.webp") no-repeat center top;
background-size: cover;
width: 100vw;
height: 100vh;
}

#kvCopy {
position: absolute;
width: 610px;
top: 40%;
left: 90%;
transform: translateY(-40%) translateX(-90%);
z-index: 1;
}

#kvCopyTxt {
position: absolute;
width: 610px;
font-size: 2rem;
font-weight: 500;
text-align: left;
color: #fff;
left: 60px;
bottom: 60px;
z-index: 1;
line-height: 2.3;
text-shadow: #000 1px 0 10px;
}

#kvLogo01 {
position: absolute;
width: 250px;
right: 310px;
bottom: 40px;
z-index: 1;
}

#kvLogo02 {
position: absolute;
width: 250px;
right: 40px;
bottom: 40px;
z-index: 1;
}

/**/

#indexTopWrap {
background: url("../img/index_top_bg.svg") no-repeat top;
background-size: cover;
width: 100%;
margin: 0 auto;
padding: 120px 0 600px;
}

#indexTopWrapInner {
position: relative;
max-width: 1336px;
width: 100%;
font-size: 2rem;
text-align: justify;
margin: 0 auto;
padding: 0 30px;
line-height: 2;
}

#indexTopPhoto {
position: absolute;
width: 85%;
top: 30px;
right: 0;
}

#indexTopWrapInner h2 {
font-family: var(--font-second);
font-size: 5.8rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 60px;
line-height: 1.5;
}

#indexTopWrapInner p {
margin-bottom: 60px;
}

.btn,
.btnM {
position: relative;
background-color: var(--themeColor);
width: 360px;
height: 80px;
font-size: 1.8rem;
color: #fff;
padding-bottom: 3px;
cursor: pointer;
border-radius: 10px;
border: 1px solid var(--txtColor);
z-index: 2;
transition: .3s;
}

.btnM {
width: 400px;
}

.btn::after,
.btnM::after {
position: absolute;
background: url("../img/btn_arrow_w.svg") no-repeat;
background-size: 42px;
width: 42px;
height: 13px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 15px;
}

.btn:hover,
.btnM:hover {
background-color: #fff;
color: var(--themeColor);
}

.btn:hover::after,
.btnM:hover::after {
background: url("../img/btn_arrow_g.svg") no-repeat;
background-size: 42px;
}

.wrap {
width: 1200px;
margin: 0 auto;
padding: 120px 0;
}

.indexTitle,
.indexTitleWh {
font-family: var(--font-roboto);
font-size: 9rem;
text-align: center;
color: var(--themeColor);
margin-bottom: 60px;
line-height: 1.3;
}

.indexTitleWh {
text-align: left;
color: #fff;
}

.indexTitle span,
.indexTitleWh span {
font-family: var(--font-second);
font-size: 2.4rem;
font-weight: 600;
color: var(--txtColor);
display: block;
}

.indexTitleWh span {
color: #fff;
}

#ourServiceFlex {
margin: 60px auto;
display: flex;
justify-content: space-between;
}

.ourService {
background:url("../img/our_service_bg.svg") no-repeat;
background-size: cover;
width: 380px;
text-align: left;
color: #fff;
padding: 35px 30px 40px;
}

.ourService h3 {
font-family: var(--font-robotoCon);
font-size: 4rem;
font-weight: 500;
margin-bottom: 20px;
display: flex;
align-items: center;
line-height: 1;
}

.ourService h3 span {
position: relative;
font-family: var(--font-primary);
font-size: 2.4rem;
margin-left: 20px;
margin-top: -5px;
}

.btnSs {
position: relative;
background-color: inherit;
width: 110px;
font-family: var(--font-primary);
font-size: 1.6rem;
color: #fff;
text-align: left;
margin-top: 20px;
padding: 0;
cursor: pointer;
border: 0;
}

.btnSs::after {
position: absolute;
background: url("../img/btn_arrow_w.svg") no-repeat;
background-size: 21px;
width: 21px;
height: 6px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 0;
}

#wrapWorksAwards {
position: relative;
background: url("../img/index_works_awards_bg.webp") no-repeat;
background-size: cover;
text-align: left;
color: #fff;
overflow: hidden;
}

#wrapWorksAwardsInner {
position: relative;
max-width: 1300px;
width: 100%;
margin: 0 auto;
padding: 120px 30px;
left: 22px;
}

#worksLineDiagonal {
position: absolute;
background-color: #fff;
width: 3000px;
height: 2px;
z-index: 2;
transform: rotate(-60deg);
left: -1420px;
top: 0;
}

#worksLine {
position: absolute;
background-color: #fff;
width: 5000px;
height: 2px;
margin: auto;
z-index: 2;
left: -5180px;
right: 0;
top: 300px;
}

#worksAwardsFlex {
display: flex;
justify-content: space-between;
}

#worksAwardsL {
width: 43%;
}

#worksAwardsL h3 {
font-size: 2.4rem;
margin-bottom: 5px;
}

#worksAwardsLWrap {
background-color: #fff;
color: var(--txtColor);
padding: 30px;
}

#worksAwardsLWrap dt {
float: left;
font-size: 2rem;
color: var(--themeColor);
}

#worksAwardsLWrap dd {
padding: 0 0 0 26px;
}

#worksAwardsLWrap dd h4 {
font-size: 2rem;
}

.btnSss {
position: relative;
background-color: #e6f2ec;
font-family: var(--font-primary);
width: 182px;
height: 40px;
font-size: 1.4rem;
color: var(--txtColor);
text-align: left;
margin-right: 15px;
padding: 0 0 2px 25px;
cursor: pointer;
border: 1px solid #e6f2ec;
}

.btnSss:nth-of-type(2) {
padding: 0 0 2px 40px;
}

.btnSss::after {
position: absolute;
background: url("../img/btn_sss_arrow.svg") no-repeat;
background-size: 32px;
width: 32px;
height: 32px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 3px;
transition: .3s;
}

.btnSss:hover::after {
right: 1px;
}

#worksAwardsR {
width: 52%;
display: flex;
justify-content: space-between;
}

.worksAwardsRlr {
background-color: #fff;
width: 48%;
font-size: 1.8rem;
color: var(--txtColor);
padding: 10px 10px 20px;
line-height: 1.5;
}

.worksAwardsRlr img {
margin-bottom: 10px;
}

#wrapRecruitNews {
background: url("../img/index_recruit_bg.svg") no-repeat;
background-size: cover;
width: 100%;
}

#wrapRecruitInner {
position: relative;
max-width: 1300px;
width: 100%;
margin: 0 auto;
padding: 120px 30px 100px;
left: 22px;
}

#wrapRecruitFlex {
margin-bottom: 120px;
display: flex;
justify-content: space-between;
}

#wrapRecruitL {
background: url("../img/index_recruit_dot.svg") no-repeat left 80px;
background-size: 1px;
width: 42%;
text-align: justify;
padding: 0 0 0 50px;
}

#indexRecruitTitle {
position: relative;
width: 188px;
margin-bottom: 20px;
left: -65px;
}

#wrapRecruitL h3 {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
margin-bottom: 30px;
line-height: 1.5;
}

#recruitBanner {
position: relative;
width: 100%;
margin: 40px auto;
margin-bottom: 50px;
padding: 10px;
border: 1px solid var(--txtColor);
display: flex;
justify-content: space-between;
align-items: center;
}

#recruitBanner:after {
position: absolute;
background: url("../img/banner_arrow.svg") no-repeat;
background-size: 38px;
width: 38px;
height: 38px;
content: "";
margin: auto;
right: 20px;
top: 0;
bottom: 0;
transition: .3s;
}

#recruitBanner:hover:after {
right: 15px;
}

#recruitBannerL {
width: 180px;
}

#recruitBannerR {
width: 60%;
padding-left: 30px;
}

#wrapRecruitR {
width: 668px;
}

#recruitTitle {
font-family: var(--font-roboto);
font-size: 9rem;
text-align: right;
color: var(--themeColor);
line-height: 1;
}

#wrapRecruitRPhoto {
position: relative;
margin-top: -80px;
}

#wrapNews {
position: relative;
background: url("../img/index_news_bg.png") no-repeat;
background-size: cover;
width: 1240px;
height: 460px;
text-align: justify;
margin: 0 auto;
margin-bottom: -70px;
padding: 60px 80px 86px 120px;
z-index: 1;
display: flex;
justify-content: space-between;
}

#newsL {
width: 230px;
}

#newsL h2 {
font-family: var(--font-roboto);
font-size: 1.4rem;
font-weight: 500;
color: var(--themeColor);
line-height: 1.5;
}

#newsL h2 span {
font-family: var(--font-second);
font-size: 4rem;
color: var(--txtColor);
display: block;
}

#newsR {
width: 802px;
}

#newsR .newsFlex {
position: relative;
width: 100%;
padding: 25px 0;
display: block;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #b8c1bd;
}

#newsR .newsFlex:after {
position: absolute;
background: url("../img/btn_arrow_g.svg") no-repeat;
background-size: 21px;
width: 21px;
height: 6px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 5px;
transition: .3s;
}

#newsR .newsFlex:hover:after {
right: 0;
}

#newsR .newsL {
font-family: var(--font-roboto);
width: 208px;
font-size: 1.4rem;
font-weight: 500;
color: var(--themeColor);
display: flex;
justify-content: flex-start;
align-items: center;
}

#newsR .newsL .categoryTag {
background-color: #fff;
font-family: var(--font-primary);
width: 110px;
height: 24px;
font-size: 1.3rem;
font-weight: 400;
text-align: center;
margin-left: 15px;
border: 1px solid var(--themeColor);
line-height: 20px;
}

#newsR .newsR {
width: 574px;
padding-right: 60px;
}

#btnNewsList {
position: relative;
background-color: #fff;
font-family: var(--font-primary);
width: 182px;
height: 40px;
font-size: 1.4rem;
color: var(--txtColor);
text-align: left;
margin: 0 0 20px auto;
padding: 0 0 2px 10px;
display: block;
cursor: pointer;
border: 1px solid #e6f2ec;
}

#btnNewsList::after {
position: absolute;
background: url("../img/btn_sss_arrow.svg") no-repeat;
background-size: 32px;
width: 32px;
height: 32px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 3px;
transition: .3s;
}

#btnNewsList:hover::after {
right: 1px;
}

/**/

#wrapTitle {
position: relative;
width: 100%;
height: 600px;
overflow: hidden;
margin-top: 94px;
}

#wrapTitle:after {
position: absolute;
background: rgb(0 0 0 / .3);
width: 100%;
height: 100%;
content: "";
left: 0;
top: 0;
}

#wrapTitleOther,
#wrapTitlePrivacy {
position: relative;
width: 100%;
height: 480px;
overflow: hidden;
margin-top: 94px;
}

#contentsTitle {
position: absolute;
font-family: var(--font-roboto);
font-size: 9rem;
text-align: left;
color: #fff;
padding-left: 100px;
z-index: 2;
line-height: 1.3;
left: 0;
bottom: 90px;
}

#contentsTitleWrap {
position: absolute;
width: 1200px;
font-size: 1.8rem;
text-align: left;
top: 70%;
left: 50%;
transform: translateY(-70%) translateX(-50%);
}

#contentsTitleOther {
font-family: var(--font-roboto);
font-size: 9rem;
text-align: left;
color: var(--themeColor);
margin-bottom: 50px;
line-height: 1.3;
}

#contentsTitle span,
#contentsTitleOther span {
font-family: var(--font-second);
font-size: 2.4rem;
font-weight: 600;
display: block;
}

#contentsTitleOther span {
color: var(--txtColor);
}

#contentsTitle:after {
position: absolute;
background-color: #fff;
width: 76px;
height: 2px;
content: "";
margin: auto;
left: 0;
top: -32px;
bottom: 0;
}

#contentsTitleDiagonal {
position: absolute;
background-color: #fff;
width: 1000px;
height: 2px;
z-index: 2;
transform: rotate(-60deg);
left: -350px;
top: 200px;
}

.bgBusiness {
background: url("../img/bg_business.webp") no-repeat center;
background-size: cover;
}

.bgCompany {
background: url("../img/bg_company.webp") no-repeat center;
background-size: cover;
}

.bgHistory {
background: url("../img/bg_history.webp") no-repeat center;
background-size: cover;
}

.bgWorks {
background: url("../img/bg_works.webp") no-repeat center;
background-size: cover;
}

.bgAwards {
background: url("../img/bg_award.webp") no-repeat center;
background-size: cover;
}

.bgContact {
background: url("../img/bg_contact.webp") no-repeat center;
background-size: cover;
}

#breadcrumb {
position: relative;
max-width: 1300px;
width: 100%;
text-align: right;
margin: 0 auto;
padding: 20px 30px 0;
left: 22px;
z-index: 3;
}

#breadcrumb .breadcrumbLine {
background-color: var(--themeColor);
width: 28px;
height: 1px;
margin: 0 15px;
display: inline-block;
vertical-align: middle;
}

.wrapCoW {
position: relative;
max-width: 1300px;
width: 100%;
text-align: justify;
margin: 0 auto;
padding: 40px 30px 120px;
left: 22px;
}

.contentsTop {
font-size: 1.8rem;
line-height: 2;
}

#wrapBusinessTop {
width: 100%;
padding: 170px 0 80px;
display: flex;
justify-content: space-between;
}

#wrapBusinessTopL {
max-width: 690px;
padding-right: 30px;
}

#wrapBusinessTopL h2 {
position: relative;
font-family: var(--font-second);
font-size: 2.4rem;
font-weight: 500;
margin-bottom: 40px;
line-height: 1.4;
}

#wrapBusinessTopL h2 span {
font-size: 5.8rem;
color: var(--themeColor);
display: block;
margin-top: 30px;
}

#wrapBusinessTopL h2::before {
position: absolute;
background-color: var(--themeColor);
width: 2000px;
height: 1px;
content: "";
left: -2015px;
top: 16px;
}

#businessStrengthsFlex {
display: flex;
justify-content: space-between;
}

.businessStrengths {
width: 49%;
text-align: center;
padding: 30px;
border: 1px solid var(--themeColor);
}

.businessStrengths h3 {
font-size: 2.2rem;
font-weight: 500;
color: var(--themeColor);
}

.businessStrengths p {
margin-bottom: 0;
}

#wrapBusinessTopR {
max-width: 508px;
margin-top: 76px;
}

#wrapBusinessColor {
background: url("../img/business_bg.svg") no-repeat;
background-size: cover;
}

.wrapCo {
position: relative;
width: 1200px;
text-align: justify;
margin: 0 auto;
padding: 120px 0;
}

.commonTitle,
.commonTitleL {
position: relative;
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
text-align: center;
margin-bottom: 60px;
padding-bottom: 20px;
}

.commonTitleL {
text-align: left;
}

.commonTitle::before,
.commonTitleL::before {
position: absolute;
background-color: var(--themeColor);
width: 40px;
height: 1px;
content: "";
margin: auto;
bottom: 0;
left: -44px;
right: 0px;
}

.commonTitleL::before {
margin: 0;
left: 0px;
}

.commonTitle::after,
.commonTitleL::after {
position: absolute;
background-color: #ffc239;
width: 16px;
height: 1px;
content: "";
margin: auto;
bottom: 0;
left: 0px;
right: -20px;
}

.commonTitleL::after {
margin: 0;
left: 44px;
}

.businessContentFlex {
margin-bottom: 100px;
display: flex;
justify-content: space-between;
align-items: center;
}

.businessContentFlex:last-child {
margin-bottom: 0;
}

.businessContentPhoto {
width: 600px;
}

.businessContent {
width: 520px;
}

.businessContent h3 {
font-size: 2.8rem;
font-weight: 500;
margin: 25px auto;
padding: 15px 0;
border-top: 2px solid var(--themeColor);
border-bottom: 2px solid var(--themeColor);
}

.businessContent .number {
font-family: var(--font-roboto);
font-size: 7rem;
font-weight: 500;
color: var(--themeColor);
line-height: 1;
}

#wrapBusinessWorks {
position: relative;
background: url("../img/business_bg02.webp") no-repeat center;
background-size: cover;
width: 100%;
height: 450px;
color: #fff;
overflow: hidden;
padding: 100px 0;
}

#wrapBusinessWorks::after {
position: absolute;
background: rgb(0 0 0 / .4);
width: 100%;
height: 100%;
content: "";
left: 0;
top: 0;
}

#wrapBusinessWorks h2 {
position: relative;
font-size: 3.6rem;
font-weight: 500;
margin-bottom: 25px;
line-height: 1.5;
z-index: 2;
}

#wrapBusinessWorks p {
position: relative;
z-index: 2;
}

/**/

#wrapMessage {
background: url("../img/company_bg.svg") no-repeat bottom;
background-size: 100%;
width: 100%;
}

.wrapCoC {
position: relative;
width: 1200px;
text-align: justify;
margin: 0 auto;
padding: 40px 0 120px;
}

#messageFlex {
padding: 170px 0 80px;
display: flex;
justify-content: space-between;
}

#messageL {
width: 380px;
}

#messageR {
width: 700px;
font-size: 2rem;
line-height: 2;
}

#messageR h2 {
font-family: var(--font-roboto);
font-size: 3.2rem;
margin-bottom: 40px;
line-height: 1.5;
}

#messageR h2 span {
font-family: var(--font-second);
font-size: 4.2rem;
font-weight: 500;
color: var(--themeColor);
display: block;
margin-top: 30px;
}

#representative {
font-size: 2.4rem;
margin-top: 60px;
line-height: 1.5;
}

#representative span {
font-size: 4.2rem;
display: block;
}

#wrapOutline {
background: url("../img/company_outline_bg.svg") no-repeat center;
background-size: cover;
width: 100%;
padding: 100px 0;
}

#outlineFlex {
width: 1200px;
text-align: justify;
margin: 0 auto;
display: flex;
justify-content: space-between;
}

#outlineL {
width: 270px;
}

#outlineR {
width: 782px;
padding-left: 82px;
border-left: 2px solid var(--themeColor);
}

#outlineR dl {
margin-top: -25px;
}

#outlineR dt {
float: left;
padding: 25px 0;
}

#outlineR dd {
padding: 25px 0 25px 200px;
border-bottom: 1px solid #b7b7b7;
}

#accessFlex {
margin-top: 60px;
display: flex;
justify-content: space-between;
align-items: center;
}

#accessL {
width: 600px;
}

.googleMap {
position: relative;
width: 100%;
height: 450px;
}

.googleMap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

#accessR {
width: 520px;
}

#accessR h3 {
color: var(--themeColor);
margin-bottom: 10px;
}

/**/

#wrapHistory {
background: url("../img/history_bg.webp") no-repeat center;
background-size: cover;
width: 100%;
}

#wrapHistoryInner {
width: 930px;
font-size: 1.8rem;
margin: 0 auto;
padding: 100px 0 120px;
}

.historyFlex {
margin: 0 auto;
margin-top: 40px;
display: flex;
justify-content: space-between;
align-items: center;
}

.historyL {
position: relative;
font-size: 3.2rem;
font-weight: 600;
color: var(--themeColor);
line-height: 1;
}

.historyL span {
position: relative;
font-family: var(--font-robotoCon);
width: 252px;
font-size: 7rem;
font-weight: 500;
top: 10px;
}

.historyL em {
position: relative;
font-family: var(--font-robotoCon);
font-weight: 500;
font-size: 3.8rem;
top: 1px;
}

.historyR {
position: relative;
background-color: #fff;
width: 680px;
font-size: 2rem;
font-weight: 500;
text-align: left;
margin-top: 20px;
padding: 10px 40px;
border-radius: 100px;
line-height: 1.4;
}

.historyR::before {
position: absolute;
background-color: var(--txtColor);
width: 64px;
height: 1px;
content: "";
margin: auto;
top: 0;
bottom: 0;
left: -50px;
}

/**/

#worksTxtTop {
font-size: 1.8rem;
text-align: center;
margin-top: 20px;
margin-bottom: 100px;
}

#worksTxt {
font-size: 1.8rem;
text-align: center;
margin-bottom: 50px;
line-height: 2;
}

#worksImg {
width: 850px;
margin: 0 auto;
margin-bottom: 40px;
}

#wrapWorksList {
background: url("../img/works_list_bg.webp") repeat-y;
background-size: 100%;
width: 100%;
}

#worksListFlex {
display: flex;
justify-content: space-between;
}

#worksListL {
width: 340px;
color: #fff;
}

#worksListL h2 {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
margin-bottom: 40px;
}

#worksListR {
width: 700px;
}

.accordion {
width: 100%;
margin-bottom: 60px;
}

.accordion li {
position: relative;
width: 100%;
margin-bottom: 30px;
}

.accordion li p:last-child {
margin-bottom: 0;
}

.toggle {
position: relative;
background-color: var(--themeColor);
width: 100%;
height: 56px;
display: block;
padding: 0 20px;
cursor: pointer;
border: 1px solid #fff;
line-height: 52px;
}

.toggle h3 {
position: relative;
font-size: 2.2rem;
font-weight: 600;
color: #fff;
}

.toggle .accordion_icon {
position: absolute;
background-color: #fff;
width: 54px;
height: 54px;
margin: auto;
top: 0;
right: 0;
}

.toggle .accordion_icon .arrow {
position: absolute;
width: 14px;
height: 14px;
margin: auto;
display: block;
transition: all .3s;
border-right: 3px solid var(--themeColor);
border-bottom: 3px solid var(--themeColor);
transform: rotate(45deg);
left: 0;
right: 0;
top: -10px;
bottom: 0;
}

.toggle .accordion_icon.active .arrow {
transform: rotate(-135deg);
top: 0;
bottom: 0;
}

.accordionDetail {
position: relative;
background-color: #fff;
color: var(--txtColor);
display: none;
padding: 10px 30px 35px;
}

.worksDetailFlex {
padding: 5px 0;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #b7b7b7;
}

.worksDetailR {
background-color: #e6f2ec;
min-width: 122px;
height: 34px;
font-size: 1.4rem;
text-align: center;
color: var(--themeColor);
padding: 0 10px;
border: 1px solid var(--themeColor);
line-height: 30px;
}

.accordionDe li {
position: relative;
width: 100%;
color: var(--txtColor);
margin: 0 auto;
}

.toggleDe {
position: relative;
background-color: #fff;
width: 360px;
height: 64px;
display: block;
margin: 0 auto;
padding: 0 20px;
cursor: pointer;
border-radius: 10px;
line-height: 62px;
}

.toggleDe h3 {
position: relative;
font-size: 1.8rem;
color: var(--txtColor);
text-align: center;
}

.accordion_iconDe {
position: absolute;
margin: auto;
top: 0;
bottom: 0;
right: 40px;
}

.accordion_iconDe .arrow {
position: absolute;
width: 14px;
height: 14px;
margin: auto;
display: block;
transition: all .3s;
border-right: 3px solid var(--themeColor);
border-bottom: 3px solid var(--themeColor);
transform: rotate(45deg);
left: 0;
right: 0;
top: -10px;
bottom: 0;
}

.accordion_iconDe.active .arrow {
transform: rotate(-135deg);
top: 0;
bottom: 0;
}

.accordionDeDetail {
position: relative;
display: none;
padding-top: 30px;
}

.accordionDeDetail li  {
margin-bottom: 30px;
}


/**/

#wrapAwards {
background: url("../img/awards_bg.webp") no-repeat center top;
background-size: contain;
width: 100%;
}

#awardsTxt {
font-size: 1.8rem;
text-align: center;
margin-bottom: 200px;
line-height: 2;
}

#awardsFlex {
margin-bottom: 50px;
display: flex;
justify-content: center;
flex-wrap: wrap;
}

.awards {
width: 376px;
text-align: center;
margin: 0 20px 40px;
padding: 20px;
border: 1px solid var(--themeColor)
}

.awards img {
width: auto;
height: 180px;
margin: 20px auto;
}

.awards:nth-of-type(1) {
margin: 0 15px 40px 0;
}

.awards:nth-of-type(3) {
margin: 0 0 40px 15px;
}

.awards h3 {
font-size: 1.8rem;
color: var(--themeColor);
margin: 20px auto;
line-height: 1.6;
}

/**/

#wrapTitleRecruit {
position: relative;
background: url("../img/bg_recruit.webp") no-repeat center;
background-size: cover;
width: 100%;
height: 986px;
margin-top: 94px;
}

#wrapTitleRecruit #breadcrumb {
top: 40px;
}

#wrapTitleRecruitTriangle {
position: absolute;
background: url("../img/bg_recruit_triangle.webp") no-repeat top right;
background-size: 1143px;
width: 100%;
height: 986px;
z-index: 1;
top: 0;
right: 0;
}

#recruitTitleWrap {
position: relative;
width: 1200px;
margin: 0 auto;
margin-top: 80px;
display: flex;
justify-content: space-between;
z-index: 2;
}

#recruitTitleL {
width: 640px;
font-size: 2rem;
text-align: justify;
line-height: 2;
}

#recruitTitleL h1 {
font-family: var(--font-roboto);
font-size: 4.8rem;
color: var(--themeColor);
margin-bottom: 30px;
line-height: 1.5;
}

#recruitTitleL h1 span {
font-family: var(--font-second);
font-size: 1.8rem;
font-weight: 600;
color: var(--txtColor);
display: block;
}

#recruitTitleL h2 {
font-family: var(--font-second);
font-size: 4.2rem;
font-weight: 500;
margin-bottom: 30px;
line-height: 1.5;
}

#titleBottomUl {
width: 1200px;
margin: 0 auto;
display: flex;
justify-content: flex-start;
}

#titleBottomUl li {
background-color: #fff;
width: auto;
height: 35px;
color: var(--themeColor);
text-align: center;
margin-right: 10px;
padding: 0 25px;
border: 1px solid var(--themeColor);
border-radius: 100px;
line-height: 31px;
}

#recruitTitleR {
width: 400px;
text-align: left;
}

#recruitTitleR img {
width: 300px;
}

#recruitTopBanner {
position: relative;
width: 950px;
margin: 0 auto;
margin-top: 80px;
z-index: 2;
}

#wrapNumber {
background: url("../img/recruit_number_bg.png") no-repeat;
background-size: contain;
width: 100%;
height: 380px;
font-size: 1.8rem;
text-align: center;
color: #fff;
margin-bottom: 100px;
padding: 40px;
}

#wrapNumber h2 {
font-family: var(--font-second);
font-size: 3.2rem;
font-weight: 500;
margin-bottom: 15px;
}

#wrapNumber h2 span {
font-size: 5.6rem;
font-weight: 500;
display: block;
}

.btnRe,
.btnReW,
.btnReM {
position: relative;
font-family: var(--font-primary);
background-color: #fff;
width: 338px;
height: 64px;
font-size: 1.6rem;
text-align: left;
color: var(--txtColor);
padding-left: 40px;
padding-bottom: 3px;
cursor: pointer;
border: 1px solid var(--txtColor);
transition: .3s;
}

.btnReW {
width: 390px;
}

.btnReM {
width: 354px;
}

.btnRe::after,
.btnReW::after,
.btnReM::after {
position: absolute;
background: url("../img/btn_arrow_re.svg") no-repeat;
background-size: 38px;
width: 38px;
height: 38px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 15px;
}

.btnRe:hover,
.btnReW:hover,
.btnReM:hover {
background-color: var(--themeColor);
color: #fff;
border: 1px solid #fff;
}

.btnRe:hover::after,
.btnReW:hover::after,
.btnReM:hover::after {
background: url("../img/btn_arrow_re_w.svg") no-repeat;
background-size: 38px;
}

.wrapRecruitFlex {
position: relative;
width: 100%;
margin-bottom: 60px;
padding: 60px;
display: flex;
justify-content: space-between;
border: 1px solid var(--txtColor)
}

.wrapRecruitFlex .subTitle {
position: absolute;
width: auto;
height: 47px;
left: -12px;
top: 50px;
}

.wrapRecruitL {
width: 580px;
padding-top: 50px;
}

.wrapRecruitL2 {
position: relative;
width: 580px;
top: -4px;
}

.wrapRecruitL h2,
.wrapRecruitL2 h2 {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
text-align: left;
margin-bottom: 25px;
line-height: 1.5;
letter-spacing: .01em;
}

.wrapRecruitL2 h2 span {
letter-spacing: -.35em;
}

.wrapRecruitR {
width: 460px;
}

/**/

.wrapColor {
background: var(--themeColor) url("../img/bg_pattern.svg") repeat;
background-size: 200px;
width: 100%;
}

#crosstalkX {
position: absolute;
width: 750px;
z-index: 1;
right: 0;
top: 94px;
}

#wrapBreadcrumb {
width: 100%;
padding-top: 130px;
}

#wrapBreadcrumb #breadcrumb {
color: #fff;
}

#wrapBreadcrumb #breadcrumb a {
color: #fff;
}

#wrapBreadcrumb .breadcrumbLine {
background-color: #fff;
}

#contentsTitleEn {
position: relative;
font-family: var(--font-roboto);
font-size: 3.2rem;
font-weight: 400;
color: #fff;
text-align: left;
margin-top: 60px;
}

#contentsTitleEn::before {
position: absolute;
background-color: #fff;
width: 2000px;
height: 1px;
content: "";
margin: auto;
left: -2015px;
top: 0;
bottom: 0;
}

#contentsTitleWrapCo {
max-width: 1336px;
width: 100%;
font-size: 2rem;
font-weight: 500;
text-align: left;
margin: 0 auto;
padding-bottom: 50px;
}

#contentsTitleWrapCo h1 {
font-family: var(--font-second);
width: 1200px;
font-size: 4.2rem;
font-weight: 500;
color: #fff;
margin: 60px auto;
margin-bottom: 30px;
line-height: 1.5;
}

#contentsTitleWrapCo p {
width: 1200px;
margin: 0 auto;
margin-bottom: 32px;
}

#crosstalkKvContainer {
width: min(100%, 82%);
margin: 0 auto;
}

#crosstalkKvInner {
width: calc(100% + (100vw - 100%) / 2);
}

#crosstalkKv {
width: 100%;
}

#crosstalkKv img {
width: 100%;
}

#crosstalkContainer {
position: relative;
background: url("../img/crosstalk_bg.svg") no-repeat top;
background-size: 100%;
width: 100%;
}

#wrapCrosstalkArea01 {
position: relative;
width: 80%;
margin: 0 auto;
/*padding: 57vh 0;*/
padding: 120px 0;
}

#wrapCrosstalk {
position: relative;
/*position: absolute;*/
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
/*top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);*/
}

#wrapCrosstalkL {
width: 55%;
margin-left: 70px;
display: flex;
justify-content: space-between;
}

.crosstalkGroup {
position: relative;
width: 45%;
text-align: justify;
}

.crosstalkGroup:nth-of-type(2) {
top: 155px;
}

.crosstalkGroup h3 {
font-size: 2rem;
margin: 30px 0 15px;
line-height: 1.7;
}

.crosstalkGroup h3 span {
font-size: 3.2rem;
color: #fff;
display: block;
}

#wrapCrosstalkR {
width: 33%;
text-align: justify;

}

#wrapCrosstalkR h2 {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 20px;
}

#wrapCrosstalkArea02 {
position: relative;
width: 80%;
margin: 0 auto;
/*padding: 62vh 0;*/
padding: 250px 0;
}

.crosstalkTheme {
position: relative;
/*position: absolute;*/
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
/*top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);*/
}

.crosstalkThemeL,
.crosstalkThemeLw {
width: 47%;
text-align: justify;
}

.crosstalkThemeLw {
width: 60%;
}

.crosstalkThemeL h3,
.crosstalkThemeLw h3 {
width: 372px;
margin-bottom: 60px;
}

.crosstalkThemeL h4,
.crosstalkThemeLw h4 {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 40px;
line-height: 1.5;
}

.crosstalkThemeLw dl {
width: 68%;
}

.crosstalkThemeL dt,
.crosstalkThemeLw dt {
position: relative;
float: left;
top: .2em;
}

.crosstalkThemeL dt .name01,
.crosstalkThemeL dt .name02,
.crosstalkThemeLw dt .name01,
.crosstalkThemeLw dt .name02 {
background-color: var(--themeColor);
width: 60px;
height: 24px;
font-size: 1.4rem;
font-weight: 700;
text-align: center;
color: #fff;
line-height: 22px;
}

.crosstalkThemeL dt .name02,
.crosstalkThemeLw dt .name02 {
background-color: #757675;
}

.crosstalkThemeL dd,
.crosstalkThemeLw dd {
padding: 0 0 0 80px;
}

.crosstalkThemeR {
width: 46%;
}

#wrapCrosstalkArea03 {
position: relative;
width: 85%;
margin: 0 auto;
/*padding: 35vh 0;*/
padding: 50px 0;
}

#wrapCrosstalkArea04 {
position: relative;
width: 80%;
margin: 0 auto;
/*padding: 60vh 0;*/
padding: 180px 0;
}

.crosstalkThemePhoto {
position: absolute;
width: 50%;
right: 0;
bottom: 35px;
}

/**/

#dataFacts {
position: absolute;
width: 540px;
right: 0;
top: 94px;
}

#dataFactsTitle {
font-size: 7rem !important;
}

#dataFactsFlex {
position: relative;
width: 1200px;
margin: 60px auto;
margin-bottom: 0;
padding-bottom: 120px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
z-index: 1;
}

.dataFacts {
width: 380px;
margin-bottom: 30px;
}

/**/

#wrapOurWorks01 {
background: url("../img/our_works_bg01.svg") no-repeat;
background-size: 100%;
}

#wrapOurWorks01 #breadcrumb {
color: var(--txtColor);
}

#wrapOurWorks01 #breadcrumb a {
color: var(--txtColor);
}

#wrapOurWorks01 .breadcrumbLine {
background-color: var(--themeColor);
}

#ourWorksTitle {
font-size: 5.8rem !important;
color: var(--themeColor) !important;
}

#wrapOurWorks01 #contentsTitleEn {
color: var(--txtColor);
}

#wrapOurWorks01 #contentsTitleEn::before {
background-color: var(--themeColor);
}

#wrapOurWorks01 p {
font-weight: 400;
}

#ourWorksFlex {
display: flex;
justify-content: space-between;
}

#ourWorksL {
width: 65%;
}

#ourWorksR {
width: 35%;
margin-top: 70px;
margin-right: 60px;
}

.wrapOurWorks {
width: 1200px;
font-size: 1.8rem;
margin: 0 auto;
padding: 150px 0 0;
}

.commonsSubTitleCe,
.commonsSubTitleL,
.commonsSubTitleLw,
.commonsSubTitleS {
position: relative;
background-color: var(--themeColor);
width: 340px;
font-family: var(--font-second);
font-size: 1.8rem;
font-weight: 500;
height: 32px;
text-align: center;
color: #fff;
margin: 0 auto;
margin-bottom: 40px;
border-radius: 100px;
line-height: 29px;
}

.commonsSubTitleL,
.commonsSubTitleLw,
.commonsSubTitleS {
margin: 0 0 40px;
}

.commonsSubTitleLw {
width: 460px;
}

.commonsSubTitleS {
width: 180px;
}

.commonsSubTitleCe::after,
.commonsSubTitleL::after,
.commonsSubTitleLw::after,
.commonsSubTitleS::after {
position: absolute;
font-size: 1.6rem;
font-weight: 700;
color: var(--txtColor);
content: "／";
margin: auto;
left: 0;
right: 0;
bottom: -30px;
}

.commonTitleCe {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
margin-bottom: 30px;
line-height: 1.6;
}

#jobDescriptionFlex {
margin-top: 60px;
display: flex;
justify-content: space-between;
}

.jobDescription {
background: url("../img/our_works_bg02.svg") repeat-y;
background-size: cover;
width: 380px;
font-size: 1.6rem;
text-align: justify;
color: #fff;
}

.jobDescriptionInner h3 {
font-size: 2.4rem;
font-weight: 500;
margin-bottom: 43px;
line-height: 1;
}

.jobDescriptionInner {
background: url("../img/our_works_bg02.svg") repeat-y;
background-size: cover;
padding: 23px;
}

.jobDescriptionInner p {
margin-bottom: 0;
}

#wrapOurWorks02 {
background: url("../img/our_works_bg03.svg") no-repeat;
background-size: 100%;
}

#wrapOurWorksSchedule {
width: 930px;
font-size: 1.8rem;
margin: 0 auto;
padding: 600px 0 0;
}

.scheduleFlex {
margin: 0 auto;
margin-bottom: 20px;
display: flex;
justify-content: space-between;
align-items: center;
}

.scheduleL {
position: relative;
font-family: var(--font-roboto);
width: 215px;
font-size: 4rem;
font-weight: 500;
}

.scheduleL::after {
position: absolute;
background-color: var(--txtColor);
width: 44px;
height: 1px;
content: "";
margin: auto;
right: 0;
top: 0;
bottom: 0;
}

.scheduleR {
background-color: #fff;
width: 700px;
font-size: 1.6rem;
text-align: justify;
padding: 20px 24px;
border: 1px solid var(--txtColor);
overflow: hidden;
line-height: 1.6;
}

.scheduleR h3 {
font-size: 2rem;
color: var(--themeColor);
margin-bottom: 8px;
line-height: 1;
}

.scheduleR p {
margin-bottom: 0;
}

.schedulePhotoR {
float: right;
width: 200px;
margin: 0 0 0 30px;
}

.schedulePhotoL {
float: left;
width: 200px;
margin: 0 30px 0 0;
}

#wrapEducationCareer {
width: 1200px;
font-size: 1.8rem;
text-align: justify;
margin: 0 auto;
padding: 350px 0 100px;
}

#stepWrapFlex {
margin-top: 138px;
display: flex;
justify-content: space-between;
}

.stepWrap {
position: relative;
width: 400px;
font-size: 1.6rem;
padding: 44px 50px;
border-top: 4px solid var(--themeColor);
}

.stepWrap:nth-of-type(2) {
margin-top: -90px;
}

.stepWrap:nth-of-type(3) {
margin-top: -180px;
}

.stepWrap::before {
position: absolute;
background-color: var(--themeColor);
width: 4px;
height: 90px;
content: "";
left: 0;
top: 0;
}

.stepWrap .step {
font-family: var(--font-roboto);
font-size: 3.2rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 30px;
line-height: 1;
}

.stepWrap .step span {
margin-left: 15px;
}

.stepWrap h3 {
font-family: var(--font-second);
font-size: 2.8rem;
font-weight: 500;
margin-bottom: 15px;
line-height: 1.5;
}

/**/

#wrapLifeSupport {
width: 1200px;
text-align: justify;
margin: 150px auto;
margin-bottom: 0;
padding: 60px;
border: 1px solid var(--txtColor);
display: flex;
justify-content: space-between;
}

#lifeSupportL {
width: 530px;
}

#lifeSupportBottom {
background-color: #E6F2EC;
font-size: 2rem;
color: var(--themeColor);
padding: 20px;
}

#lifeSupportR {
width: 510px;
}

#wrapDormitoryFeatures {
width: 1200px;
font-size: 1.8rem;
margin: 0 auto;
padding: 200px 0 0;
}

#dormitoryFeaturesFlex {
margin-top: 60px;
display: flex;
justify-content: space-between;
}

.dormitoryFeaturesLr {
width: 588px;
}

.dormitoryFeaturesWrap {
background-color: #E6F2EC;
font-size: 1.6rem;
text-align: justify;
margin-bottom: 30px;
padding: 40px;
display: flex;
justify-content: space-between;
align-items: center;
}

.dormitoryFeaturesWrap .iconL {
width: 100px;
}

.dormitoryFeaturesWrap .iconR {
width: 384px;
}

.dormitoryFeaturesWrap .iconR h3 {
font-family: var(--font-second);
font-size: 2.8rem;
font-weight: 500;
margin-bottom: 10px;
line-height: 1;
}

.dormitoryFeaturesWrap .iconR p {
margin-bottom: 0;
}

#wrapLifeSupportM {
background: url("../img/life_support_bg.svg") no-repeat top;
background-size: 100%;
width: 100%;
}

#wrapLifeSupport2 {
width: 1200px;
font-size: 1.8rem;
text-align: justify;
margin: 0 auto;
padding: 250px 0 180px;
}

#wrapLifeSupport2 p {
margin-bottom: 40px;
}

#wrapLifeSupportL {
width: 490px;
}

#bicycleWrap {
position: relative;
background: url("../img/life_support_bicycle.png") no-repeat;
background-size: cover;
width: 580px;
font-size: 1.6rem;
height: 240px;
margin-top: -20px;
padding: 70px 70px 30px 90px;
left: -20px;
}

#bicycleWrap h3 {
font-family: var(--font-second);
font-size: 2.4rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 10px;
line-height: 1;
}

#wrapLifeSupport3 {
width: 1200px;
font-size: 1.8rem;
text-align: justify;
margin: 0 auto;
padding: 0 0 200px;
}

#lifeSupport3Flex {
display: flex;
justify-content: space-between;
align-items: center;
}

#lifeSupport3L {
width: 600px;
}

#lifeSupport3R {
width: 600px;
padding: 0 100px;
}

#lifeSupport3R p {
margin-bottom: 0;
}

/**/

#wrapInterviews01 {
background: url("../img/interviews_top_bg01.svg") no-repeat top;
background-size: 100%;
width: 100%;
}

#wrapInterviews01 #breadcrumb {
color: var(--txtColor);
}

#wrapInterviews01 #breadcrumb a {
color: var(--txtColor);
}

#wrapInterviews01 .breadcrumbLine {
background-color: var(--themeColor);
}

#wrapInterviews01 #contentsTitleEn {
color: var(--txtColor);
}

#wrapInterviews01 #contentsTitleEn::before {
background-color: var(--themeColor);
}

#wrapInterviews01 p {
font-weight: 400;
}

#interviewsVoiceFlex {
width: 1200px;
margin: 0 auto;
padding: 280px 0 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

#interviewsVoiceImg {
width: 200px;
}

.interviewsVoice {
position: relative;
width: 360px;
margin-bottom: 60px;
}

.interviewsVoiceTopPhoto {
width: 100%;
height: 440px;
overflow: hidden;
}

.interviewsVoiceTopPhoto img {
width: 100%;
height: 440px;
object-fit: cover;
}

.interviewsVoice h3 {
position: relative;
font-family: var(--font-second);
font-size: 2.8rem;
font-weight: 500;
text-align: justify;
margin: 30px auto;
line-height: 1.5;
}

.quotationmarksT {
position: absolute;
background: url("../img/interviews_img02.png") no-repeat;
background-size: contain;
width: 52px;
height: 48px;
z-index: 1;
left: -10px;
top: 405px;
}

.interviewsVoice h3::after {
position: absolute;
background: url("../img/interviews_img03.png") no-repeat;
background-size: contain;
width: 52px;
height: 48px;
content: "";
z-index: 1;
right: -10px;
bottom: -60px;
}

.interviewsVoiceJoining {
background-color: var(--themeColor);
width: 110px;
height: 30px;
text-align: center;
color: #fff;
line-height: 27px;
}

.interviewsVoiceName {
text-align: left;
margin-top: 20px;
display: flex;
justify-content: space-between;
align-items: center;
}

.interviewsVoiceName span {
font-size: 2.8rem;
font-weight: 500;
width: 210px;
}

.interviewsVoiceArrow {
width: 32px;
}

#wrapInterviews02 {
background: url("../img/interviews_top_bg02.webp") no-repeat top;
background-size: 100%;
width: 100%;
}

#wrapInterviewsCrosstalk {
max-width: 1336px;
width: 100%;
margin: 0 auto;
padding: 300px 0 120px;
display: flex;
justify-content: space-between;
}

#interviewsCrosstalkL {
width: 580px;
font-size: 2rem;
text-align: justify;
color: #fff;
}

#interviewsCrosstalkSubTitle {
position: relative;
font-family: var(--font-second);
font-size: 2.4rem;
font-weight: 500;
color: #fff;
text-align: left;
margin-bottom: 30px;
}

#interviewsCrosstalkSubTitle::before {
position: absolute;
background-color: #fff;
width: 2000px;
height: 1px;
content: "";
margin: auto;
left: -2015px;
top: 0;
bottom: 0;
}

#interviewsCrosstalkL h2 {
font-family: var(--font-second);
font-size: 5.8rem;
font-weight: 500;
margin-bottom: 30px;
letter-spacing: 0;
line-height: 1.5;
}

#interviewsCrosstalkR {
width: 693px;
margin-top: 252px;
}

/**/

#wrapInterviewsCo {
background: url("../img/interviews_bg.svg") no-repeat top;
background-size: 100%;
width: 100%;
}

#wrapInterviewsCo #breadcrumb {
color: var(--txtColor);
}

#wrapInterviewsCo #breadcrumb a {
color: var(--txtColor);
}

#wrapInterviewsCo .breadcrumbLine {
background-color: var(--themeColor);
}

#wrapInterviewsCo #contentsTitleEn {
color: var(--txtColor);
}

#wrapInterviewsCo #contentsTitleEn::before {
background-color: var(--themeColor);
}

#interviewsTitleWrap {
max-width: 1336px;
width: 100%;
margin: 0 auto;
}

#interviewsTitleWrapInner {
width: 1200px;
text-align: justify;
margin: 40px auto;
}

#interviewsCoL {
width: 680px;
}

#interviewsCoTitle {
font-family: var(--font-second);
font-size: 4.8rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 30px;
line-height: 1.6;
}

#interviewsDetail {
position: relative;
background: url("../img/interviews_img04.png") no-repeat;
background-size: contain;
width: 100%;
height: 400px;
padding: 50px 70px 50px 80px;
left: -20px;
line-height: 1.5;
}

#profile {
font-family: var(--font-roboto);
font-size: 1.4rem;
margin-bottom: 5px;
}

.profileFlex {
font-size: 1.8rem;
padding:  10px 0 15px;
display: flex;
justify-content: space-between;
border-bottom: 1px dotted #707070;
align-items: center;
}

.profileL {
width: 50%;
}

.profileR {
width: 50%;
}

.profileL span,
.profileR span {
font-size: 1.6rem;
color: var(--themeColor);
}

#hobby {
font-size: 1.6rem;
color: var(--themeColor);
margin-top: 15px;
margin-bottom: 5px;
}

#interviewsCoR {
position: relative;
width: 440px;
margin-top: -90px;
}

#interviewsCoRPhoto {
width: 100%;
height: 560px;
overflow: hidden;
}

#interviewsCoRPhoto img {
width: 100%;
height: 560px;
object-fit: cover;
}

#interviewsCoJobtype {
position: absolute;
background: url("../img/interviews_img05.png") no-repeat;
background-size: contain;
width: 159px;
height: 47px;
color: #fff;
text-align: center;
line-height: 32px;
z-index: 1;
left: -15px;
top: 540px;
}

#interviewsCoJobtype span {
margin-left: -20px;
}

#interviewsCoName {
font-size: 4.8rem;
font-weight: 500;
margin-top: 20px;
}

#interviewsCoJoining {
font-size: 1.8rem;
font-weight: 500;
color: var(--themeColor);
}

.interviewsQ {
font-family: var(--font-roboto);
font-size: 10rem;
font-weight: 100;
color: var(--themeColor);
}

.interviewsCoWrap {
width: 100%;
text-align: justify;
padding: 200px 0;
line-height: 2;
}

.interviewsCoTitle {
font-family: var(--font-second);
font-size: 3.6rem;
font-weight: 500;
margin-bottom: 80px;
line-height: 1.5;
}

.interviewsCoFlex {
margin: 0 auto;
padding-bottom: 140px;
display: flex;
justify-content: space-between;
align-items: center;
}

#interviewsCoPhoto01 {
width: 700px;
height: 700px;
overflow: hidden;
}

#interviewsCoPhoto01 img {
width: 100%;
height: 700px;
object-fit: cover;
}

#interviewsCoTxt01 {
width: 500px;
padding: 0 120px;
}

#interviewsTitleCe {
position: relative;
text-align: center;
margin: 0 auto;
}

#interviewsTitleL {
margin-top: -40px;
}

#interviewsTitleL h2,
#interviewsTitleR h2 {
margin-top: -20px;
}

#interviewsTitleR {
width: 1200px;
text-align: right;
margin: 0 auto;
}

.interviewsQR {
position: absolute;
font-family: var(--font-roboto);
font-size: 10rem;
font-weight: 100;
color: var(--themeColor);
line-height: 1;
right: 0;
top: -25px;
}

.interviewsCoPhoto02 {
width: 560px;
height: 560px;
overflow: hidden;
}

.interviewsCoPhoto02 img {
width: 100%;
height: 560px;
object-fit: cover;
}

.interviewsCoTxt02 {
width: 640px;
padding: 0 120px;
}

#interviewsWrapBgR {
background: url("../img/interviews_bg_r.svg") no-repeat bottom;
background-size: 100%;
width: 100%;
margin-top: -250px;
}

.interviewsCoFlexB {
width: 1200px;
text-align: justify;
margin: 0 auto;
padding-bottom: 250px;
display: flex;
justify-content: space-between;
align-items: center;
}

#wrapInterviewsBottom {
background-color: #E6F2EC;
width: 100%;
padding-bottom: 100px;
}

#wrapInterviewsBottomInner {
position: relative;
max-width: 1336px;
width: 100%;
margin: 0 auto;
}

#wrapInterviewsBottomInnerInner {
width: 1200px;
text-align: justify;
margin: 0 auto;
}

#contentsTitleEnB {
position: absolute;
font-family: var(--font-roboto);
font-size: 3.2rem;
font-weight: 400;
text-align: left;
top: -100px;
left: 0;
}

#contentsTitleEnB::before {
position: absolute;
background-color: var(--themeColor);
width: 2000px;
height: 1px;
content: "";
margin: auto;
left: -2015px;
top: 0;
bottom: 0;
}

#wrapInterviewsBottomInnerInner h2 {
font-family: var(--font-second);
font-size: 4.8rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 30px;
line-height: 1.6;
}

#interviewsCoLrFlex {
margin: 60px auto;
display: flex;
justify-content: space-between;
}

#interviewsCoLB {
width: 430px;
}

#interviewsCoLBTxtL {
font-size: 2rem;
font-weight: 500;
margin-bottom: 50px;
line-height: 2.2;
}

#interviewsCoRB {
width: 600px;
}

/**/

#wrapNewsTopics {
background: url("../img/news_bg.webp") repeat-y;
background-size: 100%;
width: 100%;
}

#categoryNav {
margin-bottom: 30px;
}

#categoryNav ul {
display: flex;
justify-content: center;
}

#categoryNav ul li a {
background-color: #fff;
width: 140px;
height: 40px;
font-size: 1.8rem;
color: var(--themeColor);
text-align: center;
margin: 0 20px;
display: block;
border: 1px solid var(--themeColor);
line-height: 36px;
}

#categoryNav ul li a:hover,
#categoryNav ul li a.active {
background-color: var(--themeColor);
color: #fff;
}

#wrapNewsTopics .newsFlex {
position: relative;
width: 100%;
padding: 30px 0;
display: block;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #b8c1bd;
}

#wrapNewsTopics .newsFlex:after {
position: absolute;
background: url("../img/btn_arrow_g.svg") no-repeat;
background-size: 29px;
width: 29px;
height: 8px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 5px;
transition: .3s;
}

#wrapNewsTopics .newsFlex:hover:after {
right: 0;
}

#wrapNewsTopics .newsL {
font-family: var(--font-roboto);
width: 240px;
font-size: 2rem;
font-weight: 500;
color: var(--themeColor);
display: flex;
justify-content: flex-start;
align-items: center;
}

#wrapNewsTopics .newsL .categoryTag {
background-color: #fff;
font-family: var(--font-primary);
width: 110px;
height: 30px;
font-size: 1.6rem;
font-weight: 400;
text-align: center;
margin-left: 15px;
border: 1px solid var(--themeColor);
line-height: 26px;
}

#wrapNewsTopics .newsR {
width: 932px;
font-size: 2.2rem;
padding-right: 60px;
}

/**/

.pageNavi {
font-family: var(--font-kodchasan);
margin: 0 auto;
margin-top: 60px;
}

.wp-pagenavi {
position: relative;
font-family: var(--font-roboto);
font-size: 2rem;
font-weight: 500;
text-align: center;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
line-height: 42px;
}

.wp-pagenavi .pages {
display: none;
}

.wp-pagenavi .page {
margin: 0 3px;
}

.wp-pagenavi .current {
background-color: var(--themeColor);
width: 42px;
height: 42px;
color: #fff;
margin: 0 7px;
display: block;
border: 1px solid var(--txtColor) !important;
}

.wp-pagenavi a,
.wp-pagenavi .extend {
width: 42px;
height: 42px;
color: var(--themeColor);
display: block;
border: 1px solid var(--themeColor) !important;
}
.wp-pagenavi .first,
.wp-pagenavi .last {
display: none;
}

.wp-pagenavi a:hover {
background-color: var(--themeColor);
color: #fff;
border: 1px solid var(--txtColor) !important;
}

.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
position: relative;
background: #fff url("../img/btn_arrow_p.svg") no-repeat center;
background-size: 21px;
width: 32px;
height: 32px;
font-size: 0;
text-indent: -1000px;
margin: 0 7px;
border: 0 !important;
}

.wp-pagenavi .nextpostslink {
background: #fff url("../img/btn_arrow_g.svg") no-repeat center;
background-size: 21px;
}

.wp-pagenavi a:hover.previouspostslink,
.wp-pagenavi a:hover.nextpostslink {
background-color: #fff;
}

/**/

#wrapTitleNo {
position: relative;
width: 100%;
margin-top: 94px;
}

#postDate {
font-family: var(--font-roboto);
font-size: 2rem;
font-weight: 500;
color: var(--themeColor);
margin-bottom: 30px;
display: flex;
justify-content: flex-start;
align-items: center;
}

#postDate .categoryTag {
background-color: #fff;
font-family: var(--font-primary);
width: 110px;
height: 30px;
font-size: 1.6rem;
font-weight: 400;
text-align: center;
margin-left: 15px;
border: 1px solid var(--themeColor);
line-height: 26px;
}

#postTitle {
font-size: 3.2rem;
margin-bottom: 50px;
padding-bottom: 40px;
border-bottom: 1px solid #b7b7b7;
line-height: 1.5;
}

#wrapPost {
width: 900px;
margin: 0 auto;
}

#wrapPost h2 {
position: relative;
font-size: 2.2rem;
margin-bottom: 32px;
padding-left: 27px;
}

#wrapPost h2::before {
position: absolute;
background-color: var(--themeColor);
width: 16px;
height: 1px;
content: "";
margin: auto;
left: 0;
top: 0;
bottom: 0;
}

#wrapPost img {
margin-bottom: 40px;
}

#wrapBtnBack {
text-align: center;
margin: 0 auto;
margin-top: 80px;
}

.btnBack {
position: relative;
background-color: var(--themeColor);
width: 360px;
height: 80px;
font-size: 1.8rem;
color: #fff;
padding-bottom: 3px;
cursor: pointer;
border-radius: 10px;
border: 1px solid var(--txtColor);
z-index: 2;
transition: .3s;
}

.btnBack::after {
position: absolute;
background: url("../img/btn_arrow_back.svg") no-repeat;
background-size: 42px;
width: 42px;
height: 13px;
content: "";
margin: auto;
top: 0;
bottom: 0;
left: 15px;
}

.btnBack:hover {
background-color: #fff;
color: var(--themeColor);
}

.btnBack:hover::after {
background: url("../img/btn_arrow_back_h.svg") no-repeat;
background-size: 42px;
}

/**/

#bottomContactWrap {
background: var(--themeColor) url("../img/bottom_contact_bg.svg") no-repeat center;
background-size: cover;
width: 100%;
font-size: 2rem;
color: #fff;
padding: 100px 0 120px;
}

#bottomContactWrap h2 {
font-family: var(--font-roboto);
font-size: 2.4rem;
font-weight: 500;
margin-bottom: 10px;
}

#bottomContactWrap h2 span {
font-family: var(--font-second);
font-size: 4.8rem;
display: block;
}

#bottomContactFlex {
width: 1200px;
font-size: 2.4rem;
margin: 0 auto;
margin-top: 40px;
display: flex;
justify-content: space-between;
}

#bottomContactFlex h3 {
margin-bottom: 25px;
}

#bottomContactCall {
background: url("../img/bottom_contact_bg01.svg") no-repeat center;
background-size: cover;
width: 580px;
padding: 50px 0 60px;
}

#bottomContactCall p {
font-family: var(--font-roboto);
font-size: 5.6rem;
display: flex;
justify-content: center;
align-items: center;
align-content: center;
line-height: 1;
}

#bottomContactCall p a {
color: #fff;
margin-left: 20px;
}

#bottomContactCallTxt {
background-color: #fff;
width: 280px;
height: 32px;
font-size: 1.6rem;
font-weight: 400;
color: var(--txtColor);
margin: 0 auto;
border-radius: 100px;
line-height: 30px;
}

#bottomContactWeb {
background: url("../img/bottom_contact_bg02.svg") no-repeat center;
background-size: cover;
width: 580px;
padding: 50px 0 60px;
}

.btnS {
position: relative;
font-family: var(--font-primary);
background-color: #fff;
width: 280px;
height: 32px;
font-size: 1.6rem;
color: var(--txtColor);
padding-bottom: 3px;
cursor: pointer;
border-radius: 100px;
border: 1px solid #fff;
z-index: 2;
transition: .3s;
}

.btnS::after {
position: absolute;
background: url("../img/btn_arrow_g.svg") no-repeat;
background-size: 21px;
width: 21px;
height: 7px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 10px;
}

.btnS:hover {
background-color: var(--themeColor);
color: #fff;
}

.btnS:hover::after {
background: url("../img/btn_arrow_w.svg") no-repeat;
background-size: 21px;
}

/**/

#bottomRecruitWrap {
position: relative;
background: url("../img/footer_recruit_bg.webp") no-repeat center;
background-size: cover;
width: 100%;
height: 450px;
overflow: hidden;
padding: 100px 0;
}

#bottomRecruitWrap::after {
position: absolute;
background: rgb(32,43,39,.52);
width: 100vw;
height: 100vh;
content: "";
left: 0;
top: 0;
z-index: 1;
}

#bottomRecruitWrap h2 {
position: relative;
font-family: var(--font-second);
font-size: 5.8rem;
font-weight: 500;
color: #fff;
margin-bottom: 30px;
z-index: 2;
}

.btnW {
position: relative;
font-family: var(--font-primary);
background-color: #fff;
width: 360px;
height: 80px;
font-size: 1.8rem;
color: var(--txtColor);
padding-bottom: 3px;
cursor: pointer;
border-radius: 10px;
border: 1px solid var(--txtColor);
z-index: 2;
transition: .3s;
}

.btnW::after {
position: absolute;
background: url("../img/btn_arrow_g.svg") no-repeat;
background-size: 42px;
width: 42px;
height: 13px;
content: "";
margin: auto;
top: 0;
bottom: 0;
right: 15px;
}

.btnW:hover {
background-color: var(--themeColor);
color: #fff;
}

.btnW:hover::after {
background: url("../img/btn_arrow_w.svg") no-repeat;
background-size: 42px;
}

/**/

#wrapManga {
width: 800px;
margin: 0 auto;
margin-top: -380px;
margin-bottom: 120px;
border: 1px solid #eee;
}

/**/

#contactCall {
background-color: #e6f2ec;
width: 100%;
margin: 120px auto;
margin-bottom: 0;
padding: 40px;
display: flex;
justify-content: space-between;
align-items: center;
}

#contactCallL {
width: 46%;
font-size: 2rem;
font-weight: 500;
text-align: center;
}

#contactCallL h2 {
background: url("../img/icon_call.svg") no-repeat left;
background-size: 30px;
font-family: var(--font-second);
font-size: 3.9rem;
margin-bottom: 10px;
padding-left: 6px;
}

#contactCallL p {
margin-bottom: 20px;
}

#contactCallR {
background-color: #fff;
font-family: var(--font-roboto);
width: 580px;
height: 240px;
font-size: 5.6rem;
text-align: center;
padding: 70px 0;
line-height: 1;
}

#contactCallTxt {
background-color: var(--themeColor);
width: 280px;
height: 32px;
font-size: 1.6rem;
font-weight: 400;
color: #fff;
margin: 0 auto;
margin-top: 15px;
border-radius: 100px;
line-height: 32px;
}

#wrapContact {
background: url("../img/contact_bg.svg") repeat-y;
background-size: 100%;
font-size: 1.8rem;
}

.wrapContact {
background-color: #fff;
width: 100%;
font-size: 1.6rem;
margin-top: 60px;
padding: 80px 80px 100px;
}

#wrapContact h3 {
width: 100%;
margin-bottom: 10px;
}

.required {
position: relative;
background-color: var(--themeColor);
width: 42px;
height: 21px;
font-size: 1.4rem;
text-align: center;
color: #fff;
margin-left: 10px;
display: inline-block;
border: 1px solid var(--txtColor);
line-height: 18px;
top:-1px;
}

.radioGroup {
margin-bottom: 30px;
}

.inputGroup {
width: 100%;
margin-bottom: 30px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.inputSolo {
margin-bottom: 30px;
}

.radioArea input[type=radio] {
position: absolute;
appearance: none;
}

.radioArea label {
cursor: pointer;
background-color: #fff;
width: 512px;
height: 56px;
text-align: center;
color: var(--txtColor);
margin-bottom: 10px;
display: block;
border: 1px solid #b7b7b7;
border-radius: 8px;
transition: .3s;
line-height: 52px;
}

.radioArea input[type=radio]:checked+label {
background-color: #e6f2ec;
border: 1px solid var(--themeColor);
}

.radioWrap {
width: 100%;
margin-bottom: 30px;
}

.radioWrap label {
cursor: pointer;
margin-left: -17px;
margin-right: 20px;
}

.radioWrap input[type="radio"]::before {
background-color: var(--themeColor);
border-radius: 50%;
bottom: 0;
content: "";
height: 14px;
left: 0;
margin: auto;
opacity: 0;
position: absolute;
right: 0;
top: 0;
width: 14px;
}

.radioWrap input[type="radio"]:checked::before {
opacity: 1;
}

.radioWrap input[type="radio"] {
appearance: none;
border: 1px solid #b7b7b7;
border-radius: 50%;
height: 20px;
left: 0;
top: 4px;
margin: 0;
position: relative;
width: 20px;
}

.inputArea {
width: 512px;
}

.input {
background-color: #fff;
width: 100%;
height: 56px;
font-size: 1.6rem;
padding: 0 15px;
border: 1px solid #b7b7b7;
border-radius: 8px;
line-height: 52px;
}

textarea {
background-color: #fff;
width: 100%;
height: 280px;
font-size: 1.6rem;
padding: 15px;
border: 1px solid #b7b7b7;
border-radius: 8px;
}

.checkWrap {
position: relative;
text-align: left;
left: -15px;
}

.checkWrap a {
text-decoration: underline;
}

.checkWrap label {
position: relative;
display: flex;
align-items: center;
cursor: pointer;
}

.checkWrap input[type="checkbox"] {
margin: 0;
padding: 0;
background: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
display: flex;
flex-wrap: wrap;
border: none;
}

.checkWrap label::before,
.checkWrap label:has(:checked)::after {
content: '';
}

.checkWrap label::before {
position: relative;
background-color: #fff;
width: 20px;
height: 20px;
margin-right: 8px;
border: 1px solid #b7b7b7;
border-radius: 3px;
top: 1px;
}

.checkWrap label:has(:checked)::before {
background-color: #fff;
}

.checkWrap label:has(:checked)::after {
position: absolute;
top: 6px;
left: 6px;
transform: rotate(45deg);
width: 8px;
height: 12px;
border: solid var(--txtColor);
border-width: 0 2px 2px 0;
}

#wrapSubmit {
margin: 0 auto;
margin-top: 40px;
text-align: center;
}

/**/

#wrapPrivacy {
width: 1200px;
text-align: justify;
margin: 60px auto;
margin-bottom: 200px;
padding-left: 300px;
border-left: 1px solid var(--themeColor);
}

#wrapPrivacy h2 {
font-family: var(--font-primary);
font-size: 2.2rem;
font-weight: 500;
margin-bottom: 20px;
line-height: 1;
}

#wrapPrivacy h2 span {
position: relative;
font-family: var(--font-roboto);
font-size: 2.8rem;
color: var(--themeColor);
top: 2px;
}

.privacyLine {
margin: 50px auto;
border-bottom: 1px dotted #b7b7b7;
}

#wrapPrivacy ul {
margin-bottom: 36px;
list-style: disc;
margin-left: 20px;
}

#bottomLine {
max-width: 1336px;
width: 100%;
margin: 0 auto;
border-bottom: 1px solid  #b7b7b7;
}

/**/

footer {
position: relative;
width: 100%;
text-align: left;
padding: 60px 30px;
}

#footerLrFlex {
display: flex;
justify-content: space-between;
}

#footerWrap {
max-width: 1336px;
width: 100%;
margin: 0 auto;
}

#footerL {
width: 446px;
text-align: justify;
}

#footerL p {
margin-bottom: 50px;
}

#footerLogo {
width: 446px;
margin-bottom: 30px;
}

#footerAddress {
font-size: 1.4rem;
}

#footerCall {
font-family: var(--font-roboto);
font-size: 2.4rem;
color: var(--themeColor);
margin-top: 5px;
}

#footerCall span {
font-size: 4rem;
}

#copyright {
font-size: 1.3rem;
margin-top: 30px;
}

#footerR {
max-width: 687px;
width: 100%;
font-size: 1.4rem;
display: flex;
justify-content: flex-end;
}

#footerR nav {
margin-left: 100px;
line-height: 3em;
}

#footerR nav:first-child {
margin-left: 0;
}

#footerR nav h3 {
font-size: 2.2rem;
font-weight: 600;
}

#footerR nav h3 a {
color: var(--themeColor);
}

#footerR nav ul li {
position: relative;
padding-left: 20px;
}

#footerR nav ul li::before {
position: absolute;
background-color: var(--themeColor);
width: 12px;
height: 1px;
content: "";
margin: auto;
top: 0;
bottom: 0;
left: 0;
}

}