@charset "utf-8";
/* 下層専用css */

/*==================================
	common
==================================*/
#contents #fv { padding-top: 150px;}
#contents #fv .outer { height: 580px; position: relative;}
#contents #fv .en:before { margin: 10px 4px 0 0; content: ""; height: 80px; width: 1px; background: #cb1818; display: inline-block;}
#contents #fv .en { font-size: 1.4rem; right: 26px; top: -10px; font-weight: 400; color: #cb1818; writing-mode: sideways-lr; position: absolute;}
#contents #fv .txt { font-size: 2.2rem; left: calc(50% + 150px); top: 100px; font-weight: 700; color: #cb1818; position: absolute;}
#contents #fv .txt span { padding: 5px 10px; background: #fff; display: inline-block; margin-bottom: 5px;}
#contents #fv .pageTit { font-size: 6rem; font-weight: 700; padding: 15px 5%; background: #fff; display: inline-block; position: absolute; left: 0; bottom: 0; border-radius: 0 15px 0 0;}
#contents #fv .pageTit::before,#contents #fv .pageTit::after { content: ""; background: url("/lib/img/fv_corner.png") no-repeat; background-size: 100% auto; width: 12px; height: 12px; position: absolute;}
#contents #fv .pageTit::before { left: 0; top: -12px;}
#contents #fv .pageTit::after { right: -12px; bottom: 0;}
#contents #fv .pageTit span.subTxt { position: absolute; top: -55px; left: 46px; display: inline-block}
#contents #fv .pageTit span.subTxt img { height: 100%; width: auto;}
@media screen and (max-width: 1400px) {
#contents #fv .outer { height: 42.2vw; width: 97%;}
}
@media screen and (max-width: 1400px) {
#contents #fv .pageTit { font-size: 4vw;}
#contents #fv .pageTit span.subTxt { top: -39%; left: 3vw; height: 38px;}
#contents #fv .txt { font-size: 1.5vw; left: calc(50% + 12vw); top: 7vw;}
}
@media screen and (max-width: 1149px) {
#contents #fv { padding-top: 100px;}
#contents #fv .pageTit span.subTxt { top: -37%; left: 3vw; height: 36px;}
}
@media screen and (max-width: 899px) {
#contents #fv .outer { width: 95.73%; height: 76vw;}
#contents #fv .en { right: 15px; top: -10px;}
#contents #fv .txt { font-size: 3vw; left: calc(50% - 10vw); top: 7vw;}
#contents #fv .pageTit { font-size: 2.9rem;}
/* #contents #fv .pageTit span.subTxt { top: -31%; left: 3vw; width: 15vw;} */
}
@media screen and (max-width: 749px) {
#contents #fv .en { font-size: 1.1rem;}
#contents #fv .txt { font-size: 2.5vw;}
#contents #fv .pageTit span.subTxt { top: -30%; left: 2.1vw; height: 30px;}
}


@keyframes loop-slide {
  from { transform: translateX(0);} to { transform: translateX(-100%);}
}



/*==================================
	recruitinfo
==================================*/
/* common */
#recruitinfo #contents .secTit {}
#recruitinfo #contents .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#recruitinfo #contents .secTit .en { font-size: 1.5rem; color: #cb1818;}
@media screen and (max-width: 899px) {
#recruitinfo #contents .secTit .jp { font-size: 2.8rem;;}
#recruitinfo #contents .secTit .en { font-size: 1.3rem;;}
}

/* fv */
#recruitinfo #contents #fv {}
#recruitinfo #contents #fv .outer { background: url("/lib/img/recruitinfo/fv.png") no-repeat; background-size: 100% auto;}
@media screen and (max-width: 899px) {
#recruitinfo #contents #fv .outer { background: url("/lib/img/recruitinfo/fv_sp.png") no-repeat; background-size: 100% auto;}
}

/* portrait */
#recruitinfo #portrait { margin-top: 130px;}
#recruitinfo #portrait .box { padding: 0 0 0 80px; display: flex; align-items: center; flex-wrap: wrap;}
#recruitinfo #portrait .box .txtArea { margin-right: 70px;}
#recruitinfo #portrait .box .txtArea .secTit {}
#recruitinfo #portrait .box .txtArea .secTit .en {}
#recruitinfo #portrait .box .txtArea .secTit .jp {}
#recruitinfo #portrait .box .txtArea .txt { margin-top: 50px; line-height: 2;}
#recruitinfo #portrait .box img { width: 350px;}
#recruitinfo #portrait .list { margin: 60px auto; max-width: 960px;}
#recruitinfo #portrait .list li { padding: 40px 80px; background: #f8f8f8; border: solid 1px #e9e9e9; border-radius: 8px; position: relative;}
#recruitinfo #portrait .list li:before { left: -10px; width: 68px; height: 34px; position: absolute; content: "";}
#recruitinfo #portrait .list li .tit { font-size: 2.4rem; font-weight: 700; color: #cb1818;}
#recruitinfo #portrait .list li .txt { margin-top: 10px;}
#recruitinfo #portrait .list li:nth-child(2),
#recruitinfo #portrait .list li:nth-child(3) { margin-top: 8px;}
#recruitinfo #portrait .list li:nth-child(1):before { background: url("/lib/img/recruitinfo/portrait_num01.png") no-repeat; background-size: cover;}
#recruitinfo #portrait .list li:nth-child(2):before { background: url("/lib/img/recruitinfo/portrait_num02.png") no-repeat; background-size: cover;}
#recruitinfo #portrait .list li:nth-child(3):before { background: url("/lib/img/recruitinfo/portrait_num03.png") no-repeat; background-size: cover;}
#recruitinfo #portrait .messageSlider { display: flex;  align-items: center; overflow: hidden; height: 10vw;}
#recruitinfo #portrait .messageSlider .slideshow { display: flex; animation: loop-slide 40s infinite linear 1s both;}
#recruitinfo #portrait .messageSlider li { width: 90vw; height: 10vw;}
#recruitinfo #portrait .messageSlider li img { width: 100%;}
@media screen and (max-width: 1099px) {
#recruitinfo #portrait .box { padding: 0 80px; display: block; text-align: center;}
#recruitinfo #portrait .box .txtArea { text-align: left;}
#recruitinfo #portrait .box img { margin: 40px auto 0 auto;}
}
@media screen and (min-width: 900px) {
#recruitinfo #portrait .messageSlider { height: 82px;}
#recruitinfo #portrait .messageSlider li { width: 839px; height: 82px;}
}
@media screen and (max-width: 899px) {
#recruitinfo #portrait { margin-top: 70px;}
#recruitinfo #portrait .box { padding: 0;}
#recruitinfo #portrait .box .txtArea { margin-right: 0;}
#recruitinfo #portrait .box .txtArea .txt { margin-top: 25px;}
#recruitinfo #portrait .box img { max-width: 80%;}
#recruitinfo #portrait .list { margin: 30px auto;}
#recruitinfo #portrait .list li { padding: 30px;}
#recruitinfo #portrait .list li:before { left: 15px; top: -10px; width: 50px; height: 25px;}
#recruitinfo #portrait .list li:nth-child(2),
#recruitinfo #portrait .list li:nth-child(3) { margin-top: 15px;}
#recruitinfo #portrait .list li .tit { font-size: 2.2rem;}
#recruitinfo #portrait .list li .txt { margin-top: 5px;}
}


/* flow */
#recruitinfo #flow { margin-top: 70px; padding: 130px 0 150px 0; background: url("/lib/img/recruitinfo/flow_bg.gif");}
#recruitinfo #flow:before { width: 1440px; height: 455px; position: absolute; right: 0; bottom: 0; content: ""; background: url("/lib/img/recruitinfo/flow_bg.png") right bottom no-repeat;}
#recruitinfo #flow .inner { position: relative; z-index: 1;}
#recruitinfo #flow .secTit { text-align: center;}
#recruitinfo #flow .list { margin-top: 70px;}
#recruitinfo #flow .list li { font-size: 2rem; background: #fff; border-radius: 8px; position: relative;}
#recruitinfo #flow .list li:before { top: 138px; left: -48px; width: 61px; height: 1px; background: #cb1818;}
#recruitinfo #flow .list li:before,
#recruitinfo #flow .list li .box:before,
#recruitinfo #flow .list li .box:after { content: ""; position: absolute;}
#recruitinfo #flow .list li .box:before { top: 135px; left: 30px; width: 7px; height: 7px; border-radius: 7px; background: #cb1818; z-index: 1;}
#recruitinfo #flow .list li .box:after { top: 130px; left: 25px; width: 17px; height: 17px; border-radius: 17px; background: #fae7e7;}
#recruitinfo #flow .list li:first-child:before,
#recruitinfo #flow .list li:first-child .box:before,
#recruitinfo #flow .list li:first-child .box:after { display: none;}
#recruitinfo #flow .list li:nth-child(1) .box img { width: 54px;}
#recruitinfo #flow .list li:nth-child(2) .box img { width: 70px;}
#recruitinfo #flow .list li:nth-child(3) .box img { width: 66px;}
#recruitinfo #flow .list li:nth-child(4) .box img { width: 58px;}
#recruitinfo #flow .notes { font-size: 1.4rem; margin-top: 15px;}
@media screen and (min-width: 1100px) {
#recruitinfo #flow .list { display: flex; justify-content: space-between;}
#recruitinfo #flow .list li { width: 23.63%; min-height: 300px; display: flex; align-items: center; justify-content: center;}
#recruitinfo #flow .list li .box { text-align: center;}
#recruitinfo #flow .list li .box span { margin-top: 20px; display: block;}
}
@media screen and (max-width: 1099px) {
#recruitinfo #flow .list li { margin-top: 15px; padding: 40px 40px 40px 90px;}
#recruitinfo #flow .list li:before { top: -30px; left: 0; right: 0; margin: auto; width: 1px; height: 40px;}
#recruitinfo #flow .list li .box:before { top: 15px; left: 0; right: 0; margin: auto; width: 6px; height: 6px; border-radius: 6px;}
#recruitinfo #flow .list li .box:after { top: 11px; left: 0; right: 0; margin: auto; width: 14px; height: 14px; border-radius: 14px;}
#recruitinfo #flow .list li img { position: absolute;}
#recruitinfo #flow .list li:nth-child(1) .box img { left: 20px; width: 50px;}
#recruitinfo #flow .list li:nth-child(2) .box img { left: 20px; width: 54px;}
#recruitinfo #flow .list li:nth-child(3) .box img { left: 24px; width: 50px;}
#recruitinfo #flow .list li:nth-child(4) .box img { left: 24px; width: 44px;}
#recruitinfo #flow .list li .box { display: flex; align-items: center;}
#recruitinfo #flow .list li .box .pcOnly { display: none;}
}
@media screen and (max-width: 899px) {
#recruitinfo #flow { margin-top: 35px; padding: 65px 0 75px 0;}
#recruitinfo #flow:before { width: 100%; height: 30vw; background-size: 100% auto;}
#recruitinfo #flow .list { margin-top: 35px;}
#recruitinfo #flow .list li { font-size: 1.5rem;}
#recruitinfo #flow .notes { font-size: 1rem; margin-top: 10px;}
}

/* description */
#recruitinfo #description { padding: 140px 0 200px 0;}
#recruitinfo #description .secTit { text-align: center;}
#recruitinfo #description .list {}
#recruitinfo #description .list dt.ac { font-size: 3rem; padding: 20px; margin-top: 50px; border-bottom: solid 2px #cb1818;}
#recruitinfo #description .list dd.ac .detail { display: flex; flex-wrap: wrap;}
#recruitinfo #description .list dd.ac .detail dt { width: 28%; font-size: 2rem; padding: 50px 30px; border-bottom: solid 1px #e6e6e6;}
#recruitinfo #description .list dd.ac .detail dd { width: 72%; padding: 50px 30px; line-height: 1.8; border-bottom: solid 1px #e6e6e6;}
#recruitinfo #description .list dd.ac .detail dd .min { margin-top: 5px; font-size: 1.2rem;}
#recruitinfo #description .list dd.ac .detail dd .mt { margin-top: 20px;}
@media screen and (min-width: 900px) {
}
@media screen and (max-width: 899px) {
#recruitinfo #description { padding: 70px 0 100px 0;}
#recruitinfo #description .list dt.ac { font-size: 2.2rem;}
#recruitinfo #description .list dd.ac .detail { display: block;}
#recruitinfo #description .list dd.ac .detail dt { width: 100%; font-size: 1.6rem; padding: 25px 15px 0 15px; border-bottom: none;}
#recruitinfo #description .list dd.ac .detail dd { width: 100%; font-size: 1.4rem; padding: 25px 15px;}
#recruitinfo #description .list dd.ac .detail dd .min { font-size: 1rem;}
}

/* accordion */
.accordion dt.ac { cursor: pointer; background:url(../img/accordion_icon_off.png) no-repeat right 22px center; background-size: auto 41px; margin-top: 20px; text-align: left;margin-bottom: 0;display: flex;justify-content: flex-start;align-items: center;}
.accordion dt.ac.open { background:url(../img/accordion_icon.png) no-repeat right 22px center; background-size:auto 41px;}
.accordion dd.ac { padding: 0; display:none;text-align: left; line-height: 160%; margin-left: 0;}



/*==================================
	about
==================================*/
/* fv */
#about #contents #fv {}
#about #contents #fv .outer { background: url("/lib/img/about/fv.png") no-repeat; background-size: 100% auto;}
@media screen and (max-width: 899px) {
#about #contents #fv .outer { background: url("/lib/img/about/fv_sp.png") no-repeat; background-size: 100% auto;}
}

/* common */
#about #contents .secTit { padding-top: 40px; position: relative; z-index: 1;}
#about #contents .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#about #contents .secTit .en { font-size: 1.5rem; margin-top: 20px; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
#about #contents .nomaltxt { margin-top: 50px; line-height: 2; position: relative; z-index: 1;}
@media screen and (max-width: 899px) {
#about #contents .secTit { padding-top: 0;}
#about #contents .secTit .jp { font-size: 2.8rem;}
#about #contents .secTit .en { font-size: 1.3rem; margin-top: 10px;}
#about #contents .nomaltxt { margin-top: 25px;}
}

/* philosophy */
#about #contents #philosophy { padding: 60px 0 180px 0; text-align: center;}
#about #contents #philosophy .graphArea { min-height: 480px; margin-top: 60px; position: relative; overflow: hidden;}
#about #contents #philosophy .graphArea:before { background: #f8f8f8; border-radius: 15px; max-width: 1100px; width: 90%; height: 480px; display: inline-block; content: ""; position: absolute; top: 0; left: 0; right: 0; margin: auto;}
#about #contents #philosophy .graphArea .graph { padding-top: 70px; position: relative; z-index: 5;}
#about #contents #philosophy .graphArea .graph img { max-width: 85%;}
#about #contents #philosophy .philosophySlider { position: absolute; top: 160px; display: flex;  align-items: center; overflow: hidden; height: 10vw;}
#about #contents #philosophy .philosophySlider .slideshow { display: flex; animation: loop-slide 40s infinite linear 1s both;}
#about #contents #philosophy .philosophySlider li { width: 90vw; height: 10vw;}
#about #contents #philosophy .philosophySlider li img { width: 100%;}
#about #contents #philosophy .boxList { margin-top: 50px;}
#about #contents #philosophy .boxList .box { padding: 80px 0; text-align: left; border-bottom: solid 1px #e9e9e9;}
#about #contents #philosophy .boxList .box:nth-last-of-type(1) { border-bottom: 0;}
#about #contents #philosophy .boxList .box .titBox { color: #cb1818; font-weight: 700;}
#about #contents #philosophy .boxList .box .titBox .en { font-size: 5.6rem; font-weight: 400; line-height: 1; display: block;}
#about #contents #philosophy .boxList .box .txtBox .tit { font-size: 3.8rem; font-weight: 700; color: #cb1818;}
#about #contents #philosophy .boxList .box .txtBox .txt { font-size: 1.8rem; margin-top: 20px; line-height: 1.8;}
#about #contents #philosophy .boxList .box .txtBox .list { margin-top: 40px; padding: 20px; display: flex; align-items: center; background: #fafafa; color: #626262;}
#about #contents #philosophy .boxList .box .txtBox .list dt { width: 180px; font-size: 1.7rem; text-align: center;}
#about #contents #philosophy .boxList .box .txtBox .list dd { width: calc( 100% - 180px); padding: 10px 0 10px 30px; border-left: solid 1px #e9e9e9;}
#about #contents #philosophy .boxList .box .txtBox .list dd p { margin-bottom: 5px; text-indent: -13px; margin-left: 13px;}
#about #contents #philosophy .boxList .box .txtBox .list dd p:nth-last-of-type(1) { margin-bottom: 0;}
#about #contents #philosophy .boxList .box .txtBox .list dd p:before { content: "・"; margin-right: 5px;}
@media screen and (min-width: 900px) {
#about #contents #philosophy .boxList .box { display: flex; align-items: center;}
#about #contents #philosophy .boxList .box .titBox { width: 330px;}
#about #contents #philosophy .boxList .box .txtBox { width: calc( 100% - 330px);}
#about #contents #philosophy .philosophySlider { height: 100px;}
#about #contents #philosophy .philosophySlider li { width: 1010px; height: 100px;}
}
@media screen and (max-width: 899px) {
#about #contents #philosophy { padding: 50px 0 80px 0;}
#about #contents #philosophy .boxList { margin-top: 25px;}
#about #contents #philosophy .boxList .box { padding: 40px 0;}
#about #contents #philosophy .boxList .box .titBox { font-size: 1.3rem;}
#about #contents #philosophy .boxList .box .titBox .en { font-size: 4.2rem; margin-right: 10px;}
#about #contents #philosophy .boxList .box .txtBox { margin-top: 25px;}
#about #contents #philosophy .boxList .box .txtBox .tit { font-size: 2.4rem;}
#about #contents #philosophy .boxList .box .txtBox .txt { font-size: 1.5rem; margin-top: 15px;}
#about #contents #philosophy .boxList .box .txtBox .list { margin-top: 20px; display: block;}
#about #contents #philosophy .boxList .box .txtBox .list dt { width: 100%; padding-bottom: 10px; border-bottom: solid 1px #e9e9e9; font-size: 1.5rem;}
#about #contents #philosophy .boxList .box .txtBox .list dd { width: 100%; padding: 10px 0 0 0; border-left: 0;}
#about #contents #philosophy .graphArea { min-height: 52vw; margin-top: 30px;}
#about #contents #philosophy .graphArea:before { height: 52vw;}
#about #contents #philosophy .graphArea .graph { padding-top: 5vw;}
#about #contents #philosophy .philosophySlider { top: 20vw;}
}

/* message */
#about #contents #message { padding: 130px 0; text-align: center; background: url("/lib/img/about/message_bg.jpg") bottom center no-repeat; background-size: cover;}
#about #contents #message .secTit,
#about #contents #message .secTit .en,
#about #contents #message .box,
#about #contents #message .box a { color: #fff;}
#about #contents #message .box { margin-top: 90px; text-align: left; position: relative;}
#about #contents #message .box .imgBox { width: 460px; position: absolute; right: 0;}
#about #contents #message .box .imgBox img { width: 100%;}
#about #contents #message .box .txtBox { width: calc( 100% - 550px);}
#about #contents #message .box .txtBox .tit { font-size: 3.6rem;}
#about #contents #message .box .txtBox .tit .en { font-size: 4rem; font-weight: 400;}
#about #contents #message .box .txtBox .set { margin: 40px 0 70px 0; position: relative;}
#about #contents #message .box .txtBox .set .name .big { font-size: 2.8rem;}
#about #contents #message .box .txtBox .set .link { position: absolute; right: 0; bottom: 0;}
#about #contents #message .box .txtBox .set .link a { margin: 10px auto 0 auto; display: inline-block; border-bottom: solid 1px #fff; cursor: pointer;}
#about #contents #message .box .txtBox .set .link .en { font-size: 1.8rem; padding-left: 15px; background: url("/lib/img/icon_arr_mov.svg") left center no-repeat; background-size: 7px 7px; font-weight: 400;}
#about #contents #message .box .txtBox .txtArea {}
#about #contents #message .box .txtBox .txtArea p { margin-top: 40px; line-height: 2.2;}
#about #contents #message .box .txtBox .txtArea p:nth-of-type(1) { margin-top: 0;}
#about #contents #message .box .txtBox2 { font-size: 2rem; margin-top: 100px; text-align: center; line-height: 2;}
#about #contents #message .box .txtBox2 .big { font-size: 2.6rem;}
@media screen and (min-width: 11400px) {
#about #contents #message .box .txtBox { min-height: 960px;}
}
@media screen and (max-width: 1139px) {
#about #contents #message .box .imgBox { width: 38vw;}
#about #contents #message .box .txtBox { width: 42vw;}
#about #contents #message .box .txtBox .set .link { position: inherit;}
}
@media screen and (max-width: 899px) {
#about #contents #message { padding: 70px 0;}
#about #contents #message .box .pcOnly { display: none;}
#about #contents #message .box .spOnly { display: block;}
#about #contents #message .box { margin-top: 20px;}
#about #contents #message .box .imgBox { position: inherit; width: 75%; margin: 0 auto;}
#about #contents #message .box .txtBox { width: 100%;}
#about #contents #message .box .txtBox .tit { font-size: 2.1rem; margin-top: 40px; text-align: center;}
#about #contents #message .box .txtBox .tit .en { font-size: 2.4rem;}
#about #contents #message .box .txtBox .set { margin: 20px 0 30px 0;}
#about #contents #message .box .txtBox .set .name .big { font-size: 2rem;}
#about #contents #message .box .txtBox .set { text-align: center;}
#about #contents #message .box .txtBox .set .link .en { font-size: 1.7rem;}
#about #contents #message .box .txtBox .txtArea p { font-size: 1.5rem; margin-top: 30px;}
#about #contents #message .box .txtBox .txtArea p:nth-of-type(1) { margin-top: 0;}
#about #contents #message .box .txtBox2 { font-size: 1.7rem; margin-top: 30px; text-align: left;}
#about #contents #message .box .txtBox2 .big { font-size: 1.7rem;}
}

/* company */
#about #contents #company { padding: 150px 0 170px 0;}
#about #contents #company .secTit { text-align: center;}
#about #contents #company .list { margin-top: 60px; display: flex; flex-wrap: wrap; border-top: solid 1px #e6e6e6;}
#about #contents #company .list dt { padding: 30px 0 30px 20px; width: 260px; font-size: 2rem; border-bottom: solid 1px #e6e6e6;}
#about #contents #company .list dd { padding: 30px 0; width: calc(100% - 260px); border-bottom: solid 1px #e6e6e6;}
#about #contents #company .list dd span { display: inline-block;}
@media screen and (max-width: 899px) {
#about #contents #company { padding: 75px 0;}
#about #contents #company .list { margin-top: 30px; display: block;}
#about #contents #company .list dt { padding: 15px 15px 0 15px; width: 100%; font-size: 1.6rem; border-bottom:none;}
#about #contents #company .list dd { padding: 10px 15px 15px 15px; width: 100%;}
}


/*==================================
	job
==================================*/
/* fv */
#job #contents #fv {}
#job #contents #fv .outer { background: url("/lib/img/job/fv.png") no-repeat; background-size: 100% auto;}
@media screen and (max-width: 899px) {
#job #contents #fv .outer { background: url("/lib/img/job/fv_sp.png") no-repeat; background-size: 100% auto;}
}

/* common */
#job #contents .secTit { padding-top: 40px; position: relative; z-index: 1; text-align: center;}
#job #contents .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#job #contents .secTit .en { font-size: 1.5rem; margin-top: 20px; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
@media screen and (max-width: 899px) {
#job #contents .secTit { padding-top: 0;}
#job #contents .secTit .jp { font-size: 2.8rem;}
#job #contents .secTit .en { font-size: 1.3rem; margin-top: 10px;}
}

/* schedule */
#job #contents #schedule { padding-top: 170px; padding-bottom: 160px; background: url("/lib/img/job/schedule_bg.gif"); position: relative; overflow: hidden;}
#job #contents #schedule:before { background: url("/lib/img/job/hd_bg.jpg") top center no-repeat; background-size: 100% auto; position: absolute; top: 170px; width: 100%; content: ""; z-index: 1;}
#job #contents #schedule:after { height: 170px; width: 100%; background: #fff; position: absolute; top: 0; width: 100%; content: "";}
#job #contents #schedule .inner { position: relative; z-index: 10;}
#job #contents #schedule .mainBox {}
#job #contents #schedule .mainBox .mainTit { padding-left: 90px; font-size: 2.8rem; color: #cb1818; position: relative;}
#job #contents #schedule .mainBox .mainTit .line { font-size: 5.4rem; font-weight: 700; display: inline-block;}
#job #contents #schedule .mainBox .mainTxt { font-size: 1.8rem; line-height: 2;}
#job #contents #schedule .mainBox .anchor { width: 730px; margin: 100px auto 0 auto; display: flex; justify-content: space-between;}
#job #contents #schedule .mainBox .anchor li { width: 352px;}
#job #contents #schedule .mainBox .anchor li a { font-size: 1.8rem; padding: 25px 60px; border-radius: 40px; background: #cb1818; color: #fff; position: relative;}
#job #contents #schedule .mainBox .anchor li a:before,
#job #contents #schedule .mainBox .anchor li a:after { width: 54px; height: 54px; border-radius: 54px; right: 20px; top: 0; bottom: 0; margin: auto; position: absolute; content: "";}
#job #contents #schedule .mainBox .anchor li a:before { background: url("/lib/img/icon_arrB_red.svg") center center no-repeat; background-size: 16px 16px; z-index: 1;}
#job #contents #schedule .mainBox .anchor li a:after { background: #fff;}
#job #contents #schedule .mainBox .scheduleSlider { position: absolute; top: 220px; display: flex;  align-items: center; overflow: hidden; height: 10vw; z-index: 5;}
#job #contents #schedule .mainBox .scheduleSlider .slideshow { display: flex; animation: loop-slide 40s infinite linear 1s both;}
#job #contents #schedule .mainBox .scheduleSlider li { width: 91vw; height: 10vw;}
#job #contents #schedule .mainBox .scheduleSlider li img { width: 100%;}
@media screen and (min-width: 900px) {
#job #contents #schedule:before { height: 220px;}
#job #contents #schedule .mainBox .mainTit { min-height: 420px; writing-mode: vertical-rl;}
#job #contents #schedule .mainBox .mainTit .staff { display: inline-block; margin-left: 15px;}
#job #contents #schedule .mainBox .mainTit .line { border-right: solid 1px #cb1818;}
#job #contents #schedule .mainBox .mainTit .num { -webkit-text-combine: horizontal; -ms-text-combine-horizontal: all; text-combine-upright: all;}
#job #contents #schedule .mainBox .mainTxt { position: absolute; left: calc(50% + 40px); top: 200px;}
#job #contents #schedule .mainBox .scheduleSlider { height: 100px; top: 450px;}
#job #contents #schedule .mainBox .scheduleSlider li { width: 1026px; height: 100px;}
}
@media screen and (max-width: 899px) {
#job #contents #schedule { padding-top: 80px; padding-bottom: 80px;}
#job #contents #schedule:before { height: 200px; background: url("/lib/img/job/hd_bg_sp.jpg") bottom center no-repeat; background-size: 100% auto; top: 80px;}
#job #contents #schedule:after { height: 80px;}
#job #contents #schedule .mainBox .mainTit { font-size: 1.9rem; text-align: center; padding-left: 0;}
#job #contents #schedule .mainBox .mainTit .staff { margin-bottom: 10px; display: inline-block;}
#job #contents #schedule .mainBox .mainTit .line { padding-bottom: 5px; margin-bottom: 5px; font-size: 3.7rem; line-height: 1; border-bottom: solid 1px #cb1818;}
#job #contents #schedule .mainBox .mainTit .num { font-size: 4.5rem; line-height: 1;}
#job #contents #schedule .mainBox .mainTxt { margin-top: 40px; font-size: 1.5rem;}
#job #contents #schedule .mainBox .mainTxt .pcOnly { display: none;}
#job #contents #schedule .mainBox .anchor { width: 90%; margin: 50px auto 0 auto; display: block;}
#job #contents #schedule .mainBox .anchor li { width: 100%;}
#job #contents #schedule .mainBox .anchor li:nth-child(1) { margin-bottom: 15px;}
#job #contents #schedule .mainBox .anchor li a { font-size: 1.5rem; padding: 20px 30px;}
#job #contents #schedule .mainBox .anchor li a:before,
#job #contents #schedule .mainBox .anchor li a:after { width: 46px; height: 46px; border-radius: 46px; right: 10px;}
#job #contents #schedule .mainBox .anchor li a:before { background-size: 12px 12px;}
#job #contents #schedule .mainBox .scheduleSlider { top: 280px;}
}

@media screen and (max-width: 510px) {
#job #contents #schedule:after { height: calc( 35vw + 80px);}
#job #contents #schedule .mainBox .scheduleSlider { top: 340px;}
}

/* schedule item */
#job #contents #schedule .itemBox { margin-top: 90px; position: relative; z-index: 10;}
#job #contents #schedule .itemBox .item { padding: 95px; border-radius: 24px; background: #fff; border: solid 1px #cb1818;}
#job #contents #schedule .itemBox .item .titArea .boxTit { font-size: 4.8rem; color: #cb1818; line-height: 1;}
#job #contents #schedule .itemBox .item .titArea .boxTit .label { padding: 10px 30px; margin-top: 15px; font-size: 2.6rem; border-radius: 5px; background: #f8f8f8; display: inline-block;}
#job #contents #schedule .itemBox .item .titArea .imgArea { max-width: 510px; border-radius: 15px; overflow: hidden;}
#job #contents #schedule .itemBox .item .titArea .imgArea img { vertical-align: bottom;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt { padding: 20px 30px; background: #f3695d; display: flex; justify-content: space-between; align-items: center;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt .label { padding: 10px 20px; background: #fff; color: #f3695d; display: inline-block; border-radius: 30px; line-height: 1;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt .detail { width: calc( 100% - 140px); color: #fff;}
#job #contents #schedule .itemBox .item .timeTable { margin-top: 60px; border-top: solid 1px #e6e6e6; position: relative;}
#job #contents #schedule .itemBox .item .timeTable:before { height: calc(100% - 80px); width: 1px; bottom: 0; left: 20px; position: absolute; content: ""; background: #fb9f97;}
#job #contents #schedule .itemBox .item .timeTable li { margin-top: 60px; padding-left: 70px;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea { width: calc( 100% - 430px); position: relative;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .time { font-size: 5.4rem; font-family: "Jost", sans-serif; font-weight: 400; color: #cb1818; line-height: 1;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .time:before { left: -60px; top: 15px; width: 20px; height: 20px; background: url("/lib/img/job/circle.png"); position: absolute; content: "";}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .tit { font-size: 3rem; color: #cb1818;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .txt { margin-top: 30px; line-height: 2;}
#job #contents #schedule .itemBox .item .timeTable li img { margin-right: -25px;}
#job #contents #schedule .itemBox .item#item01 {}
#job #contents #schedule .itemBox .item#item02 { margin-top: 40px;}
@media screen and (min-width: 1181px) {
#job #contents #schedule .itemBox .item .titArea { display: flex; align-items: center; justify-content: space-between;}
#job #contents #schedule .itemBox .item .timeTable li { display: flex; justify-content: space-between;}
#job #contents #schedule .itemBox .item#item02 .titArea .boxTit { width: calc(100% - 540px); order: 2; margin-left: 70px;}
#job #contents #schedule .itemBox .item#item02 .titArea .imgArea { order: 1;}
}
@media screen and (max-width: 1180px) {
#job #contents #schedule .itemBox .item .titArea .boxTit { text-align: center;}
#job #contents #schedule .itemBox .item .titArea .imgArea { margin: 20px auto 0 auto;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea { width: 100%;}
#job #contents #schedule .itemBox .item .timeTable li img { margin-top: 20px; margin-right: 0;}
}
@media screen and (max-width: 899px) {
#job #contents #schedule .itemBox { margin-top: 45px;}
#job #contents #schedule .itemBox .item { padding: 30px 20px; border-radius: 12px;}
#job #contents #schedule .itemBox .item .titArea .boxTit { font-size: 2.6rem;}
#job #contents #schedule .itemBox .item .titArea .boxTit .label { padding: 5px 15px; margin-top: 10px; font-size: 1.4rem;}
#job #contents #schedule .itemBox .item .titArea .imgArea { max-width: 510px; width: 100%; border-radius: 10px;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt { padding: 20px 15px 15px 15px; display: block; text-align: center; position: relative;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt .label { padding: 5px 20px; top: -15px; left: calc(50% - 50px); margin: auto; position: absolute;}
#job #contents #schedule .itemBox .item .titArea .imgArea .txt .detail { font-size: 1.4rem; width: 100%; text-align: left;}
#job #contents #schedule .itemBox .item .timeTable { margin-top: 25px;}
#job #contents #schedule .itemBox .item .timeTable:before { height: calc(100% - 50px); left: 10px;}
#job #contents #schedule .itemBox .item .timeTable li { margin-top: 30px; padding-left: 40px;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .time { font-size: 4rem;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .time:before { left: -40px; top: 15px; width: 20px; height: 20px;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .tit { font-size: 2.1rem;}
#job #contents #schedule .itemBox .item .timeTable li .txtArea .txt { font-size: 1.4rem; margin-top: 15px;}
#job #contents #schedule .itemBox .item .timeTable li img { max-width: 368px; width: 100%;}
#job #contents #schedule .itemBox .item#item01 {}
#job #contents #schedule .itemBox .item#item02 { margin-top: 20px;}
}

/* introduction */
#job #contents #introduction { padding: 150px 0 220px 0;}
#job #contents #introduction .list {}
#job #contents #introduction .list li { padding: 30px; background: #f8f8f8; position: relative; border-radius: 12px; text-align: center;}
#job #contents #introduction .list li:before,
#job #contents #introduction .list li:after { position: absolute; content: "";}
#job #contents #introduction .list li:before { left: 16px; top: -8px; width: 32px; height: 27px; background: url("/lib/img/job/introduction_top.png") no-repeat;}
#job #contents #introduction .list li:after { right: 16px; bottom: -8px; width: 33px; height: 22px; background: url("/lib/img/job/introduction_btm.png") no-repeat;}
#job #contents #introduction .list li .label { padding: 5px; font-size: 2.2rem; background: #fff; border-radius: 30px;}
#job #contents #introduction .list li img { margin: 20px auto 0 auto;}
#job #contents #introduction .list li .txt { margin-top: 20px; line-height: 2; text-align: left;}
@media screen and (min-width: 900px) {
#job #contents #introduction .list { margin-top: 80px; display: flex; justify-content: space-between;}
#job #contents #introduction .list li { width: 31.4%;}
}
@media screen and (max-width: 899px) {
#job #contents #introduction { padding: 75px 0 110px 0;}
#job #contents #introduction .list li { margin-top: 40px;}
#job #contents #introduction .list li:nth-child(1) { margin-top: 60px;}
#job #contents #introduction .list li .label { font-size: 1.8rem;}
#job #contents #introduction .list li img { height: 60px; width: auto;}
#job #contents #introduction .list li .txt { font-size: 1.5rem;}
}


/*==================================
	benefits
==================================*/
/* fv */
#benefits #contents #fv {}
#benefits #contents #fv .outer { background: url("/lib/img/benefits/fv.png") no-repeat; background-size: 100% auto;}
@media screen and (max-width: 899px) {
#benefits #contents #fv .outer { background: url("/lib/img/benefits/fv_sp.png") no-repeat; background-size: 100% auto;}
}

/* bp */
#benefits #contents #bp { padding: 100px 0 200px 0; overflow: hidden;}
#benefits #contents #bp .outer { position: relative; text-align: center;}
#benefits #contents #bp .outer:before { top: -45px; left: calc(50% + 550px); width: 61px; height: 62px; background: url("/lib/img/benefits/deco01.png") no-repeat; background-size: cover;  position: absolute; content: "";}
#benefits #contents #bp .outer:after { top: 70px; right: calc( 50% + 470px); width: 107px; height: 123px; background: url("/lib/img/benefits/deco02.png") no-repeat; background-size: cover;  position: absolute; content: "";}
#benefits #contents #bp .outer .secTit { padding-top: 40px; position: relative; z-index: 1;}
#benefits #contents #bp .outer .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#benefits #contents #bp .outer .secTit .en { font-size: 1.5rem; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
#benefits #contents #bp .outer .nomaltxt { margin-top: 50px; line-height: 2; position: relative; z-index: 1;}
#benefits #contents #bp .outer .list { margin-top: 50px; position: relative; z-index: 1;}
#benefits #contents #bp .outer .list li { font-size: 1.3rem; color: #cb1818; letter-spacing: -0.03em;}
#benefits #contents #bp .outer .list li .icon { width: 88px; height: 88px; padding: 20px 12px; margin-bottom: 5px; border-radius: 5px; background: #cb1818;}
#benefits #contents #bp .outer .ph01 { display: none;}
#benefits #contents #bp .outer .ph02 { display: none;}
#benefits #contents #bp .inner { margin-top: 120px;}
#benefits #contents #bp .inner .listTit { margin: 80px 0 20px 7px; font-size: 3.8rem; font-weight: 700; color: #cb1818; line-height: 1;}
#benefits #contents #bp .inner .listTit .icon { margin-right: 20px; padding: 2px 20px 2px 10px; border-radius: 5px 30px 30px 5px; background: #cb1818; display: inline-block; vertical-align: text-bottom;}
#benefits #contents #bp .inner .listTit .icon img { max-width: 56px;}
#benefits #contents #bp .inner .list { position: relative;}
#benefits #contents #bp .inner .list li { padding: 50px; background: #f8f8f8; border: solid 1px #e9e9e9; border-radius: 12px; position: relative;}
#benefits #contents #bp .inner .list li .tit { font-size: 2.8rem; font-weight: 700;}
#benefits #contents #bp .inner .list li .en { font-size: 1.4rem; right: 50px; top: 62px; color: #e37070; font-weight: 400; position: absolute;}
#benefits #contents #bp .inner .list li .txt { font-size: 1.6rem; margin-top: 20px; line-height: 1.8; font-weight: 500;}
#benefits #contents #bp .inner .list li .txt sup { font-size: 1.1rem;}
#benefits #contents #bp .inner .list li .notes { font-size: 1.1rem; margin-top: 10px; text-align: right; font-weight: 400;}
#benefits #contents #bp .inner .list.list01:before,
#benefits #contents #bp .inner .list.list02:before,
#benefits #contents #bp .inner .list.list03:before,
#benefits #contents #bp .inner .list.list04:before,
#benefits #contents #bp .inner .list.list05:before { position: absolute; content: "";}
#benefits #contents #bp .inner .list.list01:before { top: -30px; left: calc(50% + 550px); width: 69px; height: 150px; background: url("/lib/img/benefits/deco03.png") no-repeat;}
#benefits #contents #bp .inner .list.list02:before { top: 90px; right: calc(50% + 570px); width: 41px; height: 62px; background: url("/lib/img/benefits/deco04.png") no-repeat;}
#benefits #contents #bp .inner .list.list03:before { top: 10px; left: calc(50% + 540px); width: 52px; height: 36px; background: url("/lib/img/benefits/deco05.png") no-repeat;}
#benefits #contents #bp .inner .list.list04:before { top: 50px; right: calc(50% + 530px); width: 117px; height: 107px; background: url("/lib/img/benefits/deco06.png") no-repeat;}
#benefits #contents #bp .inner .list.list05:before { top: -100px; left: calc(50% + 550px); width: 41px; height: 62px; background: url("/lib/img/benefits/deco04.png") no-repeat;}
@media screen and (min-width: 1150px) {
#benefits #contents #bp .outer .ph01 { top: 0; left: calc(50% + 400px); display: block; position: absolute; z-index: 1;}
#benefits #contents #bp .outer .ph01 img { box-shadow: 11.314px 11.314px 13.44px 2.56px rgba(153, 153, 153, 0.12); border-radius: 12px;}
#benefits #contents #bp .outer .ph02 { top: 180px; right: calc(50% + 400px); display: block; position: absolute; z-index: 1;}
#benefits #contents #bp .outer .ph02 img { box-shadow: 11.314px 11.314px 13.44px 2.56px rgba(153, 153, 153, 0.12); border-radius: 12px;}
#benefits #contents #bp .inner .list { display: grid; grid-template-columns: 1fr 1fr; gap: 19px;}
#benefits #contents #bp .inner .list.list02,#benefits #contents #bp .inner .list.list03 { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 19px; grid-row-gap: 19px; }
#benefits #contents #bp .inner .list.list02 li:nth-child(1),#benefits #contents #bp .inner .list.list03 li:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
#benefits #contents #bp .inner .list.list02 li:nth-child(2),#benefits #contents #bp .inner .list.list03 li:nth-child(2) { grid-area: 1 / 2 / 2 / 3; }
#benefits #contents #bp .inner .list.list02 li:nth-child(3), #benefits #contents #bp .inner .list.list03 li:nth-child(3) { grid-area: 2 / 1 / 3 / 3; } 
}
@media screen and (max-width: 1149px) {
#benefits #contents #bp .outer:before { left: auto; right: 5%;}
#benefits #contents #bp .outer:after { right: auto; left: 5%;}
#benefits #contents #bp .inner .list li { margin-top: 15px;}
#benefits #contents #bp .inner .list.list01:before {  left: auto; right: -5%;}
#benefits #contents #bp .inner .list.list02:before { right: auto; left: -5%;}
#benefits #contents #bp .inner .list.list03:before { left: auto; right: -5%;}
#benefits #contents #bp .inner .list.list04:before { right: auto; left: -8%;}
#benefits #contents #bp .inner .list.list05:before { left: auto; right: -5%;}
}
@media screen and (min-width: 900px) {
#benefits #contents #bp .outer .list { display: grid; grid-template-columns: 90px 90px 90px 90px 90px; gap: 18px; place-content: center;}
}
@media screen and (max-width: 899px) {
#benefits #contents #bp { padding: 50px 0 100px 0;}
#benefits #contents #bp .outer:before { top: -10px; background-size: 30px auto;}
#benefits #contents #bp .outer:after { top: 0; background-size: 50px auto;}
#benefits #contents #bp .outer .secTit { padding-top: 0;}
#benefits #contents #bp .outer .secTit .jp { font-size: 2.8rem;}
#benefits #contents #bp .outer .secTit .en { font-size: 1.3rem;}
#benefits #contents #bp .outer .nomaltxt { margin-top: 25px;}
#benefits #contents #bp .outer .list { margin: 30px auto 0 auto; max-width: 330px; display: flex; flex-wrap: wrap; justify-content: center;}
#benefits #contents #bp .outer .list li { width: 90px; margin: 8px}
#benefits #contents #bp .inner { margin-top: 60px;}
#benefits #contents #bp .inner .listTit { margin: 40px 0 10px 0; font-size: 2.2rem;}
#benefits #contents #bp .inner .listTit .icon { margin-right: 10px; padding: 2px 15px 2px 10px;}
#benefits #contents #bp .inner .listTit .icon img { max-width: 40px;}
#benefits #contents #bp .inner .list li { padding: 20px 6%;}
#benefits #contents #bp .inner .list li .tit { font-size: 1.8rem;}
#benefits #contents #bp .inner .list li .en { font-size: 1rem; right: 7.5%; top: 26px;}
#benefits #contents #bp .inner .list li .txt { font-size: 1.4rem; margin-top: 10px;}
#benefits #contents #bp .inner .list li .txt sup { font-size: 1rem;}
#benefits #contents #bp .inner .list li .notes { font-size: 1rem; margin-top: 5px;}
#benefits #contents #bp .inner .list.list01:before { background-size: 35px auto; right: -12%; top: -15px;}
#benefits #contents #bp .inner .list.list02:before { background-size: 20px auto; top: 45px;}
#benefits #contents #bp .inner .list.list03:before { background-size: 25px auto; right: -8%; top: -20px;}
#benefits #contents #bp .inner .list.list04:before { background-size: 55px auto; top: 25px;}
#benefits #contents #bp .inner .list.list05:before { background-size: 20px auto; right: -8%; top: -50px;}
}

/* support */
#benefits #contents #support { padding-bottom: 200px; background: url("/lib/img/benefits/support_bg.gif");}
#benefits #contents #support .secTit { padding-bottom: 10.4vw; height: 678px; display: flex; justify-content: center; align-items: center; background: url("/lib/img/benefits/support_main.jpg") no-repeat; background-size: cover; position: relative;}
#benefits #contents #support .secTit:after { height: 10.4vw; content: ""; position: absolute; bottom: -2px; left: 0; width: 100%; background: url("/lib/img/benefits/support_blind.png") bottom center no-repeat; background-size: 100% auto; z-index: 1;}
#benefits #contents #support .secTit .inner { text-align: center; color: #fff;}
#benefits #contents #support .secTit .jp { font-size: 5.2rem; font-weight: 700;}
#benefits #contents #support .secTit .en { font-size: 1.6rem; margin-top: 10px; font-weight: 400; letter-spacing: 0.05em;}
#benefits #contents #support .list {}
#benefits #contents #support .list li { margin-top: 70px; position: relative;}
#benefits #contents #support .list li .ph { margin-left: 40px;}
#benefits #contents #support .list li .ph img { width: 100%; max-width: 630px; box-shadow: 11.314px 11.314px 13.44px 2.56px rgba(153, 153, 153, 0.12); border-radius: 12px;}
#benefits #contents #support .list li .txtArea { padding-top: 10px;}
#benefits #contents #support .list li .txtArea .tit { margin-bottom: 15px; font-size: 2.8rem; color: #cb1818; font-weight: 700; line-height: 1;}
#benefits #contents #support .list li .txtArea .tit .en { padding-right: 20px; margin-right: 10px; line-height: 25px; font-weight: 400; background: url("/lib/img/benefits/support_line.png") right center no-repeat;}
#benefits #contents #support .list li .txtArea .txt { font-size: 1.6rem; line-height: 1.8;}
#benefits #contents #support .list li .txtArea .item { margin-top: 20px; font-size: 1.4rem; display: flex; align-items: center;}
#benefits #contents #support .list li .txtArea .item .label { padding: 5px; margin-right: 10px; background: #fff; line-height: 1; display: inline-block; min-width: 120px; text-align: center;}
@media screen and (min-width: 1050px) {
#benefits #contents #support .list li { display: flex; justify-content: space-between;}
#benefits #contents #support .list li .ph { width: 260px;}
#benefits #contents #support .list li .txtArea { width: calc(100% - 350px);}
}
@media screen and (max-width: 1049px) {
#benefits #contents #support .list li .ph { margin: 0 auto; width: 96%; max-width: 630px;}
#benefits #contents #support .list li .txtArea .tit { margin-top: 10px; text-align: center;}
#benefits #contents #support .list li .txtArea .tit .en { font-size: 4.3rem; line-height: 30px; position: absolute; top: -20px; left: calc(50% - 25px); margin: auto; background-position: right bottom;}
}
@media screen and (max-width: 899px) {
#benefits #contents #support { padding-bottom: 100px;}
#benefits #contents #support .secTit { height: 87.46vw; background: url("/lib/img/benefits/support_main_sp.jpg") no-repeat; background-size: cover;}
#benefits #contents #support .secTit .jp { font-size: 2.8rem;}
#benefits #contents #support .secTit .en { font-size: 1.3rem; margin-top: 5px;}
#benefits #contents #support .secTit:after { background-size: 110% auto; background-position: top center;}
#benefits #contents #support .list li .txtArea .tit { font-size: 2rem; line-height: 1.5;}
#benefits #contents #support .list li .txtArea .txt { font-size: 1.4rem;}
#benefits #contents #support .list li .txtArea .item { margin-top: 10px; font-size: 1.3rem; display: block;}
#benefits #contents #support .list li .txtArea .item .label { font-size: 1.2rem; padding: 5px; margin-right: 10px; margin-bottom: 2px;}
}
@media screen and (max-width: 749px) {
#benefits #contents #support .secTit { padding-bottom: 10.4vw; height: 75vw;}
}

/* careerup */
#benefits #contents #careerup { padding: 140px 0;}
#benefits #contents #careerup .secTit { text-align: center;}
#benefits #contents #careerup .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#benefits #contents #careerup .secTit .en { font-size: 1.5rem; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
#benefits #contents #careerup .maintxt { margin-top: 50px; text-align: center; line-height: 1.8;}
#benefits #contents #careerup .list { margin-top: 100px;}
#benefits #contents #careerup .list li { margin-top: 70px; position: relative;}
#benefits #contents #careerup .list li:before { width: 63px; height: 32px; top: -50px; content: ""; position: absolute; left: 0; right: 0; margin: auto; background: url("/lib/img/benefits/carrierup_arr.svg") no-repeat; background-size: cover;}
#benefits #contents #careerup .list li:nth-child(1) { margin-top: 0;}
#benefits #contents #careerup .list li:nth-child(1):before { display: none;}
#benefits #contents #careerup .list li .bar { padding: 30px 50px; border-radius: 6px; color: #fff; display: flex; justify-content: space-between; align-items: center;}
#benefits #contents #careerup .list li .bar .tit { font-size: 3rem; line-height: 1;}
#benefits #contents #careerup .list li .bar .tit .tag { font-size: 1.5rem; margin-left: 15px; padding: 5px 10px; color: #222; background: #fff; border-radius: 30px; display: inline-block; vertical-align: center;}
#benefits #contents #careerup .list li .bar .txt { font-size: 1.9rem;}
#benefits #contents #careerup .list li .skill { margin-top: 10px;}
#benefits #contents #careerup .list li .skill .tit { margin-right: 25px;}
#benefits #contents #careerup .list li .skill .tit:before { margin-right: 5px; width: 8px; height: 8px; border-radius: 8px; background: #e6e6e6; content: ""; display: inline-block; vertical-align: center;}
#benefits #contents #careerup .list li .skill .txt {}
#benefits #contents #careerup .list li:nth-child(1) .bar,
#benefits #contents #careerup .list li:nth-child(2) .bar  { color: #cb1818;}
#benefits #contents #careerup .list li:nth-child(1) .bar { background: #ffd5d1;}
#benefits #contents #careerup .list li:nth-child(2) .bar { background: #fcb8b2;}
#benefits #contents #careerup .list li:nth-child(3) .bar { background: #f9958c;}
#benefits #contents #careerup .list li:nth-child(4) .bar { background: #f3695d;}
#benefits #contents #careerup .list li:nth-child(5) .bar { background: #dc4c3f;}
#benefits #contents #careerup .list li:nth-child(6) .bar { background: #cb1818;}
@media screen and (max-width: 899px) {
#benefits #contents #careerup { padding: 70px 0 120px;}
#benefits #contents #careerup .secTit .jp { font-size: 2.8rem;}
#benefits #contents #careerup .secTit .en { font-size: 1.3rem;}
#benefits #contents #careerup .maintxt { font-size: 1.4rem; margin-top: 25px; text-align: left;}
#benefits #contents #careerup .list { margin-top: 50px;}
#benefits #contents #careerup .list li { margin-top: 35px;}
#benefits #contents #careerup .list li:before { width: 32px; height: 16px; top: -25px;}
#benefits #contents #careerup .list li:nth-child(1) { margin-top: 0;}
#benefits #contents #careerup .list li .bar { padding: 15px 25px; display: block; border-radius: 3px;}
#benefits #contents #careerup .list li .bar .tit { font-size: 2.3rem; margin-bottom: 10px; display: inline-block;}
#benefits #contents #careerup .list li .bar .tit .tag { font-size: 1.3rem; margin-left: 10px; padding: 2px 10px;}
#benefits #contents #careerup .list li .bar .txt { font-size: 1.4rem; display: block;}
#benefits #contents #careerup .list li .skill { margin-top: 10px;}
#benefits #contents #careerup .list li .skill .tit { font-size: 1.4rem; margin-right: 0; display: block;}
#benefits #contents #careerup .list li .skill .txt { font-size: 1.3rem;}
}


/*==================================
	crosstalk
==================================*/
/* fv */
#crosstalk #contents #fv {}
#crosstalk #contents #fv .outer { background: url("/lib/img/crosstalk/fv.png") no-repeat; background-size: 100% auto;}
#crosstalk #contents #fv .txt { left: auto; right: 5%; top: auto; bottom: 2vw;}
#crosstalk #contents #fv .txt span { line-height: 1;}
#crosstalk #contents #fv .txt .line1 { font-size: 3.8rem; padding: 5px 10px; background: #fff; display: inline-block; margin-bottom: 5px; color: #222;}
#crosstalk #contents #fv .txt .line2 { font-size: 3.3rem; padding: 5px 10px; background: #fff; display: inline-block; color: #222;}
#crosstalk #contents #fv .txt .line2 .big { font-size: 4.1rem; color: #cb1818; padding: 0;}
@media screen and (max-width: 1199px) {
#crosstalk #contents #fv .txt .line1 { font-size: 2.8rem;}
#crosstalk #contents #fv .txt .line2 { font-size: 2.3rem;}
#crosstalk #contents #fv .txt .line2 .big { font-size: 3.1rem;}
}
@media screen and (max-width: 899px) {
#crosstalk #contents #fv .outer { background: url("/lib/img/crosstalk/fv_sp.png") no-repeat; background-size: 100% auto;}
#crosstalk #contents #fv .txt { left: 5%; right: auto; top: 4vw; bottom: auto;}
#crosstalk #contents #fv .txt .line1 { font-size: 1.4rem;}
#crosstalk #contents #fv .txt .line2 { font-size: 1.7rem;}
#crosstalk #contents #fv .txt .line2 .big { font-size: 2rem;}
}

/* common */
#crosstalk #contents .secTit { padding-top: 40px; position: relative; z-index: 1; text-align: center;}
#crosstalk #contents .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#crosstalk #contents .secTit .en { font-size: 1.5rem; margin-top: 20px; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
@media screen and (max-width: 899px) {
#crosstalk #contents .secTit { padding-top: 0;}
#crosstalk #contents .secTit .jp { font-size: 2.8rem;}
#crosstalk #contents .secTit .en { font-size: 1.3rem; margin-top: 10px;}
}

/* member */
#crosstalk #contents #member { padding: 100px 0 40px 0; position: relative; z-index: 10; overflow: hidden;}
#crosstalk #contents #member:before,
#crosstalk #contents #member:after { content: ""; position: absolute; z-index: 5;}
#crosstalk #contents #member:before { width: 41px; height: 62px; right: calc(50% + 580px); top: 300px; background: url("/lib/img/crosstalk/deco01.png") no-repeat; background-size: cover;}
#crosstalk #contents #member:after { width: 121px; height: 126px; left: calc(50% + 540px); top: 150px; background: url("/lib/img/crosstalk/deco02.png") no-repeat; background-size: cover;}
#crosstalk #contents #member .box { padding: 90px 60px; max-width: 1100px; border-radius: 20px; background: #fff; border: solid 2px #cb1818; position: relative;}
#crosstalk #contents #member .box .label { font-size: 2.4rem; padding: 8px 40px; border-radius: 18px 0 18px 0; color: #fff; background: #cb1818; font-family: "Jost", sans-serif; font-weight: 400; display: inline-block; letter-spacing: 0.05em; position: absolute; top: 0; left: 0;}
#crosstalk #contents #member .box .list { display: flex; justify-content: center;}
#crosstalk #contents #member .box .list li { padding-left: 100px; text-align: center; position: relative;}
#crosstalk #contents #member .box .list li:before { top: 90px; left: 30px; width: 37px; height: 37px; content: ""; background: url("/lib/img/crosstalk/member_x.png") no-repeat; display: inline-block; position: absolute;}
#crosstalk #contents #member .box .list li:first-child { padding-left: 0;}
#crosstalk #contents #member .box .list li:first-child:before { display: none;}
#crosstalk #contents #member .box .list li .name {}
#crosstalk #contents #member .box .list li .name .fwB { font-size: 2rem;}
#crosstalk #contents #member .box .list li .name .fwB .en { font-size: 3rem;}
#crosstalk #contents #member .box .list li .career { font-size: 1.5rem; color: #7f7f7f;}
#crosstalk #contents #member .notes { font-size: 1.4rem; margin-top: 15px;}
@media screen and (max-width: 1180px) {
#crosstalk #contents #member:before { right: auto; left: 0;}
#crosstalk #contents #member:after { left: auto; right: -4%;}
#crosstalk #contents #member .box .list {}
}
@media screen and (max-width: 1099px) {
#crosstalk #contents #member .box .list li { padding-left: 60px;}
#crosstalk #contents #member .box .list li:before { left: 10px;}
}
@media screen and (max-width: 899px) {
#crosstalk #contents #member { padding: 50px 0 30px 0;}
#crosstalk #contents #member:before { width: 21px; height: 31px; left: 1%; top: 100px}
#crosstalk #contents #member:after { width: 58px; height: 64px; right: 3%; top: 45px;}
#crosstalk #contents #member .box { padding: 50px 30px 30px 30px;}
#crosstalk #contents #member .box .label { font-size: 1.8rem; padding: 4px 20px;}
#crosstalk #contents #member .box .list {}
#crosstalk #contents #member .box .list li { padding-left: 20px;}
#crosstalk #contents #member .box .list li:before { display: none;}
#crosstalk #contents #member .box .list li img { width: 17.86vw;}
#crosstalk #contents #member .box .list li .name { font-size: 1rem;}
#crosstalk #contents #member .box .list li .name .fwB { font-size: 1.3rem; display: block;}
#crosstalk #contents #member .box .list li .name .fwB .en { font-size: 1.8rem;}
#crosstalk #contents #member .box .list li .career { font-size: 1rem;}
#crosstalk #contents #member .notes { font-size: 1.2rem; margin-top: 10px;}
}

/* talk */
#crosstalk #contents #talk {}
#crosstalk #contents #talk .box { padding: 150px 0;}
#crosstalk #contents #talk .box.bg01 { background: url("/lib/img/job/schedule_bg.gif");}
#crosstalk #contents #talk .box.bg02 { background: url("/lib/img/bg_pattern.gif");}
#crosstalk #contents #talk .box .titArea { color: #cb1818; padding: 0 90px;}
#crosstalk #contents #talk .box .titArea .en { font-size: 2rem; font-weight: 400; letter-spacing: 0.05em;}
#crosstalk #contents #talk .box .titArea .en:before { width: 56px; margin-right: 10px; content: ""; height: 1px; background: #cb1818; display: inline-block; vertical-align: center;}
#crosstalk #contents #talk .box .titArea .jp { font-size: 3.6rem; font-weight: 700;}
#crosstalk #contents #talk .box .talkArea { margin-top: 70px; padding: 0 90px;}
#crosstalk #contents #talk .box .talkArea .talkBox { margin-top: 20px; display: flex; justify-content: space-between; align-items: center;}
#crosstalk #contents #talk .box .talkArea .talkBox .marker { padding: 0 4px; color: #fff; background:linear-gradient(transparent 10%, #ee594b 10%);}
#crosstalk #contents #talk .box .talkArea .mem { width: 76px; padding-top: 80px; font-size: 1.3rem; color: #ee594b; font-weight: 700; text-align: center; line-height: 1;}
#crosstalk #contents #talk .box .talkArea .mem .en { font-size: 1.7rem; font-weight: 400; line-height: 1;}
#crosstalk #contents #talk .box .talkArea .memS { background: url("/lib/img/crosstalk/icon_s.png") no-repeat;}
#crosstalk #contents #talk .box .talkArea .memM { background: url("/lib/img/crosstalk/icon_m.png") no-repeat;}
#crosstalk #contents #talk .box .talkArea .memH { background: url("/lib/img/crosstalk/icon_h.png") no-repeat;}
#crosstalk #contents #talk .box .talkArea .memMS { background: url("/lib/img/crosstalk/icon_ms.png") no-repeat; font-size: 1.1rem;}
#crosstalk #contents #talk .box .talkArea .memMS .en { font-size: 1.4rem;}
#crosstalk #contents #talk .box .talkArea .txt { width: calc( 100% - 100px); padding-bottom: 20px; line-height: 1.8;}
#crosstalk #contents #talk .box .imgArea { margin-top: 100px;}
#crosstalk #contents #talk .box .imgArea img { max-width: 100%;}
#crosstalk #contents #talk .fin { margin-top: 60px; text-align: center;}
#crosstalk #contents #talk .fin .tit { font-size: 4.2rem; font-weight: 700;}
#crosstalk #contents #talk .fin .tit span { border-bottom: solid 1px #d8d8d8; display: inline-block; position: relative;}
#crosstalk #contents #talk .fin .tit span:before,
#crosstalk #contents #talk .fin .tit span:after { width: 16px; height: 13px; position: absolute; content: ""; display: inline-block;}
#crosstalk #contents #talk .fin .tit span:before { left: -20px; top: 0; background: url("/lib/img/interview_detail/tit_start.png") no-repeat;}
#crosstalk #contents #talk .fin .tit span:after { right: 0; top: 0; background: url("/lib/img/interview_detail/tit_end.png") no-repeat;}
#crosstalk #contents #talk .fin .txt { margin-top: 20px; font-size: 2.2rem; font-weight: 700;}
@media screen and (max-width: 1199px) {
#crosstalk #contents #talk .box .titArea { padding: 0 30px;}
#crosstalk #contents #talk .box .talkArea { padding: 0 30px;}
}
@media screen and (max-width: 899px) {
#crosstalk #contents #talk .box { padding: 50px 0;}
#crosstalk #contents #talk .box .titArea { padding: 0;}
#crosstalk #contents #talk .box .titArea .en { font-size: 1.8rem;}
#crosstalk #contents #talk .box .titArea .jp { font-size: 2.1rem; margin-top: 10px;}
#crosstalk #contents #talk .box .talkArea { margin-top: 30px; padding: 0;}
#crosstalk #contents #talk .box .talkArea .talkBox { font-size: 1.4rem; align-items: flex-start;}
#crosstalk #contents #talk .box .imgArea { margin-top: 50px;}
#crosstalk #contents #talk .fin { margin-top: 30px;}
#crosstalk #contents #talk .fin .tit { font-size: 3rem;}
#crosstalk #contents #talk .fin .txt { font-size: 1.8rem; margin-top: 10px;}
}

/* interview */
#crosstalk #contents #interview { padding: 160px 0 ; border-top: solid 2px #e6e6e6;}
#crosstalk #contents #interview .secTit { text-align: center;}
#crosstalk #contents #interview .list { margin-top: 70px; display: flex; justify-content: space-between;}
#crosstalk #contents #interview .list li { width: calc( 33% - 10px); background: #f8f8f8; border-radius: 20px;}
#crosstalk #contents #interview .list li a { padding: 20px; position: relative;}
#crosstalk #contents #interview .list li a img { width: 100%;}
#crosstalk #contents #interview .list li a .box {}
#crosstalk #contents #interview .list li a .box .numline { top: -40px; left: 30px; position: absolute;}
#crosstalk #contents #interview .list li a .box .numline .en { font-size: 4.0rem; color: #cb1818; font-weight: 400;}
#crosstalk #contents #interview .list li a .box .numline .en .big { font-size: 5.8rem; margin-left: 5px; line-height: 1;}
#crosstalk #contents #interview .list li a .box .catch { margin-top: 15px; font-size: 2rem;}
#crosstalk #contents #interview .list li a .box .catch br { display: none;}
#crosstalk #contents #interview .list li a .box .name { font-size: 1.5rem; margin-top: 15px; color: #7f7f7f;}
#crosstalk #contents #interview .list li a .box .name .label { margin-right: 10px; padding: 5px 15px; border: solid 1px #e9e9e9; border-radius: 25px; background: #fff; color: #222222;}
#crosstalk #contents #interview .list li a .box .name span { display: inline-block;}
#crosstalk #contents #interview .more { margin-top: 50px; text-align: center;}
#crosstalk #contents #interview .more .btn { padding: 30px 45px; min-width: 353px; border-radius: 100px; display: inline-block; background: #cb1818; text-align: left; position: relative;}
#crosstalk #contents #interview .more .btn .arr { font-size: 1.8rem; font-weight: 700; color: #fff;}
#crosstalk #contents #interview .more .btn .arr:before { width: 15px; height: 15px; right: 40px; top: 0; bottom: 0; margin: auto; background: url("/lib/img/icon_arrR_red.svg") no-repeat; background-size: 15px 15px; content: ""; position: absolute; z-index: 1;}
#crosstalk #contents #interview .more .btn .arr:after { width: 54px; height: 54px; border-radius: 54px; right: 20px; top: 0; bottom: 0; margin: auto; background: #fff; content: ""; position: absolute;}
@media screen and (max-width: 1099px) {
#crosstalk #contents #interview .list li a .box .name span { display: block;}
#crosstalk #contents #interview .list li a .box .name .label { display: inline-block; margin-bottom: 10px;}
}
@media screen and (max-width: 899px) {
#crosstalk #contents #interview { padding: 80px 0;}
#crosstalk #contents #interview .list { display: block; max-width: 500px; margin-left: auto; margin-right: auto;}
#crosstalk #contents #interview .list li { width: 100%;}
#crosstalk #contents #interview .list li:nth-child(2) { margin-top: 50px;}
#crosstalk #contents #interview .list li:nth-child(3) { margin-top: 50px;}
#crosstalk #contents #interview .list li a { border-radius: 10px;}
#crosstalk #contents #interview .list li a .box .numline { top: -30px;}
#crosstalk #contents #interview .list li a .box .numline .en { font-size: 3.1rem;}
#crosstalk #contents #interview .list li a .box .numline .en .big { font-size: 4.4rem;}
#crosstalk #contents #interview .list li a .box .catch { margin-top: 10px; font-size: 1.6rem;}
#crosstalk #contents #interview .list li a .box .name { font-size: 1.4rem;}
#crosstalk #contents #interview .list li a .box .name .label { font-size: 1.3rem;}
#crosstalk #contents #interview .list li a .box .name span { display: inline-block;}
#crosstalk #contents #interview .more { margin-top: 30px;}
#crosstalk #contents #interview .more .btn { width: 90%; max-width: 300px;}
#crosstalk #contents #interview .more .btn .arr { font-size: 1.5rem;}
#crosstalk #contents #interview .more .btn .arr:before { width: 12px; height: 12px; right: 38px; background-size: 12px 12px;}
#crosstalk #contents #interview .more .btn .arr:after { width: 48px; height: 48px; border-radius: 48px;}
}




/*==================================
	data
==================================*/
/* fv */
#data #contents #fv .outer { background: url("/lib/img/data/fv.png") no-repeat; background-size: 100% auto;}
@media screen and (max-width: 899px) {
#data #contents #fv .outer { background: url("/lib/img/data/fv_sp.png") no-repeat; background-size: 100% auto;}
}

/* common */
#data #contents #real .secTit { padding-top: 40px; position: relative; z-index: 1; text-align: center;}
#data #contents #real .secTit .jp { font-size: 4.8rem; font-weight: 700;}
#data #contents #real .secTit .en { font-size: 1.5rem; margin-top: 20px; font-weight: 400; color: #cb1818; letter-spacing: 0.05em;}
#data #contents #real .nomaltxt { margin-top: 50px; text-align: center;}
@media screen and (max-width: 899px) {
#data #contents #real .secTit { padding-top: 0;}
#data #contents #real .secTit .jp { font-size: 2.8rem;}
#data #contents #real .secTit .en { font-size: 1.3rem; margin-top: 10px;}
#data #contents #real .nomaltxt { margin-top: 25px;}
}

/* datalist */
#data #contents #datalist { margin: 120px 0 200px 0;}
#data #contents #datalist .titArea { margin-bottom: 50px; color: #cb1818; position: relative;}
#data #contents #datalist .titArea:before { top: 35px; border-top: dotted 2px #cb1818; position: absolute; height: 1px; width: 100%; content: "";}
#data #contents #datalist .titArea .tit { font-size: 4.8rem; padding-right: 20px; font-weight: 700; background: #fff; display: inline-block; position: relative; z-index: 1; line-height: 1;}
#data #contents #datalist .titArea .notes { font-size: 1.4rem; margin-top: 10px;}
#data #contents #datalist .boxArea { display: grid;}
#data #contents #datalist .boxArea .box { background: #f8f8f8; border-radius: 12px;}
#data #contents #datalist .boxArea .box img { width: 100%;}
@media screen and (min-width: 900px) {
#data #contents #datalist .boxArea { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(4, 1fr); gap: 25px;}
#data #contents #datalist .boxArea .box {}
#data #contents #datalist .boxArea .box img.pc { display: block;}
#data #contents #datalist .boxArea .box img.sp { display: none;}
#data #contents #datalist .boxArea .box01 { order: 1; grid-area: 1 / 1 / 2 / 2;}
#data #contents #datalist .boxArea .box02 { order: 2; grid-area: 1 / 2 / 2 / 3;}
#data #contents #datalist .boxArea .box03 { order: 3; grid-area: 1 / 3 / 2 / 4;}
#data #contents #datalist .boxArea .box04 { order: 4; grid-area: 2 / 1 / 3 / 3;}
#data #contents #datalist .boxArea .box05 { order: 5; grid-area: 2 / 3 / 3 / 4;}
#data #contents #datalist .boxArea .box06 { order: 6; grid-area: 3 / 1 / 4 / 2;}
#data #contents #datalist .boxArea .box07 { order: 7; grid-area: 3 / 2 / 4 / 4;}
#data #contents #datalist .boxArea .box08 { order: 8; grid-area: 4 / 1 / 5 / 2;}
#data #contents #datalist .boxArea .box09 { order: 9; grid-area: 4 / 2 / 5 / 3;}
#data #contents #datalist .boxArea .box10 { order: 10; grid-area: 4 / 3 / 5 / 4;}
}
@media screen and (max-width: 899px) {
#data #contents #datalist { margin: 40px 0 100px 0;}
#data #contents #datalist .titArea { margin-bottom: 25px;}
#data #contents #datalist .titArea .tit { font-size: 2.7rem;}
#data #contents #datalist .titArea:before { top: 15px;}
#data #contents #datalist .titArea .notes { font-size: 1.2rem; margin-top: 5px;}
#data #contents #datalist .boxArea { max-width: 658px; margin: 0 auto; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(6, 1fr); gap: 13px;}
#data #contents #datalist .boxArea .box img.pc { display: none;}
#data #contents #datalist .boxArea .box img.sp { display: block;}
#data #contents #datalist .boxArea .box01 { grid-area: 1 / 1 / 2 / 2;}
#data #contents #datalist .boxArea .box02 { grid-area: 1 / 2 / 2 / 3;}
#data #contents #datalist .boxArea .box03 { grid-area: 2 / 1 / 3 / 2;}
#data #contents #datalist .boxArea .box04 { grid-area: 3 / 1 / 4 / 3;}
#data #contents #datalist .boxArea .box05 { grid-area: 2 / 2 / 3 / 3;}
#data #contents #datalist .boxArea .box06 { grid-area: 4 / 2 / 5 / 3;}
#data #contents #datalist .boxArea .box07 { grid-area: 5 / 1 / 6 / 3;}
#data #contents #datalist .boxArea .box08 { grid-area: 6 / 1 / 7 / 2;}
#data #contents #datalist .boxArea .box09 { grid-area: 6 / 2 / 7 / 3;}
#data #contents #datalist .boxArea .box10 { grid-area: 4 / 1 / 5 / 2;}
}


/* real */
#data #contents #real { padding: 150px 0 200px 0; background: url("/lib/img/bg_pattern.gif"); border-top: solid 2px #e6e6e6;}
#data #contents #real .box { margin-top: 120px;}
#data #contents #real .box .balloon { margin-bottom: 70px;}
#data #contents #real .box .balloon span { font-size: 2.2rem; padding: 20px 70px; border-radius: 30px 30px 30px 1px; position: relative; border: solid 1px #d6d6d6; background: #fff; display: inline-block; box-shadow: 6.309px 9.011px 5.52px 0.48px rgba(69, 69, 69, 0.04);}
#data #contents #real .box .balloon span:before,
#data #contents #real .box .balloon span:after { content: ""; position: absolute;}
#data #contents #real .box .balloon span:before { left: 20px; top: -5px; width: 16px; height: 14px; background: url("/lib/img/data/real_bln_top.png") no-repeat; background-size: 100% 100%;}
#data #contents #real .box .balloon span:after { right: 20px; bottom: -5px; width: 16px; height: 14px; background: url("/lib/img/data/real_bln_btm.png") no-repeat; background-size: 100% 100%;}
#data #contents #real .box .graphArea { margin: 0 90px;}
#data #contents #real .box .graphArea .tit {font-size: 2.6rem; color: #222222;}
#data #contents #real .box .graphArea .tit .big { font-size: 3.5rem; color: #cb1818;}
#data #contents #real .box .graphArea .tit .en { font-size: 3.5rem; color: #cb1818; font-weight: 400;}
#data #contents #real .box .graphArea .tit .en .big { font-size: 5.6rem;}
#data #contents #real .box .graphArea .img { margin-top: 20px;}
#data #contents #real .box .graphArea .img img { max-width: 100%;}
#data #contents #real .box .staff { margin: 50px 90px 0 90px; padding: 30px 50px; background: #f8f8f8; border-radius: 5px;}
#data #contents #real .box .staff dt { font-size: 2.2rem; font-weight: 700;}
#data #contents #real .box .staff dd:nth-of-type(1) { margin-top: 20px;}
#data #contents #real .box .staff dd { margin-top: 15px;}
#data #contents #real .box .staff dd:before { width: 25px; height: 25px; margin-right: 15px; background: url("/lib/img/data/real_icon_staff.png") no-repeat; background-size: 100% 100%; content: ""; display: inline-block; vertical-align: top;}
@media screen and (max-width: 1099px) {
#data #contents #real .box .graphArea { margin: 0;}
#data #contents #real .box .staff { margin: 50px 0 0 0;}
}
@media screen and (min-width: 900px) {
}
@media screen and (max-width: 899px) {
#data #contents #real { padding: 75px 0 100px 0;}
#data #contents #real .box { margin-top: 60px;}
#data #contents #real .box .balloon { margin-bottom: 35px;}
#data #contents #real .box .balloon span { font-size: 1.4rem; padding: 20px 35px; line-height: 1.8;}
#data #contents #real .box .graphArea .tit {font-size: 1.5rem;}
#data #contents #real .box .graphArea .tit .big { font-size: 1.8rem;}
#data #contents #real .box .graphArea .tit .en { font-size: 1.8rem;}
#data #contents #real .box .graphArea .tit .en .big { font-size: 3rem;}
#data #contents #real .box .graphArea .img { margin-top: 10px;}
#data #contents #real .box .staff { margin: 25px 0 0 0; padding: 15px 20px 25px 20px;}
#data #contents #real .box .staff dt { font-size: 1.6rem;}
#data #contents #real .box .staff dd { font-size: 1.3rem; padding-left: 35px; position: relative;}
#data #contents #real .box .staff dd:nth-of-type(1) { margin-top: 15px;}
#data #contents #real .box .staff dd:before { margin-ri:0; position: absolute; left: 0; top: 0;}
}








