@charset "UTF-8";
/*
Theme Name:DROP child
Author:TCD
Template:drop_tcd087
Version:1.5
*/
/* 20221209 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap');

/* FON SET */
body, input, textarea { font-family: 'Noto Sans JP', sans-serif;}
.rich_font, .p-vertical { font-family: 'Noto Sans JP', sans-serif;}
.rich_font_type2 { font-family: 'Noto Sans JP', sans-serif;}
/* COMMON */
*,
*:before,
*:after { box-sizing: border-box;}
.font-color-red { color: #b20000;}
.no-post { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 200px; text-align: center;}
button { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none;}
@media only screen and (max-width: 767px) {
  .sp-only { display: block;}
  .pc-only { display: none;}
}
@media print, (min-width: 768px) { 
  .sp-only { display: none;}
  .pc-only { display: block;}
  .no-post { min-height: 400px; font-size: 22px;}
}
/* ----------------------------------------------------------------------
 トップページ　ヘッダーコンテンツ
---------------------------------------------------------------------- */
#header_slider_wrap { height: 357px!important;}
#header_slider_wrap .bg_image { background-size: 100% auto!important;}
@media only screen and (max-width: 767px) {
  #header_slider_wrap { height: 0!important}
  #header_slider { height: 0!important}
  #header_slider .item { height: 0!important}
  .kv-top-sp { position: relative; width: 100%!important; height: auto!important;}
  .kv-top-sp a { position: absolute; left: 20px; bottom: 60px; display: block; width: 50%; max-width: 200px; height: 50px; line-height: 50px; color: #fff; text-align: center; background: #b20000; border-radius: 50px;}
  #main-top { margin-top: -2px;}
}
@media only screen and (max-width: 320px) {
  .kv-top-sp a { bottom: 40px;}
}
@media print, (min-width: 768px) { 
  #header_slider_wrap { height: 660px!important; background: linear-gradient(to right,  #ced1d3 0%,#fafafa 50%,#fafafa 100%);}
  #header_slider { height: 660px!important}
  #header_slider .item { height: 660px!important;}
  #header_slider_wrap .bg_image { background-size: auto 100%!important;}
  .kv-top-sp { display: none;}
}
/* デザインボタン */ 
#header_slider .caption { width: 100%; max-width: 1030px; height: 100%;}
#header_slider .design_button a { position: absolute; left: 0; top: 0; top: 520px!important; width: 60%!important; max-width: 550px; font-size: 20px; font-weight: bold; border-radius: 60px;}
/* パンくずリンクA */
@media only screen and (max-width: 767px) {
  #bread_crumb { overflow-x: scroll;}
}
#bread_crumb li .is-page-link { display:inline; font-size:12px; margin:0 10px 0 0; padding:0 20px 0 0; position:relative; }
#bread_crumb li .is-page-link:after {
  font-family:'design_plus'; content:'\e910'; font-size:10px; color:#fff;
  display:inline-block; line-height:60px; height:59px;
	position:absolute; right:0px; bottom:-23px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
/* パンくずリンクB */
#bread_crumb02 { position: static!important; width:100%; background: rgba(0,0,0,1);}
#bread_crumb02 ul { margin: 0 auto!important; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; visibility:visible;}
#bread_crumb02 li { display:inline; font-size:12px; margin:0 10px 0 0; padding:0 20px 0 0; position:relative;}
#bread_crumb02 li:after { font-family:'design_plus'; content:'\e910'; font-size:10px; color: rgba(255,255,255,1); display:inline-block; line-height:60px; height:59px; position:absolute; right:0px; bottom:-23px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
#bread_crumb02 li:last-of-type:after { display:none;}
#bread_crumb02, #bread_crumb02 li.last { color: rgba(255,255,255,1);}
#bread_crumb02 li a { color: rgba(255,255,255,1); height: 29px; line-height: 30px; display:inline-block; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;}
#bread_crumb02 li a:hover { opacity:0.5;}
#bread_crumb02 li.category a { display:none;}
#bread_crumb02 li.category a:first-of-type, #bread_crumb li.category a:only-of-type { display:inline-block;}
#bread_crumb02 li.home a { position:relative; width:16px;}
#bread_crumb02 li.home a span { opacity:0;}
#bread_crumb02 li.home a:before { font-family:'design_plus'; content:'\e90c'; font-size:12px; color: rgba(255,255,255,1); display:inline-block; height:100%; line-height:1; top:0px; position:relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
@media only screen and (max-width: 767px) {
  #bread_crumb02 ul { padding: 0 20px;}
}
@media print, (min-width: 768px) { 
  #bread_crumb ul { width: 1030px;}
  #bread_crumb02 ul { max-width: 1030px;}
}
/* パンくずリンクC */
#bread_crumb03 { position: static!important; width:100%; border-top: 1.5px solid #ddd; border-bottom: 1.5px solid #ddd;}
#bread_crumb03 ul { margin: 13px auto; overflow:hidden; white-space: nowrap; text-overflow: ellipsis; visibility:visible;}
#bread_crumb03 li { display:inline; font-size:12px; margin:0 10px 0 0; padding:0 20px 0 0; position:relative;}
#bread_crumb03 li:after { font-family:'design_plus'; content:'\e910'; font-size:10px; color: #333; display:inline-block; line-height:60px; height:59px; position:absolute; right:0px; bottom:-23px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
#bread_crumb03 li:last-of-type:after { display:none;}
#bread_crumb03, #bread_crumb03 li.last { color: #333;}
#bread_crumb03 li a { color: #333; height: 29px; line-height: 30px; display:inline-block; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out;}
#bread_crumb03 li a:hover { opacity:0.5;}
#bread_crumb03 li.category a { display:none;}
#bread_crumb03 li.category a:first-of-type { display:inline-block;}
#bread_crumb03 li.home a { position:relative; width:16px;}
#bread_crumb03 li.home a span { opacity:0;}
#bread_crumb03 li.home a:before { font-family:'design_plus'; content:'\e90c'; font-size:12px; color: rgba(0,0,0,1); display:inline-block; height:100%; line-height:1; top:0px; position:relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
@media only screen and (max-width: 767px) {
  #bread_crumb03 ul { padding: 0 20px;}
}
@media print, (min-width: 768px) { 
  #bread_crumb ul { width: 1030px;}
  #bread_crumb03 ul { max-width: 1030px;}
}
/* ニュースティッカー */
@media only screen and (max-width: 767px) {
  #news_ticker_bottom { display: none;}
}
/* メッセージをフッターリンクに改修 */
.menu-footer-link-container { position:absolute; top:50%; transform: translateY(-50%); width:100%; z-index:1; text-align:center;}
.menu-footer-link-container ul { display: flex; justify-content: center; flex-wrap: wrap;}
.menu-footer-link-container ul li { padding-right: 10px;}
.menu-footer-link-container ul li:before { content: "|"; padding-right: 10px;}
.menu-footer-link-container ul li:first-child:before { content: "";}
@media only screen and (max-width: 767px) {
  .menu-footer-link-container ul { margin: 20px 0 0; padding: 15px 0;}
  .menu-footer-link-container ul li { padding: 10px;}
  .page_navi .prev:before { margin-right: 30px!important; font-size: 20px;}
  .page_navi .next:before { margin-left: 30px!important; font-size: 20px;}
}
/* フッターロゴ */
@media only screen and (max-width: 428px) {
  #footer_logo img { margin-bottom: 80px; width: 60%; max-width: 50px; height: auto;}
}
@media only screen and (max-width: 767px) {
  #footer_logo img { margin-bottom: 80px; max-width: 70px;}
}
/* ----------------------------------------------------------------------
 インタビューアーカイブページ interview→document
---------------------------------------------------------------------- */
#main_contents.document { width: 100%; max-width: 1030px;}
#archive_document_list { display: flex; justify-content: space-between; flex-wrap: wrap;}
#archive_document_list .item { width: 100%;}
#archive_document_list .image_wrap { width:100%; height: 250px; margin-bottom: 30px; overflow: hidden;}
#archive_document_list .image { width:100%; height:100% !important; display:block; overflow:hidden; position:relative; z-index:2;}
@media print, (min-width: 768px) { 
  #archive_document_list .item { width: 31%;}
  #archive_document_list .item:nth-of-type(n + 4) { margin-top: 50px;}
}
/* ホワイトペーパー */
@media only screen and (max-width: 767px) {
  #archive_interview_list .item {  height: auto!important;}
  #archive_interview_list .title_area { height: auto!important;}
  #archive_interview_list .catch { max-height: 100%!important; overflow: auto;}
}
#archive_interview_list .title { position:static; color: #000; font-size:18px; font-weight: bold; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
#archive_interview_list .catch { margin-top: 10px; color: #666; font-size:14px!important; font-weight:normal; line-height: 1.3;}
/* ----------------------------------------------------------------------
 インタビュー詳細ページ
---------------------------------------------------------------------- */
body.single-interview #article .post_content { margin-top: 50px;}

#interview_title_area .title_area { padding:50px 50px; position:absolute; left:0px; bottom:0px; z-index:3; color:#fff;}
#interview_title_area .catch { font-weight:500; line-height:1.5;}
#interview_title_area .title { font-size: 16px; line-height: 1.5}
@media only screen and (max-width: 767px) {
  #page_header .title  { line-height: 1.5!important;}
}
@media print, (min-width: 768px) { 
  body.single-interview #interview_title_area { margin-top: -50px;}
  #interview_title_area .title { font-size: 28px;}
}
/* Common・Layout 99-add */
.contents-inr { width: 100%; min-width: 320px; padding: 0 20px;}
.text-center { text-align: center!important;}
.text-deco-line { text-decoration: underline;}
.sec-base { padding: 30px 20px;}
.text-left {text-align: left!important;}
@media only screen and (max-width: 767px) {
  .contents-inr { padding: 0 20px!important;}
  .sm-hidden { display: none !important;} 
}
@media print, (min-width: 768px) { 
  .pc-hidden { display: none !important;}
  .contents-inr { max-width: 1030px; margin: 0 auto;}
  .sec-base { padding: 60px 0;}
}
/* TOP ONELY */
.h-style01 { width: 100%; font-size: 22px; text-align: center; font-weight: normal!important}
.box-link a, a.box-link { display: flex; justify-content: center; align-items: center; width: 70%; height: 50px; margin: 50px auto; border: 1px solid #000;}
a.box-link { max-width: 300px; margin: 50px auto 0;}
@media print, (min-width: 768px) { 
  .box-link a { width: 320px;}
}
.strengths-top { padding: 30px 0;}
.strengths-top .image { max-width: 890px; margin: auto;}
.service-top { background: #eee;}
.ul-service { display: flex; justify-content: space-between; flex-wrap: wrap; margin-left: 0!important; list-style-type: none!important}
.ul-service { margin-top: 30px;}
.ul-service li { position: relative; width: 100%;}
.ul-service li img { margin-bottom: 20px; filter:drop-shadow(3px 3px 8px rgba(0, 0, 0, 0.05)); border-radius: 12px;}
.ul-service li .btn a { display: flex; justify-content: center; align-items: center; width: 300px; height: 60px; margin: auto; color: #fff; background: #000; border-radius: 60px;}
.ul-service li .btn a:hover { background: #999;}
.ul-service li a img:hover { filter:drop-shadow(3px 3px 8px rgba(0, 0, 0, 0.2));}
@media only screen and (max-width: 767px) {
  .ul-service li img { width: 100%; height: auto;}
  .ul-service li:nth-child(n + 2) { margin-top: 40px;}
}
@media print, (min-width: 768px) { 
  .h-style01 { font-size: 36px!important;}
  .strengths-top { padding: 60px 0;}
  .strengths-top .image { width: 100%;}
  .ul-service li { width: 45%;}
  .ul-service li p { min-height: 150px;}
  .ul-service li:nth-child(n + 3) { margin-top: 60px;}
}
.top-inview { padding: 30px 0 0;}
.top-inview ul { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0; list-style-type: none;}
.top-inview ul li { width: 100%!important}
.top-inview ul li figure img { margin: -35px 0 -45px!important; width: 100%; height: 160px; object-fit: cover;}
.top-inview ul li .cate a { display: flex; justify-content: center; align-items: center; width: 90px; height: 30px; color: #fff; text-align: center; background: #ed2c00; border-radius: 40px;}
.top-inview ul li .link-outline { display: flex; justify-content: flex-start; align-items: center; padding: 10px 20px 20px;}
.top-inview ul li h3 { margin-bottom: -20px!important}
.top-inview ul li h3:hover { color: #ed2c00;}
.top-inview ul li time { color: #9d9d9d;}
@media only screen and (max-width: 767px) {
  .top-inview ul li:last-child{ border-bottom: 1px solid #ddd;}
  .top-inview ul li figure { position: relative;}
  .top-inview ul li figure .cate a { position: absolute; top: -20px; left: 10px; font-size: 12px;}
  .top-inview ul li h3 { font-size: 15px;}
}
@media print, (min-width: 768px) { 
  .top-inview { padding: 60px 0 0;}
  .top-inview ul li { width: 50%!important}
  .top-inview ul li:nth-child(odd) { border-right: 1px solid #ddd;}
  .top-inview ul li:nth-child(n + 3) { border-bottom: 1px solid #ddd;}
  .top-inview ul li figure img { height: 330px;}
  .top-inview ul li .link-outline { padding: 0 30px 20px;}
  .top-inview ul li .cate a { width: 120px; height: 40px; line-height: 40px; margin-right: 30px;}
  .top-inview ul li h3 { margin-bottom: -30px!important}
}

.news-area, .voice-area { padding: 30px 0;}
.news-area dl dd a { color: #0099cc;}
.voice-area { background: #d9dbdb;}
.voice-area input[name="tab_item"] { display: none;}
.voice-area .tabs { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 30px}
.voice-area .tabs label { width: 33.3%; text-align: center; transition: all 0.2s ease;}
.voice-area .tabs label img { max-width: 70%; border-radius: 100%;}
.voice-area .tabs label span { display: block; margin-top: 10px; font-size: 13px; text-align: center;}
.voice-area .tabs input:checked + label img { border: 3px solid #ff9999;}
.voice-area .tabs input:nth-of-type(2):checked + label img { border: 3px solid #f6a769;}
.voice-area .tabs input:nth-of-type(3):checked + label img { border: 3px solid #ebc33e;}
.voice-area .tabs input:nth-of-type(4):checked + label img { border: 3px solid #a8d68f;}
.voice-area .tabs input:nth-of-type(5):checked + label img { border: 3px solid #84aed0;}
.voice-area .tabs input:nth-of-type(6):checked + label img { border: 3px solid #5ab4bd;}
.voice-area .tabs .tab_content { width: 100%; display: none; margin-top: 50px; padding: 20px; background: #fff;border-radius: 12px}
#voice01:checked ~ #voice01_content,
#voice02:checked ~ #voice02_content,
#voice03:checked ~ #voice03_content, 
#voice04:checked ~ #voice04_content, 
#voice05:checked ~ #voice05_content, 
#voice06:checked ~ #voice06_content { display: block;}
.voice-area .tabs .tab_content strong { padding: 5px 20px; font-size: 12px; text-align: center; background: #ff8080;}
.voice-area .tabs .tab_content:nth-of-type(2) strong { background: #f49144;}
.voice-area .tabs .tab_content:nth-of-type(3) strong { background: #e6b40e;}
.voice-area .tabs .tab_content:nth-of-type(4) strong { background: #92cc73;}
.voice-area .tabs .tab_content:nth-of-type(5) strong { background: #659ac4;}
.voice-area .tabs .tab_content:nth-of-type(6) strong { background: #5ab4bd;}
@media only screen and (max-width: 767px) {
  .voice-area .tabs label:nth-of-type(n + 4) { margin-top: 20px;}
}
@media print, (min-width: 768px) { 
  .news-area, .voice-area { padding: 60px 0;}
  .news-area dl dt { float: left; width: 15%;}
  .news-area dl dd { width: 85%; padding-left: 15%;}
  .voice-area .tabs label { position: relative; width: 16%;}
  .voice-area .tabs label img { max-width: 100px;}
  .voice-area .tabs input:nth-of-type(1):checked + label:after,
  .voice-area .tabs input:nth-of-type(2):checked + label:after,
  .voice-area .tabs input:nth-of-type(3):checked + label:after,
  .voice-area .tabs input:nth-of-type(4):checked + label:after,
  .voice-area .tabs input:nth-of-type(5):checked + label:after,
  .voice-area .tabs input:nth-of-type(6):checked + label:after { content: ""; position: absolute; bottom: -50px; left: 50%; transform: translateX(-50%); border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 30px solid #fff;}
}

.top-case-study, .top-lanking { padding: 60px 0;}
.top-case-study .list-case-study { display: flex; justify-content: flex-start; flex-wrap: wrap; margin-top: 40px;}
.top-case-study .list-case-study li { width: 100%;}
.top-case-study .list-case-study li .company-thum { position: relative; width: 100%; height: 170px; overflow: hidden; z-index: 1;}
.top-case-study .list-case-study li .company-thum img { width: 100%!important; height: auto;}
.top-case-study .list-case-study li .company-logo { position: absolute; bottom: 0px; left: 0; width: 100%; height: 30px; line-height: 30px; text-align: center; background: rgba(255,255,255,0.8);}
.top-case-study .list-case-study li .company-logo img { width: auto!important; height: 30px!important; padding: 2px 0;}
.top-case-study .single-ttl { font-size: 15px; font-weight: bold; line-height: 1.5;}
.top-case-study .single-date { margin: 5px 0 20px; color: #999; font-size: 12px;}
.top-case-study .company-name { margin: 30px 0 10px; font-size: 14px; font-weight: bold;}
@media only screen and (max-width: 767px) {
 .top-case-study .list-case-study li { margin-bottom: 50px;}
 .top-case-study .list-case-study li:last-child { margin-bottom: 0;}
}
@media print, (min-width: 768px) {  
 .top-case-study .list-case-study li { width: 31%; margin-right: 3.5%;}
 .top-case-study .list-case-study li:nth-child(3n) { margin-right: 0;}
 .top-case-study .list-case-study li:nth-child(n + 4) { margin-top: 50px;}
 .top-case-study .list-case-study li li { width: 100%;}
}
.top-lanking { background: #eee;}
.top-lanking .box-outline { margin-top: 10px!important; padding: 10px 20px; background: #fff;}
.top-lanking .box-outline:first-of-type { margin-top: 40px!important}
.top-lanking .box-outline { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 40px;}
.top-lanking .box-outline .rank { width: 100%; text-align: center;}
.top-lanking .box-outline .rank span { color: #b20000; font-size: 26px; font-weight: bold;}
.top-lanking .box-outline .rank span:before { content: "第"; color: #333; font-size: 18px;}
.top-lanking .box-outline .rank span:after { content: "位"; color: #333; font-size: 18px;}
.top-lanking .box-outline .company-thum { width: 100%; height: 180px; overflow: hidden;}
.top-lanking .box-outline .company-thum img { width: 100%; height: auto;}
.top-lanking .box-outline .company-thum .company-logo { position: absolute; bottom: 0px; left: 0; width: 100%; height: 30px; line-height: 30px; text-align: center; background: rgba(255,255,255,0.8);}
.top-lanking .box-outline .company-thum .company-logo img { width: auto!important; height: 30px!important; padding: 2px 0;}
.top-lanking .box-outline .ul-layout { display: flex; justify-content: flex-start; align-items: center;}
.top-lanking .box-outline .cate { display: flex;  justify-content: center; align-items: center; width: 100px; height: 26px; color: #fff; font-size: 12px; background: #ed2c00; border-radius: 26px;}
.top-lanking .box-outline .seminar-status { display: flex; justify-content: center; align-items: center; height: 26px; margin-left: 10px; padding: 0 10px; color: #fff; font-size: 12px; text-align: center; background: #333;}
.top-lanking .box-outline .company-name, .top-lanking .box-outline .seminar-date { margin-top: 15px; font-weight: bold;}
.top-lanking .box-outline .single-ttl { overflow: hidden; margin: 10px 0 15px; font-size: 16px; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.top-lanking .box-outline .archive-catch { margin-top: -10px; line-height: 1.5;}
@media only screen and (max-width: 767px) {
  .top-lanking .box-outline { padding-top: 20px;}
  .top-lanking .box-outline .rank, .top-lanking .box-outline .company-thum { margin-bottom: 10px;}
}
@media print, (min-width: 768px) {  
  .top-lanking .box-outline .rank { display: flex; align-items: center; width: 80px;}
  .top-lanking .box-outline .company-thum { position: relative; z-index: 1; width: 285px; height: 150px; margin-right: 20px; background: #ddd;}
  .top-lanking .box-outline .company-thum img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
  .top-lanking .box-right { width: calc(100% - 390px);}
}
/* COMMON */
a.window { display: inline-block; padding-right: 24px; background: url("img/common/icon-window.png") no-repeat right center/16px auto;}
/* SITEMP ONELY */
.sitemap .ul-outline { display: flex; justify-content: space-between; flex-wrap: wrap;}
.sitemap .ul-outline ul { width: 100%;}
.sitemap .ul-outline ul .ttl { margin: 0 0 20px -1em; height: 95px; list-style-type: none; border-bottom: 1px dotted #000; overflow: hidden;}
.sitemap .ul-outline ul .ttl img { max-width: 260px;}
.sitemap .ul-outline .baitoru .ttl img { margin-left: -60px;}
.sitemap .ul-outline .baitoru-next .ttl img, .sitemap .ul-outline .baitoru-pro .ttl img, .sitemap .ul-outline .hatarako .ttl img { margin-left: -50px;}
.sitemap .ul-outline .kobot .ttl img { margin-left: -70px;}
.sitemap .ul-outline ul p.ttl { margin: 0;}
@media print, (min-width: 768px) { 
  .sitemap .ul-outline ul { width: 45%;}
  .sitemap .ul-line-one-three { display: flex; justify-content: flex-start;}
  .sitemap .ul-line-one-three li { width: 15%;}
}


/* ページヘッダー  ここから下をsingle.cssへ移植すること */
#header { border-bottom: none; background: rgba(0,0,0,0.8);}
/* common */
cite { display: block; width: 100%; margin: 10px auto 50px; font-size: 12px; text-align: right; font-style: normal; line-height: 1.5;}
.ul-tag, .tag-list { position:relative; margin: 10px 0 0; color: #0099cc; font-size: 13px; line-height: 1.5;}
.ul-tag li { padding-left: 20px; color: #0099cc!important;}
.ul-tag li:before, .tag-list a:before  { font-family:'design_plus'; color:#0099cc; font-size:15px; line-height:1; position: absolute; top: 3px; left: 0;}
.ul-tag li.post_category:before { content:'\e92f';}
.ul-tag li.post_tag:before, .tag-list a:before { content:'\e935';}
.tag-list { padding-left: 20px; font-size: 14px;}
.tag-list a { padding-left: 3px; color: #666!important;}
.tag-list a:hover { color: #ed2c00!important;}
@media print, (min-width: 768px) { 
  .tag-list { font-size: 16px;}
  .tag-list a:before { top: 5px; font-size: 16px;}
}

.pc-flex-between .box-left { margin-bottom: 30px;}
@media print, (min-width: 768px) { 
  .pc-flex-between { display: flex; justify-content: space-between;}
  .pc-flex-between .box-left {  width: 330px; margin-bottom: 0;}
  .pc-flex-between .box-right {  width: calc(100% - 380px);}
}
/* ----------------------------------------------------------------------
 HOME
---------------------------------------------------------------------- */
#main-top .inr { width: 100%; max-width: 1140px; padding: 0 20px; margin: 50px auto 0;}
.banner_content.top .overlay { background: rgba(0,0,0,0.7);}
.banner_content.top  .inview { color: #fff;}
.banner_content.top  .catch { font-size: 20px;}
.banner_content.top .design_button a { background: #b20000;}
@media print, (min-width: 768px) {   
  .banner_content.top  .catch { font-size: 36px;}
}

/* ----------------------------------------------------------------------
 single「case-study」
---------------------------------------------------------------------- */
/* メインビジュアル */
#main-vis { overflow: hidden; padding-top: 60px;}
#main-vis a { color: #333!important;}
#main-vis a:hover { color: #ed2c00!important;}
#main-vis .inr { width: 100%;}
#main-vis .inr .single-ttl { margin-bottom: 10px; font-size: 20px; line-height: 1.3;}
#main-vis .inr .single-date { margin-bottom: 36px; color: #999; font-size: 12px;}
#main-vis .inr .key-vis { width: 100%;}
#main-vis .inr .key-vis img { width: 100%; height: auto;}
#main-vis.case-study .inr .company-name { margin-bottom: 20px;}
#main-vis.case-study .inr .company-detail { display: flex; justify-content: space-between; flex-direction: row-reverse;}
#main-vis.case-study .inr .company-detail dl { width: 100%; font-size: 12px; line-height: 1.5!important;}
#main-vis.case-study .inr .company-detail dt { float: left; margin-bottom: 6px; width: 6em; font-weight: bold;}
#main-vis.case-study .inr .company-detail dt:after { content: "：";}
#main-vis.case-study .inr .company-detail dd { margin-bottom: 6px; padding-left: 6em;}
#main-vis.case-study .inr .company-detail dd a { color: #fff; /*color: #0099cc;*/}
#main-vis.case-study .inr .company-logo { display: flex; align-items: center; width: 100px; height: 100px; padding: 5px; background: #fff;}
#main-vis.case-study .inr .company-detail .company-logo + dl { width: calc( 100% - 110px);}
#main-vis.case-study .inr div img { width: 100%; height: auto;}
@media only screen and (max-width: 767px) {
  #main-vis .inr .single-ttl { text-align: center;}
  #main-vis .inr .box-left { padding: 20px;}
}
@media print, (min-width: 768px) {   
  #main-vis { height: 470px; padding-top: 70px;}
  #main-vis .inr { max-width: 1120px; margin: auto; display: flex; justify-content: space-between; flex-flow: row-reverse;}
  #main-vis .inr .box-left { width: calc(100% - 640px); padding: 50px 0 20px;}
  #main-vis .inr .key-vis { width: 600px; height: 400px;}
  #main-vis .inr .key-vis img { width: auto; height: 400px;}
  #main-vis .inr .single-ttl { font-size: 2.33vw!important;}
  #main-vis.case-study .inr .company-logo { width: 140px; height: 140px;}
  #main-vis.case-study .inr .company-detail dl { font-size: 13px;}
  #main-vis.case-study .inr .company-detail .company-logo + dl { width: calc( 100% - 150px);}
  #main-vis.case-study .ul-tag { margin-top: 20px;}
}
@media screen and (min-width:1030px) {
  #main-vis .inr .single-ttl { font-size: 24px!important;}
}
/* コンテンツ */
#main-single { line-height: 1.8; padding-bottom: 0!important;}
#main-single a { color: #0099cc;}
#main-single .btn-base { display: block; width: 80%; max-width: 300px; height: 60px; margin: 60px auto 0; line-height: 60px; text-align: center;}
#main-single .btn-base:first-of-type { margin-bottom: 60px;}
#main-single .b-radius6 { border-radius: 6px;}
#main-single .b-radius100 { border-radius: 100%;}
#main-single .bgc01 { background: #0099cc;}
#main-single .bgc02 { background: #000;}
#main-single .bgc03 { background: #CC0047;}
#main-single .bgc04 { background: #99CC00;}
#main-single .fontc-w { color: #fff;}
#main-single .fontc-b { color: #000;}
#main-single .h-design01 { margin-bottom: 50px; padding-top: 40px; text-align: center; border-top: 0.8px solid #ccc;}
#main-single .h-design01:first-of-type { border: none;}
#main-single .h-design02 { color: #026586;}
#main-single .dl-success { margin-bottom: 0!important; padding: 20px; text-align: left; border: 2px solid #e4e4e4;}
#main-single .dl-success dt span { padding: 3px 20px; color:#fff; background:#026586;  border-radius: 3px;}
#main-single, #main-archive { width: 100%; margin: 30px auto 0; padding-bottom: 150px;}
#main-single ul { text-align: left;}
.btn-sns { display: flex; justify-content: flex-start; margin-bottom: 30px;}
.btn-sns a { display: flex; align-items: center; height: 30px; margin-right: 5px; padding: 0px 5px; color: #fff!important; font-size: 10px; text-align: center; border-radius: 3px;}
.btn-sns a:hover { opacity: 0.8;}
.btn-sns a i{ line-height: 30px; margin-right: 5px; font-size: 20px;}
.btn-sns .twitter a { line-height: 30px; background: #1da1f2;}
.btn-sns .facebook a { background: #1877f2;}
.btn-sns .line a { background: #00b900;}
.btn-sns .icon-line a:before { content:'\e900'; font-family:'design_plus'; font-size:60px; display:block; position:absolute; top:1px; left:0; right:0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
#main-single .ul-tag { font-size: 16px;}
#main-single .post_content { margin-bottom: 50px;}
#main-single .post_content figure { width:100%; text-align: center;}
#main-single .post_content .box-company { clear: both; width: 100%; margin: 50px 0; padding: 20px; background: #f6f6f6; border-radius: 6px;}
@media only screen and (max-width: 767px) {
  #main-single, #main-archive { padding: 0 20px;}
}
@media print, (min-width: 768px) {   
  #main-single, #main-archive { max-width: 1030px; margin: 50px auto 0;}
  .btn-sns a, #main-archive .btn-sns a, #main-top .btn-sns a, #post_content .btn-sns a { margin-right: 8px; padding: 0px 14px; font-size: 11px; }
  #main-single .post_content img { width: 100%;}
}
#main-single.case-study h2, #main-single.column h2 { padding: 10px 0; font-size: 16px; border-top: 1px solid #333; border-bottom: 1px solid #333;}
#main-single.case-study h3, #main-single.column h3 { padding-left: 12px; border-left: 5px solid #333; }
#main-single.case-study h2 + h3, #main-single.column h2 + h3 { margin-top: 38px;}
#main-single.case-study h4, #main-single.column h4 { padding: 6px 12px; font-size: 16px; background: #e6e6e6;}
#main-single.case-study h5, #main-vis.case-study h6,
#main-single.column h5, #main-vis.column h6 { font-size: 16px;}
@media print, (min-width: 768px) { 
  #main-single.case-study h2, #main-single.column h2 { font-size: 28px; line-height: 1.5;}
  #main-single.case-study h3, #main-single.column h3 { font-size: 24px; line-height: 1.5;}
  #main-single.case-study h2 + h3, #main-single.column h2 + h3 { margin-top: 50px;}
  #main-single.case-study h4, #main-single.column h4 { font-size: 20px; line-height: 1.5;}
  #main-single.case-study h5, #main-single.column h5 { font-size: 18px;}
  #main-single.case-study h6, #main-single.column h6 { font-size: 16px;}
}
/* CTA */
#main-single .btn-area { display: flex; justify-content: center; max-width: 750px; margin: 30px auto 0;}
#main-single .btn-area div { width: 50%; text-align: center;}
#main-single .btn-area div span { font-size: 10px;}
#main-single .btn-area .btn-base { width: 100%; margin-top: 5px; border-radius: 6px;}
#main-single .btn-base.contact { color: #fff; background: #cc0047;}
#main-single .btn-base.contact::before, #main-single .btn-base.document::before { content: ""; display: inline-block; width: 20px; height: 20px; margin: -3px 10px 0 -20px; vertical-align: middle;}
#main-single .btn-base.contact::before { background: url(img/common/icon-mail-w.png); background-size: contain;}
#main-single .btn-base.document { color: #cc0047; border: 1px solid #cc0047;}
#main-single .btn-base.document::before { background: url(img/common/icon-document-red.png); background-size: contain;}
#main-single .btn-base.contact:hover, #main-single .btn-base.document:hover { opacity: 0.8;}
#main-single .btn-area .arrow { position: relative; display: inline-block; color: #000; vertical-align: middle; text-decoration: none; font-size: 15px;}
#main-single .arrow::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 5px;  margin-top: -7px;}
#main-single .arrow-01::before, #main-single .arrow-02::before { width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg);}
#main-single .arrow-02::before { border-color: #cc0047;}
@media only screen and (max-width: 767px) {
  #main-single .btn-area:last-of-type { margin-bottom: -70px;}
  #main-single .btn-area div:first-of-type {margin-right: 5px;}
  #main-single .btn-area div:last-of-type { margin-left: 5px;}
}
@media print, (min-width: 768px) { 
  #main-single .btn-area { margin: 60px auto 0;}
  #main-single .btn-area div { width: 100%; max-width: 360px;}
  #main-single .btn-area div span { font-size: 15px;}
  #main-single .btn-base.contact::before, #main-single .btn-base.document::before { width: 30px; height: 30px; margin: -3px 20px 0 -30px;}
  #main-single .arrow::before { left: 20px;;}
}
/* レコメンド・ご利用のサービス */
.reco-area, .service-area { margin-top: 40px; padding: 20px; background: #eee; border-radius: 3px}
.reco-area .ttl, .service-area .ttl { font-size: 16px; line-height: 1.5;}
.reco-area .slide-reco { display: flex; justify-content: space-between; width: 90%; margin: 10px auto 0;}
.reco-area .box-slide-reco .company-thum { position: relative; width: 100%; height: 150px; overflow: hidden;   z-index: 1;}
.reco-area .box-slide-reco .company-thum img { width: 100%; height: auto;}
.reco-area .box-slide-reco .company-thum .company-logo { position: absolute; bottom: 0; left: 0; width: 100%; height: 30px; line-height: 30px; text-align: center; background: rgba(255,255,255,0.8); z-index: 2;}
.reco-area .box-slide-reco .company-thum .company-logo img { width: auto; height: 20px; margin-top: 5px; z-index: 3;}
.reco-area .box-slide-reco .company-name { margin-top: 10px; line-height: 1.3;}
.reco-area .box-slide-reco .company-name a { color:  #333!important; font-size: 15px; font-weight: 600;}
.reco-area .box-slide-reco .single-ttl { line-height: 1.3!important;  overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
.reco-area .box-slide-reco .single-ttl a { color:  #333!important; font-size: 13px;}

.service-area ul { display: flex; justify-content: flex-start; flex-wrap: wrap;}
.service-area ul li { display: none; width: 47%;}
.reco-area ul li img, .service-area ul li img  { width: 100%; height: auto;}
.service-area ul li a p { color: #333; font-size: 11px; line-height: 1.5;}
.service-area .baitoru li.baitoru,
.service-area .baitoru-next li.baitoru-next,
.service-area .baitoru-pro li.baitoru-pro,
.service-area .hatarako li.hatarako,
.service-area .kobot li.kobot { display: block;}
@media only screen and (max-width: 600px) {
  .reco-area .box-slide-reco .company-thum { height: 150px;}
}
@media only screen and (max-width: 767px) {
  .reco-area .ttl { margin-bottom: 20px;}
  .service-area .ttl { margin-bottom: 10px;}
  .service-area ul li { margin-top: 10px; margin-left: 1.5%; margin-right: 1.5%;}
}
@media print, (min-width: 768px) { 
  .reco-area .box-slide-reco { margin: 0 10px;}
  .reco-area .ttl, .service-area .ttl { margin-bottom: 20px; font-size: 18px;}
  .reco-area .slide-reco { width: 96%;}
  .reco-area  .box-slide-reco .company-thum { height: 140px;}
  .service-area ul li { width: 24%; margin: 0.5%;}
  .service-area ul li:last-child { margin-right: 0;}
}
@media print, (min-width: 821px) { 
  .reco-area .box-slide-reco .company-thum { height: 170px;}
}
/* SLICK Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0;}
.slick-list:focus { outline: none;}
.slick-list.dragging { cursor: pointer; cursor: hand;}
.slick-slider .slick-track, .slick-slider .slick-list { transform: translate3d(0, 0, 0);}
.slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto;}
.slick-track:before, .slick-track:after { display: table; content: '';}
.slick-track:after { clear: both;}
.slick-loading .slick-track { visibility: hidden;}
.slick-slide { display: none; float: left; height: 100%; min-height: 1px;}
[dir='rtl'] .slick-slide { float: right;}
.slick-initialized .slick-slide { display: block;}
.slick-loading .slick-slide { visibility: hidden;}
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent;}
.slick-arrow.slick-hidden  { display: none;}
/* SLICK Arrows */
.slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slick-prev:before, .slick-next:before { color: #fff; font-size: 20px; line-height: 1;}
.slick-prev { top: 40%; left: -30px; width: 40px; height: 40px; background: rgba(0,0,0,0.8); border-radius: 50px; z-index:10;}
[dir='rtl'] .slick-prev { top: 40%; right: -30px; left: auto;}
.slick-prev:before { content: '←';}
[dir='rtl'] .slick-prev:before { content: '→';}
.slick-next { top: 40%; right: -30px; width: 40px; height: 40px; background: rgba(0,0,0,0.8); border-radius: 50px; z-index:10;}
[dir='rtl'] .slick-next { top: 40%; right: -30px;}
.slick-next:before { content: '→';}
[dir='rtl'] .slick-next:before { content: '←';}
@media print, (min-width: 768px) { 
  .slick-prev, .slick-next { width: 50px; height: 50px;}
  .slick-prev, [dir='rtl'] .slick-prev { left: -20px;}
  .slick-next, [dir='rtl'] .slick-next { right: -20px;}
}
/* ----------------------------------------------------------------------
 single「column」
---------------------------------------------------------------------- */
#main-vis.column .single-desc, #main-vis.seminar .single-desc { line-height: 1.8;}
#main-vis.column .inr .single-date { display: flex; justify-content: flex-start; color: #333; font-size: 14px;}
#main-vis.column .inr .single-date li:first-child::before { content: "公開日：";}
#main-vis.column .inr .single-date li:last-child::before { content: " | 最終更新日："; margin-left: 5px;}
#main-single.column .post_content img { width: 100%;}
#main-single.column .post_content .has-text-align-center + cite { display: block; width: 100%;}
/* ----------------------------------------------------------------------
 single「seminar」
---------------------------------------------------------------------- */
#main-vis.seminar { position: relative;}
#main-vis.seminar .filter-being-prepared, #main-vis.seminar .filter-streaming { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background:rgba(0,0,0,0.92);}
#main-vis.seminar .filter-inr { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; width: 100%; color: #fff; text-align: center;}
#main-vis.seminar .filter-inr p { font-size: 20px; line-height: 1.8;}
#main-vis.seminar .btn-seminar-status { display: block; width: 80%; min-width: 240px; height: 50px; line-height: 50px; margin: 30px auto 0; color: #fff; text-align: center; background: #b20000;}
#main-vis.seminar a.btn-seminar-status{ color: #fff!important; border-radius: 50px;}
.seminar .box-profile figure { width: 150px!important; height: 150px;}
.seminar .box-profile figure img { width: 100%!important;}
.seminar .box-profile .profile-name { font-weight: bold;}
.form-area { margin-top: 100px; padding: 60px 0; background: #eee;}
.form-area .ttl-form { width: 100%; max-width: 1180px; margin: 0 auto 30px; paading: 0 20px; font-size: 20px; text-align: center;}
@media only screen and (max-width: 767px) {
  .table-seminar { border-bottom: 1px solid #eee!important;}
  .table-seminar th, .table-seminar td { display: block; width: 100%;}
  .table-seminar th { padding: 5px 20px; border-bottom: none!important;}
  .table-seminar td { border-bottom: none!important;}
  .seminar .box-profile figure { margin: 30px auto 20px;}
  .seminar .box-profile figure img { border-radius: 100px;}
}
@media print, (min-width: 768px) {   
  #main-vis.seminar .filter-being-prepared, #main-vis.seminar .filter-streaming { height: 470px;}
  #main-vis.seminar .filter-inr p { font-size: 30px;}
  #main-vis.seminar a.btn-seminar-status { max-width: 400px;}
  .table-seminar th { padding: 5px 20px; width: 200px;}
  .table-seminar td { padding: 5px 20px;}
  .seminar .box-profile { display: flex; justify-content: space-between;}
  .seminar .box-profile figure { width: 220px!important; height: 220px;}
  .seminar .box-profile figure + .box-text { width: calc(100% - 270px);}
  .form-area .ttl-form { font-size: 26px;}
}
/**/
.video-wrap { width: 100%; max-width: 900px; margin: auto;}
.video { position: relative; width:100%; height:0; padding-top: 56.25%;}
.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
/* ----------------------------------------------------------------------
 archive「case-study」
---------------------------------------------------------------------- */
#main-vis-archive.case-study { background: url(img/archive/kv-case-study-archive.jpg) no-repeat top center/cover;}
#main-vis-archive.case-study .inr, #main-vis-archive.column .inr, #main-vis-archive.seminar .inr, #main-vis-archive.lanking .inr, #main-vis-archive.document .inr { display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; height: 300px; color: #fff; text-align: center; background: rgba(0,0,0,0.6);}
#main-vis-archive .ttl { margin: 50px 0 30px; font-size: 20px; font-weight: bold;}
#main-vis-archive h1 { font-weight: normal; line-height: 1.5;}
#main-archive .list-case-study, #main-archive .list-column, #main-archive .list-seminar, #main-archive .list-document { display: flex; justify-content: flex-start; flex-wrap: wrap;}
#main-archive .list-case-study li, #main-archive .list-column li, #main-archive .list-seminar li, #main-archive .list-document li { width: 100%;}
#main-archive .list-case-study li .company-thum, #main-archive .list-column li .column-thum, #main-archive .list-seminar li .seminar-thum, #main-archive .list-document li .document-thum { position: relative; width: 100%; height: 230px; overflow: hidden; z-index: 1;}
#main-archive .list-case-study li .company-thum img, #main-archive .list-column li .column-thum img, #main-archive .list-seminar li .seminar-thum img, #main-archive .list-document li .document-thum img { width: 100%; height: auto;}
#main-archive .list-case-study li .company-logo { position: absolute; bottom: 0px; left: 0; width: 100%; height: 30px; line-height: 30px; text-align: center; background: rgba(255,255,255,0.8);}
#main-archive .list-case-study li .company-logo img { width: auto; height: 30px; padding: 2px 0;}
#main-archive .company-name { margin: 30px 0 10px; color: #333; font-size: 14px; font-weight: bold;}
#main-archive .single-ttl { font-size: 15px; font-weight: bold; line-height: 1.5;}
#main-archive .single-date { margin: 5px 0 20px; color: #999; font-size: 12px;}
@media only screen and (max-width: 767px) {
  #main-vis-archive .inr { padding: 0 20px;}
  #main-archive .list-case-study li { margin-top: 20px; padding-top: 30px; border-top: 1px solid #eee;}
  #main-archive .list-case-study  li:first-child { margin-top: 0; padding-top: 0; border: none;}
}
@media print, (min-width: 768px) { 
  #main-vis-archive .ttl { margin-bottom: 20px; font-size: 28px;}
  #main-archive .list-case-study li, #main-archive .list-column li, #main-archive .list-seminar li, #main-archive .list-document li { width: 31%; margin-right: 3.5%;}
  #main-archive .list-case-study li:nth-child(3n), #main-archive .list-column li:nth-child(3n), #main-archive .list-seminar li:nth-child(3n), #main-archive .list-document li:nth-child(3n)  { margin-right: 0;}
  #main-archive .list-case-study li:nth-child(n + 4), #main-archive .list-column li:nth-child(n + 4), #main-archive .list-seminar li:nth-child(n + 4), #main-archive .list-document li:nth-child(n + 4) { margin-top: 50px;}
  #main-archive .list-case-study li li, #main-archive .list-column li li, #main-archive .list-seminar li li { width: 100%;}
  #main-archive .list-case-study li .company-thum, #main-archive .list-column li .column-thum, #main-archive .list-seminar li .seminar-thum { height: 170px;}
  #main-archive.seminar .single-ttl { font-size: 20px;}
}
/* 絞り込みMENU */
#main-archive.case-study .menu-btn { display: flex; justify-content: center; align-items: center; width: 300px; height: 50px; margin: 0 auto 30px; color: #fff; background: #0099cc; border-radius: 50px;}
#main-archive.case-study .menu { position: fixed; top: 0; left: 0; z-index: 9999; width: 80vw; height: 100%; background: #fff; transform: translateX(-100vw); transition: all .3s linear; box-shadow: 0 10px 10px rgba(0,0,0,0.5);}
#main-archive.case-study .menu .ttl { padding: 20px 0; color: #0182ad; font-size: 18px; text-align: center; font-weight: bold;}
#main-archive.case-study .menu .text { margin-bottom: 20px; padding: 0 20px; text-align: center; font-size: 14px; line-height: 1.5;}
#main-archive.case-study .menu .text strong { font-size: 120%;}
#main-archive.case-study .tag-service ul li, #main-archive.case-study .tag-theme ul li { padding: 10px 20px; font-size: 14px; background: #fff; border-bottom: 1px solid #ddd;}
#main-archive.case-study .tag-service ul li:last-child { border-bottom: none;}
#main-archive.case-study .menu.is-active { transform: translateX(0);}
#main-archive.case-study nav { display: none;}
#main-archive.case-study .nav-open { position: relative; padding: 15px 20px; color: #fff; font-size: 18px; font-weight: 300; background: #0182ad; border: 0.5px solid #fff;}
#main-archive.case-study .nav-open::before{ content: "＋"; position: absolute; right: 20px;}
#main-archive.case-study .nav-open.active::before{ content: "－";}
#main-archive.case-study .menu .ic-step { display: inline-block; margin-right: 8px; padding: 2px 6px 4px; color: #fff; font-size: 14px; border: 1px solid #fff; border-radius: 3px;}
#main-archive.case-study .menu .ic-step:before { content: "STEP"; font-size: 10px;}
#main-archive.case-study .menu .notes { margin-left: 20px; font-size: 12px;}
#main-archive.case-study .menu .inr { position: relative; height: 100%; background: #eee;  overflow-y: scroll;}
#main-archive.case-study .btn-area { position: absolute; bottom: 0; width:100%; padding: 10px 0; text-align: center; background: #fff;}
#main-archive.case-study .btn-area button { width: 200px; height: 40px; color: #fff; background: #0182ad; border-radius: 40px;}
/* スライドインメニュー展開時　背景を固定 */
body.fixed { max-height: 100vh; overflow: hidden;}
@media print, (min-width: 768px) { 
  #main-archive.case-study .menu { width: 400px;} 
}
/* ----------------------------------------------------------------------
 archive「column」
---------------------------------------------------------------------- */
#main-vis-archive.column { background: url(img/archive/kv-column-archive.jpg) no-repeat top center/cover;}
#main-archive .list-column .column-thum { position: static;}
#main-archive.column .single-date { display: flex; justify-content: flex-start; color: #333; font-size: 13px;}
#main-archive.column .single-date li { width: auto!important; margin: 0;}
#main-archive.column .single-date li:last-child::before { content: "（";}
#main-archive.column .single-date li:last-child::after { content: "更新）";}
@media only screen and (max-width: 767px) {
  #main-archive .list-column li { margin-top: 20px; padding-top: 30px; border-top: 1px solid #eee;}
  #main-archive .list-column li:first-child { margin-top: 0; padding-top: 0; border: none;}
  #main-archive .list-column .column-thum { margin-bottom: -20px!important;}
}
@media print, (min-width: 768px) { 
  #main-archive .list-column .single-ttl { margin-top: 20px;}
}
/* ----------------------------------------------------------------------
 archive「document」new
---------------------------------------------------------------------- */
#main-vis-archive.document { background: url(img/archive/kv-document-archive.jpg) no-repeat top center/cover;}
#main-archive .list-document li .document-thum { position: relative; height: auto; border: 1px solid #eee; z-index: 1;}
#main-archive .list-document li .document-thum img { margin-bottom: -5px;}
#main-archive .list-document li .category { position: absolute; top: 0; left: 0; z-index: 2;}
#main-archive .list-document li .category a { display: block; height: 30px; line-height: 30px; padding: 0 10px; font-size: 11px; text-align: center; opacity: 0.9;}
#main-archive .list-document li .single-ttl { margin-top: 10px;}
#main-archive .list-document li .archive-catch { margin: 5px 0 30px; color: #666; font-size: 13px; line-height: 1.5;}
@media print, (min-width: 768px) { 
  #main-archive .list-document li .archive-catch { margin: 10px 0 0;}
}
/* ----------------------------------------------------------------------
 archive「seminar」
---------------------------------------------------------------------- */
#main-vis-archive.seminar { background: url(img/archive/kv-seminar-archive.jpg) no-repeat top center/cover;}
#main-archive.seminar .tab-outline { display: flex; justify-content: space-between; margin-bottom: -15px;}
#main-archive.seminar .tab-outline .tab { display: block; width: 40%; height: 50px; line-height: 50px; margin: 0 5%; color: #999; font-size: 11px; text-align: center; background: #ddd; border-bottom: 1px solid #333; border-top-left-radius: 6px; border-top-right-radius: 6px;}
#main-archive.seminar .tab-outline .tab.current { margin-bottom: -50px; color: #333; background: #fff; border-bottom: 1px solid #fff; border-left: 1px solid #333; border-top: 1px solid #333; border-right: 1px solid #333;}
#main-archive.seminar hr { border-color: #333;}
.box-seminar { margin-top: 30px;}
.box-seminar:first-of-type { margin-top: 50px;}
.box-seminar figure img { width: 100%;  height: auto;}
.box-seminar .box-right .single-ttl { margin-bottom: 15px; font-size: 16px;}
.box-seminar .box-right .seminar-date { margin-bottom: 15px; font-size: 16px; font-weight: bold;}
.box-seminar .box-right dl { margin-bottom: 15px; font-size: 13px; line-height: 1.5;}
.box-seminar .box-right dt { float: left;}
.box-seminar .box-right dd { padding-left: 7.3em;}
/* seminar archives */
.box-seminar .btn-seminar-status { display: block; width: 80%; min-width: 240px; height: 50px; line-height: 50px; margin: 10px auto 20px; color: #b20000; text-align: center; border: 1px solid #b20000;}
.box-seminar a.btn-seminar-status { color: #fff!important; background: #b20000; border-radius: 50px;}
@media only screen and (max-width: 767px) {
  .box-seminar .box-right { padding: 0 0 20px; border-bottom: 1px solid #eee;}
}
@media print, (min-width: 768px) { 
  #main-archive.seminar .tab-outline { margin-bottom: -17px;}
  #main-archive.seminar .tab-outline .tab { font-size: 17px;}
  .box-seminar { display: flex; justify-content: space-between;}
  .box-seminar figure { width: 48%;}
  .box-seminar .box-right { width: 48%; padding: 20px 0 0;}
  .box-seminar .box-right dl { font-size: 15px;}
  /* seminar archives */
  .box-seminar .btn-seminar-status { width: 100%; margin: 30px auto;}
}
/* ----------------------------------------------------------------------
 archive「lanking」
---------------------------------------------------------------------- */
#main-vis-archive.lanking { background: url(img/archive/kv-lanking-archive.jpg) no-repeat top center/cover;}
#main-archive.lanking .sort-area { display: flex; justify-content: flex-start; flex-wrap: wrap; widt: 100%;}
#main-archive.lanking .sort-area button { width: 32%; padding: 10px 20px; color: #999; border: 1px solid #999;}
#main-archive.lanking .sort-area button.current { color: #fff; background: #ed2c00; border: none;}
#main-archive.lanking .box-outline { margin-top: 10px!important; padding: 10px 20px; color: #ddd; border: 1px solid #333;}
#main-archive.lanking .box-outline:first-of-type { margin-top: 40px!important}
#main-archive.lanking .box-outline { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 40px;}
#main-archive.lanking .box-outline .rank { width: 100%; text-align: center;}
#main-archive.lanking .box-outline .rank span { color: #b20000; font-size: 26px; font-weight: bold;}
#main-archive.lanking .box-outline .rank span:before { content: "第"; color: #333; font-size: 18px;}
#main-archive.lanking .box-outline .rank span:after { content: "位"; color: #333; font-size: 18px;}
#main-archive.lanking .box-outline .company-thum { position: relative; width: 100%; height: 180px; overflow: hidden;}
#main-archive.lanking .box-outline .company-thum img { width: 100%; height: auto;}
#main-archive.lanking .box-outline .company-thum .company-logo { position: absolute; bottom: 0px; left: 0; width: 100%; height: 30px; line-height: 30px; text-align: center; background: rgba(255,255,255,0.8);}
#main-archive.lanking .box-outline .company-thum .company-logo img { width: auto!important; height: 30px!important; padding: 2px 0;}
#main-archive.lanking .box-outline .ul-layout { display: flex; justify-content: flex-start; align-items: center;}
#main-archive.lanking .box-outline .cate  { display: flex;  justify-content: center; align-items: center; width: 100px; height: 26px; color: #fff; font-size: 12px; background: #ed2c00; border-radius: 26px;}
#main-archive.lanking .box-outline .seminar-status { display: flex;  justify-content: center; align-items: center; height: 26px; margin-left: 10px; padding: 0 10px; color: #fff; font-size: 12px; text-align: center; background: #333;}
#main-archive.lanking .box-outline .company-name, #main-archive.lanking .box-outline .seminar-date { margin-top: 15px; color: #333; font-weight: bold;}
#main-archive.lanking .box-outline .single-ttl { overflow: hidden; margin: 10px 0 15px; font-size: 16px; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}
#main-archive.lanking .box-outline .archive-catch { margin-top: -10px; color: #333; line-height: 1.5;}
@media only screen and (max-width: 767px) {
  #main-archive.lanking .sort-area button { margin-right: 2%;}
  #main-archive.lanking .sort-area button:last-of-type { margin-right: 0;}
  #main-archive.lanking .sort-area button:nth-of-type(3n) { margin-right: 0;}
  #main-archive.lanking .sort-area button:nth-of-type(n + 4) { width: 49%;}
  #main-archive.lanking .sort-area button:nth-of-type(n + 4) { margin-top: 10px;}
  #main-archive.lanking .box-outline .rank, #main-archive.lanking .box-outline .company-thum { margin-bottom: 10px;}
}
@media print, (min-width: 768px) {  
  #main-archive.lanking .sort-area { justify-content: space-between;}
  #main-archive.lanking .sort-area button { width: 19%;}
  #main-archive.lanking .box-outline .rank { display: flex; align-items: center; width: 80px;}
  #main-archive.lanking .box-outline .company-thum { position: relative; z-index: 1; width: 285px; height: 150px; margin-right: 20px; background: #ddd;}
  #main-archive.lanking .box-outline .company-thum img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
  #main-archive.lanking .box-right { width: calc(100% - 390px);}
}

/* プラグイン「Easy Table of Contents」 */
#ez-toc-container { margin-bottom: 50px; padding: 20px; text-align: center; background: #eee!important; border: none; border-radius: 0; box-shadow: none;}
#ez-toc-container ul { margin: 20px 0 0; font-weight: bold;}
#ez-toc-container ul ul { margin: 0 0 20px 1.2em; font-weight: normal;}
#ez-toc-container ul li:last-child ul { margin-bottom: 0;}
#ez-toc-container ul a { color: #333!important;}
@media print, (min-width: 768px) {  
}