@charset "utf-8";


/* common ---------------- */
#contents { padding-top:40px; }

/* title */
.pageTitle { position:relative; z-index:3; min-height:150px; margin-bottom:2.5em; }
.pageTitle .ttlbox { width:26.2%; padding-top:1em; }
.pageTitle .ttlbox .secttl { margin-left:-.7em; margin-bottom:0; }
.pageTitle .img { position:absolute; top:0; bottom:0; right:0; z-index:-1; width:70%;
 background:url(../img/title/greeting.jpg) no-repeat left center / cover }
.pageTitle:after { content:""; position:absolute; top:3.75em; bottom:-2em; left:0; right:0; z-index:-2; background:#dfe5e8; }

#info .pageTitle .img { background-image:url(../img/title/info.jpg); }
#company .pageTitle .img { background-image:url(../img/title/company.jpg); }
#history .pageTitle .img { background-image:url(../img/title/history.jpg); }
#topics .pageTitle .img { background-image:url(../img/title/topics.jpg); }

.subttl { position:relative; z-index:2; overflow:hidden; margin-bottom:1.2em; padding:1em 0; font-size:1.4em; font-weight:bold; text-align:center; }
.subttl span { display:inline-block; line-height:1.5; background:#e8edf0; }
.subttl:before { content:""; position:absolute; top:-.5em; bottom:-.5em; left:0; right:0; z-index:-1; width:1px; margin:0 auto; background:#929da6; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* tbl */
.tbl .row { margin-bottom:.6em; }
.tbl .row > * { padding:.4em .2em; }
.tbl .row:last-child, .tbl2 .row:last-child { margin-bottom:0; }
.tbl .row dt { margin-bottom:.2em; font-weight:bold; border-bottom:1px solid #506b81; }

.tbl2 .row { display:-webkit-flex; display:flex; margin-bottom:.6em;
  -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; }
.tbl2 .row dt { padding:.2em .8em; width:7em; background:#ccd6df; text-align:center; }
.tbl2 .row dd { padding:.2em 0 .2em 1em; -webkit-box-flex:1;-ms-flex:1;flex:1; }

/* contents ---------------- */

/*  ごあいさつ
============================================= */
.greeting-box { position:relative; }
.greeting-box .ttl { position:absolute; top:32vw; right:0; z-index:-1; font-size:4em; color:#dfe5e8; line-height:1; letter-spacing:.1em; }
.greeting-con { -webkit-box-align:start; align-items:flex-start; }
.greeting-con figure { position:relative; z-index:2; width:40%; margin:1em auto; }
  .greeting-con figure:before { content:""; position:absolute; top:2%; left:-12%; width:53%; height:1px; background:#fff; -webkit-transform:rotate(-30deg) translateX(-7%); transform:rotate(-30deg) translateX(-7%); }
  .greeting-con figure:after { content:""; position:absolute; top:-10px; left:-10px; z-index:-1;
    width:100%; height:100%; background:#929da6; }
  .greeting-text .text { line-height:2; }
  .greeting-text .ceo_name { margin-top:3em; text-align:right; }
  .greeting-text .ceo_name span { font-size:1.5em; }

/*  事業案内
============================================= */
#info { counter-reset:bus-num; }
.bus-box { position:relative; overflow:hidden; margin-bottom:70px; padding-bottom:2em; }
  .bus-box:before { content:""; position:absolute; top:25%; right:0; bottom:0; left:0; z-index:-1; background:#dfe5e8; }
  .bus-box .inner { -webkit-box-align:start; align-items:flex-start; }

.bus-con { padding-top:6.5%; }
  .bus-con .ttl { position:relative; margin-bottom:1.8em;
   font-weight:bold; font-size:1.3em; -webkit-font-feature-settings:"palt"; font-feature-settings:"palt"; letter-spacing:.1em; line-height:1.6; }
  .bus-con .ttl:before { content:counter(bus-num); counter-increment:bus-num; position:absolute; z-index:-1; top:-.35em; left:.1em; display:block; color:#ccd6df; font-size:4.615em; font-weight:lighter; line-height:1;
    font-family: "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;  }

.bus-company-box { position:relative; margin-top:2.5em; }
  .bus-company-box:before, .bus-company-box:after,
  .bus-company-list:before, .bus-company-list:after {
    content:""; position:absolute; width:5px; height:5px; border:1px solid #506b81; }
  .bus-company-box:before { top:0; left:0; border-bottom:none; border-right:none; }
  .bus-company-box:after { top:0; right:0; border-bottom:none; border-left:none; }
  .bus-company-list:before { bottom:0; left:0;  border-top:none; border-right:none; }
  .bus-company-list:after { bottom:0; right:0; border-top:none; border-left:none; }
.bus-company-list { padding:.7em; border:1px solid #ccd6df; }
  .bus-company-list li { margin-top:2%; -ms-flex-preferred-size:48%; flex-basis:48%;
   -webkit-box-flex:1; -ms-flex-positive:1; flex-grow:1; }
  .bus-company-list li:not(:only-child) { max-width:48%; margin-right:2%; }
  .bus-company-list li:nth-child(-n + 2) { margin-top:0; }
  .bus-company-list li a { display:block; padding:.5em; border-radius:5px; }
  .bus-company-list li a:hover { background:#f0f4f7; }

.bus-img { position:relative; margin-top:2em; padding-bottom:2em; }
  .bus-img:before { content:""; position:absolute; top:19%; bottom:0; left:2.5em; z-index:-1; width:150%; background:#929da6; }
  .bus-img figure { width:47%; }
  .bus-img .img1 { padding-top:14%; }

/* イベント */
.event-box { margin-bottom:40px; padding:1.5em; background:#f0f4f7; }
.event-con, .event-slide { width:100%; }

.event-box .ttl { position:relative; margin:1.2em 0; padding-bottom:.6em; font-size:1.375em; font-weight:bold; line-height:1.6; }
.event-box .ttl span { font-size:.727em; }
.event-box .ttl:before { content:""; position:absolute; left:0; bottom:0; width:1em; height:1px;  background:#929da6; }
.event-box .text + .link { margin-top:2.5em; }
.event-box .link .button { text-align:left; }

.slick-arrow { position:absolute; top:0; bottom:0; z-index:99; width:0; height:0; margin:auto 0; padding:0; font-size:0; text-indent:-9999px; border:none; border-width:8px; border-style:solid; border-color:#929da6 transparent transparent #001a2c; background:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); cursor:pointer; }
.slick-arrow:focus { outline:none; }
.slick-next { right:-12px; -webkit-transform:rotate(135deg); transform:rotate(135deg);
  border-color:#001a2c transparent transparent #929da6; }
.slick-prev { left:-12px; }
.slider-nav .slick-list { margin-right:-5px; }
.slider-nav .slick-slide { margin-right:5px; }

/*  会社概要
============================================= */
.com-box { margin-bottom:60px; }
.com-name { position:relative; margin-bottom:1.2em; padding-top:1.8em; padding-left:0em; font-size:1.375em; font-weight:bold; line-height:1.5; }
.com-name:before { content:""; position:absolute; top:0; left:0; width:4em; height:3em; background:no-repeat left center / 100%; }
.com-box .url { overflow:hidden; text-overflow:ellipsis; }
.com-box .url a { overflow:hidden; max-width:100%; white-space:nowrap; text-overflow:ellipsis; }


#group .com-name:before { background-image:url(../img/common/logomark_izutsu.svg); }
#daikonya .com-name:before { background-image:url(../img/common/logomark_daikonya.svg); }

#group .com-name { padding-top:1.6em }
#daikonya .com-name { padding-top:.2em }
#tratto .com-logo img { height:40px; }

.com-group-list { margin:55px 0 -3%; }
.com-group-list li { width:100%; margin-bottom:3%; padding:1.2em; background:#f0f4f7; }
.com-group-list li .logo { margin-bottom:1.5em; padding-bottom:1em; text-align:center; border-bottom:1px solid #ccd6df; }
.com-group-list li .logo img { height:28px; }
.com-group-list li .name { margin-bottom:.7em; font-weight:bold; font-size:1.25em; }
.com-group-list li .name span { display:block; font-size:.75em; }
.com-group-list + .com-group-list { margin-top:80px; }

.com-date { text-align:right; font-weight:bold; }

/*  井筒の歴史
============================================= */
.chronology { position:relative; padding:2em 1em; background:#f0f4f7; }
.chronology:before { content:""; position:absolute; top:10px; left:-10px; z-index:-1; width:100%; height:100%; background:#dfe5e8; }
.chronology:after { content:""; position:absolute; top:0; right:0; border-width:15px; border-style:solid; border-color:#e8edf0 #e8edf0 #dfe5e8 #dfe5e8; }

.chronology-tbl { position:relative; }
.chronology-tbl .row { position:relative; z-index:2; padding:.8em 0; }
.chronology-tbl .row:before { content:""; position:absolute; z-index:-1; top:20px; left:0; width:1px; height:100%; background:#ccd6df; }

.chronology-tbl dt, .chronology-tbl dd { position:relative; padding-left:1.5em; }
.chronology-tbl dt { font-weight:bold; }
.chronology-tbl dt:after { content:""; position:absolute; top:6px; left:-6px; width:13px; height:13px; border:4px solid #929da6; border-radius:50%; background:#fff; }

/*  トピックス
============================================= */
.topic_list li { padding:1.2em .5em; border-bottom:1px solid #ccd6df; }
.topic_list li .date { display:inline-block; margin-right:.5em; min-width:5.5em; font-weight:bold; }
.topic_list li .cat { display:inline-block; min-width:8.5em; padding:.2em 1em .1em; font-size:.85em; text-align:center; background:#cad3d9; }
.topic_list li .cat.hoi { background:#cfe0c1; }
.topic_list li .cat.shozoku { background:#efe6ab; }
.topic_list li .cat.juyohin { background:#f3dad4; }
.topic_list li .cat.kikaku { background:#d9d9f3; }
.topic_list li a { display:block; margin-top:.5em; }

/* ================================================================
  レスポンシブ
=================================================================== */
/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {
  /* commmon ---------------- */
  #contents { padding-top:80px; }

  /* title */
  .pageTitle { min-height:240px; }
  .pageTitle .ttlbox  { width:28.8%; }
  .pageTitle:after { bottom:-2.5em; }

  .subttl { font-size:1.625em; }

  /* tbl */
  .tbl .row { display:-webkit-flex; display:flex; margin-bottom:1em; }
  .tbl .row > * { padding:.4em 1.5em; }
  .tbl .row dt { width:25%; min-width:15em; margin-bottom:0; }
  .tbl .row dd { border-bottom:1px solid #ccd6df; -webkit-box-flex:1;-ms-flex:1; flex:1; }

  .tbl2 .row dd { padding-left:1.5em; }


  /* contents ---------------- */

  /*  ごあいさつ
  ============================================= */
  .greeting-box .ttl { top:0; font-size:5em; }
  .greeting-box figure { width:24%; margin:10px 0 0 10px; }
  .greeting-text { padding-top:2em; width:100%; }


  /*  事業案内
  ============================================= */
  .bus-box:before { top:40%; }
  .bus-con, .bus-img { width:47%; }
    .bus-con .ttl { font-size:1.625em; }
  .bus-img { margin-top:0; }
  .bus-company-list { padding:1.2em }

  .bus-box:nth-of-type(even) .bus-con { order:2; }
  .bus-box:nth-of-type(even) .bus-img:before { left:auto; right:2.5em; }
  .bus-box:nth-of-type(even) .bus-img .img1 { padding-top:0; }
  .bus-box:nth-of-type(even) .bus-img .img2 { padding-top:14%; }

  /* イベント */
  #event { padding-top:30px; }
  .event-box { padding:2.5em; }
  .event-con, .event-slide { width:47%; }
  .event-slide { -webkit-box-ordinal-group:3; -ms-flex-order:2; order:2; }

  .slick-arrow { border-width:10px; }
  .slick-next { right:-16px; }
  .slick-prev { left:-16px; }

  /*  会社概要
  ============================================= */
  .com-box { margin-bottom:100px; }
  .com-name { margin-bottom:2em; }

  #daikonya .com-name { padding-top:1.5em }

  .com-group-list li { padding:2em 2em 1.5em; }
  .com-group-list li .logo img { height:35px; }

  /*  井筒の歴史
  ============================================= */
  .chronology { padding:50px; }
  .chronology:after { border-width:25px; }

  .chronology-tbl .row { display:-webkit-flex; display:flex; padding:0; }
  .chronology-tbl .row:before { display:none; }
  .chronology-tbl dt, .chronology-tbl dd { padding:.8em 0; }
  .chronology-tbl dt { width:10.5em; margin-right:1.6em; padding-right:1.5em; text-align:right; }
  .chronology-tbl dt:before { content:""; position:absolute; top:20px; right:0; width:1px; height:100%; background:#ccd6df; }
  .chronology-tbl dt:after { top:20px; left:auto; right:-6px; }
  .chronology-tbl dd { -webkit-box-flex:1; -ms-flex:1; flex:1; }

  /*  トピックス
  ============================================= */
  .topic_list li { padding:.8em; display:-webkit-flex; display:flex;
  -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; }
  .topic_list li a { -webkit-box-flex:1;-ms-flex:1; flex:1; margin-top:0; }
  .topic_list li .date { margin-right:.5em; }
  .topic_list li .cat { margin-right:1em; }
}

/* 960px以上(PC) */
@media screen and (min-width: 960px) {
  /* commmon ---------------- */
  #contents { padding-top:120px; }

  /* title */
  .pageTitle { min-height:290px; }
  .pageTitle .ttlbox { width:26.2%; }

  /* contents ---------------- */

  /*  ごあいさつ
  ============================================= */
  .greeting-box figure { width:22%; }
  .greeting-text { width:100%; }
  .greeting-box .ttl { font-size:6.25em; }

  /*  会社概要
  ============================================= */
  .com-group-list li { width:48.5%; }

}


/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {

}

/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {

}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){

}