@charset "UTF-8";

/**********************************************************************
*                                                                     *
*                        BUS GEAR カスタマイズ                        *	
*                                                                     *
**********************************************************************/

/* 個別カスタマイズについて

個別カスタマイズはstyle2-free.cssで行って下さい。

*/


/* 共通
======================================================================*/
.clmr12{ margin-right: 12px; }

/* absoluteで隠れてしまう要素の対策 */
p,
.content__heading--lg { position: relative; }
/* 見出しが表示された際に下の要素に被ってしまう対策 */
.content-inn 					{ position: relative; }
.ibrow { display: inline-block; }

/* {デフォルト値} */

/* トップページ                                           fw_index.htm
======================================================================*/

/*

	--	Common	--

*/

/* MORE
--------------------------------------*/
.more { text-align: right; }
.more a::before {
  font-family: 'icomoon';
  content: "\e250";
  position: relative;
  top: -0.2em;
  margin-right: .2em;
  font-size: .6em;
}

/* NOTICE
--------------------------------------*/
.notice-noinfo {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
}
@media (max-width: 543px) {
.notice-noinfo {
  text-align: left;
  font-size: 16px;
}
}

/* メインビジュアル
--------------------------------------*/
.slick-dots { bottom: 0; }
.slick-dots li button:before {
  font-size: 24px;					/* 6px 		*/
  color		 : #fff;					/* black  */
  opacity	 : 0.25;					/* 0.25   */
}
.slick-dots li.slick-active button:before {
  color		 : #fff;					/* white  */
  opacity	 :  0.9;					/* 0.9	  */
}


/* パンクズ
--------------------------------------*/
.breadcrumbs ol li { border-bottom: 0; }

/* バナー
--------------------------------------*/
.bnrwrap { text-align: center; }
.bnr 		 { display: inline-block; }
.bnr img { width: 100%; max-width: 100%; }


/* セクション背景
--------------------------------------*/
.load-message p {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/* フローティングボタン
--------------------------------------*/
.flbtn-top .btn_area.btn_area--lg {
  padding: 1.75rem 1.75rem;
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 10;
}

/* VIEWコントロール
--------------------------------------*/
@media (max-width: 543px) {
.spview {display: block;}
.tabview{display:  none;}
.pcview {display:  none;}
}
@media (min-width: 544px) {
.spview {display:  none;}
.tabview{display: block;}
.pcview {display:  none;}
}
@media (min-width: 768px) {
.spview {display:  none;}
.tabview{display:  none;}
.pcview {display: block;}
}
@media (max-width: 543px) {
.spview1 {display: block;}
.pcview1 {display:  none;}
}
@media (min-width: 544px) {
.spview1 {display:  none;}
.pcview1 {display: block;}
}



/* 横並びリスト
・インタビュー　　　topContParse05.htm
・サイトメニュー		topContParse07.htm
--------------------------------------*/
.modwrap {
  width:100%;
  margin:0;
  padding: 24px 0;
  display:-webkit-box;
  display:-ms-box;
  display:-webkit-flexbox;
  display:-moz-flexbox;
  display:-ms-flexbox;
  display:-moz-flex;
  display:-ms-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-padding-start: 0;
          padding-inline-start: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  flex-direction: unset;
}
.modwrap .mod {
  position: relative;
  width: 33.3333%;
  padding-bottom: 65px;
  margin-bottom: 0;
}
.modwrap .mod img {
  width: 100%;
}
.modwrap .frm {
  position: relative;
  margin: 0 auto;
  overflow: hidden;
}
.modwrap h3 {
  margin-bottom: 16px;
  text-align: center;
  line-height: 1.3;
}
.modwrap h4 {
  margin-bottom:15px;
  margin-top:20px;
  padding: 0px 24px;
  font-weight:bold;
  font-size:110%;
  text-align:center;
}
.modwrap p {
  padding:0 9%;
  font-size: 90%;
}
.modwrap .btn {
  display: block;
  position: absolute;
  bottom: 40px;
  width:100%;
  padding:0;
  text-align:center;
}
.modwrap .btn a {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  width: 60%;
  margin: auto;
  padding: .5em .5em;
  color: #000000;
  border: 1px solid #e1e1e1;
  background: #fff;
}
.modwrap .btn a::after {
    font-family: 'icomoon';
    content: "\e258";
    position: relative;
    margin-left: .2em;
}
@media (max-width: 768px) {
.modwrap {
  display: block;
}
.modwrap .mod {
  width: 72%;
  margin: 0 auto;
}
.modwrap .btn {
  position: relative;
  bottom: auto;
}
}
@media (max-width: 543px) {
.modwrap .mod {
  width: 100%;
}
}
.modwrap .btn a:hover {
    color: #4e4e4e;
    background: #f7f7f7;
}


/*
.load-interview .modwrap
.load-interview .modwrap .mod
.load-sitemenu .modwrap
.load-sitemenu .modwrap .mod
*/

/* bnr */
@media (max-width: 543px) { 
/* Expo */
.expobnr {margin-top: 8px;}

/* terminallink */
.linkbnr {margin-top: 3em;}
}
@media (min-width: 544px) {
/* Expo */
.expobnr {margin: 0;}
.expobnr.clmb {margin-bottom: 4%;}

/* terminallink */
.linkbnr {margin-top: 5%;}
}
@media (min-width: 768px) {
/* terminallink */
.linkbnr {margin-top: 5%;}
}





/* インタビュー										topContParse05.htm
======================================================================*/
#interview { position: relative; padding: 28px 0 12px; }
.load-interview li { list-style: none; }

.load-interview .modwrap.col_1 .mod { width: 72%; }
.load-interview .modwrap.col_2 .mod { width: 50%; }
.load-interview .modwrap.col_3 .mod { width: 33.333%; }
.load-interview .modwrap.col_4 .mod { width: 25%; }
.load-interview .modwrap.col_5 .mod { width: 20%; }

.load-interview .modwrap .frm img {
  width: 100%;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}
.load-interview .modwrap .frm:hover img {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

@media (max-width: 768px) {
.load-interview .modwrap .frm {
  width: 100% !important;
}
.load-interview .modwrap.col_2 .mod,
.load-interview .modwrap.col_3 .mod,
.load-interview .modwrap.col_4 .mod,
.load-interview .modwrap.col_5 .mod {
  width: 72% !important;
}
}
@media (max-width: 543px) {
.load-interview .modwrap.col_2 .mod,
.load-interview .modwrap.col_3 .mod,
.load-interview .modwrap.col_4 .mod,
.load-interview .modwrap.col_5 .mod {
  width: auto !important;
}
}

/* サークル */
.load-interview .modwrap.circle .frm {
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    width: 72%;							/* ここを変更すると円の大きさが変わる */
    margin: 0 auto;
}
.load-interview .modwrap.circle .frminn {
  position: relative;
  left: -25%;
  width: 150%;
}
@media (max-width: 768px) {
.load-interview .modwrap.circle .frm {
  width: 72% !important;
}
}
@media (max-width: 543px) {
.load-interview .modwrap.circle .frm {
  width: 80% !important;
}
}

/* アシンメトリー */
.load-interview .modwrap.list {
  width: 100%;
  display: -ms-flexbox; 							/* IE10 */
  display: flex;
  flex-wrap: -ms-wrap;								/* IE10 */
  flex-wrap: wrap;
  justify-content: space-between;
  flex-direction: column;
  overflow: hidden;
}
.load-interview .modwrap.list > li:nth-child(2n+1) {
  width: 100%;
  display: -ms-flexbox; 							/* IE10 */
  display: flex;
  justify-content: space-between;
  flex-direction: unset;
}
.load-interview .modwrap.list > li:nth-child(2n) {
  display: -ms-flexbox;
  display: flex;
  flex-flow: row-reverse;
}
.load-interview .modwrap.list .mod {
  width: 100% !important;
  padding-bottom: 0;
}

.load-interview .modwrap.list .frm {
  width: 100% !important;
}
.load-interview .modwrap.list .mod .frminn {
  width: 75%;
}
.load-interview .modwrap.list .mod .frminn > div {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}
.load-interview .modwrap.list .mod .frminn:hover > div {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
.load-interview .modwrap.list > li > div {
  position: relative;
  align-items: stretch;
}
.load-interview .modwrap.list > li > div:first-child {
  width: 100%;
  margin-right: -250px;
}
.load-interview .modwrap.list > li > div:nth-child(2n) {
  width: 250px;
  background: #ccc;
}

.load-interview .modwrap.list .inn {
  padding-top: 36%;
  min-height: 240px;
}
.load-interview .modwrap.list .mod .objinn {
  position: absolute;
  top: 40%;
  left: 50%;
  width: 100%;
  margin: 0;
  padding: 12px;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}
.load-interview .modwrap.list .btn {
  position: relative;
  bottom: 0;
}

/* ストレートタイプに変更 */
.load-interview .modwrap.list.straight > li:nth-child(2n) {
  display: -ms-flexbox;
  display: flex;
  flex-flow: row;
}
.load-interview .modwrap.list.straight .mod {
  width: 100% !important;
  padding-bottom: 0;
  border-bottom: 1px solid #fff;
}
@media (max-width: 768px) {
.load-interview .modwrap.list,
.load-interview .modwrap.list > li:nth-child(2n+1),
.load-interview .modwrap.list > li:nth-child(2n),
.load-interview .modwrap.list.straight > li:nth-child(2n) {
  width: 100%;
  display: block;
}
.load-interview .modwrap.list.straight .mod,
.load-interview .modwrap.list .mod {
  width: 72% !important;
  padding-bottom: 0;
  border-bottom: 0;
}
.load-interview .modwrap.list .frm,
.load-interview .modwrap.list .mod .frminn {
  width: 100% !important;
}
.load-interview .modwrap.list > li > div:first-child,
.load-interview .modwrap.list > li > div:nth-child(2n) {
  width: 100% !important;
  margin-right: auto;
  background: #ccc;
}
.load-interview .modwrap.list .mod .objinn {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 12px;
  -ms-transform: translate(0,0);
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
}
.load-interview .modwrap.list .btn,
.load-interview .modwrap.list .btn a {
  position: relative;
}
}
@media (max-width: 543px) {
.load-interview .modwrap.list.straight .mod,
.load-interview .modwrap.list .mod {
  width: 100% !important;
}
}







/* アピールメッセージ                               topContParse06.htm
======================================================================*/
.load-message p { padding: 24px 0; }



/* サイトメニュー                                   topContParse07.htm
======================================================================*/
#sitemenu { position: relative; padding: 28px 0 12px; }

.load-sitemenu .modwrap .mod {
  margin-bottom: 6%;
}
.load-sitemenu .modwrap .ibox {
  margin-bottom: 16px;
}
.load-sitemenu .modwrap p {
  text-align: center;
}

@media (max-width: 768px) {
.load-sitemenu .modwrap .mod {
  width: 72% !important;
  padding-bottom: 40px;
  margin-bottom: 40px;
}
}
@media (max-width: 543px) {
.load-sitemenu .modwrap .mod {
  width: 100% !important;
}
}


.load-sitemenu .modwrap .frm img {
  width: 100%;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}
.load-sitemenu .modwrap .frm:hover img {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}



/* サークル */
.load-sitemenu .modwrap.circle .frm {
    position: relative;
    overflow: hidden;
    border-radius: 50%;
    width: 72%;							/* ここを変更すると円の大きさが変わる */
    margin: 0 auto;
}
.load-sitemenu .modwrap.circle .frminn {
  position: relative;
  left: -25%;
  width: 133.33%;
}
@media (max-width: 768px) {
.load-sitemenu .modwrap.circle .frm {
  width: 72% !important;
}
}
@media (max-width: 543px) {
.load-sitemenu .modwrap.circle .frm {
  width: 80% !important;
}
}


/* ストレートタイプに変更 */
.load-sitemenu .modwrap.straight h3 {
  margin-left: 24px;
  text-align: left;
}
.load-sitemenu .modwrap.straight p {
  margin-left: 24px;
  padding: 0;
  text-align: left;
}
.load-sitemenu .modwrap.straight {
  width: 100%;
  display: block;
  overflow: hidden;
}
.load-sitemenu .modwrap.straight > .mod {
  width: 100%;
  display: -ms-flexbox; 							/* IE10 */
  display: flex;
  justify-content: flex-start;
  flex-direction: unset;
}
.load-sitemenu .modwrap.straight .mod {
  width: 100% !important;
  padding-bottom: 0;
  border-bottom: 1px solid #ccc;
  margin-bottom: 2%;
}
.load-sitemenu .modwrap.straight > div > div {
  position: relative;
  align-items: stretch;
}
.load-sitemenu .modwrap.straight .frm {
  width: 100%;
}
.load-sitemenu .modwrap.straight .ibox {
  width: 200px;

}
.load-sitemenu .modwrap.straight .tbox {
  width: 100%;
  text-align: left;
}

.load-sitemenu .modwrap.straight .inn {
  padding-top: 80%;
  min-height: 160px;
}
.load-sitemenu .modwrap.straight .btn {
  position: relative;
  bottom: auto;
  text-align:right;
}
.load-sitemenu .modwrap.straight .btn a {
  position: relative;
  display: inline-block;
  width: auto;
}
.load-sitemenu .modwrap.straight .mod .frminn > div {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
}
.load-sitemenu .modwrap.straight .mod .frminn:hover > div {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
@media (max-width: 768px) {
.load-sitemenu .modwrap.straight,
.load-sitemenu .modwrap.straight > div:nth-child(2n+1),
.load-sitemenu .modwrap.straight > div:nth-child(2n) {
  width: 100%;
  display: block;
}
.load-sitemenu .modwrap.straight .mod {
  width: 72% !important;
  padding-bottom: 0;
  border-bottom: 0;
}
.load-sitemenu .modwrap.straight .frm,
.load-sitemenu .modwrap.straight .mod .frminn {
  width: 100% !important;
}
.load-sitemenu .modwrap.straight > div > div:first-child,
.load-sitemenu .modwrap.straight > div > div:nth-child(2n) {
  width: 100% !important;
  margin-right: auto;
}
.load-sitemenu .modwrap.straight .mod .objinn {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 12px;
  -ms-transform: translate(0,0);
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
}
.load-sitemenu .modwrap.straight .btn,
.load-sitemenu .modwrap.straight .btn a {
  position: relative;
}
}
@media (max-width: 543px) {
.load-sitemenu .modwrap.straight .mod {
  width: 100% !important;
}
}


/* 動画                                             topContParse08.htm
======================================================================*/
.load-movie .animation__frm {
  width: 72%;
  margin: 2.4em auto 3.35em;
}
.load-movie .animation {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.load-movie .animation iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
/* 動画右配置の時 */
.load-movie .mov__area.right .animation__frm{
  float: left;
  width: 50%;
  margin: 0 0 3.35em;
}
.load-movie .mov__area.right .content__box_text__inner {
  float: left;
  width: 50%;
  padding-right: 24px;
}
/* 動画左配置の時 */
.load-movie .mov__area.left .animation__frm{
  float: left;
  width: 50%;
  margin: 0 0 3.35em;
}
.load-movie .mov__area.left .content__box_text__inner {
  float: right;
  width: 50%;
  padding-left: 24px;
}
@media (max-width: 768px) {
.load-movie .animation__frm,
.load-movie .mov__area.right .animation__frm,
.load-movie .mov__area.left .animation__frm,
.load-movie .mov__area.right .content__box_text__inner,
.load-movie .mov__area.left .content__box_text__inner {
  float: none;
  width: 100%;
  padding: 0;
} 
}

/* 新着お知らせオプション                           topContParse09.htm
======================================================================*/
.load-newinfo img { width: 100%; }
.load-newinfo li { list-style: none; border-bottom: 1px solid #1c7bd1; margin-bottom: 32px; }
.load-newinfo ul { margin-top: 1rem; padding-left: 0; }

.load-newinfo .mod1,mod2 { float: left; }
.load-newinfo .mod1 .obj { float: left; }

.load-newinfo .mod1 .obj.ibox {
  position: relative;
  top: -8px;
  width: auto;
  margin-right: 12px;
}
.load-newinfo .mod1 .obj.ibox .inn {
  border-radius: 50%;
  overflow: hidden;
  width: 48px;
  height: 48px;
  position: relative;
}
.load-newinfo .obj.ibox img {
  width: 48px;
  height: 48px;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin: 0;
  padding: 0;
}
.load-newinfo .mod1 .obj.time { width: 104px; }
.load-newinfo .mod1 .obj.label {
  margin-right: 16px;
  padding: 0 16px;
  background: #1c7bd1;
  border-radius: 24px;
  color: #fff;
  text-align: center;
}
.load-newinfo .mod1 .obj.label.icon-none {
  margin-right: 44px;
}
.load-newinfo .mod2 p { overflow: hidden; }


@media (max-width: 543px) {
.load-newinfo .mod1,mod2 { float: none; margin-bottom: 12px; }
.load-newinfo ul { padding:1.25rem 1rem; }
}
.load-newinfo a:hover { text-decoration: underline ; }

/* 取り消し線 */
.load-newinfo .end-label {
  margin-right: 8px;
}
.load-newinfo .end-line-through { text-decoration: line-through; }


/* 説明会オプション                                 topContParse10.htm
======================================================================*/
.load-eventinfo ul {
  margin-left: 0;
  padding-left:0;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
}
.load-eventinfo .mod img { width: auto; height: 96px; }
.load-eventinfo .mod {
  margin: 0 0 24px 0;
  padding-bottom: 4px;
  overflow: auto;
  white-space: nowrap;
}
.load-eventinfo .mod__wrap_sp .mod {
  margin: 0 0 24px 0;
  padding: 16px;
  white-space: normal;
  border: 1px solid #ccc;
}
.load-eventinfo .mod__wrap_sp i {
  vertical-align: baseline;
}
.load-eventinfo .mod__wrap_sp .label2 {
  padding: 0 6px;
  background: #9e9e9e;
  font-size: 13px;
  color: #fff;
  border-radius: 4px;
}
.load-eventinfo small.label {
  padding: 0 6px;
  background: #F00;
  font-size: 13px;
  color: #fff;
  border-radius: 4px;
}
.load-eventinfo .mod table {
  width:100%;
  border:solid 1px #ccc;
}
.load-eventinfo .mod th,td {
	position:relative;
  padding:10px 5px;
  text-align:left;
  border:solid 1px #ccc;
}
.load-eventinfo .mod th {
  background:#666;
  color:#ffffff;
  font-weight:normal;
}
.load-eventinfo a:hover { text-decoration: underline ; }

/* サブビジュアル
======================================================================*/
#svisual .inn { position: relative; height: 100%;}

/* テキスト設定 単色背景、画像を使用する場合のみ */
#svisual .inn .tbox {
  width: 100%;
  margin: 0 auto;
  padding: 24px 0;
  text-align: center;
}
#svisual .inn .tbox p {
  width: 96%;
  margin: 0 auto;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  text-shadow: 1px 1px 1px #000;
}
/* 画像の場合 */
#svisual.svimg .inn .tbox {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  text-align: center;
}


/* 単色（またはグラデーション）背景のみ
--------------------------------------*/
#svisual { background: transparent; }

/* 画像を使う
--------------------------------------*/
@media (max-width: 543px) { .svimg { height: calc( 240px * .774 ); } }
@media (min-width: 544px) { .svimg { height: calc( 296px * .774 ); } }
@media (min-width: 768px) { .svimg { height: calc( 424px * .7 ); } }
@media (min-width: 992px) { .svimg { height: 424px; } }
