@charset "utf-8";

/*---------------------------------------------
	body
---------------------------------------------*/
html {
  scroll-behavior: smooth;
  font-size: 62.5%;
}

/* 10px */
body {
  width:100%;
  font-size: 2.0rem;
  color: #333;
  line-height: 1.9;
  text-align: left;
  -webkit-text-size-adjust: 100%;
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500!important;
}

/* 16px */
p {
  width:90%;
  margin:0 auto 1.5em;
  font-size: 2.0rem;
  line-height: 1.7 !important;
}



/*---------------------------------------------
 **  フォント
---------------------------------------------*/
.mincho {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}


/*---------------------------------------------
 **  フッターナビ
---------------------------------------------*/
#footer #nav ul {
  display:none;
}


/*------F---------------------------------------
 **  メイン画像
---------------------------------------------*/

/*---------------------------------------------
	Anchor
---------------------------------------------*/
a {
  outline: none;
}

a:link {
  text-decoration: none;
  color: #171A5F;
  text-decoration: none;
}

a:visited {
  text-decoration: none;
  color: #171A5F;
}

a:hover {
  color:#c54720;
  text-decoration: none;
}

a:active {
  text-decoration: none;
  color:#c54720;
}

a {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

/*---------------------------------------------
	p
---------------------------------------------*/
p {
  margin-bottom: 1.5em;
}

p + a {
  margin-top: 1.5em !important;
}

p + div {
  margin-top: 1.5em !important;
}

.line_yes{
  display: inline;
}
.br_no{
  display: none;
}
/*---------------------------------------------
	imgbox
---------------------------------------------*/
.imgbox img{ width: 100% !important; }


/*---------------------------------------------
 ** ON OFF hover
---------------------------------------------*/
.hover {
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.hover:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -ms-filter: "alpha( opacity=60 )";
}


/*---------------------------------------------
 **  ページトップ
---------------------------------------------*/
#pageTop {
  width:100px;
  height:60px;
  border-radius: 50px;
  padding: 40px 3px 0px 3px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  color:#fff;
  font-size:1.6rem;
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 999;
}


#pageTop a {
  width:100px;
  height:100px;
  display: block;
  position:relative;
}
#pageTop a:link,#pageTop a:visited {
  color:#fff;
}

#pageTop a:hover,#pageTop a:active {
  opacity: 0.7;
}

#pageTop a::before {
  content:url(../img/common/arrow.png);
  display: block;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
  position:absolute;
  top:-25px;
  right:0;
  left:0;
  margin:0 auto;
}


/*---------------------------------------------
 ** パンくずリスト
---------------------------------------------*/
nav#breadcrumbs ol {
  padding: 0 2%;
}

nav#breadcrumbs ol li {
  display: inline;
  list-style-type: none;
  font-size: 80%;
}

nav#breadcrumbs ol li:before {
  content: " > ";
}

nav#breadcrumbs ol li:first-child:before {
  content: "";
}

/*=================================================================================================================================*/
/**  共通部分	*/
/*=================================================================================================================================*/
.g_color{
  background: #171c61; /* Old browsers */
  background: -moz-linear-gradient(top,  #171c61 0%, #0085b2 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #171c61 0%,#0085b2 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #171c61 0%,#0085b2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#171c61', endColorstr='#0085b2',GradientType=0 ); /* IE6-9 */
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/*---------------------------------------------
 ** 見出し
---------------------------------------------*/
/*---------------------------------------------
 ** h2
---------------------------------------------*/
h2{
  font-size:4.5rem;
  font-weight: bold;
  text-align: center;
  background: linear-gradient( to bottom, #171c61 0%,#0085b2 100%);
  -webkit-background-clip: text;
  color: transparent;
  line-height: 1.4;
  margin-bottom: 3%;
  padding-bottom: 1%;
  padding-top: 2%;
}
#index h2{
  font-size:4.5rem;
  font-weight: bold;
  text-align: center;
  background: linear-gradient( to bottom, #171c61 0%,#0085b2 100%);
  -webkit-background-clip: text;
  color: transparent;
  line-height: 1.4;
  margin-bottom:3%;
  border-bottom: none;
  padding-bottom: 0;
}


h2 span{
  color:#333;
  font-size:1.6rem;
  font-weight: bold;
  display: block;
}

/*---------------------------------------------
 ** h3
---------------------------------------------*/
h3 {
  margin-bottom: 1.5rem;
  color: #171A5F;
  font-weight: bold;
}
h4{
  color: #171A5F;
  font-weight: bold;
  font-size: 16px;
}

/*---------------------------------------------
 ** コンテンツ全体
---------------------------------------------*/
#content {
  width: 100%;
  margin: -150px auto 0;
  padding-top:20px;
}

#index #content {
  width: 100%;
  margin: -50px auto 0;
}

#main {
  width: 100%;
  margin: 0 auto;
  padding: inherit;
}


ul.serviceList li{
  list-style-type: unset;
  list-style-position: inside;
  margin-left: 2em;
  background: #DFF2FC;
  padding: 10px 15px;
  margin-bottom: 10px;
  border-radius: 5px;
}




/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/
header {
  width: 100%;
  position:relative;
}
/*
header::before {
  content:url(../img/common/bg_tri.png);
  position:absolute;
  left:-35px;
  top:-28px;
}
*/
.header_wrapper {
  width:100%;
  height: 647px;
  background:url(../img/common/main_img5.jpg) no-repeat top 120px center;
  background-size:100%;
  z-index: 99;
}
#index .header_wrapper {
  width:100%;
  height:619px;
  background:url(../img/top/main_img.jpg) no-repeat top 120px center;
  background-size:100%;
  z-index: 99;
}
#about .header_wrapper {  background:url(../img/common/main_img1.jpg) no-repeat top 120px center; background-size:100%;}
#recruit .header_wrapper {  background:url(../img/common/main_img2.jpg) no-repeat top 120px center;background-size:100%;}
#company .header_wrapper {  background:url(../img/common/main_img3.jpg) no-repeat top 120px center;background-size:100%;}
#contact .header_wrapper {  background:url(../img/common/main_img4.jpg) no-repeat top 120px center;background-size:100%;}

.header_wrapper{
  margin-bottom: 50px;
}

/* ヘッダー */
.header_inner {
  width:100%;
  max-width: 1200px;
  margin:0 auto;
  position: relative;
}

#header .tel_box{
  width:290px;
  position:absolute;
  top:50px;
  right:20px;
}
.tel_box p{
  font-size:3.0rem;
  text-align:right;
  font-weight: bold;
  z-index:2;
  letter-spacing:1.5px;
}
.tel_box p span{
  display: inline-block;
  background:url(../img/common/tel.png) no-repeat;
  padding:0% 0 3% 16%;
}

.tel_box p a{
  text-decoration:none;
}
.tel_box p a:hover{
  text-decoration:none;
}

/* ロゴ */
.header_wrapper h1{
  width:220px;
  text-align: left;
  position:absolute;
  top:50px;
  left:0;
}



/*---------------------------------------------
 **  ナビゲーション
---------------------------------------------*/
#nav ul li span{
  display: none;
}
#nav ul li {
	list-style-type: unset;
  margin-left: 0;
}
#nav ul{
  margin-bottom: 0;
}


/* メインイメージ */
#main{
  max-width:1600px;
  margin:0 auto;
}
#main div{
  width:97%;
  margin:0 auto;
  border-radius: 20px;
  background:url(../img/main_img/main.jpg) no-repeat;
  background-size: 100%;
  padding:17% 0;
}
#main_text{
  animation-name: fadein;
  animation-duration: 3s;
  animation-iteration-count: 1;
}
@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(30px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

section{
  max-width:1200px;
  margin:0 auto 90px;
  position:relative;
  background:#fff;
}

.pan{max-width:1200px;margin:0 auto 20px;}

.pan div{width:95%;}


/*---------------------------------------------
 ** トップ コンテンツ
---------------------------------------------*/
#top_info{
  width:100%;
  height:284px;
  max-width:1200px;
  margin:-200px auto 50px;
  position:relative;
}
#top_info #info_block{
  width:284px;
  height:284px;
  position:absolute;
  bottom:0;
  left:0;
}
#top_info #info_block p:nth-child(1){
  color:#fff;
  font-size:3.0rem;
  font-weight: bold;
  position:absolute;
  bottom:170px;
  left:30px;
}
#top_info #info_block p:nth-child(1) span{
  color:#fff;
  font-size:1.8rem;
  font-weight: normal;
  position:absolute;
  display: block;
}
#top_info #info_block p:nth-child(2){
  color:#fff;
  font-size:1.8rem;
  position:absolute;
  bottom:30px;
  left:30px;
  background:url(../img/common/arrow.png) no-repeat top 6px left 0;
  padding-left:22px;
}
#top_info #info_block p:nth-child(2) a:link,
#top_info #info_block p:nth-child(2) a:visited{
  color:#fff;
}
#top_info #info_block p:nth-child(2) a:hover,
#top_info #info_block p:nth-child(2) a:active{
  color:#171A5F;
}

#top_info #info_dl{
  width:85%;
  background:#fff;
  display: flex;
  position:absolute;
  bottom:-1px;
  right:0;
}
#top_info #info_dl dl{
  width:44%;
  background:#fff;
  border-left: 10px solid;
  border-image: linear-gradient(to bottom, #171c61 0%, #0085b2 100%);
  border-image-slice: 1;
  margin:2% 4%;
  padding:1% 2%;
}
#top_info #info_dl dl:last-child{
  margin:2% 4% 2% 0;
}
#top_info #info_dl dl dt{
  font-size:2.4rem;
  font-weight: bold;
  border-bottom:1px solid #333;
}
#top_info #info_dl dl dt span{
  font-size:1.8rem;
  font-weight: normal;
  display: block;
}
#top_info #info_dl dl dd{
  margin-top:2%;
}

#top_info #info_dl dl a:link dt span,
#top_info #info_dl dl a:visited dt span,
#top_info #info_dl dl a:link dd,
#top_info #info_dl dl a:visited dd{
  color:#333;
}
div.fix_img{
  position:relative;
}

.top_con img{
  margin-bottom:15px;
}
.top_con p{
  width:210px;
  display: inline-block;
  color:#fff;
  font-weight: bold;
  font-size:110%;
  background:#162165;
  position:absolute;
  bottom:20px;
  right:20px;
  border-radius: 8px;
}


.top_con p span{
  display: inline-block;
  background:url(../img/common/arrow.png) no-repeat top 21px left 25px;
  padding:10px 30px 10px 50px;
}
.top_con a:hover p, .top_con a:active p{
  background:#00698C;
}

.top_con dl dt{
  font-size:2.8rem;
  font-weight: bold;
  padding:0 3%;
}
.top_con dl dd{
  padding:0 3%;
}

#top_other > div{
  display: flex;
}
#top_service > div, #top_recruit > div{
  position:relative;
}

/*
.top_service_l{
  width:63%;
}
.top_service_r{
  width:33%;
  margin-left:4%;
  position:relative;
}
*/

.top_other_l{
  width:44%;
  position:relative;
  margin-left:4%;
}
.top_other_r{
  width:44%;
  margin:0 4%;
  position:relative;
}


/*---------------------------------------------
 ** 下層ページ
---------------------------------------------*/
.text_title{
  width:100%;
  max-width: 1200px;
  margin:0 auto!important;
  position: relative;
  background:#fff;
  padding:5% 0 1%;
}

.text_box{
  width:100%;
  max-width: 1200px;
  margin:0 auto 30px!important;
  position: relative;
  background:#fff;
  padding-bottom:0;
}
.img_box{
  width:100%;
  max-width: 1200px;
  margin:-30px auto 90px!important;
  background:#fff;
  position: relative;
  padding-bottom:0;
}
/* 会社概要 */

.company_box{
  width:100%;
  max-width: 1200px;
  margin:0 auto 30px!important;
  position: relative;
  background:#fff;
  padding-bottom:0;
}
.company_box div:nth-child(1){
  width:74%;
}
.company_box div:nth-child(1) p{
  padding:7% 3% 3%;
  font-size:30px;
  font-weight: bold;
  text-align: center;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
  margin:0 0 0 7%;
}
.company_box div:nth-child(1) p.p_name{
  padding: 0 5%;
  font-size:24px;
  text-align: right;
  border:none;
}
.company_box div:nth-child(1) p.p_name span{
  font-size:14px;
  display: block;
}

.company_box div:nth-child(2) {
  width:220px;
  position:absolute;
  bottom:-20px;
  right:3%;
}

.company_box .wp-block-image {
  margin-bottom:0;
}

.about_title01, .about_title02{
  width:100%;
  position:relative;
  text-align: center;
  font-size:3.0rem;
  padding-top: 20px;
}
.about_title01::before{
content:'';
width:30%;
max-width:100px;
height:auto;
min-height:100px;
display: block;
position:absolute;
top:-70px;
left:0;
right:0;
margin:0 auto;
background:url(../img/common/icon_light.png) no-repeat;
background-size:100%;
}
.about_title02::before{
content:'';
width:30%;
max-width:100px;
height:auto;
min-height:100px;
display: block;
position:absolute;
top:-70px;
left:0;
right:0;
margin:0 auto;
background:url(../img/common/icon_lan.png) no-repeat;
background-size:100%;
}

.about_list{
  width:100%;
  display: flex;
  flex-wrap: wrap;
  margin:3% auto 1%;
  padding:0;
}
.about_list li{
    width: 29%;
    margin:0 2% 0 0;
    text-align: center;
    color: #171a5f;
    padding:2% 1%;
    list-style: none;
    font-size:2.8rem;
    font-weight: bold;
    background: #edfaff;
    border: 6px solid #171a5f;
}
.about_list li span{
  font-size:70%;
  font-weight: normal;
}
.about_list li:last-child{
  margin-right:0;
}
.about_list li:nth-child(1){
}

.about_list_lan li{
  background: #edfaff;
}

.about_text{
  width:95%;
  font-size:105%;
}
.about_text span{
  font-size:110%;
  color:#171A5F;
  font-weight: bold;
}

/* 採用 */
.table_title{
  color:#fff;
  font-size:120%!important;
  text-align: center;
  background: #171c61!important; /* Old browsers */
  background: -moz-linear-gradient(top,  #171c61 0%, #0085b2 100%)!important; /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #171c61 0%,#0085b2 100%)!important; /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #171c61 0%,#0085b2 100%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#171c61', endColorstr='#0085b2',GradientType=0 )!important; /* IE6-9 */
}

.rec_human{
  width:90%;
  margin:0 auto;
}
.rec_human dl{
  width:100%;
  display: flex;
  flex-wrap: wrap;
}
.rec_human dt{
  padding:1% 2%;
  border-left: 10px solid;
  border-image: linear-gradient(to bottom, #171c61 0%, #0085b2 100%);
  border-image-slice: 1;
  font-size:140%;
  font-weight: bold;
  background-color:#edfaff;
}
.rec_human dd{
  padding:2% 2% 5% 7%;
  font-size:110%;
  margin:1% 0 3%;
  border-bottom:1px solid #999;
}
.rec_human dd.ok{
  background: url(../img/recruit/icon_ok.png) no-repeat top 10px left;
  background-size:55px;
}
.rec_human dd.good{
  background: url(../img/recruit/icon_good.png) no-repeat top 10px left;
  background-size:55px;
}
.rec_name{
  font-size:120%;
  color:#171A5F;
  font-weight:bold;
  text-align: center;
  margin-bottom:1%;
}
.rec_message{
  font-size:140%;
  font-weight: bold;
  text-align: center;
  color:#171A5F;
  margin-bottom:1%;
}
.rec_safety{
  width:90%;
  margin:3% auto;
}
.rec_safety li{
  list-style: none;
  text-indent: -1.3em;
  margin-bottom:1em;
}
.rec_safety li::before{
  content:'■ ';
  color:#171A5F;
}



/*---------------------------------------------
 ** 共通 コンテンツ
---------------------------------------------*/
.smallImg{ text-align: center;}
.smallImg img{ max-width: 800px;  }


/*---------------------------------------------
 ** フッター コンテンツ
---------------------------------------------*/
.foot_img{
  width:100%;
  height:200px;
  position:relative;
}
.foot_img ul{
  width:100%;
  max-width: 1200px;
  display: flex;
  margin:0 auto;
  position:absolute;
  bottom:-80px;
  left:0;
  right:0;
}
.foot_img ul li{
  width:23.5%;
  margin-right:2%;
}
.foot_img ul li:last-child{
  margin-right:0;
}
.foot_img img{
  max-width:288px;
}


.footer_wrapper{
  text-align: center;
}
.foot_box{
  width:95%;
  margin:8% auto 2%;
  max-width:1200px;
  display: flex;
}
.foot_box h1{
  width:40%;
  text-align: left;
}
.foot_box h1 img{
  max-width:437px;
}

.foot_box p{
  width:60%;
  font-weight: bold;
  font-size:2.2rem;
  text-align: right;
  margin-top:0.2%;
  color:#000;
}




/* コピーライト */
#copyright {
  font-size: 0.8em;
  width: 100%;
  text-align: center;
  letter-spacing: 3px;
  padding: 15px 0 30px;
  color:#666666;
}



.balloon1-right,
.balloon1-left{
  position: relative;
  display: inline-block;
  margin: 1.5em 0 1.5em 15px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  background: #e0edff;
  font-size: 18px;
  font-weight: bold;
  padding: 10px 15px;
  text-align: center;
  box-shadow: 2px 2px 4px #ddd;
}


.balloon1-left:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -20px;
  margin-top: -10px;
  border: 10px solid transparent;
  border-right: 10px solid #e0edff;
}

.balloon1-left p,
.balloon1-right p {
  margin: 0;
  padding: 0;
}

.balloon1-right:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -10px;
  border: 10px solid transparent;
  border-left: 10px solid #e0edff;
}


.icon_ok{
  background: url(../img/recruit/icon_ok.png) no-repeat;
  background-size:40px;
  padding: 0 20px 0 55px !important;
  margin-left: 15px;
  width: 80%;
}
.icon_good{
  background: url(../img/recruit/icon_good.png) no-repeat;
  background-size:40px;
  padding: 0 20px 0 55px !important;
  margin-left: 15px;
  width: 80%;
}


/* コンタクトフォーム7 */

.wpcf7{
  width:90%;
  max-width:800px;
  margin:0 auto;
}

/* 必須マーク */
.must{
	color: #fff;
	margin-right: 10px;
	padding: 6px 10px;
	background: #00468C;
	border-radius: 5px;
}

/* 任意マーク */
.free {
	color: #fff;
	margin-right: 10px;
	padding: 6px 10px;
	background: #999;
	border-radius: 5px;
}

/* 項目名を太字にする */
form p {
	font-weight: 600;
  margin-bottom:50px!important;
}

/* 入力項目を見やすくする */
input.wpcf7-form-control.wpcf7-text,select,
textarea.wpcf7-form-control.wpcf7-textarea {
	width: 100%;
	padding: 8px 15px;
	margin-right: 10px;
	margin-top: 10px;
	border: 1px solid #d0d5d8;
	border-radius: 3px;
}
textarea.wpcf7-form-control.wpcf7-textarea {
	height: 200px;
}

/* 必須項目の入力欄を黄色にする */
/*input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required,select {
	background: rgba(255, 255, 142, 0.46);
}
*/

/* 送信ボタンを見やすくする */
input.wpcf7-submit {
	width: 100%;
	height: 80px;
	background: #00468C;
	color: #fff;
	font-size: 20px;
	font-weight: 600;
}

/* エラーメッセージを見やすくする */
span.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
	color: red;
	font-weight: 600;
}

.screen-reader-response{
  margin-bottom:30px;
}

.wpcf7-validation-errors, .screen-reader-response ul{
  display: none;
}

#wpcf7-f35-p404-o1 > .screen-reader-response{ display: none;}

/* サンクス画面 */
.wpcf7-mail-sent-ok{
  width:100%;
  margin:30px auto;
  border:2px solid #ff6990;
  background-color:#fbd5df;
  text-align: center;
  padding:20px;
}
