@charset "utf-8";
/* CSS Document */

.jm1{ background:url(../images/icons/jm_bg1.jpg) center no-repeat; background-size:cover; padding:0 0 100px;}
.jm1 img{ display:block; max-width:100%; margin:40px auto 0;}

.jm2{ padding:0 0 80px;}
.jm2 ul{ display:block; font-size:16px; margin:-1em; padding:60px 0 0;}
.jm2 ul::before,
.jm2 ul::after{ content:''; display:block; width:100%; height:0; overflow:hidden; clear:both;}
.jm2 ul li{ display:block; width:25%; float:left;}
.jm2 ul li a{ display:block; background:#faf8f8; padding:1.75em 1.75em; margin:1em; position:relative; overflow:hidden; box-shadow:0 0 7px rgba(238,238,238,0.7);}
.jm2 ul li em{ display:block; line-height:0.8; color:#e60012; font-size:18em; font-weight:bold; position:absolute; right:0; bottom:0; transform:translate(10%,8%); z-index:1; opacity:0.05; transition:all ease 0.4s;}
.jm2 ul li b{ display:block; line-height:2; color:#e60012; font-size:1.25em; padding:0 0 0.5em;}
.jm2 ul li .txt{ display:block; height:15.75em; line-height:1.75; color:#666; font-size:0.875em; position:relative; z-index:3;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:9;
}
.jm2 ul li a:hover em{ transform:translate(0%,0%);}


.jm3{ background:url(../images/icons/jm_bg3.jpg) center no-repeat; background-size:cover; padding:0 0 80px;}
.jm3 ul{ display:block; font-size:16px; margin:-1.125em; padding:60px 0 0;}
.jm3 ul::before,
.jm3 ul::after{ content:''; display:block; width:100%; height:0; overflow:hidden; clear:both;}
.jm3 ul li{ display:block; width:16.66%; float:left;}
.jm3 ul li a{ display:block; background:#fff; padding:20% 16%; margin:1.125em; position:relative; border-radius:1em; overflow:hidden; box-shadow:0 0 7px rgba(238,238,238,0.7); transition:all ease 0.4s;}
.jm3 ul li img{ display:block; height:3.5em; margin:0 auto; transition:all ease 0.4s;}
.jm3 ul li p{ display:block; height:6.5em; line-height:1.625; color:#333; text-align:justify; padding:2em 0 0; transition:all ease 0.4s;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:4;
}
.jm3 ul li a:hover{ background:#e60012; box-shadow:0 0 7px rgba(230,0,18,0.7);}
.jm3 ul li a:hover img{ filter:brightness(0) invert(1); transform:translateY(-10px);}
.jm3 ul li a:hover p{ color:#fff; transform:translateY(-10px);}

.jm4{ padding:0 0 80px;}
.jm4 ul{ display:block; font-size:16px; background:url(../images/icons/jm_title4.png) center top no-repeat; background-size:100% auto; padding:0 2.75% 0 3.5%; margin:60px 0 0;}
.jm4 ul::before,
.jm4 ul::after{ content:''; display:block; width:100%; height:0; overflow:hidden; clear:both;}
.jm4 ul li{ display:block; width:20%; float:left;}
.jm4 ul li a{ display:block; margin:0;}
.jm4 ul li b{ display:block; line-height:2.5; color:#fff; font-size:2.25em; font-weight:normal; text-align:center;}
.jm4 ul li .txt{ display:block; width:16.125em; height:16.375em; margin:2.625em auto 0;}
.jm4 ul li .txt p{ display:flex; justify-content:center; align-items:center; width:100%; height:100%; box-sizing:border-box; line-height:1.75; color:#e60012; background:url(../images/icons/jm_info4.png) center no-repeat; background-size:100% 100%; padding:2.3% 14.25% 17%;}


.jm5{ background:url(../images/icons/jm_bg5.jpg) center no-repeat; background-size:cover; padding:0 0 80px; background:#fcfcfc;}
.jm5 h3.sub{ text-align:center;}
.jm5 h3.sub::after{ margin:0 auto;}
.jm5 .txt{ color:#333; line-height:2; font-size:18px; text-align:center; padding:1.5em 0;}
.jm5 .flex{ display:flex; justify-content:center; align-items:center; font-size:16px; padding:30px 0;}
.jm5 .info{ margin:0 3.2%;}
.jm5 .info p{ display:block; line-height:2; color:#333; overflow:hidden; padding:1.25em 0;}
.jm5 .info p img{ display:block; height:2em; float:left; margin-right:0.625em;}
.jm5 .code{ margin:0 3.2%;}
.jm5 .code img{ display:block; width:12em; box-shadow:0 0 8px rgba(0,0,0,0.1);}

.jm6{ background:url(../images/icons/jm_bg5.jpg) center no-repeat; background-size:cover;}
.jm6 h3.sub{ text-align:center;}
.jm6 h3.sub::after{ margin:0 auto;}
.jm6 form.apply{ display:block; font-size:15px; overflow:hidden; padding:40px 0 80px; margin-left:-24px;}
.jm6 form.apply p{ display:block; width:calc(33.33% - 24px); box-sizing:border-box; background:#fff; overflow:hidden; border:1px solid #ddd; border-radius:5px; float:left; margin:0 0 16px 24px; position:relative;}
.jm6 form.apply p:nth-child(14){ margin-bottom:40px;}
.jm6 form.apply label{ display:block; width:4em; line-height:52px; color:#333; float:left; margin-left:1em;}
.jm6 form.apply input.text{ display:block; width:calc(100% - 5em); height:52px; box-sizing:border-box; color:#333; background:none; padding:0 1em; border:0;}
.jm6 form.apply ::placeholder{ color:#999;}
.jm6 form.apply select{ display:block; width:calc(100% - 5em); height:52px; color:#333; background:url(../images/common/select.png) right 1em center no-repeat; background-size:0.9em auto; padding:0 1em; border:0; -webkit-appearance:none;}
.jm6 form.apply select.short{ width:calc(50% - 2.5em); float:left;}
.jm6 form.apply label.radio{ width:auto; margin:0 1.5em 0 1em; cursor:pointer; user-select:none; position:relative;}
.jm6 form.apply label.radio::before{ content:''; display:block; box-sizing:border-box; width:1em; height:1em; border:1px solid #999; padding:2px; background-clip:content-box !important; position:absolute; left:0; top:50%; transform:translateY(-50%); border-radius:50%;}
.jm6 form.apply label.radio.checked::before{ background-color:#e60012; border-color:#e60012;}
.jm6 form.apply label.radio input{ display:block; width:1em; height:52px; float:left; margin-right:0.5em; cursor:pointer; visibility:hidden;}
.jm6 form.apply p.long{ width:calc(66.66% - 24px);}
.jm6 form.apply textarea{ display:block; width:calc(100% - 5em); height:52px; line-height:24px; box-sizing:border-box; color:#333; background:none; padding:14px 1em; border:0; resize:none;}
.jm6 form.apply label.long{ width:9em;}
.jm6 form.apply label.long + input.text,
.jm6 form.apply label.long + select{ width:calc(100% - 10em);}
.jm6 form.apply span{ display:block; line-height:52px; padding:0 1em; position:absolute; right:0; top:0; z-index:1;}
.jm6 form.apply input.btn{ display:block; width:15em; height:54px; color:#fff; font-size:16px; background:#e60012; border:0; border-radius:5px; overflow:hidden; clear:both; margin:0 auto; cursor:pointer;}

.main dl.jobList{ display:block; font-size:16px; overflow:hidden; padding:0 0 80px;}
.main dl.jobList dt{ display:block; line-height:3; color:#333; font-size:1.125em; background:#f8f8f8; overflow:hidden; padding:0 3%; cursor:pointer; user-select:none; margin:20px 0 0; position:relative; box-shadow:0 0 7px rgba(238,238,238,0.7); transition:all ease-out 0.4s;}
.main dl.jobList dt:first-child{ margin:0;}
.main dl.jobList dt::before,
.main dl.jobList dt::after{ content:''; display:block; width:2px; height:20px; background:#e60012; position:absolute; right:4%; top:50%; margin:-10px -1px 0 0;}
.main dl.jobList dt::after{ transform:rotate(90deg);}
.main dl.jobList dt span{ display:block; float:left;}
.main dl.jobList dt span:first-child{ width:36%;}
.main dl.jobList dt.open{ color:#fff; background:#e60012;}
.main dl.jobList dt.open::before,
.main dl.jobList dt.open::after{ background:#fff; transform:rotate(90deg);}
.main dl.jobList dd{ display:none; line-height:2.125; color:#444; overflow:hidden; background:#f8f8f8; padding:1.5em 3% 2.5em;}
.main dl.jobList dd.open{ border-color:#e60012;}






@media only screen and (max-width:1440px){

.jm2 ul li{ width:33.33%;}
.jm2 ul li:nth-child(7){ margin-left:16.666%;}

.jm3 ul li{ width:33.33%;}
.jm3 ul li a{ padding:10% 8%;}
.jm3 ul li p{ height:3.25em; -webkit-line-clamp:2; text-align:center;}

.jm4 ul li b{ font-size:2em; line-height:2.15;}
.jm4 ul li .txt{ width:94%; height:14em;}

.main dl.jobList dt span:first-child{ width:44%;}

}


@media only screen and (max-width:768px){

.main .position{ display:none;}
.main .attr h2.title em{ line-height:1.5;}
.main .attr h3.sub{ font-size:18px; padding:1em 0 0; text-align:center;}
.main .attr h3.sub::after{ margin:0 auto;}
.main .attr h2.title + h3.sub{ padding:0;}

.jm1{ padding:0 0 40px;}
.jm1 .attr h2.title{ font-size:22px;}
.jm1 .attr h3.sub{ text-align:left;}
.jm1 .attr h3.sub::after{ margin-left:0;}
.jm1 img{ margin:20px auto 10px;}

.jm2{ padding:0 0 40px;}
.jm2 ul{ font-size:13px; padding:24px 0 0;}
.jm2 ul li{ width:100%;}
.jm2 ul li:nth-child(7){ margin:0;}
.jm2 ul li a{ padding:1.5em; overflow:hidden;}
.jm2 ul li em{ font-size:14em;}
.jm2 ul li b{ padding:0 0 0.25em;}
.jm2 ul li .txt{ line-height:1.875; font-size:inherit; height:auto; -webkit-line-clamp:99;}

.jm3{ padding:0 0 40px;}
.jm3 ul{ font-size:14px; margin:0; padding:20px 0 0;}
.jm3 ul li{ width:100%;}
.jm3 ul li a{ padding:8% 10%; margin:0 0 16px;}
.jm3 ul li img{ height:2.75em;}
.jm3 ul li p{ padding:1em 0 0; line-height:1.75; height:auto; -webkit-line-clamp:99;}

.jm4{ padding:0 0 30px;}
.jm4 ul{ background:none; font-size:14px; padding:20px 0 0; margin:0 -10px;}
.jm4 ul li{ width:50%;}
.jm4 ul li:last-child{ margin-left:25%;}
.jm4 ul li a{ margin:0 6px;}
.jm4 ul li b{ background:linear-gradient(#ff7877, #cb0201); border-radius:6px; font-size:1.5em; margin:0 3%;}
.jm4 ul li .txt{ width:auto; height:6em; margin:6px 0 12px;}
.jm4 ul li .txt p{ padding:7% 10% 10%; text-align:center;}

.jm5{ padding:0 0 40px;}
.jm5 .txt{ font-size:14px;}
.jm5 .flex{ justify-content:space-between; font-size:14px; padding:0 10px; display:block;}
.jm5 .info{ margin:0;}
.jm5 .info p{ padding:0.375em 0;}
.jm5 .info p img{ height:1.5em; padding:0.25em 0;}
.jm5 .code{ margin:10px auto 0; width:9em;}
.jm5 .code img{ width:100%;}

.jm6 form.apply{ font-size:14px; padding:24px 0 40px; margin:0;}
.jm6 form.apply p{ width:100% !important; margin:0 0 12px !important; float:none;}
.jm6 form.apply label,
.jm6 form.apply span{ line-height:42px;}
.jm6 form.apply input.text{ height:42px;}
.jm6 form.apply label.radio input{ height:42px;}
.jm6 form.apply textarea{ width:100%; clear:both; padding-top:0; height:72px;}
.jm6 form.apply select{ height:42px; line-height:42px;}
.jm6 form.apply input.btn{ font-size:15px; height:46px; margin:28px auto 8px;}

.main dl.jobList{ font-size:13px;}
.main dl.jobList dt{ font-size:14.5px; line-height:3.25;}
.main dl.jobList dt::before,
.main dl.jobList dt::after{ height:16px; right:6%;}
.main dl.jobList dt span{ white-space:nowrap;}
.main dl.jobList dt span:first-child{ width:50%;}




}