@charset "utf-8";
/* CSS Document */
/*PC*/
@media print, screen and (min-width: 768px) {
#header {
z-index: 10000;
/*background-color: rgba(255,255,255,0.70)*/
}
/*#menu li a { color: #fff!important;}
.subMenu li a { color: #fff!important;}
*/
.logo_com {
display: none;
}
header.smaller #menu li a {
color: #333 !important;
}
#header {
z-index: 100000;
/*background-color: rgba(255,255,255,0.70)*/
} /*
.logo_Hed { display: none; }*/
/*.logo_Hed_index {
-moz-transition: all 0.3s;
position: absolute;
top: 35px;
left: 20px;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
width: 200px;
display: none;
}

.logo_Hed_index img {
width: 100%;
height: auto;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

.logo_Hed_index a {
display: block;
width: 100%;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

header.smaller .logo_Hed {
opacity: 1!important;
width: 180px;
display: block;
position: absolute;
left: 15px;
top: 16px;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

header.smaller .logo_Hed_index {
display: none;
}

header.smaller .logo_Hed img {
width: 100%;
height: auto;
}
header.smaller .subMenu li a { color: #333!important;}

header.smaller .menuWrap .menu__line { background: #000; }
header.smaller .menuWrap .menu { margin-top: 25px; }
header.smaller .menuWrap .menu__line.active { background: #000; }
.menuWrap .menu__line { background: #fff; }
.menuWrap .menu__line.active { background: #000; }*/
/*--------------------*/
/*.headerWrap:before {
content: "";
position: absolute;
bottom: 0;
right: 0;
width: 71.4%;
height: 400px;
background: #dd0012;
}*/
.hedTitWrap {
width: 100%;
height: 800px;
position: relative;
margin-top: 100px;
min-width: 1100px;
}
.headerslider {
width: 100%;
position: relative;
height: 800px;
box-sizing: border-box;
padding: 0 50px;
}
.hedTitWrap {
height: calc(100% - 60px);
padding: 0;
}
.idxHedTit {
width: 100%;
height: 100%;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.idxHedTitIn {
width: 100%;
z-index: 1000;
margin: auto auto auto 0;
text-align: left;
margin-top: 260px;
margin-left: 80px;
}
.idxHedTitIn h2 span.sp01 {
font-size: 30px;
color: #fff;
font-weight: bold;
line-height: 2em;
background: #003567;
padding: 10px 15px;
margin: 10px 0px;
}
.hedTitWrap {
height: 100%;
position: relative;
}
.idx_logo {
width: 430px;
margin: 0 auto;
}
.idx_logo span.logo_en {
display: block;
color: #fff;
font-size: 22px;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
text-align: center;
margin-top: 15px;
}
.idx_logo img {
width: 100%;
height: auto;
}
.idx_Hed_tit {
font-size: 1.8vw;
font-weight: 300;
margin-bottom: 30px;
color: #fff;
text-align: center;
}
.idx_Hed_txt {
color: #fff;
font-weight: 200 !important;
text-align: center;
line-height: 2em;
letter-spacing: 0.06em;
font-size: 14px;
}
.m-kv__scroll {
position: absolute;
font-family: Lato, sans-serif;
font-size: 1rem;
font-weight: 700;
right: -40px;
bottom: 350px;
opacity: 1;
transition: .5s;
transform: rotate(-90.1deg);
letter-spacing: .4rem;
/* cursor:pointer;*/
transform-origin: left center;
transition-delay: 0s;
z-index: 8;
}
.m-kv__line {
position: absolute;
width: 80px;
height: 1px;
background: #333;
left: -90px;
bottom: 8px
}
.m-kv__line:before {
position: absolute;
content: "";
width: 5px;
height: 5px;
background: #003567;
border-radius: 50%;
left: 75px;
bottom: -2px;
opacity: 0;
transform: translate(0);
animation: scrollMark 3.6s cubic-bezier(.645, .045, .355, 1) infinite
}
/*----------------index共通------------------------------------*/
.idx_tit {
font-size: 28px;
color: #333;
margin-bottom: 45px;
font-weight: bold;
letter-spacing: 0.07em;
}
.idx_tit span.en {
font-size: 55px;
font-weight: bold;
color: #003567;
display: block;
}
.idx_tit span.jp {
font-size: 16px;
display: block;
margin-top: 15px;
position: relative;
}
.idx_tit span.jp::before {
content: "";
display: block;
width: 30px;
height: 1px;
background: #003567;
bottom: -15px;
left: 0;
position: absolute;
}
.idx_tit_C {
margin-bottom: 45px;
font-weight: bold;
letter-spacing: 0.07em;
}
.idx_tit_C span.en {
font-size: 55px;
font-weight: bold;
color: #003567;
display: block;
text-align: center;
line-height: 1em;
}
.idx_tit_C span.jp {
font-size: 16px;
display: block;
margin-top: 15px;
position: relative;
text-align: center;
}
.idx_tit_C span.jp::before {
content: "";
display: block;
width: 30px;
height: 1px;
background: #003567;
bottom: -15px;
left: 0;
right: 0;
position: absolute;
margin: auto;
}
.idx_subtit {
font-size: 21px;
color: #333;
margin-bottom: 30px;
font-weight: bold;
}
.idx_txt {
color: #333;
font-size: 15px;
text-align: left;
line-height: 2.5em;
margin-bottom: 50px;
}
.idx_txtbox_35l {
width: 35%;
float: left;
}
.idx_imgbox_60r {
width: 60%;
float: right;
}
.idx_txtbox_35r {
width: 35%;
float: right;
}
.idx_imgbox_60l {
width: 55%;
float: left;
}
.idx_txtbox_40r {
width: 45%;
float: right;
}
/*-------------------求人新着情報--------------------------------*/
#idx_box_job {
width: 1100px;
margin: 0 auto;
margin-top: -100px;
position: relative;
z-index: 10000;
}
.job_tit_box {
padding: 15px 20px 0px;
background: #003567;
display: inline-block;
border-radius: 10px 10px 0px 0px;
}
.job_txt_box {
padding: 20px;
background: #003567;
border-radius: 0px 10px 10px 10px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.job_tit {
color: #FFF;
font-weight: bold;
}
.job_tit i {
font-size: 17px;
color: #003567;
margin-top: 2px;
background: #FFF;
width: 30px;
border-radius: 30px;
height: 30px;
text-align: center;
line-height: 30px;
margin-right: 10px;
}
.job_tit span.en {
color: #FFF;
font-size: 20px;
padding-right: 15px;
letter-spacing: -0.05em;
margin-right: 15px;
position: relative;
}
.job_tit span.en::after {
content: "";
display: block;
position: absolute;
top: 7px;
right: 0;
width: 1px;
height: 15px;
background: #FFF;
}
.job_list {
width: 85%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
.job_list li {
width: 23.5%;
margin-right: 2%;
}
.job_list li:nth-child(n+4) {
margin-right: 0px;
}
.job_list li a {
display: block;
background: #f3f7f7;
padding: 10px 10px;
border-radius: 5px;
}
.job_list li a span.short {
padding: 2px 5px;
background: #003567;
color: #fff;
border-radius: 3px;
font-size: 12px;
display: inline-block;
margin: 0px;
}
.job_list li a span {
display: block;
margin-top: 5px;
font-size: 13px;
}
.job_list li a:hover {
color: #003567;
}
.job_btn {
width: 12%;
}
.job_btn a {
display: block;
padding: 20px;
background: #FFF;
color: #003567;
text-align: center;
height: 90px;
box-sizing: border-box;
line-height: 50px;
}

#idx_box_job .bnr_rec_img{
position: absolute;
top: -120px;
right: -280px;
width: 260px;
}

/*--------------idx_box00---------------------------*/
.particles-wrap {
background-size: cover;
overflow: hidden;
position: relative;
width: 100%;
}
#particles {
position: absolute;
top: 0;
left: 0;
right: 0;
width: 100%;
margin: auto;
padding: 100px 0px;
}
#hoge {
background-size: cover;
width: 100%;
overflow: hidden;
overflow: hidden;
position: relative;
min-width: 1200px;
}
.idx_box00 {
width: 100%;
margin: 0 auto;
position: relative;
}
.idx_box00_txtbox {
width: 100%;
}
.idx_box00_tit {
writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
text-orientation: upright;
text-align: left;
font-size: 28px;
vertical-align: middle;
margin: 0 auto;
line-height: 2em;
color: #765635;
display: inline-block;
font-weight: bold;
}
.idx_box00_txt {
text-align: center;
font-size: 16px;
margin: 0 auto;
line-height: 3.5em;
font-weight: 500;
}
/*--------------idx_box01-----------------*/
#idx_box01 {
margin-bottom: 100px;
}
#idx_box01 .com_btn {
margin: auto auto auto 0;
margin-top: 30px;
}
.idx_box {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
align-items: center;
}
.idx_txtbox {
flex-basis: 43%;
margin-right: 5%;
}
.idx_imgbox {
flex-basis: 52%;
}
.idx_box01_imgin {
width: 100%;
margin: 0 auto;
}
.idx_box01_img_l {
width: 50%;
float: left;
margin-top: 150px;
}
.idx_box01_img_r {
width: 100%;
float: right;
overflow: visible;
margin-right: -350px;
margin-top: -50px;
}
.idx_box01_img_l img, .idx_box01_img_r img {
width: 100%;
height: auto;
}
.idx_list_txt {
width: 100%;
margin: 0 auto;
}
.idx_list_txt li {
position: relative;
padding-left: 23px;
line-height: 1.8em;
font-size: 16px;
}
.idx_list_txt li:nth-child(n+2) {
margin-top: 10px;
}
.idx_list_txt li::before {
content: "\f00c";
position: absolute;
left: 0;
top: 0px;
font-size: 16px;
color: #765635;
font-family: "Font Awesome 5 Free";
font-weight: bold;
display: block;
}
.idx_list_txt li span {
display: block;
color: #765635;
font-size: 15px;
line-height: 1.5em;
margin-top: 5px;
}
/*--------------idx_box02-----------------*/
#idx_box02 {
margin-bottom: 100px;
position: relative;
padding-top: 70px;
}
#idx_box02::before {
position: absolute;
top: 0;
width: 100%;
left: 0;
right: 0;
content: "";
height: 450px;
background: url("../images/index/idx_box02_bgimg.jpg") center center;
background-size: cover;
z-index: -3;
}
.idx_box02_bg {
padding: 70px 0px 120px;
width: 100%;
background: #003567;
position: relative;
z-index: 1;
margin-top: 300px;
}
#idx_box02 .idx_tit_C {
color: #fff;
text-align: center;
}
#idx_box02 .idx_tit_C span.en, #idx_box02 .idx_tit_C span.jp {
color: #fff;
}
#idx_box02 .idx_tit_C span.jp::before {
background: #fff;
left: 0;
right: 0;
margin: auto;
}
#idx_box02 .idx_box02_bg .idx_txt {
color: #fff;
text-align: center;
}
#idx_box02 .idx_subtit {
text-align: center;
margin-bottom: 50px;
}
.idx_box02_in {
width: 84%;
padding: 50px 8%;
background: #fff;
margin-top: -100px;
position: relative;
z-index: 2;
}
.idx_box02_list {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.idx_box02_list li {
width: 18%;
}
.idx_box02_list_img {
width: 120px;
margin: 0 auto 30px;
}
.idx_box02_list_img img {
width: 100%;
height: auto;
}
.idx_box02_list_txt {
color: #333;
font-weight: 500;
text-align: center;
}
#idx_box02 .com_btn {
margin: 0 auto;
margin-top: 50px;
}
/*--------------idx_box03-----------------*/
#idx_box03 {
margin-bottom: 100px;
margin-top: 100px;
}
#idx_box03 .com_btn {
margin: auto auto auto 0;
margin-top: 30px;
}
#idx_box03 .idx_box {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
#idx_box03 .idx_txtbox {
flex-basis: 43%;
margin: 0px;
}
#idx_box03 .idx_imgbox {
flex-basis: 60%;
margin-left: -10%;
}
.idx_box03_imgin {
width: 100%;
margin: 0 auto;
}
.idx_box03_img_l {
width: 50%;
float: right;
margin-top: 150px;
}
.idx_box03_img_r {
width: 100%;
float: left;
overflow: visible;
margin-left: -350px;
margin-top: -50px;
}
.idx_box03_img_l img, .idx_box01_img_r img {
width: 100%;
height: auto;
}
/*--------------idx_box04-----------------*/
#idx_box04 {
margin-bottom: 100px;
}
#idx_box04 .idx_tit_C {
text-align: center;
}
#idx_box04 .idx_txt {
text-align: center;
margin-bottom: 100px;
}
#idx_box04 .com_btn {
margin: 0 auto;
margin-top: 50px;
}
.idx_box04_list {
width: 85%;
margin: 0 auto;
position: relative;
}
.idx_box04_list::before {
content: "";
position: absolute;
width: 100%;
top: -50px;
right: -280px;
background: #003567;
height: 350px;
display: block;
z-index: -1;
}
.idx_box04_list li {
width: 32%;
margin-right: 2%;
float: left;
}
.idx_box04_list li:last-child {
margin-right: 0px;
}
.idx_box04_list li:nth-of-type(2) {
margin-top: 100px;
}
.idx_box04_list_txtbox {
margin-top: 30px;
}
.idx_box04_list_vol {
font-weight: bold;
font-size: 14px;
letter-spacing: 0.2em;
color: #003567;
margin-bottom: 15px;
}
.idx_box04_list_vol span {
position: relative;
font-weight: bold;
}
.idx_box04_list_vol span::before {
content: "";
width: 70px;
height: 1px;
background: #003567;
position: absolute;
right: -80px;
top: 6px;
display: block;
}
.idx_box04_list_name {
font-size: 18px;
font-weight: bold;
margin-bottom: 15px;
}
.idx_box04_list_name span.en {
font-size: 14px;
font-weight: bold;
padding-left: 10px;
color: #999;
letter-spacing: 0.1em;
}
.idx_box04_list_type {
font-size: 14px;
color: #999;
line-height: 1.8em;
font-weight: 500;
}
.idx_box04_list_type span.x {
padding-right: 10px;
}
.mix_s {
position: relative;
overflow: hidden;
height: 25vw;
}
.mix_s a {
position: relative;
width: 100%;
height: 100%;
display: block;
}
.mix_s a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}
.mix_s:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s
}
.mix_01::before {
background: url("../images/index/v_img01.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
.mix_02::before {
background: url("../images/index/v_img02.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
.mix_03::before {
background: url("../images/index/v_img03.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
/*----------idx_box05----------*/
#idx_box05 {
margin-bottom: 100px;
padding: 100px 0px;
background: url("../images/index/idx_box05_bgimg.jpg") center center;
background-size: cover;
}
.idx_box05_box {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.idx_box05_titbox {
width: 30%;
}
.idx_box05_txtbox {
width: 67%;
}
#idx_box05 .com_btn {
margin: auto 0 auto auto;
margin-top: 30px;
}
#idx_box05 .idx_tit_C {
color: #fff;
text-align: center;
}
#idx_box05 .idx_tit_C span.en, #idx_box02 .idx_tit_C span.jp {
color: #fff;
}
#idx_box05 .idx_tit_C span.jp::before {
background: #fff;
left: 0;
right: 0;
margin: auto;
}
#idx_box05 .idx_txt {
color: #fff;
margin-bottom: 0px;
}
#idx_box05 .idx_subtit {
color: #fff;
}
/*-----------idx_box06--------------*/
#idx_box06 {
margin-bottom: 100px;
}
.topics {
width: 100%;
margin: 0 auto;
}
.topics dl:nth-child(2n+1) {
background: #fff;
padding: 20px;
}
.topics dl:nth-child(2n+2) {
background: #f3f3f3;
padding: 20px;
}
.topics dl dt {
float: left;
width: 30%;
}
.topics dl dd {
float: right;
width: 65%;
}
/*------------topick-----------*/
.scroll-box {
width: 98%;
overflow: auto;
-webkit-overflow-scrolling: touch; /* 髫ｲ・ｷ繝ｻ・｣髫ｲ・､繝ｻ・ｧ驛｢・ｧ繝ｻ・ｹ驛｢・ｧ繝ｻ・ｯ驛｢譎｢・ｽ・ｭ驛｢譎｢・ｽ・ｼ驛｢譎｢・ｽ・ｫ */
padding: 1%;
height: 300px;
}
.scroll-box::-webkit-scrollbar {
height: 5px;
}
.scroll-box::-webkit-scrollbar-track {
border-radius: 0px;
background: #EEEEEE;
}
.scroll-box::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #666666;
}
}
/*----------------------------------------------------*/
@keyframes scrollMark {
0% {
opacity: 0;
transform: translate(0)
}
20% {
opacity: 1;
transform: translate(0)
}
80% {
opacity: 1;
transform: translate(-45px)
}
to {
opacity: 0;
transform: translate(-45px)
}
}
/*sp*/
@media only screen and (max-width: 767px) {
#header {
z-index: 10000;
/*background-color: rgba(255,255,255,0.70)*/
}
.logo_com {
display: none;
}
header.smaller #menu li a {
color: #333 !important;
}
#header {
z-index: 10;
/*background-color: rgba(255,255,255,0.70)*/
}
/*.logo_Hed_index {
-moz-transition: all 0.3s;
position: absolute;
top: 35px;
left: 20px;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
width: 200px;
display: none;
}

.logo_Hed_index img {
width: 100%;
height: auto;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

.logo_Hed_index a {
display: block;
width: 100%;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
*/
header.smaller .logo_Hed {
opacity: 1 !important;
width: 180px;
display: block;
position: absolute;
left: 15px;
top: 16px;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
header.smaller .logo_Hed_index {
display: none;
}
header.smaller .logo_Hed img {
width: 100%;
height: auto;
}
header.smaller .subMenu li a {
color: #333 !important;
}
header.smaller .menuWrap .menu__line {
background: #000;
}
header.smaller .menuWrap .menu {
margin-top: 25px;
}
header.smaller .menuWrap .menu__line.active {
background: #000;
}
.menuWrap .menu__line.active {
background: #000;
}
/*--------------------*/
.hedTitWrap {
width: 100%;
height: 400px;
position: relative;
}
.headerslider {
width: 100%;
position: relative;
height: 400px;
box-sizing: border-box;
padding: 0 15px;
}
.idxHedTit {
width: 100%;
height: 100%;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.idxHedTitIn {
width: 90%;
z-index: 100;
margin: 0 auto;
margin-top: 100px;
}
.idxHedTitIn h2 {
line-height: 1.2em;
}
.idxHedTitIn h2 span.sp01 {
font-size: 16px;
color: #fff;
font-weight: bold;
line-height: 2em;
background: #003567;
padding: 5px 10px;
margin: 10px 0px;
}
.idx_logo {
width: 430px;
margin: 0 auto;
}
.idx_logo span.logo_en {
display: block;
color: #fff;
font-size: 22px;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
text-align: center;
margin-top: 15px;
}
.idx_logo img {
width: 100%;
height: auto;
}
.idx_Hed_tit {
font-size: 1.8vw;
font-weight: 300;
margin-bottom: 30px;
color: #fff;
text-align: center;
}
.idx_Hed_txt {
color: #fff;
font-weight: 200 !important;
text-align: center;
line-height: 2em;
letter-spacing: 0.06em;
font-size: 14px;
}
.m-kv__scroll {
display: none;
}
/*----------------index共通------------------------------------*/
.idx_tit {
font-size: 28px;
color: #333;
margin-bottom: 45px;
font-weight: bold;
letter-spacing: 0.07em;
}
.idx_tit span.en {
font-size: 35px;
font-weight: bold;
color: #003567;
display: block;
}
.idx_tit span.jp {
font-size: 14px;
display: block;
margin-top: 15px;
position: relative;
}
.idx_tit span.jp::before {
content: "";
display: block;
width: 30px;
height: 1px;
background: #003567;
bottom: -15px;
left: 0;
position: absolute;
}
.idx_tit_C {
margin-bottom: 45px;
font-weight: bold;
letter-spacing: 0.07em;
}
.idx_tit_C span.en {
font-size: 35px;
font-weight: bold;
color: #003567;
display: block;
text-align: center;
}
.idx_tit_C span.jp {
font-size: 14px;
display: block;
margin-top: 15px;
position: relative;
text-align: center;
}
.idx_tit_C span.jp::before {
content: "";
display: block;
width: 30px;
height: 1px;
background: #003567;
bottom: -15px;
left: 0;
right: 0;
position: absolute;
margin: auto;
}
.idx_txtbox_35l {
width: 100%;
margin: 0 auto;
}
.idx_imgbox_60r {
width: 100%;
margin: 0 auto;
}
.idx_txtbox_35r {
width: 100%;
margin: 0 auto;
}
.idx_imgbox_60l {
width: 100%;
margin: 0 auto;
}
.idx_txtbox_40r {
width: 100%;
margin: 0 auto;
}
/*-------------------求人新着情報--------------------------------*/
#idx_box_job {
width: 85%;
margin: 0 auto;
margin-top: -50px;
position: relative;
z-index: 100;
}
.job_tit_box {
padding: 10px 15px 5px;
background: #003567;
display: inline-block;
border-radius: 10px 10px 0px 0px;
}
.job_txt_box {
padding: 15px;
background: #003567;
border-radius: 0px 10px 10px 10px;
}
.job_tit {
color: #FFF;
font-weight: bold;
font-size: 12px;
}
.job_tit i {
font-size: 14px;
color: #003567;
margin-top: 2px;
background: #FFF;
width: 30px;
border-radius: 30px;
height: 30px;
text-align: center;
line-height: 30px;
margin-right: 10px;
}
.job_tit span.en {
color: #FFF;
font-size: 14px;
padding-right: 15px;
letter-spacing: -0.05em;
margin-right: 15px;
position: relative;
}
.job_tit span.en::after {
content: "";
display: block;
position: absolute;
top: 0px;
right: 0;
width: 1px;
height: 15px;
background: #FFF;
}
.job_list {
width: 95%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.job_list li {
width: 100%;
margin-bottom: 5px;
}
.job_list li:nth-child(n+3) {
margin-top: 15px;
}
.job_list li a {
display: block;
background: #f3f7f7;
padding: 10px 10px;
border-radius: 5px;
}
.job_list li a span.short {
padding: 3px 7px;
background: #003567;
color: #fff;
border-radius: 3px;
font-size: 10px;
display: inline-block;
margin: 0px;
line-height: 1em;
}
.job_list li a span {
display: block;
margin-top: 5px;
font-size: 12px;
}
.job_list li a:hover {
color: #003567;
}
.job_btn {
width: 100%;
margin-top: 15px;
}
.job_btn a {
display: block;
padding: 10px;
background: #FFF;
color: #003567;
text-align: center;
height: 50px;
box-sizing: border-box;
}

#idx_box_job .bnr_rec_img{
position: absolute;
top: -10px;
right: -40px;
width: 120px;
}


/*--------------idx_box00---------------------------*/
#idx_box00 {
margin-bottom: 50px;
margin-top: 50px;
}
.particles-wrap {}
#particles {}
#hoge {}
.particles-js-canvas-el {
width: 100%;
height: 100% !important;
display: none;
}
.idx_box00 {
width: 100%;
margin: 0 auto;
position: relative;
}
.idx_box00_txtbox {
width: 100%;
}
.idx_box00_tit {
writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
text-orientation: upright;
text-align: left;
font-size: 20px;
vertical-align: middle;
margin: 0 auto;
line-height: 2em;
color: #765635;
display: inline-block;
font-weight: bold;
}
.idx_box00_txt {
text-align: left;
font-size: 14px;
margin: 0 auto;
line-height: 2em;
}
/*--------------idx_box01-----------------*/
#idx_box01 {
margin-bottom: 50px;
}
#idx_box01 .com_btn {
margin: auto auto auto 0;
margin-top: 30px;
}
.idx_box {
width: 100%;
margin: 0 auto;
}
.idx_txtbox {
width: 100%;
margin: 0 auto;
}
.idx_imgbox {
width: 100%;
margin: 0 auto 30px;
}
.idx_box01_imgin {
width: 100%;
margin: 0 auto;
}
.idx_box01_img_l {
width: 100%;
margin: 0 auto;
}
.idx_box01_img_r {
width: 100%;
float: right;
overflow: visible;
margin-right: -350px;
margin-top: -50px;
}
.idx_box01_img_l img, .idx_box01_img_r img {
width: 100%;
height: auto;
}
/*--------------idx_box02-----------------*/
#idx_box02 {
margin-bottom: 50px;
position: relative;
padding-top: 50px;
}
#idx_box02::before {
position: absolute;
top: 0;
width: 100%;
left: 0;
right: 0;
content: "";
height: 250px;
background: url("../images/index/idx_box02_bgimg.jpg") center center;
background-size: cover;
z-index: -3;
}
.idx_box02_bg {
padding: 50px 0px 120px;
width: 100%;
background: #003567;
position: relative;
z-index: 1;
margin-top: 150px;
}
#idx_box02 .idx_tit_C {
color: #fff;
text-align: center;
}
#idx_box02 .idx_tit_C span.en, #idx_box02 .idx_tit_C span.jp {
color: #fff;
}
#idx_box02 .idx_tit_C span.jp::before {
background: #fff;
left: 0;
right: 0;
margin: auto;
}
#idx_box02 .idx_box02_bg .idx_txt {
color: #fff;
text-align: center;
}
#idx_box02 .idx_subtit {
text-align: center;
margin-bottom: 30px;
}
.idx_box02_in {
width: 90%;
padding: 10% 5%;
background: #fff;
margin-top: -100px;
position: relative;
z-index: 2;
}
.idx_box02_list {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.idx_box02_list li {
flex-basis: 48%;
max-width: 48%;
margin-right: 4%;
}
.idx_box02_list li:nth-child(2n+2) {
margin-right: 0px;
}
.idx_box02_list li:nth-child(n+3) {
margin-top: 15px;
}
.idx_box02_list_img {
width: 50%;
margin: 0 auto 15px;
}
.idx_box02_list_img img {
width: 100%;
height: auto;
}
.idx_box02_list_txt {
color: #333;
font-weight: 500;
text-align: center;
font-size: 12px;
}
#idx_box02 .com_btn {
margin: 0 auto;
margin-top: 50px;
}
/*--------------idx_box03-----------------*/
#idx_box03 {
margin-bottom: 50px;
margin-top: 50px;
}
#idx_box03 .com_btn {
margin: auto auto auto 0;
margin-top: 30px;
}
#idx_box03 .idx_box {
width: 100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
#idx_box03 .idx_txtbox {
width: 100%;
margin: 0 auto;
}
#idx_box03 .idx_imgbox {
width: 100%;
margin: 0 auto 30px;
}
.idx_box03_imgin {
width: 100%;
margin: 0 auto;
}
.idx_box03_img_l {
width: 50%;
float: right;
margin-top: 150px;
}
.idx_box03_img_r {
width: 100%;
float: left;
overflow: visible;
margin-left: -350px;
margin-top: -50px;
}
.idx_box03_img_l img, .idx_box01_img_r img {
width: 100%;
height: auto;
}
/*--------------idx_box04-----------------*/
#idx_box04 {
margin-bottom: 50px;
}
#idx_box04 .idx_tit_C {
text-align: center;
}
#idx_box04 .idx_txt {
text-align: center;
margin-bottom: 30px;
}
#idx_box04 .com_btn {
margin: 0 auto;
margin-top: 30px;
}
.idx_box04_list {
width: 95%;
margin: 0 auto;
position: relative;
}
.idx_box04_list li {
width: 100%;
margin: 0 auto;
}
.idx_box04_list li:nth-child(n+2) {
margin-top: 30px;
}
.idx_box04_list_txtbox {
margin-top: 30px;
}
.idx_box04_list_vol {
font-weight: bold;
font-size: 14px;
letter-spacing: 0.5em;
color: #003567;
margin-bottom: 15px;
}
.idx_box04_list_vol span {
position: relative;
font-weight: bold;
}
.idx_box04_list_vol span::before {
content: "";
width: 70px;
height: 1px;
background: #003567;
position: absolute;
right: -80px;
top: 6px;
display: block;
}
.idx_box04_list_name {
font-size: 16px;
font-weight: bold;
margin-bottom: 15px;
}
.idx_box04_list_name span.en {
font-size: 12px;
font-weight: bold;
padding-left: 10px;
color: #999;
letter-spacing: 0.1em;
}
.idx_box04_list_type {
font-size: 12px;
color: #999;
line-height: 1.8em;
}
.idx_box04_list_type span.x {
padding-right: 10px;
}
.mix_s {
position: relative;
overflow: hidden;
height: 60vw;
}
.mix_s a {
position: relative;
width: 100%;
height: 100%;
display: block;
}
.mix_s a .mix_box {
position: absolute;
margin: auto;
left: 0;
right: 0;
}
.mix_s:hover::before {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
transform: scale(1.1);
transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0s
}
.mix_01::before {
background: url("../images/index/v_img01.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
.mix_02::before {
background: url("../images/index/v_img02.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
.mix_03::before {
background: url("../images/index/v_img03.jpg") center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: "";
-webkit-transition: -webkit-transform 125ms;
transition: -webkit-transform 125ms;
transition: transform 125ms;
transition: transform 125ms, -webkit-transform 125ms
}
/*----------idx_box05----------*/
#idx_box05 {
margin-bottom: 50px;
padding: 50px 0px;
background: url("../images/index/idx_box05_bgimg.jpg") center center;
background-size: cover;
}
.idx_box05_box {
width: 100%;
}
.idx_box05_titbox {
width: 100%;
margin: 0 auto 50px;
}
.idx_box05_txtbox {
width: 100%;
margin: 0 auto 0;
}
#idx_box05 .com_btn {
margin: auto 0 auto auto;
margin-top: 30px;
}
#idx_box05 .idx_tit_C {
color: #fff;
text-align: center;
}
#idx_box05 .idx_tit_C span.en, #idx_box02 .idx_tit_C span.jp {
color: #fff;
}
#idx_box05 .idx_tit_C span.jp::before {
background: #fff;
left: 0;
right: 0;
margin: auto;
}
#idx_box05 .idx_txt {
color: #fff;
margin-bottom: 30px;
}
#idx_box05 .idx_subtit {
color: #fff;
}
/*-----------idx_box06--------------*/
#idx_box06 {
margin-bottom: 50px;
}
.topics {
width: 100%;
margin: 0 auto;
}
.topics dl:nth-child(2n+1) {
background: #fff;
padding: 10px;
}
.topics dl:nth-child(2n+2) {
background: #f3f3f3;
padding: 10px;
}
.topics dl dt {
float: left;
width: 30%;
font-size: 12px;
}
.topics dl dd {
float: right;
width: 65%;
font-size: 12px;
}
/*------------topick-----------*/
.scroll-box {
width: 98%;
overflow: auto;
-webkit-overflow-scrolling: touch; /* 髫ｲ・ｷ繝ｻ・｣髫ｲ・､繝ｻ・ｧ驛｢・ｧ繝ｻ・ｹ驛｢・ｧ繝ｻ・ｯ驛｢譎｢・ｽ・ｭ驛｢譎｢・ｽ・ｼ驛｢譎｢・ｽ・ｫ */
padding: 1%;
height: 150px;
}
.scroll-box::-webkit-scrollbar {
height: 5px;
}
.scroll-box::-webkit-scrollbar-track {
border-radius: 0px;
background: #EEEEEE;
}
.scroll-box::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #666666;
}
}