@charset "UTF-8";
.contents_inner {
    display: block;
    padding-top: 120px;
    margin-top: -120px;
}
/* コンテンツ */
.img100{width: 100%;}
.w100per{width: 100%;margin: 0 auto;}
.w90per{width: 90%;margin: 0 auto;}
.w80per{width: 80%;margin: 0 auto;}
.w48per{width: 48%;margin: 0 auto;}
.w48per img{width: 100%;}
.txt_justify{text-align: justify;}
.en_ttl_h2{font-size: 2.4em;}
.spnone{display: block;}
.sponly{display: none;}
.pb100{padding-bottom:10%;}
.pt5em{padding-top: 5em;}
.pt3em{padding-top: 3em;}
.pt3em{padding-top: 3em;}
.pt1em{padding-top: 1em;}
.seo_h2{font-weight: normal;text-align: justify;}
.txt_blue{color: #036eb8;}
.overimg:hover{opacity: 0.5;}
#topimg {
	position: relative;
    width: 100%;
    height: 100vh; /* disable Fallback */
    height: calc((var(--vh, 1vh) * 100) );
    overflow: hidden;
}

.top_logo img{position: absolute;
    top: 50%;
    left: 50%;transform: translate(-50%, -50%);
width: 300px;}
.top_logo h2{position: absolute;bottom:10%;left:10%;font-size: 2.4em;color: #ffffff;line-height: 1.2em;}

/* flexbox フレックスボックス */
/* flexbox フレックスボックス */
.flexbox ,.flexbox04 {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content:space-between;
  	flex-wrap: wrap;
	width: 100%;
	margin: 0 auto;
	}
.flexbox_works {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content:space-between;
  	flex-wrap: wrap;
	width: 96%;
	margin: 0 auto;
	}
.flexbox::after{
  content:"";
  display: block;
  width:32%;
}

/* 親要素の疑似要素 */
.flexbox04::after {
    content: "";
    display:block;
    width:23%; /* 子要素と同じ幅 */
}
.flexbox04::before { 
    content: ""; 
    display:block; 
    width:23%; /* 子要素と同じ幅 */
    order: 1; /* アイテムの並び順 */
}
.box-item03 img,.box-item02 img,.box-item04 img{width: 100%;}
.box-item02{width: 48%;display: inline-block;margin:0% 0 2%;height: auto;}
.box-item03_menu{width: 32%;display: inline-block;margin:1% 0 0;height: auto;border-bottom: solid 1px #036eb8;border-right: solid 1px #036eb8;padding: 0.6em 0 0.6em 0em;}
.active{background-color: #b5b5b6;}
.arrow{
  width: 32%;
  position: relative;
  display: inline-block;
  color: #036eb8;
  vertical-align: middle;
  text-decoration: none;
  font-size: 1em;
　padding: 1em 0 1em 1em;
  font-weight: bold;
}
.arrow::after{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3%;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 0.7em;   /* arrow size */
  height: 0.7em;  /* arrow size */
  border-top: 1px solid #036eb8;  /* thickness, color */
  border-right: 1px solid #036eb8;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.box-item03{width: 31%;display: inline-block;margin:1% 0 0;height: auto;}
.box-item04{width: 23%;display: inline-block;margin:1% 0 2%;padding: 0%;}

.bk-img{
  width: 100%;
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image:url("../img/dummy_img.svg");
	float: none;
}
.works_h3{margin: 2% 0;}
.works_h2{margin: 2% 0;font-weight: bold;font-size: 1.3em;}
.voice_h2{margin: 2% 0;font-weight: bold;font-size: 1.1em;}
.contents_w90per{width: 1000px; margin: 0 auto;}

/* flexbox フレックスボックス */
/* flexbox フレックスボックス */


/* NEWS お知らせ */
.w1000_w90_top {width: 1000px;margin: 0 auto;}
.news_back{padding: 3em 0;}
.w40per{width: 28%;margin: 0 auto;}
.w60per{width: 70%;margin: 0 auto;}
.w40per img.title_h{width: 60%;margin-bottom: 3em;margin-top: 1em;}
.w40per img.news_more{width:90%;}
.news_ul{border-left: solid gray 1px;width: 95%;padding-left: 4%}
.news_kiji{background-image: url("../img/news_yajirushi.svg");background-position: center right;background-repeat: no-repeat;background-size: 10%; padding: 1.5% 0;border-bottom: dotted 1px gray;margin: 1% 0;display: block;}
.news_kiji a{color: #666666 !important;}

/* 業務案内 */
.works_back{
	background-color: #d3e6ee;
	padding: 0em 0;
	margin: 5% auto 0;
}
.en_copy{position: absolute;bottom:0;margin: 0 auto;}
.en_copy02,.en_copy03{position: absolute;bottom:0;right:0;margin: 0 auto;z-index: 100;}
.en_copy img,.en_copy02 img{width: auto;height: 60px;}
.en_copy03 img{width: auto;height: 138px;}
.mt-8per img{margin-top: -8%;}
h3.sub_h3{font-size: 1.2em;padding-bottom: 1em;}
.font_d01{font-size: 0.8em;}
.syatai{font-size: 1.6em;font-weight: bold; font-style: italic; font-family: "futura",Arial ;margin-right: 0.4em;}
.syatai02{font-size: 1.6em;font-weight: 100; font-style: italic; font-family: "futura",Arial ;margin-right: 0.2em;}
.works_content_bg{background: url("../img/works_content_back_pc.svg") repeat-y top center;
	background-size: contain;padding: 0em;position: relative;box-shadow: 5px 5px 10px #888888;
	}
.works_content_bg02{background: url("../img/works_content_back02_pc.svg") repeat-y top center;
	background-size: contain;padding: 0em;position: relative;box-shadow: 5px 5px 10px #888888;
	}
.works_60per-left{width: 45%;margin: 0 auto;padding: 5% 5% 0 10%; float: left;}
.works_40per-right{width: 40%;margin: 0 auto;float: right;}
.works_60per-right{width: 45%;margin: 0 auto;padding: 5% 10% 0 5%;float: right;}
.works_40per-left{width: 40%;margin: 0 auto;float: left;}
.works_60per-left h2,.works_60per-right h2{color: #ffffff;font-size: 3em;font-weight: normal;}
.font_d02{font-size: 0.7em;}
.font_d03{font-size: 0.5em;}
.works_40per-right img,.works_60per-left img,.works_40per-left img,.works_60per-right img{width: 100%;}
ul.works li {
list-style-type: disc;
	margin-left: 5em;
	color: #ffffff;
}
.works_more{position: relative; margin-top: 2%;z-index: 1000;}

/* 洞海の特長 */
.features_back{
	background-color: #d3e6ee;
	padding: 0em 0;
	margin: 10% auto 0;
}
.mt4em{margin-top: 4em;}
.features_more img{width: 86%;}

/* 会社概要 */
.box_shadow{box-shadow: 5px 5px 10px #888888;border-radius: 17px;}

/* リクルート */
.recruit_back{background-color: #f8b500;padding: 5em 0;}.recruit_h2{font-size: 1.6em;}
.recruit_f-left{width: 48%;float: left;}
.recruit_f-right{width: 48%;float: right;}
.ptb_3em{padding: 3em 0;}


.f-left{float: left;}
.f-right{float: right;}



/* パンくずリストcss *************************************************************** */
.bg_breadcrumb{}
.breadcrumb {
width: 1000px;
  padding: 0.2em 0em 0.4em;
  list-style: none;
  overflow: hidden;
  margin: 0 auto;
}

.breadcrumb li {
  display: inline;/*横に並ぶように*/
  list-style: none;
  font-weight: normal;/*太字*/
}
.breadcrumb li:after {/* >を表示*/
  content: '>';
  padding: 0 0.2em;
  color: #666666;
}
.breadcrumb li:last-child:after {
  content: '';
}
.breadcrumb li a {
  text-decoration: none;
  color: #666666;
	font-size: 0.8em;
}
.breadcrumb li a:hover {text-decoration: underline;}
/* パンくずリストcss *************************************************************** */



@media screen and (max-width: 560px) {
.contents_w90per{width: 90%; margin: 0 auto;}
.w48per{width: 100%;margin: 0 auto;}
.w40per{width: 100%;margin: 0 auto;}
/* パンくずリストcss *************************************************************** */
.breadcrumb {
	width: 96%;}	
.breadcrumb li a {
  font-size: 1.0em;
}	
/* パンくずリストcss *************************************************************** */	
.spnone{display: none;}
.sponly{display: block;}

.box-item02{width: 100%;display: inline-block;margin:0% 0 5%;height: auto;}
.box-item03{width: 48%;display: inline-block;margin:1% 0 2%;height: auto;}
.box-item03_menu{width: 100%;display: inline-block;margin:1% 0 0%;height: auto;}
.arrow{
  width: 100%;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  font-size: 1.2em;
	padding: 0.7em 0 0.7em 1em;
}
.arrow::after{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2%;
  margin: auto;
  content: "";
  vertical-align: middle;
  width: 0.6em;   /* arrow size */
  height: 0.6em;  /* arrow size */
  border-top: 1px solid #036eb8;  /* thickness, color */
  border-right: 1px solid #036eb8;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.f-left,.f-right{float: none;}


.top_logo img{position: absolute;
    top: 50%;
    left: 50%;transform: translate(-50%, -50%);
width: 200px;}
.top_logo h2{-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;position: absolute;bottom:20%;right:10%;font-size: 2.0em;color: #ffffff;line-height: 1.2em;}
/* NEWS お知らせ */
.w1000_w90_top {width: 90%;}
.news_ul{border-left: none;width: 100%;padding-left: 0%;}
.w40per img.title_h{width: 30%;margin-bottom: 3em;margin-top: 1em;}
.w40per img.news_more{width:50%;float: right;margin-top: 10%;}
.w60per{width: 100%;margin: 0 auto;}

/* 業務案内 */
.spmt-8per img{margin-top: 4%;}
.works_60per-left{width: 90%;margin: 0 auto;padding: 5% 5% 0 5%; float: none;}
.works_40per-right{width: 100%;margin: 0 auto;float: none;}
.works_60per-right{width: 90%;margin: 0 auto;padding: 5% 5% 0 5%;float: none;}
.works_40per-left{width: 100%;margin: 0 auto;float: none;}
.works_60per-left h2,.works_60per-right h2{color: #ffffff;font-size: 3em;font-weight: normal;}	
.en_copy{position: absolute;top:0;right:0;margin: 0 auto;}
.en_copy02,.en_copy03{position: absolute;top:0;right:0;margin: 0 auto;z-index: 10;}
.en_copy img,.en_copy02 img{width: auto;height: 38px;}
.en_copy03 img{width: auto;height: 90px;}	
.works_content_bg{background: url("../img/works_content_back_sp.svg") no-repeat top center;
	background-size: contain;padding: 0em;margin:0 0 10%; position: relative;box-shadow: 5px 5px 10px #888888;
	}
.works_content_bg02{background: url("../img/works_content_back_sp.svg") no-repeat top center;
	background-size: contain;padding: 0em;margin:0 0 10%;position: relative;box-shadow: 5px 5px 10px #888888;
	}	
.works_more{position: relative; margin-top: 2%;margin-bottom: 2%; z-index: 1000;display: block;}
/* 洞海の特長 */
.mt4em{margin-top: 1.4em;}
/* 会社概要 */
.box_shadow{box-shadow: 5px 5px 10px #888888;border-radius: 10px;}
/* リクルート */
.recruit_back{width:90%;margin: 5% auto; background-color: #f8b500;padding: 3em 0;}.recruit_h2{font-size: 1.6em;}
.recruit_f-left{width: 65%;float: left;}
.recruit_f-right{width: 32%;float: right;}
.ptb_3em{padding: 1em 0;}
.sp_border{width: 80%; border: solid 1px #000000;padding: 5%;margin-bottom: 2em;}	
.swiper-button-prev,.swiper-button-next {
    display: none;
}


}