@charset "utf-8";
/*                下層共通
======================================================= */
#greeting #wrapper .frame {
    padding-bottom: 70px;
}
#wrapper #main_area .main-top {
    position: relative;
    padding-top: 40px;
    padding-bottom: 20px;
}
#wrapper #main_area .main-top .kv_width {
    position: relative;
    max-width: 1140px;
    width: 1140px;
    margin: auto;
}
#wrapper #main_area .key-visual {
    position:relative;
    top:8.3333%;
    overflow: hidden;
}
#wrapper #main_area .key-visual img{
    float: right;
}
#wrapper #main_area .main-title {
    position: absolute;
    top:0;
    height: 100%;
    left:0;
}
#company #wrapper #main_area .main-title {
    padding-top:30px;
}
#wrapper #main_area .main-title .main-title-inner {
    display: table;
    height: 100%;
}
#wrapper #main_area .main-title .main-title-inner h1 {
    display: table-cell;
    vertical-align: middle;
}

/*                レイアウト
======================================================= */
/* =============== message_history ================ */
/* ---------- representative-greeting ---------- */
#greeting #wrapper #main_area .representative-greeting{
    margin-top: 67px;
    padding-bottom:52px;
    background-color: #ebf9ff;
    position: relative;
}
#wrapper #main_area .representative-greeting .main_width,
#wrapper #main_area .privacy-policy-cont .main_width,
#wrapper #main_area .business .main_width{
    position: relative;
}
#greeting #wrapper #main_area .representative-greeting >div:after {
    content: url(/media/images/lower/message_history/pen.png);
    position: absolute;
    top:230px;
    right: -80px;
}
#wrapper #main_area .representative-greeting .greeting-title,
#wrapper #main_area .privacy-policy-cont .pp-title{
    margin-top: 50px;
}
#wrapper #main_area .representative-greeting .greeting-title h2,
#wrapper #main_area .business .business-title h2,
#wrapper #main_area .privacy-policy-cont .pp-title h2 {
    position: absolute;
    font-size: 32px;
    top:-20px;
    color: #2fa8e1;
}
#wrapper #main_area .representative-greeting .greeting-cont h3,
#wrapper #main_area .representative-greeting .greeting-cont h2{ /* 20180126 Araki Edit */
    font-family: "Noto Sans Japanese", serif;
    padding-top: 52px;
    letter-spacing: -0.9px;
    font-size: 23px;
    color: #333333;
}
#wrapper #main_area .representative-greeting .greeting-cont p,
#wrapper #main_area .privacy-policy-cont .pp-text p{
    padding-top: 20px;
    font-size: 14px;
    line-height: 1.8;
}
#wrapper #main_area .representative-greeting .greeting-cont p+p,
#wrapper #main_area .privacy-policy-cont .pp-text p+p{
    padding-top: 8px;
    font-size: 14px;
    line-height: 1.8;
}
#wrapper #main_area .representative-greeting .name {
    text-align: right;
    padding-top: 22px;
    padding-right: 76px;
}

/* ---------- history ---------- */
#wrapper #main_area .history {
    padding-top:58px;
}
#wrapper #main_area .history .title h2 {
    font-size:32px;
    color:#2fa8e1;
}
#wrapper #main_area .history .contents {
    padding-top: 32px;
    overflow: hidden;
}
#wrapper #main_area .history .contents .left {
    float: left;
    width: 48.5%;
}
#wrapper #main_area .history .contents .right {
    float: right;
    width: 48.5%;
}
#wrapper #main_area .history .contents table tr th,
#wrapper #main_area .history .contents table tr td {
    text-align: left;
    border-bottom: solid 1px #dddddd;
    border-top: solid 1px #dddddd;
    padding: 17px 10px 14px 0;
}
#wrapper #main_area .history .contents table tr th {
    min-width: 69px;
    vertical-align: top;
    padding-top: 18px;
}


/* =============== company_profile ================ */
/* ---------- hoei-overview ---------- */
#wrapper #main_area .hoei-overview {
    padding-top:48px;
}
#wrapper #main_area .hoei-overview .main_width {
    position: relative;
}
#wrapper #main_area .hoei-overview > div >div:before {
    content: url(/media/images/lower/company_profile/anchor.png);
    position: absolute;
    right:-120px;
    bottom:748px;
    z-index: -100;
}
#wrapper #main_area .hoei-overview .hoei-title {
    overflow: hidden;
}
#wrapper #main_area .hoei-overview .hoei-title h2,
#wrapper #main_area .group-company-overview .group-title h2{
    font-size:32px;
    color:#2fa8e1;
    float: left;
}
#wrapper #main_area .hoei-overview .hoei-list,
#wrapper #main_area .group-company-overview .group-list {
    padding-top: 73px;
}
#wrapper #main_area .hoei-overview .hoei-list .co,
#wrapper #main_area .group-company-overview .group-list .co {
    background-color: #ebf9ff;
}
#wrapper #main_area .hoei-overview .hoei-list table tr th, tr td {
    text-align: left;
    padding: 17px 10px 14px 0;
    border-style: none;
}
#wrapper #main_area .hoei-overview .hoei-list table .lines p+p,
#wrapper #main_area .group-company-overview .group-list table .lines p+p{
    padding-top: 13px;
}
/*20190821追記*/
#wrapper #main_area .hoei-overview .hoei-list {
    padding-top: 40px;
}

/* ---------- business ---------- */
#wrapper #main_area .business {
    margin-top: 75px;
    padding-bottom: 50px;
    background-color: #ebf9ff;
}
#wrapper #main_area .business:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#wrapper #main_area .business .business-cont {
    padding-top: 55px;
}
#wrapper #main_area .business .business-title h2 {
    position: absolute;
    font-size: 32px;
    top:-16px;
    color: #2fa8e1;
}
#wrapper #main_area .business .left-photo {
    float: left;
    width: 50%;
}
#wrapper #main_area .business .right-text {
    display: block;
    float: left;
    padding-left:15px;
    width: 49%;
}
#wrapper #main_area .business .right-text p {
    line-height: 1.6;
}
#wrapper #main_area .business .right-text p+p{
    padding-top: 12px;
}
/* 20180127 Araki Add Start  */
#wrapper #main_area .business .right-text ol li {
  line-height: 1.6;
  font-size: 18px;
  text-indent: -1.35em;
  padding-left: 1.35em;
}
#wrapper #main_area .business .right-text ol li+li{
  padding-top: 12px;
}
/* 20180127 Araki Add End  */

/* ---------- group-company-overview ---------- */
#wrapper #main_area .group-company-overview {
    padding-top: 70px;
    padding-bottom: 70px;
    overflow: hidden;
}
#wrapper #main_area .group-company-overview .main_width {
    position: relative;
}
#wrapper #main_area .group-company-overview > div:before {
    content: url(/media/images/lower/company_profile/anchor.png);
    position: absolute;
    right:-120px;
    bottom: 630px;
}
#wrapper #main_area .group-company-overview .group-title h3{
    font-size:18px;
    color:#333333;
    float: left;
    line-height: 2.8;
}
#wrapper #main_area .group-company-overview .group-list table tr th, tr td {
    text-align: left;
    padding: 17px 10px 16px 0;
    border-style: none;
}
#wrapper #main_area .hoei-overview .hoei-list table tr th,
#wrapper #main_area .group-company-overview .group-list table tr th {
    min-width: 126px;
    vertical-align: top;
    padding-top: 18px;
    padding-left:20px;
}
#wrapper #main_area .group-company-overview .group-list table tr th {
    width:140px;
}
/* 20180127 Araki Add Start */
#wrapper #main_area .google-map.hoei-construction-map{
  padding-bottom: 70px;
}/* 20180127 Araki Add End */

/* =============== introduction ================ */
#wrapper #main_area .vessels-used > div {
    position: relative;
}
#wrapper #main_area .vessels-used > div:before {
    content: url(/media/images/lower/introduction/rudder.png);
    position: absolute;
    top: 16px;
    right: -67px;
    z-index: -1;
}
#wrapper #main_area .vessels-used .vessels-used-title {
    padding-top: 48px;
}
#wrapper #main_area .vessels-used .vessels-used-title h2 {
    font-size: 32px;
    top:-20px;
    color: #2fa8e1;
}

/* ---------- Ship ---------- */
#wrapper #main_area .vessels-used .Ship {
    /*margin-left: -17px;
    margin-right: -17px;* 20180126 Araki Edit*/
    margin-left: -30px;
    padding-top:30px;
    overflow: hidden;
}
#wrapper #main_area .vessels-used .Ship >div,
#wrapper #main_area .vessels-used .charter .common-background {
    /* width: 33.333%;  20180126 Araki Edit */
    width: 50%; /*25%*/
    float: left;
    /*padding-left: 17px; 20180126 Arali Edit */
    padding-left: 30px;
    /*padding-right: 17px;*/
}
#wrapper #main_area .vessels-used .Ship .text {
    padding-top:19px;
    overflow: hidden;
}
#wrapper #main_area .vessels-used .Ship .text h3,
#wrapper #main_area .vessels-used .charter .text h4 {
    font-size: 18px;
    letter-spacing: -0.4px;
}
#wrapper #main_area .vessels-used .Ship .text  dl,
#wrapper #main_area .vessels-used .charter .text dl {
    width:300px;
    padding-top:13px;
}
#wrapper #main_area .vessels-used .Ship .text  dl dt,
#wrapper #main_area .vessels-used .charter .text dl dt{
    float:left;
    clear:left;
    width: 85px;
}
#wrapper #main_area .vessels-used .Ship .text  dl dd,
#wrapper #main_area .vessels-used .charter .text dl dd{
    width: 115px;
    margin-left:27px;
    float:left;
}
#wrapper #main_area .vessels-used .Ship .text dl .c,
#wrapper #main_area .vessels-used .Ship .text dl .co,
#wrapper #main_area .vessels-used .charter .text dl .c,
#wrapper #main_area .vessels-used .charter .text dl .co{
    padding-top:6px;
}

/*20190821追加*/
#wrapper #main_area .vessels-used .Ship .shipCont {
    margin-bottom: 40px;
}
#wrapper #main_area .vessels-used .Ship .shipCont .photo {
    width: 50%;
    float: left;
}
#wrapper #main_area .vessels-used .Ship .shipCont .photo:nth-child(3){
    padding-top: 10px;
}
#wrapper #main_area .vessels-used .Ship .shipCont .text {
    width: 50%;
    float: right;
}

/* ---------- charter ---------- */
#wrapper #main_area .vessels-used .charter {
    padding-top:67px;
    padding-bottom: 70px;
    overflow: hidden;
}
#wrapper #main_area .vessels-used .charter .charter-title {
    float: left;
    width: 31%;
    padding: 51px 50px 51px;
    text-align: center;
    border:solid 1px #2fa8e1;
}
#wrapper #main_area .vessels-used .charter .charter-title h3 {
    font-size: 24px;
    color: #2fa8e1;
    letter-spacing: -1px;
}
#wrapper #main_area .vessels-used .charter .charter-title p {
    font-size: 14px;
    font-weight: bold;
    color: #2fa8e1;
    letter-spacing: -1px;
}
#wrapper #main_area .vessels-used .charter .common-background {
    background-image:url(/media/images/lower/introduction/charter_rudder.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-color: #ebf9ff;
    padding:27px 70px 27px 32px;
    width: 31%;
}
#wrapper #main_area .vessels-used .charter .common-position {
    margin-left: 34px;
}
#wrapper #main_area .vessels-used .charter .common-top {
    margin-top: 34px;
}
#wrapper #main_area .vessels-used .charter .middle-height {
    padding:28px 70px 44px 29px;
}


/* =============== privacy-policy ================ */
#privacy-policy #wrapper #main_area .privacy-policy-cont {
    margin-top: 67px;
    padding-bottom:66px;
    position: relative;
}
#wrapper #main_area .privacy-policy-cont .pp-title h2 {
    letter-spacing: -2px;
}
#wrapper #main_area .privacy-policy-cont .pp-text .overview p{
    padding-top: 49px;
    font-size: 14px;
    line-height: 1.8;
}
#wrapper #main_area .privacy-policy-cont .pp-text .clause {
    padding-top: 30px;
}
#wrapper #main_area .privacy-policy-cont .pp-text .clause h3 {
    font-weight: bold;
    font-size: 18px;
    letter-spacing: -0.6px;
}
#wrapper #main_area .privacy-policy-cont .pp-text .clause>p{
    padding-top: 11px;
    font-size: 14px;
    line-height: 1.75;
}

/*                   画像横並び_20190821追記
================================================================ */
#wrapper #main_area .hoei-overview .photo_gallery {
    display: flex;
    justify-content: space-between;
    padding-top: 40px;
}

/*                   採用情報ページ
================================================================ */
#company.recruit .bgco{
    background-color: #ebf9ff;
}
#company.recruit #main_area .hoei-overview .hoei-cont .main_text {
    padding-bottom: 48px;
}
#company.recruit #main_area .hoei-overview .hoei-cont .main_text p {
    font-size: 18px;
}
#company.recruit #main_area .hoei-overview .hoei-cont .sub_text {
    /* padding-top: 15px; */
    padding-bottom: 20px;
    font-size: 18px;
}
#company.recruit #main_area .hoei-overview .hoei-list {
    padding-top: 10px;
}
#company.recruit #main_area .hoei-overview .hoei-list.list1 {
    padding-bottom: 40px;
}
#company.recruit #main_area .hoei-overview .hoei-cont .recruit_info {
    padding-top: 40px;
    padding-bottom: 70px;
}
#company.recruit #main_area .hoei-overview .hoei-list table tr th {
    width: 170px;
}

#company.recruit #main_area .recruit-cont {
    padding-bottom:66px;
    position: relative;
}
#company.recruit #main_area .recruit-cont .pp-title h2 {
    letter-spacing: -2px;
}
#company.recruit #main_area .recruit-cont .pp-text .overview p{
    padding-top: 49px;
    font-size: 14px;
    line-height: 1.8;
}
#company.recruit #main_area .recruit-cont .pp-text .clause {
    padding-top: 30px;
}
#company.recruit #main_area .recruit-cont .pp-text .clause h3 {
    font-weight: bold;
    font-size: 18px;
    letter-spacing: -0.6px;
}
#company.recruit #main_area .recruit-cont .pp-text .clause>p{
    padding-top: 11px;
    font-size: 14px;
    line-height: 1.75;
}